html, body {
    overflow-x: hidden;
    overflow-y: auto;
    /*font-family: Roboto,sans-serif!important;*/
}
.preloader{

  /*justify-content:center;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: #fff;
  z-index: 9999;*/
/*#eaeaea4a*/
  background-color: #fff;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: white;
  display: flex;
  justify-content: center;
  align-items: center;
  z-index: 9999;
  transition: 1s all;
}

.kinner{
  /*font-family: "Open Sans", sans-serif!important;*/
    line-height: 1.1!important;
    padding: 0 15px 30px!important;
    text-align: center!important;
    font-size: 1.5em!important;
    font-weight:normal!important; 
    position: relative!important;
    margin-left: auto!important;
    margin-right: auto!important;
    width: 100%!important;
    background-position: 50% 50%!important;
    background-size: cover!important;
    background-repeat: no-repeat!important;
    -ms-flex: 1 0 auto!important;
    flex: 1 0 auto!important;

}

.section__wrap {
    padding: 30px 40px;
}

.videok{
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
}

.contener_general{
  -webkit-animation:animball_two 1s infinite;
  -moz-animation:animball_two 1s infinite;
  -ms-animation:animball_two 1s infinite;animation:animball_two 1s infinite;
  width:44px;
  height:44px;
  
} 
.contener_mixte{
  width:44px;
  height:44px;
  position:fixed
} 
.ballcolor{
  width:20px;
  height:20px;
  border-radius:50%
} 
.ball_1, .ball_2, .ball_3, .ball_4{
  position:absolute;
  -webkit-animation:animball_one 1s infinite ease;
  -moz-animation:animball_one 1s infinite ease;
  -ms-animation:animball_one 1s infinite ease;
  animation:animball_one 1s infinite ease
} 
.ball_1{
  background-color:#F08C65;
  top:0;
  left:0
} 
.ball_2{
  background-color:#43B2AD;
  top:0;left:24px
} 
.ball_3{
  background-color:#A3587A;
  top:24px;
  left:0
} 
.ball_4{
  background-color:#B4D16E;
  top:24px;
  left:24px
} 
@-webkit-keyframes animball_one{
  0%{
    position:absolute
  } 
  50%{
    top:12px;
    left:12px;
    position:absolute;
    opacity:0.5
  } 
  100%{
    position:absolute
  }
} 
@-moz-keyframes animball_one{
  0%{
    position:absolute
  } 
  50%{
    top:12px;
    left:12px;
    position:absolute;
    opacity:0.5
  } 
  100%{
    position:absolute
    }
} 
@-ms-keyframes animball_one{
  0%{
    position:absolute
    } 
  50%{
    top:12px;
    left:12px;
    position:absolute;
    opacity:0.5
  } 
  100%{
    position:absolute
  }
} 
@keyframes animball_one{
  0%{
    position:absolute
    } 
  50%{
    top:12px;
    left:12px;
    position:absolute;
    opacity:0.5
  } 
  100%{
    position:absolute
  }
} 
@-webkit-keyframes animball_two{
  0%{
    -webkit-transform:rotate(0deg) scale(1);
    } 
  50%{
    -webkit-transform:rotate(360deg) scale(1.2);
  } 100%{
  -webkit-transform:rotate(720deg) scale(1);
  }
} 
@-moz-keyframes animball_two{
  0%{
    -moz-transform:rotate(0deg) scale(1);
    } 
  50%{
    -moz-transform:rotate(360deg) scale(1.3);
    } 
    100%{
      -moz-transform:rotate(720deg) scale(1);
    }
} @-ms-keyframes animball_two{
  0%{
    -ms-transform:rotate(0deg) scale(1);
    } 
    50%{
      -ms-transform:rotate(360deg) scale(1.3);
      } 
    100%{-ms-transform:rotate(720deg) scale(1);
    }
}






.main_h {
  position: fixed;
  top: 0px;
  max-height: 85px;
  z-index: 999;
  width: 100%;
  padding-top: 25px;
  background: none;
  overflow: hidden;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  opacity: 0;
  top: -100px;
  padding-bottom: 6px;
  font-family: "Montserrat", sans-serif;
}
@media only screen and (max-width: 766px) {
  .main_h {
    padding-top: 25px;
  }
}

.logo-head{
  margin-left: -29%!important;
  margin-top: -2.7%!important;
  position: relative!important;
}

.open-nav {
  max-height: 400px !important;
}
.open-nav .mobile-toggle {
  transform: rotate(-90deg);
  -webkit-transform: rotate(-90deg);
}

.sticky {
  background-color: rgba(255, 255, 255, 0.93);
  opacity: 1;
  top: 0px;
  border-bottom: 1px solid gainsboro;
}

.logo {
  width: 50px;
  font-size: 25px;
  color: #8f8f8f;
  text-transform: uppercase;
  float: left;
  display: block;
  margin-top: 0;
  line-height: 1;
  margin-bottom: 10px;
}
@media only screen and (max-width: 766px) {
  .logo {
    float: none;
  }

  .contenedortexto {
      margin: auto!important;
      display: none!important;
      position: absolute!important;
      padding-top: 10px!important;
      width: 100%!important;
  }

  .h11 { 
      position: relative!important; 
      float: left!important;
      background: #fff;
      font-family: Raleway,sans-serif;
      font-weight: 200;
      color: #242424!important;
      font-size: 1.22em!important;
  }


  .h11 span {
      position:absolute!important;
      right:0!important;
      width:0!important;
      background: #fff;
      border-left: 1px solid rgb(67,178,173)!important;  
      animation: escribir 2s steps(20) infinite alternate;
      -webkit-animation: escribir 2s steps(20) infinite alternate;
  }

  .card-title{
    font-size: 0.98em!important;
  }
  .card-text{
    font-size: 0.78em!important;
  }
}

nav {
  float: right;
  width: 60%;
}
@media only screen and (max-width: 766px) {
  nav {
    width: 100%;
  }
}
nav ul {
  list-style: none;
  overflow: hidden;
  text-align: right;
  float: right;
}
@media only screen and (max-width: 766px) {
  nav ul {
    padding-top: 10px;
    margin-bottom: 22px;
    float: left;
    text-align: center;
    width: 100%;
  }
}
nav ul li {
  display: inline-block;
  margin-left: 35px;
  line-height: 1.5;
}
@media only screen and (max-width: 766px) {
  nav ul li {
    width: 100%;
    padding: 7px 0;
    margin: 0;
  }
}
nav ul a {
  color: #242424;
  /*text-transform: uppercase;*/
  text-transform: uppercase;
  font-size: 0.81em!important;
  font-family: "Open Sans", sans-serif!important;
}

.mobile-toggle {
  display: none;
  cursor: pointer;
  font-size: 20px;
  position: absolute;
  right: 22px;
  top: 0;
  width: 30px;
  -webkit-transition: all 200ms ease-in;
  -moz-transition: all 200ms ease-in;
  transition: all 200ms ease-in;
}
@media only screen and (max-width: 766px) {
  .mobile-toggle {
    display: block;
  }
}
.mobile-toggle span {
  width: 30px;
  height: 4px;
  margin-bottom: 6px;
  border-radius: 1000px;
  background: #8f8f8f;
  display: block;
}

.row {
  width: 100%;
  max-width: 940px;
  margin: 0 auto;
  position: relative;
  padding: 0 2%;
}



.mouse {
  display: block;
  margin: 0 auto;
  width: 26px;
  height: 46px;
  border-radius: 13px;
  border: 2px solid #e8f380;
  position: absolute;
  bottom: 40px;
  position: absolute;
  left: 50%;
  margin-left: -26px;
}
.mouse span {
  display: block;
  margin: 6px auto;
  width: 2px;
  height: 2px;
  border-radius: 4px;
  background: #e8f380;
  border: 1px solid transparent;
  -webkit-animation-duration: 1s;
  animation-duration: 1s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
  -webkit-animation-iteration-count: infinite;
  animation-iteration-count: infinite;
  -webkit-animation-name: scroll;
  animation-name: scroll;
}

@-webkit-keyframes scroll {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    transform: translateY(20px);
  }
}
@keyframes scroll {
  0% {
    opacity: 1;
    -webkit-transform: translateY(0);
    -ms-transform: translateY(0);
    transform: translateY(0);
  }

  100% {
    opacity: 0;
    -webkit-transform: translateY(20px);
    -ms-transform: translateY(20px);
    transform: translateY(20px);
  }
}

.kcolorA{
  background-color:rgb(242,140,101)!important; 
}

.kcolorB{
  background-color:rgb(67,178,173)!important;  
}

.kcolorC{
  background-color:rgb(163,88,122)!important;
}

.kcolorD{
  background-color:rgb(180,209,110)!important;  
}
.footer{
  bottom: 0px!important;
  background-color:#242424!important; 
  color: #fff!important;
  padding-top:24px;
  padding-bottom:24px;
  font-size: 0.92em!important;
  font-family: Raleway,sans-serif; 
  text-align: center!important;
}

.kcoltextA{
  color:rgb(242,140,101)!important; 
}
.kcoltextB{
  color:rgb(67,178,173)!important;  
}
.kcolorw{
  color:#fff!important;
  font-size: 1.022em!important;
  font-family: Raleway,sans-serif;
}

.active{
  color:rgb(67,178,173)!important;  
}
.md-form{
  margin-top: 5%!important;
}
.md-form input:not([type]):focus:not([readonly]), .md-form input[type="text"]:not(.browser-default):focus:not([readonly]), .md-form input[type="password"]:not(.browser-default):focus:not([readonly]), .md-form input[type="email"]:not(.browser-default):focus:not([readonly]), .md-form input[type="url"]:not(.browser-default):focus:not([readonly]), .md-form input[type="time"]:not(.browser-default):focus:not([readonly]), .md-form input[type="date"]:not(.browser-default):focus:not([readonly]), .md-form input[type="datetime"]:not(.browser-default):focus:not([readonly]), .md-form input[type="datetime-local"]:not(.browser-default):focus:not([readonly]), .md-form input[type="tel"]:not(.browser-default):focus:not([readonly]), .md-form input[type="number"]:not(.browser-default):focus:not([readonly]), .md-form input[type="search"]:not(.browser-default):focus:not([readonly]), .md-form input[type="phone"]:not(.browser-default):focus:not([readonly]), .md-form input[type="search-md"]:focus:not([readonly]), .md-form textarea.md-textarea:focus:not([readonly]) {
    border-bottom: 1px solid rgb(67,178,173)!important;
    -webkit-box-shadow: 0 1px 0 0 rgb(67,178,173)!important;
    box-shadow: 0 1px 0 0 rgb(67,178,173)!important;
}

form-control:focus {
    border-color: color:rgb(67,178,173)!important; 
    outline: 0;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075), 0 0 8px rgba(102,175,233,.6);
}

.disfrutemos{
    font-family: 'Playball', cursive!important;
    font-size: 1.68em!important;
    padding: 20px!important;
    margin: 4%!important;
    text-align: center!important;
}


.contenedortexto {
    margin: auto;
    display: table;
    position: absolute;
    padding-top: 50px!important;
    width: 100%!important;
}

.h11 { 
    position: relative; 
    float: left;
    background: #fff;
    font-family: Raleway,sans-serif;
    font-weight: 200;
    color: #242424;
    font-size: 3.2em;
}

.h11 span {
    position:absolute;
    right:0;
    width:0;
    background: #fff;
    border-left: 1px solid rgb(67,178,173)!important;  
    animation: escribir 3s steps(30) infinite alternate;
    -webkit-animation: escribir 3s steps(30) infinite alternate;
}

@keyframes escribir {
    from { width: 100% }
    to { width:0 }
}


@-webkit-keyframes escribir 
{
    from { width: 100% }
    to { width:0 }
}

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

.strech{
  width: 100%;
  padding-left: 0px!important;
  padding-right: 0px!important;
  margin-left:  0px!important;
  margin-right: 0px!important;
  left: 0%!important;
  right:0%!important;
}



  .parallax {
    height: 100vh;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-perspective: 1px;
    perspective: 1px;
  }
  .parallax_layer {
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
  }
  .parallax_layer-front {
    -webkit-transform: translateZ(0);
    transform: translateZ(0) scale(1.6);
  }
  .parallax_layer-middle {
    -webkit-transform: translateZ(-1px);
    transform: translateZ(-1px) scale(3.2);
  }
  .parallax_layer-back {
    -webkit-transform: translateZ(-2px);
    transform: translateZ(-2px) scale(6.4);
  }

  /* demo styles
  --------------------------------------------- */
  * {
    margin:0;
    padding:0;
  }
   /* add some padding to force scrollbars */
  .parallax_layer {
    padding: 100vh 0;
  }
   /* centre the content in the parallax layers */
  .title {
    position: absolute;
    left: 50%;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
  }
  .cover{
    position: fixed;
    background-color: #2B4C80;
    width: 100%;
    height: 140vh;
    top: 140vh;
  }


  form label{
  font-weight:normal;
  display:block;
  font-size: 0.99em!important;
  font-family: Raleway,sans-serif;
    font-weight: 200;
    font-size: 1.2em!important;
    margin-bottom: 4px!important;
}

.img-circle {
    border-radius: 50%!important;
}

.rounded-circle {
    border-radius: 50%;
}

.card-img-80 {
    width: 120px!important;
    height: 120px!important;
    align-self: center!important;
    margin:1.8%!important; 
}


.card-img-top{
  width: 70%!important;  
}


.card-img-top-log{
  width: 100%!important; 
  margin-top: 3%!important; 
}

.mar-bot{
  margin-bottom: 20px!important;
}

.foot-kares{
  background: -webkit-linear-gradient(left, orange, orange 20%, black 20%, black);
}

.bg-spring {
    width: 100%!important;
    height: 300px!important;
    padding:10px!important;
    color: #fff!important; 
    text-align: center!important;
    background: -webkit-linear-gradient(80deg, #f18b5f  30%, rgba(0,0,0,0) 25%), -webkit-linear-gradient(50deg, #a5577a 50%, #b2cf68 50%);
    background: -o-linear-gradient(80deg, #f18b5f  30%, rgba(0,0,0,0) 25%), -o-linear-gradient(50deg, #a5577a 50%, #b2cf68 60%);
    background: -moz-linear-gradient(80deg, #f18b5f  30%, rgba(0,0,0,0) 25%), -moz-linear-gradient(50deg, #a5577a 50%, #b2cf68 50%);
    background: linear-gradient(80deg, #f18b5f  30%, rgba(0,0,0,0) 25%), linear-gradient(50deg, #a5577a 50%, #b2cf68 50%);
}

/*PAG PROD*/
.k-prod-title{
  padding-top: 4%!important;
  padding-right: 15%!important;
  /*font-size: 8.3em!important;*/
   font-size: calc(4em + 4vw);
  }/*504 176*/

.bg-green {
  background: -webkit-linear-gradient(110deg, #ffffff 60%, #b4d066 60%);
  background: -o-linear-gradient(110deg, #ffffff 60%, #b4d066 60%);
  background: -moz-linear-gradient(110deg, #ffffff 60%, #b4d066 60%);
  background: linear-gradient(110deg, #ffffff 60%, #b4d066 60%);
}
.bg-green-txt{
  color: #b4d066!important;
}
.bg-turquesa-txt{
  color: #33b2ac!important;
}


.bg-turquesa {
  background: -webkit-linear-gradient(110deg, #ffffff 60%, #33b2ac 60%);
  background: -o-linear-gradient(110deg, #ffffff 60%, #33b2ac 60%);
  background: -moz-linear-gradient(110deg, #ffffff 60%, #33b2ac 60%);
  background: linear-gradient(110deg, #ffffff 60%, #33b2ac 60%);
}

.ktcolorK{
  color:#776e6b!important; 
}
.ktcolorW{
  color:#ffeffd!important; 
}
.ktit{
  font-family: 'Oswald', sans-serif!important;
  text-transform: uppercase!important;
  font-weight: normal!important;
  font-style: normal!important;
}
.ktl{
  font-size: 2.4em!important;
}

.ktitb{
  font-weight: 600!important;
  font-style: normal!important;
  line-height : 60px!important;
  font-family: 'Oswald', sans-serif!important;
  text-transform: uppercase!important;
}
.ktx{
  font-size: 3.8em!important;
}
.ktg{
  font-size: 2.8em!important;
}
.ktl{
  font-size: 2.4em!important;
}
.ktm{
  font-size: 2.2em!important;
}
.kts{
  font-size: calc(0.86em + 0.86vw);
}
.ktxs{
  font-size: 1.33em!important;
}

.ktcolorA{
  color:rgb(242,140,101)!important; 
}


.kzindex{z-index: 9999999!important;}

@media screen and (min-width: 400px) and (max-width: 700px) 
{
    .ktg{
      font-size: 2.0em!important;
      line-height : 35px!important;
    }

    .ktit{
      /*line-height : 80px!important;*/
    }
    #imgiss{
      width: 80%!important;
    }
    #imgisstec{
     width: 50%!important; 
    }
    #imgphone{
     /*width: 60%!important; */
    }
    .kimgpp{
      width: 30%!important; 
    }

    .kimgpm{
      width: 40%!important; 
    }

    .kzindex{}

}

@media screen and (min-width: 700px) and (max-width: 1800px) 
{
    .ktg{
      font-size: 2.0em!important;
      line-height : 35px!important;
    }

    .ktit{
      /*line-height : 80px!important;*/
    }
    #imgiss{
      width: 30%!important;
    }
    #imgisstec{
     width: 25%!important; 
    }
    #imgphone{
     /*width: 60%!important; */
    }
    .kim{
      width: 10%!important; 
    }
    .kimgpp{
      width: 30%!important; 
    }

    .kimgpm{
      width: 40%!important; 
    }

    .kimgpm-10{
      width: 10%!important; 
    }
    .kimgpm-20{
      width: 20%!important; 
    }
    .kimgpm-30{
      width: 30%!important; 
    }
    .kimgpm-40{
      width: 40%!important; 
    }
    .kimgpm-50{
      width: 50%!important; 
    }
    .kimgpm-60{
      width: 60%!important; 
    }

    .kimgpm-80{
      width: 80%!important; 
    }

    .kzindex{}

}

.kimgpm-70{
  width: calc(4.86em + 4.86vw);
  vertical-align: center!important;
}

.kimgpp{
  /*width: 30%!important;*/
  width: calc(2.86em + 2.86vw); 
}
.kimgp{
  /*width: 20%!important; */
  width: calc(3em + 3vw); 
}



@keyframes slider{
  0%{opacity: 0;animation-timing-function: ease-in;}
  10%{opacity: 1;animation-timing-function: ease-out;}
  25%{opacity: 1;transform: scale(1); }
  50%{opacity: 0;transform: scale(2); }
  100%{opacity: 0;}
}

@-moz-keyframes slider{
  0%{opacity: 0;animation-timing-function: ease-in;}
  10%{opacity: 1;animation-timing-function: ease-out;}
  25%{opacity: 1;transform: scale(1); }
  50%{opacity: 0;transform: scale(2); }
  100%{opacity: 0;}
}

@-ms-keyframes slider{
  0%{opacity: 0;animation-timing-function: ease-in;}
  10%{opacity: 1;animation-timing-function: ease-out;}
  25%{opacity: 1;transform: scale(1); }
  50%{opacity: 0;transform: scale(2); }
  100%{opacity: 0;}
}

@-o-keyframes slider{
  0%{opacity: 0;animation-timing-function: ease-in;}
  10%{opacity: 1;animation-timing-function: ease-out;}
  25%{opacity: 1;transform: scale(1); }
  50%{opacity: 0;transform: scale(2); }
  100%{opacity: 0;}
}

@-webkit-keyframes slider{
  0%{opacity: 0;animation-timing-function: ease-in;}
  10%{opacity: 1;animation-timing-function: ease-out;}
  25%{opacity: 1;transform: scale(1); }
  50%{opacity: 0;transform: scale(2); }
  100%{opacity: 0;}
}

.k-marg-tit-f{
  margin-top: 5%!important;
}

.k-marg-tit-t{
  margin-top: 2%!important;
}

/********************/
/* Style the navigation menu */
.topnav {
  overflow: hidden;
  background-color: #333;
  position: relative;
}

/* Hide the links inside the navigation menu (except for logo/home) */
.topnav #myLinks {
  display: none;
}

/* Style navigation menu links */
.topnav a {
  color: white;
  padding: 14px 16px;
  text-decoration: none;
  font-size: 17px;
  display: block;
}

/* Style the hamburger menu */
.topnav a.icon {
  background: black;
  display: block;
  position: absolute;
  right: 0;
  top: 0;
}

/* Add a grey background color on mouse-over */
.topnav a:hover {
  background-color: #ddd;
  color: black;
}

/* Style the active link (or home/logo) */
.active {
  background-color: #04AA6D;
  color: white;
}

.responsive-menu{
 display: none;
}
 
.expand {
 display: block !important; 
}