@media only screen and (-webkit-min-device-pixel-ratio: 1.5),
	   only screen and (min--moz-device-pixel-ratio: 1.5),
	   only screen and (min-device-pixel-ratio: 1.5){
}

/* FIX OCULTAR BOTÓN MENÚ */
@media screen and (max-width: 2400px) and (min-width: 1141px){
    .btn-menu{
        display: none !important
    }   

    .mobile .btn-menu{
    	display: block !important
    }
}

   


/* RESPONSIVE HORIZONTAL */



/* ----------------------------------------------------------------------*/

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

	
	
    

}





/* ----------------------------------------------------------------------*/

/* 1460
 
-------------------------------------------------------------------------*/
@media screen and (max-width: 1460px){
	
	
	
	/* #TEXTO's */
	h1{
		font-size:3em
	}
	h2{
		font-size:2.6rem
	}
	h3{
		font-size:2.2rem
	}
	h4{
		font-size:1.8rem
	}
	h5{
		font-size:1.4rem
	}
	h6{
		font-size:1.1rem
	}

	/* tit */
	.tit h2{
		font-size: 2.8rem
	}

	/* cabezal */
	.cabezal h2{
		font-size: 3rem
	}

	
	
    

}





/* ----------------------------------------------------------------------*/

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

   
	.slide-inicio .tx h2{
		font-size: 2.8rem;
	}
	
	
}





/* ----------------------------------------------------------------------*/

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




}





/* ----------------------------------------------------------------------*/

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

	/* #col */
	.col-25{
		-ms-flex: 0 0 24.9998%;
		flex: 0 0 24.9998%;
		width: 24.9998%
	}


	/* ratio */
	.ratio-40{
		padding-top: 75% !important
	}

	/* #TEXTO's */
	h1{
		font-size:2.8em
	}
	h2{
		font-size:2.4rem
	}
	h3{
		font-size:2rem
	}
	h4{
		font-size:1.6rem
	}
	h5{
		font-size:1.2rem
	}
	h6{
		font-size:1rem
	}

	/* tit */
	.tit h2{
		font-size: 2.1rem
	}

	/* cabezal */
	.cabezal h2{
		font-size: 2rem
	}

	

	/* #menú */
	.menu,
	.mobile .menu{
		position        : fixed;
		top             : 50px;
		bottom          : auto;
		left            : 0;
		width           : 100%;
		max-width       : 100%;
		height          : 0;
		background-color: rgba(0,0,0,.5);
		align-items     : center;
		justify-content : center;
		visibility      : hidden;
		height          : 0;
		opacity         : 0;
		transition      : all .4s ease
	}

	body.visible .menu,
	body.mobile.visible .menu{ 
		display   : flex;
		height    : 100%;
		visibility: visible;
		opacity   : 1
	}
	
		.menu ul,
		.mobile .menu ul{
			display    : none;
			width      : 100%;
			height     : 100%;
			float      : left;
			padding-top: 20px;
		}

		body.visible .menu ul,
		body.mobile.visible .menu ul{
			display: block
		}

			.menu ul li,
			.mobile .menu ul li{
				width     : 100%;
				float     : left;
				text-align: center;
			}
				
				.menu ul li a,
				.mobile .menu ul li a{
					width        : auto;
					display      : inline-block;
					float        : none;
					display      : inline-block;
					padding      : 10px 15px !important;
					font-size    : 1.3rem;
					margin-bottom: 10px
				}

				.menu li a:after{
					display: none
				}

		/* btn */
		.mobile .btn-menu,			
		.btn-menu{
			display: block
		}






	.slide-inicio .tx h2{
		font-size: 2.6rem;
	}



	/* # mapa */
	.mapa{
		height : 350px;
	}


	/* parallax */
	.cont-px{
		height: 500px
	}


	/* slide */
	.next{
		right: 15px
	}
	.prev{
		left: 15px
	}
	 /* tx */
	 .slide-inicio .tx{
	 	padding-left: 35px
	 }


	.img-camion{
		max-height: 260px
	}



	.box .ico:before{
		width: 100px;
		height: 100px
	}

	.box p{
		font-size: .8rem
	}



	.img-cajas{
		max-width: 340px
	}


	#contacto .col-md-6{
		flex: 0 0  100%;
		max-width: 100%
	}

	#contacto form{
		margin-bottom: 40px
	}



	.img-palet{
		max-height: 150px;
		transform: translate(0,-120px);
	}
}








/* ----------------------------------------------------------------------*/

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

	/* #ratio */
	.ratio-35{
		padding-top:40% !important;
	}
	.ratio-25{
		padding-top:35% !important;
	}
	.ratio-20{
		padding-top:30% !important;
	}
	.ratio-15{
		padding-top:20% !important;
	}
	
	/* #padding */
	.pt-5{
		padding-top: 20px !important
	}

	/* #margin */
	.mt-5{
		margin-top: 20px !important
	}

	/* #col */
	.col-25{
		-ms-flex: 0 0 24.9998%;
		flex    : 0 0 24.9998%;
		width   : 24.9998%
	}

	
	


}	





/* ----------------------------------------------------------------------*/

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

	
	.col-25{
		-ms-flex: 0 0 33.3332%;
		flex    : 0 0 33.3332%;
		width   : 33.3332%;

	}


	/* #textos */
	body{
		font-size: .9rem
	}
	
	h1{
		font-size:2rem
	}
	h2{
		font-size:1.7rem
	}
	h3{
		font-size:1.5rem
	}
	h4{
		font-size:1.3rem
	}
	h5{
		font-size:1.15rem
	}
	h6{
		font-size:.95rem
	}


	/* slides */
	.slide-inicio .tx h2{
		font-size: 2.3rem
	}
	.slide-banner i{
		width: 30px
	}



	.menu li a{
		font-size: 1.1rem
	}



	/* footer */
	#footer section img{
		height: 35px
	}
	#footer section h6{
		font-size: .9rem;
		margin-top: 10px
	}

	#footer section .col-md-6:nth-of-type(2) nav{
		text-align: left;
		margin-top: 20px
	}
	#footer section .col-md-6:nth-of-type(2) nav a{
		margin-left: 0; 
		margin-right: 10px
	}


	/* form */
	textarea.form-control, textarea{
		height: 200px !important
	}



}





/* ----------------------------------------------------------------------*/

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


	body,
	p,
	li{
		font-size: .85rem
	}




	
	/* #padding */
	.pt-5{
		padding-top: 15px !important
	}

	/* #margin */
	.mt-5{
		margin-top: 15px !important
	}




	.cabezal h2{
		font-size: 1.1rem
	}

	.tit h2{
		font-size: 1.3rem
	}


	.ratio-35{
		padding-top: 65% !important
	}

	.contenido{
		padding: 50px 0;
	}


	.cabezal .figura{
		width: 80px;
		height: 80px;
		bottom: -38px
	}

	header.tit.pt-5{
		padding-top: 50px !important;
		padding-bottom: 25px !important;
		margin-bottom: 30px !important
	}


	.img-camion,
	.img-cajas{
		display: none
	}

	#logistica .img-cajas{
		display: block !important;
		max-width: 220px;
		top: -140px !important
	}


	.col-camion + .col-12.mb-5{
		margin-bottom: 20px !important
	}



	.btn{
		padding: 8px 30px;
		font-size: .9rem
	}


	.degrade{
		opacity: .2 !important
	}

	.slide-inicio .degrade,
	.cabezal .degrade{
		opacity: .5 !important
	} 



	.prev, .next{
		width: 15px !important
	}

	.container{
		padding: 0 15px;
	}

	.btn-menu{
		right: 15px
	}
 	

	.lista li{
		padding-left: 25px;
	}
 	.lista li:before{
			width : 20px;
			height: 20px;
			top   : 0
 	}




 	.box-1 img{
 		max-height: 160px;
 		left: 10px;
 		transform: translate(-40px, -60px)
 	}


 	.box-1 article p{
 		width: 100%
 	}


 	.col-md-6.pr-5.fix-border.mt-2.mb-5{
 		padding-right: 15px !important;
 		margin-bottom: 0 !important
 	}
 	.col-md-6.pl-5.mt-2.mb-5{
 		padding-left: 15px !important
 	}
	
	.planta-de-acopio .tit.text-left.mt-5.pt-5.pb-5.fix-width{
		margin-bottom: 15px !important
	}



	.contacto form{
		margin-bottom: 30px
	}

	body.contacto section p{
		max-width: 100%; 
		width: 100%
	}

	#transporte .linea-dotted{
		width: 100%;
		max-width: 100%
	}

	#transporte .tit,
	#transporte .col-12.mb-3{
		margin-bottom: 0 !important
	}



	.slide-inicio .tx h2{
		font-size: 1.8rem
	}



	.box{
		padding-top: 70% 
	}
	.box-item{
		padding-top: 55%
	}
	.mapa{
		height: 300px
	}
	#logistica .box{ 
		width: 100%
	}


	body.logistica .bg-3 .col-12.pt-5.pb-5.mt-5.mb-5.fix{
		padding-bottom: 15px !important;
		margin-bottom: 15px !important
	}



	.row.pc{
		display: none !important
	}
	.slide-movil{
		display: block
	}






}

	@media screen and (max-width: 645px) and (orientation: landscape){ 
		

	}

 



/* ----------------------------------------------------------------------*/

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


	.slide-inicio .tx h2{
		font-size: 1.5rem
	}

	
	.menu ul li a, .mobile .menu ul li a{
		font-size: 1rem
	}

	body.logistica .cont-px .container{
		
	}
	body.logistica .cont-px .box-item{
		width: 100%;
		position: relative;
		right: 0
	}

	.slide-inicio .tx{
		padding-right: 40px;
	}
	.slide-inicio .tx h2{
		font-size: 1.35rem;
		line-height: 1.2
	}



	.box{
		padding-top: 65%
	}


}





/* ----------------------------------------------------------------------*/

/* 400
 
-------------------------------------------------------------------------*/
@media screen and (max-width: 400px){
	
	
	/* #menu */
	.menu  ul li a{
		font-size: 1rem
	}


	.ratio-40{
		padding-top: 100% !important
	}


	.slide-inicio .tx{
		top:10px;
	}
	.slide-inicio .tx h2{
		font-size: 1.3rem
	}




	.menu ul li a,
	.mobile .menu ul li a{
		padding      : 5px 15px !important;
		font-size    : .9rem;
		margin-bottom: 15px
	}




	
}




/* RESPONSIVE VERTICAL (si es necesario) */


/* # 700 */
@media screen and (max-device-height: 700px) {  


}