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);
	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% 90%;
}

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

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;
}

.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; 
		}

.texto_gen {
	color: #FFF;
	margin: 1rem 0rem 1rem 0.2rem;
}

	.texto_gen a {    /* Color del enlace no visitado */ 
		text-decoration: none; color: #FFCC66; 
	} 
	.texto_gen a.visited {    /* Color del enlace visitado */ 
		text-decoration: none; 
		color: #FFFF00; 
		background: #FFFF00;
	} 
	.texto_gen a.active {        /* Color que toma el ultimo enlace visitado */ 
		text-decoration: none; color: #FF0000; 
	} 
	.texto_gen a:hover {        /* Color que toma el enlace al pasar el raton sobre el */ 
		text-decoration: none;  
		color: #FA8072; 
	} 

.catgr {
	width: 75%;
	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*/ 
}

		.catgr a{ 
			text-decoration: none; color: #000;	/* No visitado */
		}
		.catgr a.visited{
			text-decoration: none; color: #000;	/* Visitado */
		}
		.catgr a.active{
			text-decoration: none; color: #000;	/* Ultimo visitado */
		}
		.catgr a:hover{
			text-decoration: none; color: #FFBEAE;	/* Color paso raton */
		}

.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;
}

.busca_admin{
	text-align: right;
	margin: 0.5rem 2rem 0.5rem 0rem;
	padding: 0.5rem 0rem 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;
} 

// -------------------------------- INICIO foto emergente
a.Ntooltip { 
    position: relative;                 /* es la posición normal */ 
    text-decoration: none !important;     /* forzar sin subrayado */ 
    color:#0080C0 !important;             /* forzar color del texto 0080C0 */ 
    font-weight:bold !important;         /* forzar negritas */ 
} 

a.Ntooltip:hover { 
    z-index:999;                 /* va a estar por encima de todo */ 
    background-color:#FFCC66;     /* DEBE haber un color de fondo - cambia el color al pasar el raton*/ 
} 

a.Ntooltip span { 
    display: none;                 /* el elemento va a estar oculto */ 
} 

a.Ntooltip:hover span { 
    display: block;             /* se fuerza a mostrar el bloque */ 
    position: relative;         /* se fuerza a que se ubique en un lugar de la pantalla */ 
    top: -5rem; left: 8rem;             /* donde va a estar */ 
    width: 6rem;                 /* el ancho por defecto que va a tener */ 
    padding:5px;                 /* la separación entre el contenido y los bordes */ 
    background-color: #0080C0;     /* el color de fondo por defecto */ 
    color: #FFFFFF;             /* el color de los textos por defecto */ 
} 

.marco_foto {
	width: 6rem;
	height: 9rem;
}
// -------------------------------- FIN foto emergente

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; 
	} 
		
.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;
} 

.ref {
	font-size:0.8rem; 
}

.descr {
	font-size:1rem;
	color:#696969;
}

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

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

.img_elim {
	width: 1.5rem;
	height: 2rem;
}

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

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

.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;
		}
/* ---------------------------------------------------------- */
/* Enlaces productos */

.enlc_produc {
	margin: 2rem;
	color: #FFCC66;
}

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

.campo_iden {
	width: 15rem; /* width: 15rem; */
	font-size:1rem;
	padding: 0.3rem;
	margin: 0.3rem;
	border-radius: 5px; 
    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;
}

.cont_arti {
	min-width: 6rem;
}

.n_articulos {
	position: relative;
	margin: 0.2rem 0rem 0rem 1.4rem;
	width: 1.25rem; /* width: 15rem; */
	font-size:1rem;
	padding: 0.3rem;
	border-radius: 5px; 
    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;
}

.b_mas {
	position: absolute;
	margin: 0.1rem 0rem 0rem 0.1rem;
	width: 1rem;
}

.b_men {
	position: absolute;
	margin: 1.3rem 0rem 0rem 0.1rem;
}

.b_ok {
	margin: 0rem 0rem 0rem 0rem;
	font-size: 1.0em; 
    font-family:Verdana,Helvetica; 
    font-weight:bold; 
    color:#FFF; 
    background:#666666; 
    border:0px; 
    width: 2.1rem; 
    height: 2rem; 
	border-radius: 5px; 
}

.boton_iden {
	font-size: 1.0em; 
    font-family:Verdana,Helvetica; 
    font-weight:bold; 
    color:#000; 
    background:#FFF; 
    border:0px; 
    width: 5rem; 
    height: 2rem; 
	border-radius: 5px; 
    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;
    vertical-align: top;
	margin: -3.2rem 0rem 0rem 11rem;
}

.ncamp {
	font-size: 1.2rem;
	color: #FFAA80;
}

.recuer {
	width: 1.5rem; 
	height: 1.5rem;
	padding: 0.25rem;
}

.nsexo {
	color: #FFF;
}

.boton_reg {
	font-size: 1.0em; 
    font-family:Verdana,Helvetica; 
    font-weight:bold; 
    color:#000; 
    background:#FFF; 
    border:0px; 
    width: 8rem; 
    height: 2rem; 
	border-radius: 5px; 
    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;
    vertical-align: top;
	margin: 0rem 0rem 0rem 8rem;
}

.boton_olvd {
	font-size: 1.0em; 
    font-family:Verdana,Helvetica; 
    font-weight:bold; 
    color:#000; 
    background:#FFF; 
    border:0px; 
    width: 8rem; 
    height: 2rem; 
	border-radius: 5px; 
    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;
    vertical-align: top;
	margin: 0rem 0rem 0rem 8rem;
}

#div-results {
	margin: 0rem 0rem 0rem 0.4rem;
}

#div-captcha {
	position: absolute;
	margin: -2rem 0rem 0rem 12rem;
}

.grp_form {
	margin: 0rem 0rem 0rem 2rem;
	padding: 0.5rem;
	border-radius: 5px; 
    -moz-border-radius: 5px;  
    -webkit-border-radius: 5px;
	background: #000;
	width: 17rem;	/*17rem */
}

.avisos {
	position: relative; 
	color: #FFF;
    width: auto; 
	margin: 5rem 20% 5rem 20%;
	padding: 2rem 1rem 2rem 1rem;
    background-color: #000; 
	border-radius: 5px; 
	-moz-border-radius: 5px; /*Propiedad de soporte*/   
    -webkit-border-radius: 5px; /*Propiedad de soporte*/ 
}

.dat_avisos {
	color: #FFCC66
}

	.avisos a {    /* Color del enlace no visitado */ 
		text-decoration: none; color: #FA8072; 
	} 
	.avisos a.visited {    /* Color del enlace visitado */ 
		text-decoration: none; 
		color: #FFFF00; 
		background: #FFFF00;
	} 
	.avisos a.active {        /* Color que toma el ultimo enlace visitado */ 
		text-decoration: none; color: #FF0000; 
	} 
	.avisos a:hover {        /* Color que toma el enlace al pasar el raton sobre el */ 
		text-decoration: none;  
		color: #FA8072; 
	} 
	
.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: 24%;
		height: 27rem; 
    }
   
	#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: 32%;
		height: 26rem; 
    }
	
	#conten_center{
		width: 100%;
	}
    
	#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: 48%; /* 98% */
		height: 29rem; 
    }
    
	#conten_center{
		width: 100%;
	}
	
	.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%;
	}
	
	.whatsapp{
		display:block;
	}
	
	.red_social {
		position: relative;
		margin: -0.2rem 0rem 0rem 1.9rem; /* 1.9rem */
	}
	
	.avisos {
		margin: 5rem 10% 5rem 10%; 
	}
}

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

	.carr_cab {
		margin: -3rem 1% 0% 87%;
	}
	
    .producto{
		width: 98%; /* 98% */
		height: 32rem; 
    }
    
	#conten_center{
		width: 100%;
	}
	
	.avisos {
		margin: 5rem 3% 5rem 3%; 
	}
    
	#menuA{
		display:block;
	}
	
	/* Campos y botones de formularios */
	
	.grp_form {
		margin: 0% 1% 0% 1%;
		padding: 1% 1% 3% 1%;
		width: 98%;
	}

	.campo_iden {
		width: 90%; /* width: 15rem; */
	}
	
		.boton_iden {
		width: 60%; 
		margin: 0rem 1% 0rem 38%;
	}

	.boton_olvd {
		width: 60%; 
		margin: 0rem 1% 0rem 38%;
	}
	
		.boton_reg {
		width: 60%; 
		margin: 0rem 1% 0rem 38%;
	}
}