html{
	font-size: 20px;
	font-family: verdana,arial,tahoma;
}

#responsive {
	margin: 0 auto;
	width: 100%; 
	/* padding-left: 1.2%; */
}

body { 
	background-color: #69160F; /* FF0000 */
	/* background-image: url("images/Bottom_texture.jpg");  */
} 

#conten_center {
	width: 100%; 
	/* background-color: #008000; */ 
	padding: 0rem 0rem 0rem 0.4rem;
	box-sizing:border-box;
}

header{
	background-color: rgba(105,22,15,0.5);
	/* background-color: rgba(255,69,0,0.8); */
	height: auto; /* 8rem */
	margin: -1.35rem 0rem 0rem 0rem;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem;
	padding: 0.2rem 0.2rem 0.2rem 0.2rem;
	-moz-border-radius: 5px; /*Propiedad de soporte*/   
    -webkit-border-radius: 5px; /*Propiedad de soporte*/ 
}

.bienvenida {
	padding: 0rem 0.5rem 0rem 0rem;
	text-align: right;
	color: #FFF;
}

.carr_cab {
	margin: -3.5rem 1% 0% 95%;
}

H1{
	color: #FFF;
	font-family: carrington, tahoma, verdana, arial;
	text-align:center;
}

		H1 a{
			border-radius: 10px; padding: 2px 5px 5px 5px;  
			text-decoration: none; color: #000;	/* No visitado */ 
			/* background: #FFFFFF; */
		}
		H1 a.visited{
			text-decoration: none; color: #000;	/* Visitado */
		}
		H1 a.active{
			text-decoration: none; color: #000;	/* Ultimo visitado */
		}
		H1 a:hover{
			text-decoration: none; color: #FFBEAE;	/* Color paso raton */
			background: #FF0000;
		}

.red_social {
	position: relative;
	margin: -0.2rem 0rem 0rem 1.9rem; /* 1.9rem */
}

.whatsapp {
	position: absolute;
	margin: -0.2rem 0rem 0rem 0.2rem;
}

.img_whatsapp { 
	width: 1.6rem; 
	height: auto;
}

H2{
	width: 96%;
	color: #FFF;
	margin: 1rem 0rem 1rem 0.2rem;
	padding: 0.5rem 0.5rem 0.5rem 0.5rem;
	background-color: #9E3737; 
	border-radius: 5px;
	-moz-border-radius: 5px; /*Propiedad de soporte*/   
    -webkit-border-radius: 5px; /*Propiedad de soporte*/ 
}

.salir {
	text-align: right;
	margin: 0rem 2rem 1rem 0rem;
}
	.salir a { 					/* Color del enlace no visitado */ 
		text-decoration: none; 
		color: #FFF; 
		border-radius: 10px; 
		padding: 2px 5px 5px 5px; 
		background: #FF0000;
	}
	.salir a:hover {         		/* Color que toma el enlace al pasar el raton sobre el */ 
		background: #000; 
	}
	
	.saludo a { 					/* Color del enlace no visitado */ 
		color: #FFF; 
		text-decoration: none; 
	}
	.saludo a:hover { 					/* Color del enlace no visitado */ 
			color: #FFCC66; 
		}

.cabc{
	margin: -1rem 0 0 2rem;
	color:#000;
}

.elivi{
	list-style-type: none;	/* Elimina viñetas, sangrias, etc */
}

.fac{
	display: inline; 	/* Comvierte lista vertical en fila <li> */
	padding: 0rem 0.7rem 0rem 0.7rem;	/* Separa los elementos de la fila */
	line-height: 1.8rem;
}

.busca{
	text-align: right;
	padding: 0.5rem 0.5rem 0.5rem 0rem;
}

.campo_bus {  					/* Campo buscador */
    font-family:verdana,arial;     /* tipo de letra */  
    width: 50%;                 /* anchura de campos de formulario */  
	min-height: 20px; 
    height: 2rem;
    font-size: 1.2em;                /* tamaño de la letra*/   
    padding: 10px 15px 10px 15px; 
    border: 1px solid #666666;        /* color del borde puede ser solid ó dotted */ 
	border-radius: 10px 0px 0px 10px;	
    -moz-border-radius: 10px 0px 0px 10px;    /* Para Firefox, pero parece que no funciona */  
    -webkit-border-radius: 10px 0px 0px 10px; /* sup izq - sup der - inf der - inf izq. PARA Chrome y Opera */
    vertical-align: center;
}  

.boton_bus{ 			/* Boton buscador */
    font-size: 1.0em; 
    font-family:Verdana,Helvetica; 
    font-weight:bold; 
    color:#000; 
    background:#FFF; 
    border:0px; 
    width: 5rem; 
    height: 2rem; 
	border-radius: 0px 10px 10px 0px;
    -moz-border-radius: 0px 10px 10px 0px;    /* Para Firefox, pero parece que no funciona */  
    -webkit-border-radius: 0px 10px 10px 0px; /* sup izq - sup der - inf der - inf izq. PARA Chrome y Opera */
    vertical-align: top;
} 

nav{
	margin: 0rem 0rem 0rem 0rem;
}

		nav a{
			border-radius: 10px; padding: 2px 5px 5px 5px;  
			text-decoration: none; color: #000000;	/* No visitado */
			background: #FFFFFF;
		}
		nav a.visited{
			text-decoration: none; color: #696969;	/* Visitado */
		}
		nav a.active{
			text-decoration: none; color: #800000;	/* Ultimo visitado */
		}
		nav a:hover{
			text-decoration: none; color: #FFFFFF;	/* Color paso raton */
			background: #FF0000;
		}

.tit_pro {
	color:#8B0000;
	background-color: #000; 
	border-radius: 5px; /*Propiedad válida*/
	padding: 2px;
	margin: -0.2rem 0rem 0rem -0.2rem;
	width: 102%;
	height: 2.6rem;
	text-align:center;
	vertical-align: middle;
}

	.tit_pro a {    /* Color del enlace no visitado */ 
		text-decoration: none; color: #FFF; 
	} 
	.tit_pro a.visited {    /* Color del enlace visitado */ 
		text-decoration: none; color: #FFF; 
	} 
	.tit_pro a.active {        /* Color que toma el ultimo enlace visitado */ 
		text-decoration: none; color: #FFF; 
	} 
	.tit_pro a:hover {        /* Color que toma el enlace al pasar el raton sobre el */ 
		text-decoration: none;  
		color: #DC143C; 
	} 
	
.tit_pro_de {
	color:#FFF;
	background-color: #000; 
	border-radius: 5px; /*Propiedad válida*/
	padding: 2px;
	margin: -0.2rem 0rem 0rem -0.2rem;
	width: 101%;
	height: 2.6rem;
	text-align:center;
	vertical-align: middle;
}

	.tit_pro_de a {    /* Color del enlace no visitado */ 
		text-decoration: none; color: #FFF; 
	} 
	.tit_pro_de a.visited {    /* Color del enlace visitado */ 
		text-decoration: none; color: #FFF; 
	} 
	.tit_pro_de a.active {        /* Color que toma el ultimo enlace visitado */ 
		text-decoration: none; color: #FFF; 
	} 
	.tit_pro_de a:hover {        /* Color que toma el enlace al pasar el raton sobre el */ 
		text-decoration: none;  
		color: #DC143C; 
	} 
		
.producto_img { 
	position:relative;
	float: left; 
	width: 47%; 
	height: auto; /* 30rem */
	background-color: #FFF8DC; 
	margin: 0.2rem 0.2rem 0.2rem 0.2rem;
	box-sizing:border-box;
	padding: 0.2rem 0.2rem 0.2rem 0.2rem;
	-moz-border-radius: 5px; /*Propiedad de soporte*/   
    -webkit-border-radius: 5px; /*Propiedad de soporte*/   
    border-radius: 5px; /*Propiedad válida*/
} 

.mini_img {
	width: 100%;
	text-align:center;
}

.minixx{
	width: auto;
	height: 4rem;
}

.accion {
	/* background-color: #ff0000; */
	width: 100%;
	padding: 0.3rem 0rem 0.3rem 0rem;
}

.izq {
	text-align: left;
	margin-left: 1rem;
}

.der {
	text-align:right;
	margin: -1.5rem 1rem 0rem 0rem;
}

	.der a { 					/* Color del enlace no visitado */ 
		text-decoration: none; 
		color: #FFF; 
		border-radius: 10px; 
		padding: 2px 5px 5px 5px; 
		background: #FF0000;
	}
	.der a:hover {         		/* Color que toma el enlace al pasar el raton sobre el */ 
		background: #000; 
	}
	
.der_cp {
	text-align:right;
	/* margin: -1.5rem 1rem 0rem 0rem; */
	margin: -1.5rem 1rem 2rem 0rem;
}

	.der_cp a { 					/* Color del enlace no visitado */ 
		text-decoration: none; 
		color: #FFF; 
		border-radius: 5px;
		-moz-border-radius: 5px; 
		-webkit-border-radius: 5px;  
		padding: 0.5rem 1rem; 
		background: #000;
	}
	.der_cp a:hover {         		/* Color que toma el enlace al pasar el raton sobre el */ 
		background: #008000; 
		color: #99FF00;
	}

.carrito{
	position: absolute;
	text-align: left;
	/* margin-left: 1rem; */
	margin: 0.65rem 0rem 0rem 0.5rem;
}

.img_crt{
	width: 2.5rem;
	height: 2.5rem;
}

.separador {
	margin: 1rem 0rem 1rem 0rem;
}

.producto_dat { 
	position:relative;
	float: left; 
	width: 50%; 
	overflow: hidden;	/* Impide que una imagen desborde la capa */
	height: auto; /* 30rem */
	background-color: #FFF8DC; 
	margin: 0.2rem 0.2rem 0.2rem 0.2rem;
	box-sizing:border-box;
	padding: 0.2rem 0.2rem 0.2rem 0.2rem;
	-moz-border-radius: 5px; /*Propiedad de soporte*/   
    -webkit-border-radius: 5px; /*Propiedad de soporte*/   
    border-radius: 5px; /*Propiedad válida*/
} 

.ref {
	float:left;
	font-size:0.8rem; 
	width: 100%;
}

.descr {
	float:left;
	font-size:0.8rem;
	color:#696969;
	width: 100%;
	overflow-x: auto; 
}

.prec {
	font-size:1.5rem; 
	font-weight:900; 
}

.agrupa {
	float:left;
}

.img{
    float:left;
    width: 100%;            /* 1rem = 16px */
	/* max-width: 20rem;
	max-height: 30rem; */
    /* height: 16rem; */
    margin: 3px 10px 10px -3px;
	/* border:3px solid #CCCCCC;  */
}

.imgpr{

    width: 100%;            /* 1rem = 16px */
	/* min-width: 20rem;
	max-width: 30rem; */
	text-align:center;
    /* height: 16rem; */
    margin: 3px 10px 10px -3px;
	/* border:3px solid #CCCCCC;  */
}

.img_ok{
	width: 1rem;
	height: 1rem;
}

.minfo{
	margin: -1.9rem 0rem 0rem 0rem;
	padding: 0.6rem 25% 0.6rem 0.4rem;
	text-align:right;
}

	.minfo a {    /* Color del enlace no visitado */ 
		text-decoration: none; color: #FFCC66; 
	} 
	.minfo a.visited {    /* Color del enlace visitado */ 
		text-decoration: none; color: #FFCC66; 
	} 
	.minfo a.active {        /* Color que toma el ultimo enlace visitado */ 
		text-decoration: none; color: #FFCC66; 
	} 
	.minfo a:hover {        /* Color que toma el enlace al pasar el raton sobre el */ 
		text-decoration: none;  
		color: #FFCC66; 
	} 
	
info {
	color: #FFFFD4; 
}
	
.ocultable{
	position:relative;
	font-size:0.8rem;
	color:#FFA07A;
	/* background-color: #FFDAB9; */
	padding-left: 1rem;
}

.producto { 
	position:relative;
	float: left; 
	width: 24%; 
	height: auto; /* 30rem */
	background-color: #FFF8DC; 
	margin: 0.2rem 0.2rem 0.2rem 0.2rem;
	box-sizing:border-box;
	padding: 0.2rem 0.2rem 0.2rem 0.2rem;
	-moz-border-radius: 5px; /*Propiedad de soporte*/   
    -webkit-border-radius: 5px; /*Propiedad de soporte*/   
    border-radius: 5px; /*Propiedad válida*/
	word-wrap: break-word;
} 

.marca {
	float: left;
	margin: 5px 0px 10px 0px;	/* margin: 5px 0px 10px 0px; */
}
		.marca a { 
			text-decoration: none;     /* La propiedad - none - elimina le linea bajo el enlace */ 
			color: #69160F;            /* Color del enlace no visitado AZUL */  
		} 

		.marca a:visited { 
			text-decoration: none; 
			none; color: #FF0000;    /* Color del enlace visitado ROJO */   
		} 

		.marca a:active { 
			text-decoration: none;  
			color: #008000;            /* Color que toma el ultimo enlace visitado VERDE */  
		} 

		.marca a:hover { 
			 text-decoration: underline;    /* Muestra linea bajo el enlace al pasar el ratón sobre el */ 
			 color: #666666;           /* Color que toma el enlace al pasar el raton sobre el GRIS*/ 
		} 
		
.categ {
	width: 75%;
	/* background-color: #008000; */
	margin: 1rem 0rem 1rem 0rem;
}

.disponible {
	margin: 0.8rem 0rem 0rem 0rem;
	background-color: #008000;
	color: #99FF00;
	padding: 0.5rem;
	border-radius: 5px;
	-moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
	display: inline-block;
}

.nodisponible {
	margin: 0.8rem 0rem 0rem 0rem;
	background-color: #FF0000;
	color: #FFCC66;
	padding: 0.5rem;
	border-radius: 5px;
	-moz-border-radius: 5px; 
    -webkit-border-radius: 5px; 
	display: inline-block;
}

.cls_pagi {
	text-align: center;
	font-size: 1.2rem;
	line-height: 2.5rem;
}

	.cls_pagi a {    /* Color del enlace no visitado */ 
		text-decoration: none; color: #FFF; 
	} 
	.cls_pagi a.visited {    /* Color del enlace visitado */ 
		text-decoration: none; color: #FA8072; 
	} 
	.cls_pagi a.active {        /* Color que toma el ultimo enlace visitado */ 
		text-decoration: none; color: #FA8072; 
	} 
	.cls_pagi a:hover {        /* Color que toma el enlace al pasar el raton sobre el */ 
		text-decoration: none;  
		color: #FA8072; 
	} 
	
.n_registros {
	text-align: right;
	color: #FFF;
}

footer{
	position: relative;
	float:left; 
	bottom: 0; 
	text-align: center;
	font-size: 0.8rem;
	margin: 0 auto;
	margin-top: 0.5rem;
	padding: 1.4em 1em;
	width: 100%;
	height: 4em;
	background-color: rgba(255,69,0,0.8);
	box-sizing:border-box;
	border-radius: 5px 5px 0px 0px;
}

		footer a{  
			text-decoration: none; color: #000;	/* No visitado */ 
		}
		footer a.visited{
			text-decoration: none; color: #000;	/* Visitado */
		}
		footer a.active{
			text-decoration: none; color: #000;	/* Ultimo visitado */
		}
		footer a:hover{
			text-decoration: none; color: #FFF;	/* Color paso raton */
			font-weight:900;
		}

.menumov {
	position: absolute;
	text-align: center;
	margin: 0.2rem 0rem 0rem 0.5rem;
	padding: 0.3rem 1rem 0.3rem 1rem;
	text-decoration: none; 
	color: #FFF; 
	border-radius: 5px; 
	-moz-border-radius: 5px; /*Propiedad de soporte*/   
    -webkit-border-radius: 5px; /*Propiedad de soporte*/ 
	background: #FF0000;
}
	
#menuA {   
    position: absolute; 
    margin: 2.5rem 0.5rem 0.5rem -0.4rem; 
    float: left; 
	font-weight: 900;
    font-family:verdana,arial; /*tipo de letra*/  
    width: 23%; 
    min-width: 200px; 
    line-height: 20pt; /*separación entre lineas*/ 
    z-index: 4; 
}  
	
.showme{                 /* Capa emergente */ 
    position: absolute; 
	margin: 2rem 0rem 0rem 1rem;
    padding: 0.5rem 1.5rem 0.5rem 0.3rem; 
    width: 12rem; 
    background-color: #000; 
    display: none; 
    text-align: left; 
	line-height: 2.5rem;
    border-radius: 5px; 
	-moz-border-radius: 5px; /*Propiedad de soporte*/   
    -webkit-border-radius: 5px; /*Propiedad de soporte*/ 
} 
.showhim:hover .showme{ 
    display: block; 
} 

@media screen and (min-width: 1200px){ /* 1000 */

	.carr_cab {
		margin: -3.5rem 1% 0% 95%;
	}
	
    .producto{
		width: 19%;
		height: 23rem; 
    }
    
	#menuA{
		display:none;
	}
	
	.whatsapp{
		display:none;
	}
	
	.red_social {
		position: relative;
		margin: -0.2rem 0rem 0rem 0.1rem; /* 1.9rem */
	}
}

@media screen and (max-width: 1200px){ /* 1000 */

	.carr_cab {
		margin: -3.5rem 1% 0% 93%;
	}
	
    .producto{
		width: 24%;
		height: 23rem; 
    }
	
	#conten_center{
		width: auto;
	}
    
	#menuA{
	display:none;
	}
	.whatsapp{
		display:none;
	}
	
	.red_social {
		position: relative;
		margin: -0.2rem 0rem 0rem 0.1rem; /* 1.9rem */
	}
}

@media screen and (max-width: 900px){ /* 1000 */

	.carr_cab {
		margin: -3rem 1% 0% 92%;
	}
	
    .producto{
		width: 32%; /* 98% */
		height: 23rem; 
    }
	
    .producto_img{
		width: 97%; /* 98% */
		height: auto; 
    }
    
    .producto_dat{
		width: 97%; /* 98% */
		height: auto; 
    }
	
	H2 {
		width: 95%;
	}
    
	#conten_center{
		width: auto;
	}
	
	.elivi {
		display:none;
	}
    
	#menuA{
		display:block;
	}
    
	.whatsapp{
		display:none;
	}
	
	.red_social {
		position: relative;
		margin: -0.2rem 0rem 0rem 0.1rem; /* 1.9rem */
	}
}

@media screen and (max-width: 700px){

	.carr_cab {
		margin: -3rem 1% 0% 90%;
	}
	
    .producto{
		width: 48%; /* 98% */
		height: 25rem; 
    }
	
	H2 {
		width: 94%;
	}
    
	#conten_center{
		width: auto;
	}

	.whatsapp{
		display:block;
	}
	
	.red_social {
		position: relative;
		margin: -0.2rem 0rem 0rem 1.9rem; /* 1.9rem */
	}
}

@media screen and (max-width: 550px){

	.carr_cab {
		margin: -3rem 1% 0% 87%;
	}
	
    .producto{
		width: 98%; /* 98% */
		height: auto; 
    }
	
	.tit_pro{
		width: 101%;
	}
	
	H2 {
		width: 94%;
	}
    
	#conten_center{
		width: auto;
	}
    
	#menuA{
		display:block;
	}
	
	.whatsapp{
		display:block;
	}
	
	.red_social {
		position: relative;
		margin: -0.2rem 0rem 0rem 1.9rem; /* 1.9rem */
	}
}