/* ==========================================================================
   Media Queries
   ========================================================================== */

@media only screen and (max-width: 1200px) {
  
    .container{
      padding: 0 15px;
      max-width: 100%;
    }


    .columns .col_3{
    	width: 32%;
    	margin-right: 2%
    }

    .columns .col_3:nth-child(3n){
    	margin-right: 0;
    }

    #informacion p,
    #informacion h2{
    	padding-left: 20px;
    	padding-right: 20px;
    }

    #informacion h2{
    	 font-size: 22px;
    	line-height: 22px;
    	margin-bottom: 15px;
    }

    #slider .container{
      padding: 0;
    }

    #informacion .col_3{
    	padding-top: 30px;
    }

    #slider .bannerscollection_zoominout .contentHolderUnit{
        border-radius: 0px;
    }

    .columns .col_2{
    	float: left;
	    width: 49%;
	    margin-right: 2%;
    }

    .tabla .head-table p{
    	height: auto;
    	line-height: 18px !important;
    	padding: 10px 6px;
    }

    .tabla .row-table p{
    	padding-right: 8px;
    }
    

}


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

}

@media only screen and (max-width: 1050px) {
  
  header nav a{
    margin-right: 20px;
  }

  #slider .img-header{
        bottom: -105px;
    right: 60px;
  }

  .content-info{
  	padding-left: 20px;
  }

}


@media only screen and (max-width: 990px){
  .mobile{
    display: block;
  }

  .desktop{
    display: none;
  }

  header{
    height:  70px;
  }

  header img.logo{
       margin-top: 9px;
    width: 240px;
  }

  .menu-toggle{
        top: 25px;
  }

  #informacion h2{
  	font-size: 24px;
  	line-height: 24px;
  }

  #informacion{
  	margin-top: 115px;
  }

  #eventos,
  footer{
  	margin-top: 20px;
  }

  footer .data-contact > div i{
  	    margin-right: 5px;
    margin-left: 0px;
  }

  footer .data-contact > div:nth-child(1){
  	    width: 240px;
  }

  footer .data-contact > div:nth-child(2){
  		width: calc(100% - 240px);
  }

  footer{
  	height: auto;
  	padding: 30px 0px 20px 0;
  }

  footer .socials{
  	    padding-top: 20px;
  }

  header{
  	    height: 70px;
    position: fixed;
    width: 100%;
    top: 0;
    z-index: 200;
    background: white;
  }

  .site-content{
  	margin-top: 70px;
  }

  .text-top{
  	margin-top: 40px;
  }

  .content{
  	    margin-top: 30px;
  }

  .content-form{
  	    width: calc(100% - 270px);
  }

  .content-info{
  	width: 270px;
  }


	
}

@media only screen and (max-width: 880px){
	#slider .text{
		left: 50px;
	}

	#slider h3{
		 font-size: 54px;
    	line-height: 54px;
	}

	#slider span{
		font-size: 26px;
		line-height: 26px;
	}
}

@media only screen and (max-width: 767px){
	#slider .img-header{
		bottom: -80px;
	}

	#informacion .columns{
		  -webkit-box-orient: vertical;
  -webkit-box-direction: normal ;
  -webkit-flex-direction: column ;
      -ms-flex-direction: column ;
          flex-direction: column ;
	}

	.columns .col_3{
		width: 100%;
		margin-right: 0;
		margin-bottom: 10px;
	}

	.columns .col_3:last-child{
		margin-bottom: 0;
	}

	#informacion{
		margin-top: 80px;
	}

		#slider h3{
		 font-size: 44px;
    	line-height: 44px;
	}

	#slider span{
		font-size: 20px;
		line-height: 20px;
	}

	#informacion .col_3.violet{
		margin-bottom: 0;
	}
}

@media only screen and (max-width: 550px){
	footer .data-contact,
	footer .socials,
	footer .data-contact > div{
		width: 100% !important;
		text-align: center;
		float: none;
	}

	footer .socials{
		padding-top: 5px;
	}

	footer{
		padding-top: 24px;
	}

	footer .data-contact > div i{
		width: 25px;
    	height: 25px;
	}

	footer .data-contact > div:nth-child(1) i{
		font-size: 14px;
	}

	footer .data-contact > div:nth-child(2) i{
		font-size: 12px;
	}

	footer .data-contact > div:nth-child(3) {
		font-size: 0;
	}

	footer .data-contact > div:nth-child(3) i{
		font-size: 14px;
	display: inline-block;
    vertical-align: top;
	}

	footer .data-contact > div:nth-child(3) span{
		    display: inline-block;
	    vertical-align: top;
	        line-height: 20px;
	}

	footer .data-contact > div:nth-child(3) span br{
		display: block;
	}

	footer .data-contact > div span, footer .data-contact > div a{
		line-height: 25px;
	}

	footer .socials{
		    margin-top: 10px;
	}

	#slider .img-header {

		    width: 63.549%;
    height: 48.056%;
	/*      height: 247px;
    width: 326px;*/
    left: 50%;
    transform: translateX(-50%);
    bottom: -126px !important;
	}

	#informacion {
    margin-top: 148px;
}

	#slider h3{
		 font-size: 44px;
    	line-height: 44px;
	}

	#slider span{
		font-size: 20px;
		line-height: 20px;
	}

	#slider .text {
    	left: 50%;
	    transform: translate(-50%,-50%);
	    top: 50%;
	    width: 100%;
	    text-align: center;
	}

	footer{
		padding: 30px 0px 15px 0;
	}

	.text-top,
	.content{
		margin-top: 20px;
	}

	.text-top p{
		font-size: 18px;
    	line-height: 24px;	
	}


	.content-info {
	    width: 100%;
	    text-align: center;
	    padding-top: 0;
	    padding-left: 0;
	       border-bottom: 1px solid #ccc;
    margin-bottom: 15px;
	}

	.content-info p.lab{
		margin-bottom: 15px;
	}

	.contact .columns {
	    margin-top: 20px;
	}

	.content-form{
		width: 100%;
	}

	.tabla_2 p span{
		padding-left: 0;
		text-align: center;
	}

	.columns .col_2 {
	    float: none;
	    width: 100%;
	    margin-right: 0;
	}

		
	.omega-3 #content .the-importance{
		display: block;
	}

	.omega-3 #content .the-importance .center-center {
	    width: 100%;
	    position: relative;
	    top: auto;
	    left: auto;
	    transform: translate(0,0);
	}

	.omega-3 #content h3{
	    font-size: 32px;
	    line-height: 32px;
	    margin-top: 20px;
	}

	.products .top-banner h2{
		font-size: 28px;
		line-height: 28px;
	}

	#chia-seed-oil .product-title,
	#aceite-de-chia .product-title{
				width: 210px !important;
			    height: 70px;
			    line-height: 70px;
			    padding: 0 !important;
	}

	#organic-chia-seed-oil .product-title
	#aceite-de-chia-organico .product-title{
	width: 320px !important;
			    height: 70px;
			    line-height: 70px;
			    padding: 0 !important;
	}

	#chia-seed-powder .product-title,
	#fibra-de-chia .product-title{
	width: 280px !important;
			    height: 70px;
			    line-height: 70px;
			    padding: 0 !important;
	}

	.download .columns .col_2{
		margin-bottom: 10px;
	}

	.download .columns .col_2:nth-child(2){
		margin-bottom: 0;
	}

	#chia-seed-oil, #organic-chia-seed-oil, #chia-seed-powder,
	#aceite-de-chia, #fibra-de-chia, #aceite-de-chia-organico{
		margin-top: 25px;
	}

	#organic-chia-seed-oil .product-title, #aceite-de-chia-organico .product-title{
		width: 90% !important;
	}

	#slider .container > div:nth-child(2){
		display: block !important;
	}

	#slider .container > div:nth-child(1){
		display: none !important;
	}


	.nav-links .nav-link a{
		transition: none;
	}

	.nav-links .nav-link a:before{
		content:none;
	}



}

@media only screen and (max-width: 399px){
	#slider h3{
		 font-size: 30px;
    	line-height: 30px;
	}

	#slider span{
		font-size: 16px;
		line-height: 16px;
	}

	header img.logo {
    margin-top: 17px;
    width: 170px;
	}

	.products .top-banner h2{
		font-size: 22px;
	}

	#chia-seed-oil .product-title,
	#aceite-de-chia  .product-title{
				width: 170px !important;
			    height: 55px;
			    line-height: 55px;
			    padding: 0 !important;
	}

	#organic-chia-seed-oil .product-title,
	#aceite-de-chia-organico .product-title{
	 width: 270px !important;

			    height: 55px;
			    line-height: 55px;
			    padding: 0 !important;
	}

	#chia-seed-powder .product-title,
	#fibra-de-chia .product-title{
	width: 220px !important;
			    height: 55px;
			    line-height: 55px;
			    padding: 0 !important;
	}

	#slider .img-header{
		    bottom: -95px !important;
	}

	#informacion {
	    margin-top: 100px;
	}



}