body{
	/*background-image es para imagen de fondo*/
	background-image:url("../imagenes/fondo.jpg");
	/*font-family es para la tipografia de letra, las comas sirven para señalar que si no se encuentra una tipografia, ponga otra de mi agrado*/
	font-family:"Tahoma","Economica";
	/*color es para el color de las letras*/
	color:black;
	/*font-size es para el tamaño de la letra en pixeles*/
	font-size:40px;
	text-align: center
}
hr{
		/*border es para la linea
		el grosor indica en pixeles, indicamos el tipo de linea 
		y el codigo del color*/
		border:6px solid red;
		/*width es para el ancho de la linea*/
		width:80%;
		/*border-radius es para agregar curva al borde*/
		border-radius:5px;
}
p{
	text-align: center;
	font-size:10;
	color:black;
	/*letras negritas*/
	font-weight:bold;
	/*interlineado de parrafo*/
	line-height:1;
	/*color de fondo de letras*/
	background-color:#eb7a97;
	/*espacio entre letras*/
	letter-spacing:1px;
}
table,tr,td{
	/*Atributos para celdas de la tabla*/
	border:3px solid red;
	border-spacing:0;
	background-color:#eb7a97;
	font-size:30px;
	text-align:justify;
	font-weight:bold;
	font-family:"tahoma";
}
/*Clase para los pies de pagina*/
.pie{
	text-align:center;
	font-size:16px;
	font-family:"mano";
	font-weight:bold;
	color:#e13b66;
}
.encabezado{
	text-align:center;
	font-size:40px;
	font-weight:bold;
	color:#b04e67;
}
div#nice{
	text-align:center;
	font-size:40px;
	font-weight:bold;
	color:black;
	font-family:"mano";
}


div#top{
	width:100%;
	height:75px;
	background-image:linear-gradient(#e8829c,#f68da8);
	font-family:"mi"; /*poner el nombre de la fuente en el codigo inferior*/
}
div#ppag{
	width:100%;
	height:100px;
	background-image:linear-gradient(#e8829c,#f68da8));
	font-family:"sucia";
}
/*carrousel de imagenes*/
.carrousel{
	width:600px;
	margin:auto;
	box-sizing:border-box;
}
.contecarrousel{
	width:100%;
	height:400px;
	overflow:hidden;
	box-sizing:border-box;
}
.itemcarrousel{
	position:relative;
	width:100%;
	height:100%;
	box-sizing:border-box;
}
.itemcarrouseltarjeta{
	width:100%;
	height:100%;
	box-sizing:border-box;
}
.itemcarrouselarrows{
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	height:100%;
	width:100%;
	display:flex;
	align-items:center;
	justify-content:space-between;
	padding:20px;
	box-sizing:border-box;
}
.itemcarrouselarrows> i:hover{
	cursor:pointer;
}
.contecarrouselcontroller{
	width:100%;
	display:flex;
	justify-content:space-evenly;
}
.contecarrouselcontroller> a{
	text-decoration:none;
	font-size:32px;
	color:grey;
}
.itemcarrouselarrows> a > i{
	color:white;
}
/*cajas para productos*/
.caja{
	height:350px;
	width:150px;
	background:#d67c93;
	border:1px solid red;
	margin:5px;
	color:black;
	text-align:center;
	display:inline-block;
}
.caja:hover{
	box-shadow: 0 0 10px red;
	transform:scale(1.3);
}
.caja-texto{
	padding-top:5px;
	padding-bottom:5px;
	font-size:20px;
	color:pink;
	font-weight:bold;
}
.texto-adicional{
	padding-top:5px;
	font-size:15px;
}
div#texto1{
	width:600px;
	height:200px;
	padding-top:5px;
	font-size:18px;
	background-color:#ef7594;
	font-family:"tahoma";
	font-weight:bold;
}
/*Menu de navegación*/
.navegacion{
	display:flex;
	height:100px;
}
.navegacion-item{
	flex:1;
	color:#de3e67;
	font-weight:bold;
	font-size:18px;
	display:flex;
	transition: flex-grow 0.2s;
	justify-content:center;
	align-items:center;
}
.navegacion-titulo{
	margin:0;
	transform:rotate(-90deg);
	transition:transform 0.2s 0.2s;
}
.navegacion-item:hover{
	flex-grow:10;
}
.navegacion-item:hover .navegacion-titulo{
	transform:rotate(0);
}
.navegacion-item:nth-child(1){
	background:#dc5b7c;
}
.navegacion-item:nth-child(2){
	background:#dc5b7c;
}
.navegacion-item:nth-child(3){
	background:#f0adbe;
}
.navegacion-item:nth-child(4){
	background:#f0adbe;
}
.cua{
	text-align:center;
	display:flex;
	border:5px solid red;
	padding:50px;
	max-width:700px;
	background-color:#f0adbe;
}
.image{
	width:250px;
	height:180px;
	background-image:url(../imagenes/logotipo.jpg);
	background-size:cover;
	background-position:center;
	margin-right:20px;
}
.text{
	font-size:25px;
}
.navegacion-itemq{
	display:flex;
	justify-content:center;
	align-items:center;
}
/*fuentes-tipograficas*/
@font-face{
	font-family:"mi";
	src:url(../fuentes/mi.ttf);
}
@font-face{
	font-family:"mano";
	src:url(../fuentes/mano.ttf);
}
@font-face{
	font-family:"sucia";
	src:url(../fuentes/sucia.ttf);
}