  html, body { margin: 0; height: 100%; : 100%;  color: #fff; font-family: 'Khula', sans-serif; font-weight: 100; }
  body { overflow-x: hidden; }
  header { width: 100%; height: 150px; position: fixed; z-index: 119 !important; top: 0; background: url(img/remate2.png) no-repeat center bottom; background-size: 100% auto;   }
  .logo { position: absolute; left: 9%; top: 15px; }

  h1, h2, h3, h4, h5, h6, p { position: relative;  font-family: 'Khula', sans-serif; }

  footer { color: #fff; padding: 11vh 0 9vh 0;   }
  footer p { font-size: 14px; padding-top:65px; opacity: 0.6; }
  footer h4 { margin-bottom: 45px; }
  footer hr { width: 15%; margin: 35px 0; height: 3px; background: #fff;  }
  footer .rs { margin-right: 10px; }
  footer ul {  padding: 0;  }
  footer ul li {  list-style: none; font-size: 16px; font-weight: 300; margin-bottom: 15px;   }
  .remate { width: 100%; height: auto; padding:5vh 0;  background: url(img/footer.jpg) no-repeat center top; background-attachment: fixed; background-size: cover;  }

  a { color: #fff; transition:all 300ms ease !important; }
  a:hover { color: #fff; opacity: 0.5; text-decoration: none; }

  header ul { width: 100%;  height: auto; padding-top: 20px;  }
  header ul li { display: inline-block; list-style: none; line-height: 90px; margin: 0 10px; }
  header ul li a { color: #50b353; text-transform: uppercase; font-family: 'Khula', sans-serif; font-weight: 600; font-size: 16px; }
  header ul li a:hover { color: #aacb49; }

  #index { background: #8ac040; }
 
  .deco1 { position: absolute; left: 0; top: -75px; z-index: 1; }
   .deco2 { position: absolute; right: 0 !important; top: 75px; z-index: 10; }
  .zana { background: #f9fcf5 url(img/zana.jpg) no-repeat center ; background-size: cover; width: 85%; height: auto; padding: 65px 25px 65px 45% !important; color: #9dbb44; position: relative;  z-index: 5;  }
  .zana h2 { position: relative; margin-left: -20px !important; }  
  .nos { background: #4bb154 ;  position: relative; width: 55%; margin-left: 45%; height: auto; margin-top: -45px; padding: 25px 50px  !important; color: #fff; position: relative;  z-index: 5; }


  .idioma { width:auto; height:35px; padding-left:90px; position:absolute;   right:30px; top:10px; font-size:11px; font-weight: 600; background:url(../img/mm.png) left center no-repeat; text-align:right; color:#616365; }
  .esp { color:#50b353;   margin-top:10px; width:auto; display:inline-block; } 
  .divv { color:#50b353;  margin-right:10px; margin-left:5px; margin-top:10px; width:auto; display:inline-block; }  
  .eng { color:#50b353;  margin-top:10px; width:auto; display:inline-block; }  

  .baja { top: 110px; background: rgba(30, 56, 90, 0.9);   }
  .valores { background: #f9fcf5 url(img/valores.jpg) no-repeat top center ; box-shadow: 1px 15px 15px rgba(0, 0, 0, 0.5); padding:35px 18px;  box-sizing: border-box; margin: 0 10px; background-size: 100% 200%; z-index: 105; display: inline-block !important; }
  .valores h3 { text-transform: uppercase; }
  .valores p { font-size: 14px; }
  /*
  .header { background: none; transition:all 300ms ease; }
  .oscuro { background: rgba(255, 255, 255, 0.9);  }
*/
  #nosotros { width: 100%; height: auto; background: #f9fcf5; padding: 150px 0; position: relative;}
  #productos { width: 100%; height: auto; background: #f9fcf5; position: relative; padding: 17vh 0 75vh; color: #000; position: relative; }
  #productos .container-fluid { position: relative; z-index: 10; }

  #testimonios { width: 100%; height: auto; background: url(img/testimonio.jpg) no-repeat center top; position: relative; /*background-attachment: fixed;*/ background-size: cover; padding: 120px 0 45vh 0; }
  #testimonios .container-fluid { position: relative; z-index: 10; }
  #deplant { width: 100%; height: 100vh; background: url(img/inicio.jpg) no-repeat center top; background-attachment: fixed; background-size: cover; padding-top: 47vh; }
  #deplant p { font-size: 24px; font-family: 'Khula', sans-serif; line-height: 22px; height: auto; padding-bottom: 15px; margin: 45px 0; } 

  .carousel { margin-top: 50px;  }
  .carousel-cell { width: 100%; height: auto;  }
  .carousel-cell i{ color:#fff; }
  .flickity-prev-next-button { background: none; }
  .flickity-prev-next-button:hover { background: none; fill: #f60; }

  .slide1 { background:#fff  url(img/slide1.jpg) no-repeat center !important; background-size: cover !important; height: 100vh;  }
    .slide2 { background:#fff  url(img/slide2.jpg) no-repeat center !important; background-size: cover !important; height: 100vh;  }
      .slide3 { background:#fff  url(img/slide3.jpg) no-repeat center !important; background-size: cover !important; height: 100vh;  }
        .slide4 { background:#fff  url(img/slide4.jpg) no-repeat center !important; background-size: cover !important; height: 100vh;  }

  .cereales { position: absolute; bottom: 0; right: 0; z-index: 1; }
  figure { width: 250px; height: 200px; position: absolute; padding: 50px 15px 15px 15px; font-size: 12px; line-height: 14px; color: #fff; box-sizing: border-box; border-radius: 25px; top: -205px;  opacity:0; display: none; transition:all 300ms ease !important; }
  a.boton { margin-left: 120px; position: relative; color: #000; background: url(img/boton.png) no-repeat center; background-size:auto 100% ; width: 181px; height: 37px; line-height: 43px; display: block; padding: 0 15px; box-sizing: border-box;   }
  a.boton:hover { opacity: 1; color: red; padding: 0 25px; }
  a.boton:hover figure { opacity: 1;   display: inline; top: -210px;  }
  .arrow { margin-top:10px; float: right; }

.tool1 { background: url(productos/turgen-h.png) no-repeat !important; background-size:auto 95% !important; }
.tool2 { background: url(productos/signal-h.png) no-repeat !important; background-size:auto 95% !important; }
.tool3 { background: url(productos/vigorem-h.png) no-repeat !important; background-size:auto 95% !important; }
.tool4 { background: url(productos/impetus-h.png) no-repeat !important; background-size:auto 95% !important; }

video { background: url(img/poster.png) no-repeat !important; background-size:cover !important; }
.volver { color: #50b353; width: 170px !important; display: block; font-size: 16px; }
.volver > .arrow { margin-top: 3px; }
.volver:hover { font-weight: bold; color: #FBAF3F; }

  .modal-title { color:#000; }
  .modal-dialog, .modal-content { width: 100%; background: #fff; padding: 25px; }
  .modal-dialog {
    max-width: 75%;
    margin: 30px auto;
}

  #deplant .container-fluid  { position: relative; z-index: 10;  width: 100%; height: auto; }
  #deplant .carousel {
    background: #EEE;
    position: absolute; z-index: 1; width: 100%; height: 100vh; top: -49px; 
  }

  #deplant .carousel-cell {
    width: 100%; height: 100vh; background: rgba(0,0,0,0.2);
  }

  .blanco-bg { background: none !important; padding: 75px 0; color: #727272; }

  /* FORMULARIO */

  form { width:100% ; height:auto;   }
  .tipos { margin-bottom: -50px; }
  .tipos .btn_con { display: inline-block; font-size: 15px; cursor: pointer; }
  .btn_con { font-size:14px; cursor: crosshair; }
  textarea, input { background: none; border: #fff solid 1px; border-radius: 25px; padding: 5px 15px; height: 32px;  width: 100%; color: #dafc76; letter-spacing: 1px;   }
  input, select { width:100%; }
  label { margin: 10px 0 -15px 0; }
  #upload-file-container {
  width:95%; height:36px; background:#616365 url(../img/subir.png) no-repeat center; display: inline-block; margin-bottom:10px; font-family: 'ralewaymedium'; font-size:12px; border:#616365 solid 1px; position:relative; }
  button { margin:20px 0px 0px 0px; }
  input[type="submit"] { background: #fff; color: green; width: auto; font-weight: 800; text-transform: uppercase; letter-spacing: 1px; padding: 5px 15px; margin: 25px 0; }

  #soluciones {  }
  #empleo { display:none;  }
  .copy_cont { font-size: 18px; }
  .txt-b { color: #fff; }

  .datos { margin: 50px 0; display: none; }
  .datos h2 { font-weight: 800; color:#48a8c2 ; }
  .datos h3 { font-weight: 400; color:#48a8c2 ; font-size: 18px; }
  .datos p { font-size: 15px;  }
  ul.listado { font-size: 13px; font-weight: 400; margin-top: -50px;  }
  ul.listado li { margin-bottom: 15px; list-style: none; }
  .cafe { color: #592d1d; }
  .rojo { color: #AF1E24; }
  strong { font-weight: 800; font-size: 16px; }

.tur-h { background:#fff url(productos/turgen-h.png) no-repeat !important; width: 100%;  background-size:100% auto !important; padding-top: 220px; }
.sig-h { background:#fff url(productos/signal-h.png) no-repeat !important; width: 100%;  background-size:100% auto !important; padding-top: 220px; }
.vig-h { background:#fff url(productos/vigorem-h.png) no-repeat !important; width: 100%;  background-size:100% auto !important; padding-top: 220px; }
.imp-h { background:#fff url(productos/impetus-h.png) no-repeat !important; width: 100%;  background-size:100% auto !important; padding-top: 220px; }

.desc { font-size: 14px; font-weight: 600 !important; margin: 20px 0 0 1%; text-align: justify; /*color: #84c44a;*/ color:#fff; width: 80% }
.remate-txt { margin-bottom: 250px; font-size: 14px; }
.producto { margin-top: -150px; }
.tabla1 { margin-top: -50px; display: none; }
.tabla2 { position: absolute; left: 0; text-align: center; width: 290px; height: 350px; background: url(productos/launch.png) center left; background-size: 100% auto; right: -70px; margin-top:-250px !important; }


 @media only screen and (max-width: 600px) {
  
 .zana {background-image: none !important;  background: #f9fcf5 !important; background-size: cover; width: 100%; height: auto; padding: 65px 3% 65px 3% !important; color: #9dbb44; position: relative;  z-index: 5;  }
  .zana h2 { position: relative; margin-left: 0px !important; }  
    .nos { background: #4bb154 ;  position: relative; width: 100%; margin-left:0%; height: auto; margin-top: -5px; padding: 25px 3%  !important; color: #fff; position: relative;  z-index: 5; }
.deco2 { display: none; }

.tur-h { background:#fff url(productos/turgen-h.png) no-repeat !important; width: 100%;  background-size:auto 800px  !important; padding-top: 220px; }
.sig-h { background:#fff url(productos/signal-h.png) no-repeat !important; width: 100%; background-size:auto 800px  !important;  padding-top: 220px; }
.vig-h { background:#fff url(productos/vigorem-h.png) no-repeat !important; width: 100%; background-size:auto 800px  !important;  padding-top: 220px; }
.imp-h { background:#fff url(productos/impetus-h.png) no-repeat !important; width: 100%; background-size:auto 800px  !important;  padding-top: 220px; }


.desc { font-size: 14px; font-weight: 600 !important; margin: 20px 0 0 1%; text-align: justify; /*color: #84c44a;*/ color:#fff; width: 80% }
.remate-txt { margin-bottom: 250px; font-size: 14px; }
.tabla1 { margin-top: -100px; }
.tabla2 { position: relative; right: 0; text-align: center; width: 290px; height: 350px; padding-top: 10px; background: url(productos/launch.png) center right; left: -70px; margin-top:50px !important; margin-bottom: 50px; }


.producto { margin-top: 0px; }


 header ul { width: 100%;  height: 20px; top: 100px; padding: 0px; background: #9dbb44 !important; position: absolute; left: 0;  }
  header ul li { display: inline-block; list-style: none; line-height: 0px; margin: -10px 5px 0 5px !important;  }
  header ul li a { color: #fff; text-transform: uppercase; font-family: 'Khula', sans-serif; font-weight: 600; font-size: 11px; }
  header ul li a:hover { color: #aacb49; }
  .logo > img { width: 200px !important; margin-top: 15px; margin-left: -5%; }
 .cereales { position: absolute; bottom: 0; right: 0; z-index: 1; display: none; }
   #productos { width: 100%; height: auto; background: #f9fcf5; position: relative; padding: 15vh 0 15vh; color: #000; position: relative; }
}




