html, body { width: 100%; height: auto; margin: 0; padding: 0; font-family: "Lato", sans-serif; font-weight: 400 !important; font-size: 16px !important;   }
body { overflow-x: hidden !important; animation: fadein 2s; scroll-behavior: smooth; letter-spacing: 1.5px;
    -moz-animation: fadein 2s; /* Firefox */
    -webkit-animation: fadein 2s; /* Safari and Chrome */
    -o-animation: fadein 2s; /* Opera */ }
@keyframes fadein { from { opacity:0; } to { opacity:1;} }
@-moz-keyframes fadein { /* Firefox */ from { opacity:0; } to { opacity:1;} }
@-webkit-keyframes fadein { /* Safari and Chrome */ from { opacity:0; } to { opacity:1;} }
@-o-keyframes fadein { /* Opera */ from { opacity:0; } to { opacity:1;} }
html, body, button, a, li, h1, h2, h3, h4, img, input, ul, .hide, .filtro, .wrap, .menu-res, .menu-res_, iframe, .mark_, .box, figure { transition:all 200ms ease;  }
h1, h2, h3, h4, h5, h6, b { font-family: "Onest", sans-serif !important; font-weight:800; }
a { text-decoration:none; border-radius:0!important }
b { font-weight:700; }
sup {  }
.logo-he { width:280px; margin-top:-5px; }
header { width:100% !important; height:100px !important; line-height: 100%; position:fixed; top: 0; left: 0; z-index:150; transition:all 400ms ease; }
ul.menu { margin-top:30px; padding:0 !important;  }
ul.menu li { list-style:none;  margin: 0 5px; display: inline-block; vertical-align:middle;  width:auto; }
ul.menu li a { color:#fff; text-decoration:none; text-transform: uppercase; font-size:14px; font-weight:200; cursor:pointer; }
ul.menu li a:hover { color:#A8CF36 !important; }
ul.menu li.contacto a{ border:#AD852D solid 2px; padding:5px 10px; }
ul.menu li.contacto:hover a { border:#fff solid 2px; padding:5px 10px; }
ul.menu li.activo a { border:#fff solid 2px; padding:5px 10px; color:#fff; }
ul.menu li:hover a{ color:#fff; }
ul.menu li a i { margin-top: -7px;}
.habil { opacity:.4; pointer-events:none; }
.rs img { margin-top:-7px; }
.rs_ { position:absolute; right: 0px; }
.circle1 {}
.menu-res { width:100%; height:auto; background: rgba(2, 22, 31, .9); position:fixed; z-index:99999; top:100px; right:-100%; }
.menu-res_ { width:100%; height:auto; background: rgba(2, 22, 31, .9); position:fixed; z-index:99999; top:100px; right:0%; }
.menu-res ul { width:100%; height:auto; text-align:center; padding:0; }
.menu-res ul li { list-style:none; padding:20px 0 0 0; margin: 0 5px; display: block; vertical-align:top;  width:100%; }
.menu-res ul li a { color:#fff; text-decoration:none; text-transform: uppercase; font-size:14px; font-weight:200; cursor:pointer; }
.menu-res ul li a:hover { color:#A8CF36 !important; }
footer { background: url(img/footer.jpg) no-repeat center; overflow: hidden; background-size:cover; position:relative; padding:70px 0 125px 0; color:#fff; }
footer .container { position:relative; z-index:5; }
footer .pleca { top: -1px; left: 0; position:absolute; z-index:1; }
footer h3 { font-family: "Montserrat", sans-serif; font-weight: 400 !important; font-size: 16px !important; margin-bottom:35px;   }
footer .col-sm-3 img { margin-bottom:70px; }
footer a { color:#fff; }
footer a:hover { color:#A8CF36;  }
footer ul { padding:0; }
footer li { color:#fff; list-style:none;  }
section { position: relative; padding:75px 0px;  z-index:11 !important; height:100vh; }
section.hauto { position: relative; height:auto; padding:75px 0px;  z-index:11 !important;  }
section.hauto_ { position: relative; height:auto; padding:0 0 75px 0px;  z-index:11 !important;  }
section.hauto2 { position: relative; height:auto; padding:0 0 35vh 0px;  z-index:11 !important;  }
section.hauto3 { position: relative; height:auto; padding:75px 0px 0px 0px;  z-index:11 !important;  }
section a:hover { background:#000; color:#A8CF36; }


input.form-control { border-radius:0; border-left:none !important; border-right:none !important; 
        border-top:none !important; background:none !important; margin:30px 10px ; outline: none; color:#A8CF36; }
textarea.form-control { border-radius:0; border-left:none !important; border-right:none !important; 
        border-top:none !important; height: 90px; resize: none; background:none !important; margin:30px 10px ; outline: none; color:#A8CF36; }
.cover { background-size:cover; }
.caja  { width:33%; min-height:250px; display:inline-block; vertical-align:top; padding:30px 0 60px 0; margin:-5px; letter-spacing:1px; }
.caja img { width:100px; display: block; margin:25px auto; }
.caja b { display: block; margin:25px auto 5px auto; font-size:20px; font-family: "Bricolage Grotesque", sans-serif !important; }
.offset-1_ { padding-left:75px; }
.pt75 { padding-top:75px; }
.container { position:relative; z-index:20; }
.header {}
.mainn { background: rgba(2, 22, 31, .8); }
.fs16 { font-size:10px !important; }
.fs20 { font-size:20px; }
.fs40 { font-size:40px; }
.bgg { background:#F5F5F7; }
.pb { margin-bottom:-75px; }
.pz { padding:0px; }
.mtm { margin-top:-100px; }
.mtm2 { margin-top:-50px; }
.naranja { color:#A8CF36; }
.halfp { padding-left: 50px; }
.border1 { border-right:#F8F8F8 solid 7px; border-bottom:#F8F8F8 solid 7px;  }
.border2 { border-right:#F8F8F8 solid 7px ;  }
.border3 { border-bottom:#F8F8F8 solid 7px ;  }
.border1_ { border-right:#fff solid 7px; border-bottom:#fff solid 7px;  }
.border2_ { border-right:#fff solid 7px ;  }
.border3_ { border-bottom:#fff solid 7px ;  }
.flip_ { -webkit-transform: scaleX(-1); transform: scaleX(-1); }
.fa-2x { font-size:20px; }
.hr { width:100px; margin:25px auto; }
.ir { margin:70px 0; }
.verde { color:#A8CF36; }

#tienda { background: url(img/degrade.jpg) repeat-x top left; overflow: hidden; background-size:cover; 
            position:relative; padding:125px 0; color:#fff; }
#contacto { background: url(img/contacto.jpg) no-repeat center; overflow: hidden; background-size:cover; 
            position:relative; padding:125px 0; color:#fff; }

            ::-webkit-input-placeholder { /* Chrome/Opera/Safari */
  color: rgba(255, 255, 255, .3) !important;
}
::-moz-placeholder { /* Firefox 19+ */
  color: rgba(255, 255, 255, .3) !important;
}
:-ms-input-placeholder { /* IE 10+ */
  color:  rgba(255, 255, 255, .3) !important;
}
:-moz-placeholder { /* Firefox 18- */
  color:  rgba(255, 255, 255, .3) !important;
}

button.submit { margin:40px 0; width: 200px !important; background: none; border:#A8CF36 solid 2px; color: #fff; text-align: center; font-size:12px !important; padding:15px 15px !important;  border-radius:15px !important; }
button.submit:hover { margin:40px 0; width: 200px !important; background:#fff; color: #A8CF36; text-align: center; font-size:12px !important; padding:15px 15px !important;  border-radius:15px !important; }

a.btn_ {  margin:40px auto; width: 200px !important; background: none; border:#A8CF36 solid 2px; color: #fff; text-align: center; font-size:12px !important; padding:15px 15px !important;  border-radius:15px !important; }
a.btn_:hover { margin:40px 0; width: 200px !important; background:#fff; color: #A8CF36; text-align: center; font-size:12px !important; padding:15px 15px !important;  border-radius:15px !important; }

.pimg { float: left; width:25%; }
.clear { clear: both; }
.mul { mix-blend-mode: multiply !important; }
.pb_ { position: absolute; z-index: 1; bottom: 0; margin-bottom: 0; }
.pb_ { position: absolute; z-index: 1; bottom: 0; margin-bottom: 0; }
.fa-stack { background: #fff; position: relative; margin-top: -3px; text-align: center; 
            width: 9px; height: 9px; padding: 11.5px; border-radius: 12px;}
.fa-instagram { position:absolute; top:1px; font-size:15px; }
.fa-linkedin { position:absolute; top:1px; left:1px; font-size:15px; }
.fa-stack:hover { background: #A8CF36; }
#prokine { background: url(img/prokine-index.webp) no-repeat center !important; background-size: cover !important; color:#fff; padding-top:30vh; }
#prokine h1 { font-size: 58px; } 
#prokine p { font-size: 20px; margin:50px auto; } 
.panel { width:26%; display:inline-block; vertical-align:middle; margin:0 10px; position:relative; }
.p1 { margin-top:-10px; }
.p2 { margin-top:80px; }
.numeros {
  list-style-type: none;
  counter-reset: step-counter; 
  margin: 40px 0;
}
.numeros li { margin-bottom: 20px; position:relative; margin-left:10px; }
.numeros li::before {
  content: counter(step-counter);
  counter-increment: step-counter;
  /* Add styling like background color, padding, border-radius here */
  border-radius: 50%; position: absolute; margin-left: -50px; margin-top: -5px;
  background: #000; font-weight: 700; font-size: 18px; width: 35px; height: 35px; line-height: 22px; text-align: center;
  color: #fff; padding:4px 12px 5px 12px;
}
.logo-respando { width:250px; margin: 15px; display:inline-block; }
.burger { display: none; cursor: pointer; width:40px; height:40px;  position:fixed; z-index:999999999999999999999999; top:30px; right:30px; }
.burger:hover {}
.pon_ { display:none !important; }
.aviso { background:none; padding:0 !important; display: initial; font-size:10px !important; color:#A8CF36; }
.aviso:hover { background:none; padding:0 !important; display: initial; font-size:10px !important; }
.wh_ { position: fixed; z-index:99999999999; bottom:30px; right:30px; }

/* Icon 1 */

#nav-icon1, #nav-icon2, #nav-icon3, #nav-icon4 {
  width: 100%;
  height: 10px;
  position: relative;
  margin: 0px;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .5s ease-in-out;
  -moz-transition: .5s ease-in-out;
  -o-transition: .5s ease-in-out;
  transition: .5s ease-in-out;
  cursor: pointer;
}

#nav-icon1 span, #nav-icon3 span, #nav-icon4 span {
  display: block;
  position: absolute;
  height: 4px;
  width: 100%;
  background: #A8CF36;
  border-radius: 9px;
  opacity: 1;
  left: 0;
  -webkit-transform: rotate(0deg);
  -moz-transform: rotate(0deg);
  -o-transform: rotate(0deg);
  transform: rotate(0deg);
  -webkit-transition: .25s ease-in-out;
  -moz-transition: .25s ease-in-out;
  -o-transition: .25s ease-in-out;
  transition: .25s ease-in-out;
}

#nav-icon1 span:nth-child(1) {
  top: 0px;
}

#nav-icon1 span:nth-child(2) {
  top: 13px;
}

#nav-icon1 span:nth-child(3) {
  top: 26px;
}

#nav-icon1.open span:nth-child(1) {
  top: 18px;
  -webkit-transform: rotate(135deg);
  -moz-transform: rotate(135deg);
  -o-transform: rotate(135deg);
  transform: rotate(135deg);
}

#nav-icon1.open span:nth-child(2) {
  opacity: 0;
  left: -60px;
}

#nav-icon1.open span:nth-child(3) {
  top: 18px;
  -webkit-transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
  -o-transform: rotate(-135deg);
  transform: rotate(-135deg);
}

.upper { text-transform: uppercase; }
.activo { color:#A8CF36 !important; font-weight:700 !important; }

@media only screen and (max-width: 1080px) {
  .quit_ { display:none !important; }
  .pon_ { display:block !important; }
  .burger { display: block; } 

}

@media only screen and (max-width: 690px) {
  h1 br, h2 br, h3 br, p br, li br  { display:none; }
  .caja  { width:75%; min-height:200px; display:inline-block; vertical-align:top; }
  .halfp { padding-left: 3%; }
  .ico_  { font-size:30px !important; }

    .panel {
      width: 16%;
      display: inline-block;
      vertical-align: middle;
      margin: 0 10px;
        margin-top: 0px;
    }
      .numeros li::before {
      content: counter(step-counter);
      counter-increment: step-counter;
      border-radius: 50%;
      position: absolute;
      margin-left: -45px;
      margin-top: -5px;
      background: #000;
      font-weight: 700;
      font-size: 22px;
      width: 35px;
      height: 35px;
      line-height: 22px;
      text-align: center;
      color: #fff;
      padding: 4px 12px 5px 12px;
    }
    .offset-1_ { padding-left: 3%; }
    section {
      position: relative;
      padding: 75px 0px;
      z-index: 11 !important;
      height: auto;
    }
    .mtm { margin-top:-50px; }
    .border1 { border-right:none; border-bottom:#F8F8F8 solid 7px;  }
    .border2 { border-right:none ; border-bottom:#F8F8F8 solid 7px ;  }
    .border3 { border-bottom:#F8F8F8 solid 7px ;  }

    .border1_ { border-right:none; border-bottom:#fff solid 7px;  }
    .border2_ { border-right:none ; border-bottom:#fff solid 7px ;  }
    .border3_ { border-bottom:#fff solid 7px ;  }

    footer .col-sm-10 { padding-top: 25px; }
    form { width:90%; }
    
    .mtm2 {  margin-top: 0px; }
    footer {
  background: url(img/footer.jpg) no-repeat center;
    background-size: auto;
  overflow: hidden;
  background-size: cover;
  position: relative;
  padding: 150px 0 25px 0;
  color: #fff;
}
}

@media only screen and (max-width: 490px) {
    .fs40 {  font-size: 32px; margin: 0px auto 10px auto; }
    .fs20 {  font-size: 18px; }
    h2 { margin:30px auto; }
    #prokine h1 {  font-size: 38px; }
   section.hauto2 {
  position: relative;
  height: auto;
  padding: 0 0 50px 0px;
  z-index: 11 !important;
}
.pimg { float: left; width:33.3%; }
.mtm { margin-top:0px; }
.carousel {
   margin-bottom: 70px;
   margin-top: -70px;
}
    .pt75 {
  padding: 5px 0 45px 0;
}
}