@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:1920px){
	
}

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

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


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

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

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

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

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

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

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

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

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

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

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

@media screen and (max-width:800px){
	.button3{
		font-family: RobotoCondensed-Regular;
		font-size: 18px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #FFF;
		text-decoration: none;
		background-color: #6C757D;
		text-align: center;
		padding: 10px;
		height: auto;
		width: auto;
		margin-top: 5px;
		margin-right: auto;
		margin-bottom: 5px;
		margin-left: auto;
		border: thin solid #6C757D;
		cursor: pointer;
		box-sizing: border-box;
		display: block;
	}
}

@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: block;
        margin-top: 10px;
        margin-right: 0px;
        margin-bottom: 10px;
        margin-left: 0px;
    }
	
	.imagenRezice{
		margin: 0px;
		padding: 0px;
		height: auto;
		width: 100%;
		display:block;
		box-sizing:border-box;
	}
	
	.imagenResponsive {
		display: block;
		margin: 0 auto;
		width: 60%; /* o el tamaño que prefieras para pantallas pequeñas */
	 }
	
	/*SE OCULTA EL MENUSYS*/
	.mainmenu{
		display:none;
	}
	/*SE OCULTA EL MENUSYS*/
	
	.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;
	}
	
	.logoRezice{
		margin: 0 auto;
		padding: 0px;
		height: auto;
		width: 45%;
		box-sizing:border-box;
		display:block;
	}
	
	#modalModDescrip #windowModalModDescrip{
		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: linear-gradient(to top, #999, #EFEFEF, #FFF);*/
		background:#FFFFFF;
		margin: 0px;
		padding: 10px;
		height: auto;
		max-height: 100vh; /* como máximo el 100% del alto visible */
		width: 100%;
		border: thin none #000;
		position: fixed;
		left: 0%;
		top: 20%;
		right: 0px;
		bottom: 0px;
		box-shadow: 1px 1px 10px #000;
		overflow: auto;
		word-break: break-all;
		border-radius: 5px;
		background-color: #FFF;
	}
	
	#modalModDescrip #windowModalModDescrip #closeModalModDescrip{
		font-family: RobotoCondensed-Regular;
		font-size: 18px;
		font-style: normal;
		line-height: normal;
		font-weight: normal;
		font-variant: normal;
		text-transform: none;
		color: #FFF;
		text-decoration: none;
		margin: 0px;
		padding: 0px;
		height: 25px;
		width: 25px;
		border: thin none #000;
		position: absolute;
		left: 92%;
		top: 8%;
		right: 0px;
		bottom: 0px;
		cursor: pointer;
		z-index: 1;
	}
	
	.cantidad-wrapper {
		height: 34px;
	  }
	
	  .cantidad-wrapper input[type="number"] {
		width: 45px;
		font-size: 14px;
	  }
	
	  .btn-mas,
	  .btn-menos {
		width: 30px;
		font-size: 18px;
	  }
}

@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 (max-width:500px){
	
}

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

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

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

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

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

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

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


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