@charset "utf-8";
/* CSS Document */
/*
480px y 320px: Estas resoluciones son comunes en dispositivos móviles, especialmente en teléfonos más antiguos o con pantallas más pequeñas.
768px: Esta es la resolución típica para tablets en modo paisaje y dispositivos más pequeños. Es importante tener un diseño responsive que se vea bien en esta resolución.
1024px: Esta resolución es importante ya que es la utilizada en muchas tablets y dispositivos más antiguos. Asegurarse de que tu diseño se vea bien en esta resolución es crucial para una experiencia de usuario óptima.
1280px: Esta es una resolución común para pantallas de computadoras portátiles y algunos monitores de escritorio más antiguos.
1440px: Esta es una resolución comúnmente utilizada para monitores de computadora de escritorio estándar.
1600px: Aunque menos común, algunas pantallas más grandes o monitores de alta resolución pueden tener una resolución de 1600px de ancho.
1920px: Esta es una resolución muy común para monitores de escritorio y portátiles de tamaño estándar. Es la resolución "full HD".
2560px y superiores: Monitores de alta gama, monitores 2K y 4K, y pantallas de alta resolución pueden tener resoluciones de 2560px o incluso 3840px de ancho.
*/
@media screen and (max-width:2560px){
	
}

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

@media screen and (max-width:1920px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 127px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width:1700px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 170px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width:1440px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 170px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width:1400px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 194px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width:1300px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 190px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width:1280px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 195px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

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

@media screen and (max-width:1024px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 240px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

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

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

@media screen and (max-width:900px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 280px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

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

@media screen and (max-width:853px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 300px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

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

@media screen and (max-width:820px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 300px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

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

@media screen and (max-width:800px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 120px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
	
	h1{
		display:none;
	}
}

@media screen and (max-width:768px){
    body{
		overflow-x: hidden;
    }

    table{
        padding: 0px;
        height: auto;
        width: 100%;
        border: thin none #000;
        box-sizing: border-box;
        display: inline-table;
        margin: 0px;
    }

    tr{
        text-align: center;
        margin: 0px;
        padding: 0px;
        height: auto;
        width: 100%;
        border: thin none #000;
        box-sizing:border-box;
        display:block;
    }

    td{
        text-align: center;
        padding: 0px;
        height: auto;
        width: 100%;
        border: thin none #000;
        box-sizing: border-box;
        display:table;
        margin-top: 0px;
        margin-right: 0px;
        margin-bottom: 0px;
        margin-left: 0px;
    }
	
	.button1Tienda{
		font-family: OpenSans-Regular;
		font-size: 16px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #FFFFFF;
		text-decoration: none;
		background-color: #F39C12;
		text-align: center;
		margin: 10px auto;
		padding: 5px;
		height: auto;
		width: 80%;
		border: thin solid #F39C12;
		cursor: pointer;
		box-sizing: border-box;
		display: block;
		border-radius: 5px;
	}
	
	h1{
		font-family: OpenSans-Regular;
		color: #FFCC33;
		font-style: normal;
		font-variant: normal;
		font-weight: normal;
		font-size: 22px;
		line-height: normal;
	}
	
	.trShadowLeft {
		background-color: #FFFFFF;
		padding: 20px;
		box-shadow: inset  -1px 0px 10px rgba(0, 0, 0, 0.1); /* sombreado interno a la izquierda */
	}
	
	/* Asegura que la tabla ocupe todo el ancho pero centrada */
	  table.boxTienda1 {
		width: 100% !important;
		margin: 0 auto !important;
		display: table;       /* mantiene comportamiento de tabla */
		box-sizing: border-box;
	  }
	
	  /* Quitar floats y centrar texto */
	  table.boxTienda1 td {
		float: none !important;   /* elimina cualquier float previo */
		width: auto !important;   /* ignora los width fijos en los td HTML */
		display: table-cell;
		text-align: center !important; /* aquí está el centrado del texto */
		vertical-align: middle;
		padding: 6px 8px;         /* opcional: espacio interno */
	  }
	
	  /* Evita que los spans ocupen todo el ancho */
	  .boxTienda1 .spanTienda1,
	  .boxTienda1 .h3_tienda,
	  .boxTienda1 .h4_tienda {
		display: inline-block;
		text-align: center;
	  }
	
	  /* Si algo sigue sin centrarse, forzamos más especificidad para los td que contienen texto */
	  table.boxTienda1 td:not([colspan]) { 
		text-align: center !important;
	  }
	
	.imagenRezice{
		margin: 0px;
		padding: 0px;
		height: auto;
		width: 100%;
		display:block;
		box-sizing:border-box;
	}
	
	/*IMAGENES DE LOS LOGOTIPOS DE LENGUAJES*/
	.imagenRezice2{
		margin: 0px;
		padding: 0px;
		height: auto;
		width: 80%;
		display:inline-block;
		box-sizing:border-box;
	}
	/*IMAGENES DE LOS LOGOTIPOS DE LENGUAJES*/
	
	.whatsapp{
		height: auto;
		width: 14%;
		margin: 0px;
		padding: 0px;
		border: thin none #000;
		position: fixed;
		left: 80%;
		top: 86%;
		right: 0px;
		bottom: 0px;
		cursor: pointer;
		box-sizing:border-box;
		display:block;
	}
	
	.preguntaTienda{
		font-family: RobotoCondensed-Regular;
		font-size: 16px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #333;
		text-decoration: none;
		background-color: #FFF3CD;
		padding: 10px;
		height: auto;
		width: 90%;
		margin-top: 10px;
		margin-right: 0px;
		margin-bottom: 10px;
		margin-left: 10px;
		border: thin solid #FFEEBA;
		box-sizing:border-box;
		display:block;
		border-radius:8px;
	}
	
	.respuestaTienda{
		font-family: RobotoCondensed-Regular;
		font-size: 16px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #666;
		text-decoration: none;
		background-color: #D1ECF1;
		padding: 10px;
		height: auto;
		width: 90%;
		margin-top: 10px;
		margin-right: 10px;
		margin-bottom: 10px;
		margin-left: 0px;
		border: thin solid #BEE5EB;
		box-sizing: border-box;
		display: block;
		border-radius: 8px;
		float: right;
	}
	
	.hrTienda{
		width: 90%;
		height: auto;
		padding: 0px;
		box-sizing: border-box;
		display: block;
		margin-top: 0px;
		margin-right: 5px;
		margin-bottom: 0px;
		margin-left: 5%;
		border: thin solid #F7931E;
	}
	
	.categorias{
		font-family: OpenSans-Regular;
		font-size: 18px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #B82D36;
		text-decoration: none;
		padding: 5px;
		height: auto;
		width: 50%;
		border: thin none #999;
		box-sizing: border-box;
		display: block;
		margin-top: 0px;
		margin-right: 0px;
		margin-bottom: 0px;
		margin-left: 25%;
	}
	
	.subcategorias{
		font-family: OpenSans-Regular;
		font-size: 16px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #000000;
		text-decoration: none;
		padding: 5px;
		height: auto;
		width: 90%;
		border: thin none #999;
		cursor: pointer;
		box-sizing: border-box;
		display: block;
		margin-top: 0px;
		margin-right: 0px;
		margin-bottom: 0px;
		margin-left: 7%;
	}
	
	.panel-logs-container {
		position: absolute;
		top: 16%;
		bottom: 10%;
		left: 2%;
		z-index: 1;
		width: 35%;
		height: 30%;
	}
	
	#modalContacto #windowContacto{
		font-family: OpenSans-Regular;
		font-size: 13px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #000;
		text-decoration: none;
		background:#FFFFFF;
		background: linear-gradient(to top, #BCBCBC, #EFEFEF, #FFF);
		margin: 0px;
		padding: 10px;
		height: auto;
		width: 100%;
		border: thin none #000;
		position: absolute;
		left: 0%;
		top: 5%;
		right: 0px;
		bottom: 0px;
		box-shadow: 1px 1px 10px #000;
		overflow: auto;
		word-break: break-all;
		border-radius: 0px;
		background-color: #FFF;
	}
	
	#modalModDetails #windowModDetails{
		font-family: OpenSans-Regular;
		font-size: 13px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #000;
		text-decoration: none;
		background:#FFFFFF;
		/*background: linear-gradient(to top, #999, #EFEFEF, #FFF);*/
		margin: 0px;
		padding: 10px;
		height: 600px;
		width: 100%;
		border: thin none #000;
		position: absolute;
		left: 0%;
		top: 13%;
		right: 0px;
		bottom: 0px;
		box-shadow: 1px 1px 10px #000;
		overflow: auto;
		word-break: break-all;
		border-radius: 0px;
		background-color: #FFF;
	}
	
	#modalModDetailsVarios #windowModDetailsVarios{
		font-family: RobotoCondensed-Regular;
		font-size: 13px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #000;
		text-decoration: none;
		background:#FFFFFF;
		/*background: linear-gradient(to top, #999, #EFEFEF, #FFF);*/
		margin: 0px;
		padding: 10px;
		height: 700px;
		width: 100%;
		border: thin none #000;
		position: absolute;
		left: 0%;
		top: 13%;
		right: 0px;
		bottom: 0px;
		box-shadow: 1px 1px 10px #000;
		overflow: auto;
		word-break: break-all;
		border-radius: 0px;
		background-color: #FFF;
	}
	
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 257px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

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

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

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

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

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

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

@media screen and (min-width: 501px) {
  
}

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

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

@media screen and (max-width:430px){
	table.td-bottom-gradient {
	  border-bottom: 8px solid; /* grosor del borde */
	  /*border-image: linear-gradient(to right, #AE2923 10%, #FFCC33 50%, #AE2923 100%) 1;*/
	  border-image: linear-gradient(to right, #FFCC33 0%, #FFCC33 50%, #FFCC33 100%) 1;
	}
	
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 280px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width:428px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 279px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width:414px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 279px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

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

@media screen and (max-width:390px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 279px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width:375px){
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 275px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

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

@media screen and (max-width: 344px) {
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 300px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
}

@media screen and (max-width: 320px) {
	/*MUEVE EL CONTENIDO DEL BODY*/
	.content-after-table {
    	margin-top: 300px; /* Ajusta este valor según sea necesario */
  	}
	/*MUEVE EL CONTENIDO DEL BODY*/
	
	h1{
		display:none;
	}
}


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