/*.sec1 {*/
/*    position: fixed;*/
/*    left: 0;*/
/*    right: 0;*/
/*    top: 0;*/
/*    bottom: 0;*/
/*    background: #ECE7DB;*/
/*    z-index: 99999;*/
/*    height: 100vh;*/
/*    width: 0%;*/
/*    transition: all 400ms;*/
/*}*/

/*.sec2:before {*/
/*    position: fixed;*/
/*    content: '';*/
/*    left: 0;*/
/*    right: 0;*/
/*    top: 0;*/
/*    bottom: 0;*/
/*    background: #fff;*/
/*    z-index: 99999;*/
/*    height: 100vh;*/
/*    width: 0%;*/
/*    transition: all 400ms;*/
/*}*/

/*.loaded-overlay .sec1 {*/
/*    transition: all 1s;*/
/*    animation-name: load_anim1;*/
/*    width: 100%;*/
/*}*/

/*.loaded-overlay1 .sec2:before {*/
/*    animation-name: load_anim2;*/
/*    width: 100%;*/
/*    transition: all 1s;*/
/*}*/

/*@-webkit-keyframes load_anim1 {*/
/*    0% {*/
/*        transform: translateX(-100%);*/
/*    }*/
/*    10% {*/
/*        transform: translateX(-50%);*/
/*    }*/
/*    80% {*/
/*        transform: translateX(100%);*/
/*    }*/
/*    85% {*/
/*        transform: translateX(100%);*/
/*    }*/
/*    100% {*/
/*        transform: translateX(100%);*/
/*    }*/
/*}*/

/*@-webkit-keyframes load_anim2 {*/
/*    0% {*/
/*        transform: translateX(-100%);*/
/*    }*/
/*    10% {*/
/*        transform: translateX(-50%);*/
/*    }*/
/*    80% {*/
/*        transform: translateX(100%);*/
/*    }*/
/*    85% {*/
/*        transform: translateX(100%);*/
/*    }*/
/*    100% {*/
/*        transform: translateX(100%);*/
/*    }*/
/*}*/

/*.sec2 img {*/
/*    width: auto;*/
/*}*/

/*.sec2 img {*/
/*    width: auto;*/
/*    position: fixed;*/
/*    left: 0;*/
/*    right: 0;*/
/*    top: 0;*/
/*    bottom: 0;*/
/*    margin: auto;*/
/*    transform: translateY(50px);*/
/*    opacity: 0;*/
/*    transition-delay: 20s;*/
/*    z-index: 999999;*/
/*}*/

/*@media (max-width: 767px) {*/
/*    .sec2 img {*/
/*        width: 100%;*/
/*        max-width: 250px;*/
/*    }*/
/*}*/

/*.hides .sec2,*/
/*.hides .sec2:before {*/
/*    right: 0;*/
/*    left: auto;*/
/*    width: 0;*/
/*}*/

/*.loaded-overlay2 .sec1 {*/
/*    right: 0;*/
/*    left: auto;*/
/*    width: 0;*/
/*}*/

/*.loaded-overlay2 .sec2 img {*/
/*    transform: translateY(0px);*/
/*    opacity: 1;*/
/*    transition: all 400ms;*/
/*}*/

/*.load-complete {*/
/*    position: fixed;*/
/*    z-index: 9999;*/
/*    width: 100%;*/
/*    height: 100vh;*/
/*}*/

/*.load-complete:before {*/
/*    position: fixed;*/
/*    left: 0;*/
/*    right: 0;*/
/*    top: 0;*/
/*    bottom: 0;*/
/*    content: '';*/
/*    background: #fff;*/
/*}*/

/*.hides:before {*/
/*    right: 0;*/
/*    left: auto;*/
/*}*/

/*.hides .sec2 img {*/
/*    opacity: 0;*/
/*    visibility:hidden;*/
/*}*/

/*.hides {*/
/*    display: none;*/
/*}*/


#site-loader {
  position: fixed;
  inset: 0;
  z-index: 999999;
  background: #fff;
  display: block; /* ensure visible immediately */
}

/* prevent initial flash */
body {
  overflow: hidden;
}

#site-loader.hides {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.4s ease;
}

.sec1 {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #ECE7DB;
    z-index: 99999;
    height: 100vh;
    width: 0%;
    transition: all 400ms;
}

.sec2:before {
    position: fixed;
    content: '';
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    background: #fff;
    z-index: 99999;
    height: 100vh;
    width: 0%;
    transition: all 400ms;
}

.loaded-overlay .sec1 {
    transition: all 1s;
    animation-name: load_anim1;
    width: 100%;
}

.loaded-overlay1 .sec2:before {
    animation-name: load_anim2;
    width: 100%;
    transition: all 1s;
}

@-webkit-keyframes load_anim1 {
    0% {
        transform: translateX(-100%);
    }
    10% {
        transform: translateX(-50%);
    }
    80% {
        transform: translateX(100%);
    }
    85% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(100%);
    }
}

@-webkit-keyframes load_anim2 {
    0% {
        transform: translateX(-100%);
    }
    10% {
        transform: translateX(-50%);
    }
    80% {
        transform: translateX(100%);
    }
    85% {
        transform: translateX(100%);
    }
    100% {
        transform: translateX(100%);
    }
}

.sec2 img {
    width: auto;
}

.sec2 img {
    width: auto;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    margin: auto;
    transform: translateY(50px);
    opacity: 0;
    transition-delay: 20s;
    z-index: 999999;
}

@media (max-width: 767px) {
    .sec2 img {
        width: 100%;
        max-width: 250px;
    }
}

.hides .sec2,
.hides .sec2:before {
    right: 0;
    left: auto;
    width: 0;
}

.loaded-overlay2 .sec1 {
    right: 0;
    left: auto;
    width: 0;
}

.loaded-overlay2 .sec2 img {
    transform: translateY(0px);
    opacity: 1;
    transition: all 400ms;
}

.load-complete {
    position: fixed;
    z-index: 999;
}

.load-complete:before {
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    content: '';
    background: #fff;
}

.hides:before {
    right: 0;
    left: auto;
}

.hides .sec2 img {
    opacity: 0;
    visibility:hidden;
}

.cursor {
  position: fixed;
  width: 40px;
  height: 40px;
  margin-left: -20px;
  margin-top: -20px;
  border-radius: 50%;
  border: 2px solid #355244;
  transition: 0.3s;
  transform: translate(-50%, -50%);
  pointer-events: none;
  z-index: 1000;
}
.cursor2 {
  position: fixed;
  width: 4px;
  height: 4px;
  margin-left: -20px;
  margin-top: -20px;
  border-radius: 50%;
  background-color: #355244;
  transform: translate(-50%, -50%);
  transition: 0.1s;
  pointer-events: none;
  z-index: 1000;
}

.grow,
.grow-small {
  transform: scale(4);
  background: white;
  mix-blend-mode: difference;
  border: none;
}

.grow-small {
  transform: scale(2);
}

.parallax-bg {
  position: absolute;
  top: -20%;
  left: 0;
  width: 100%;
  height: 140%;
  background-size: cover;
  background-position: center;
  will-change: transform;
}



.question {
  font-size: 18px;
  font-weight: 600;
  padding: 20px 80px 20px 0px;
  position: relative;
  display: flex;
  align-items: center;
  color: #355244;
  letter-spacing: .5px;
  border-bottom: 1px dashed #35524438;
  padding-bottom: 25px;
  margin-bottom: 15px;
}



.question span {
    width: 30px;
    height: 30px;
    background: #3552440a;
    text-align: center;
    border-radius: 50px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 11px;
    margin-right: 15px;
    position: relative;
    top: 2px;
    color: #355244;
    font-weight: 600;
}

@media (max-width: 1280px) {
    .question {
        text-align: center;
        display: block;
        padding: 16px 0;
        margin: 0;
    }
}

.watsup-fixed {
    bottom: 15px;
    right: 15px;
    position: fixed;
    z-index: 999;
}
.watsup-fixed a {
    position: relative;
    z-index: 99;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    text-align: center;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
    animation-name: pulsee;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
    animation-play-state: paused;
}
.watsup-fixed a::before {
    content: "";
    position: absolute;
    border-radius: 50%;
    padding: 25px;
    border: 5px solid #49b15d;
    opacity: .75;
    animation-name: pulse-border;
    animation-duration: 1.5s;
    animation-timing-function: ease-out;
    animation-iteration-count: infinite;
}
.watsup-fixed a img {
    max-width: 30px;
}
@-webkit-keyframes pulse-border {
    0% {
        padding: 25px;
        opacity: .75
    }

    75% {
        padding: 50px;
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@keyframes pulse-border {
    0% {
        padding: 25px;
        opacity: .75
    }

    75% {
        padding: 50px;
        opacity: 0
    }

    100% {
        opacity: 0
    }
}

@-webkit-keyframes pulsee {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(37,211,102,.5);
        box-shadow: 0 0 0 0 rgba(37,211,102,.5)
    }

    80% {
        -webkit-box-shadow: 0 0 0 14px rgba(37,211,102,0);
        box-shadow: 0 0 0 14px rgba(37,211,102,0)
    }
}

@keyframes pulsee {
    0% {
        -webkit-box-shadow: 0 0 0 0 rgba(37,211,102,.5);
        box-shadow: 0 0 0 0 rgba(37,211,102,.5)
    }

    80% {
        -webkit-box-shadow: 0 0 0 14px rgba(37,211,102,0);
        box-shadow: 0 0 0 14px rgba(37,211,102,0)
    }
}