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

/* SMARTPHONE */
@media only screen and ( min-width:320px ) and (max-width:1023px){
	body{
		padding-top: 64px;
	}
	.contenedor{
		padding: 0 20px;
	}
	.contenedor-sl{
		padding: 0 20px;
	}
	header{
		display: flex;
		align-items: center;
		justify-content: center;
		height: 64px;
		position: fixed;
		top: 0;
		left: 0;
		z-index: 9991;
	}
	header .contenedor{
		height: 100%;
		gap: 0px;
	}
	header .logo img{
		width: 200px;
	}
	header .nav{
		display: none;
	}
	header .nav-movil{
	    position: fixed;
	    top: 64px;
	    right: 0;
	    background: #222422;
	    height: calc(100vh - 64px);
	    width: 100%;
	    padding-top: 40px;
	}
	header ul{
		flex-direction: column;
		width: 100%;
		gap: 40px;
		padding: 0 30px;
	}
	header .btn-menu{
		display: flex;
		flex-direction: row;
	  	align-items: center;
		justify-content: center;
		height: 48px;
		width: 48px;
		gap: 10px;
		font-size: 12px;
		text-transform: uppercase;
		font-weight: 600;
		border-radius: 24px;
		padding: 0;
		position: absolute;
		right: 10px;
		top: 8px;
	}
	header .btn-menu span#x {
		float: left;
		display: block;
		width: 28px;
		height: 22px;
		-webkit-transition: all .3s ease, -webkit-transform .2s ease;
		      transition: all .3s ease, transform .2s ease;
		background: -webkit-linear-gradient(to bottom, transparent 0%, transparent 10%, #5F6163 10%, #5F6163 20%, transparent 20%, transparent 40%, #5F6163 40%, #5F6163 50%, transparent 50%, transparent 70%, #5F6163 70%, #5F6163 80%, transparent 80%), linear-gradient(transparent, transparent);
		background: linear-gradient(to bottom, transparent 0%, transparent 10%, #5F6163 10%, #5F6163 20%, transparent 20%, transparent 40%, #5F6163 40%, #5F6163 50%, transparent 50%, transparent 70%, #5F6163 70%, #5F6163 80%, transparent 80%), linear-gradient(transparent, transparent);
		-webkit-transform: scale(0.9);
		  -ms-transform: scale(0.9);
		      transform: scale(0.9);
	}
	header .btn-menu span#x.clicked {
		background: -webkit-linear-gradient(-45deg, transparent 0%, transparent 46%, #5F6163 46%, #5F6163 55%, transparent 51%, transparent 100%), linear-gradient(45deg, transparent 0%, transparent 46%, #5F6163 46%, #5F6163 55%, transparent 51%, transparent 100%);
		background: linear-gradient(-45deg, transparent 0%, transparent 46%, #5F6163 46%, #5F6163 55%, transparent 51%, transparent 100%), linear-gradient(45deg, transparent 0%, transparent 46%, #5F6163 46%, #5F6163 55%, transparent 51%, transparent 100%);
		-webkit-transform: rotate(180deg);
		  -ms-transform: rotate(180deg);
		      transform: rotate(180deg);
	}
	header .btn-menu span#x.clicked:active, header .btn-menu span#x.clicked:hover {
		-webkit-transform: scale(0.9) rotate(180deg);
		  -ms-transform: scale(0.9) rotate(180deg);
		      transform: scale(0.9) rotate(180deg);
	}
	.slider .slides .slide .content .txt h3{
	    font-size: 16px;
	    letter-spacing: 5px;
	    margin: 0 0 240px;
	}
	.slider .slides .slide .img{
	    max-height: 560px;
	}
	.slider .slides .slide .content .txt{
		min-height: 560px;
		height: auto;
	}
	.slider .slides .slide2 .content .txt h3{
		font-size: 20px;
        letter-spacing: 3px;
        line-height: 30px;
	}
	.slider .slides .slide2 .img{
	    max-height: 340px;
	}
	.slider .slides .slide2 .content .txt{
		min-height: 340px;
		height: auto;
		padding: 40px;
	}
	.slider .slides .slide3 .content .txt h3{
		font-size: 20px;
        letter-spacing: 3px;
        line-height: 30px;
	}
	.slider .slides .slide3 .img{
	    
	}
	.slider .slides .slide3 .content .txt{
		min-height: 590px;
		height: auto;
		flex-direction: column;
		gap: 0;
		padding: 40px 0;
	}
	.slider .slides .slide3 .content .txt .mid{
		order: 2;
		width: 100%;
		padding: 0 20px;
		justify-content: center;
	}
	.slider .slides .slide3 .content .txt .mid.l{
		order: 1;
	}
	.slider .slides .slide3 .content .txt .mid h3{
		font-size: 14px;
	    letter-spacing: 2.8px;
	    line-height: 30px;
	    text-align: center;
	}
	.slider .slides .slide3 .content .txt .mid .bottle{
		max-width: 100%;
	}
	.donde h3{
		letter-spacing: 3px;
	}
	.donde p{
		font-size: 16px;
	}
	footer{
		
	}
	footer .logo img{
		width: 200px;
	}
	footer .foot{
		font-size: 12px;
	}
	.bg-popup{
		gap: 100px;
	}
	.bg-popup .pop .buttons{
		flex-direction: column;
	}
	.bg-popup .pop{
		padding: 0 40px;
		align-items: center;
	}
	.bg-popup .pop h4{
		max-width: 240px;
	}
	
}


