@charset "UTF-8";

.way-point {
  visibility: hidden;
  transition: all 0.4s
}

.animated {
  -webkit-animation-duration: 0.5s;
  animation-duration: 0.5s;
  -webkit-animation-fill-mode: both;
  animation-fill-mode: both;
}

.delay-0 {
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
}

.delay-1 {
  animation-delay: 0.1s;
  -webkit-animation-delay: 0.1s;
}

.delay-2 {
  animation-delay: 0.2s;
  -webkit-animation-delay: 0.2s;
}

.delay-3 {
  animation-delay: 0.3s;
  -webkit-animation-delay: 0.3s;
}

.delay-4 {
  animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
}

.delay-5 {
  animation-delay: 0.5s;
  -webkit-animation-delay: 0.5s;
}

.delay-6 {
  animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
}

.delay-7 {
  animation-delay: 0.7s;
  -webkit-animation-delay: 0.7s;
}

.delay-8 {
  animation-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
}

.delay-9 {
  animation-delay: 0.9s;
  -webkit-animation-delay: 0.9s;
}

.delay-10 {
  animation-delay: 1s;
  -webkit-animation-delay: 1s;
}

.delay-11 {
  animation-delay: 1.1s;
  -webkit-animation-delay: 1.1s;
}

.delay-12 {
  animation-delay: 1.2s;
  -webkit-animation-delay: 1.2s;
}

.delay-13 {
  animation-delay: 1.3s;
  -webkit-animation-delay: 1.3s;
}

/*  animation ltr
------------------------- */

.c_layer {
  overflow: hidden;
  position: relative;
}

.c_layer:before {
  content: "";
  position: absolute;
  display: block;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: 10;
  background-color: rgb(178, 207, 161);
  -webkit-transform: translateX(101%);
  -moz-transform: translateX(101%);
  -o-transform: translateX(101%);
  -ms-transform: translateX(101%);
  transform: translateX(101%);
}

.animated.c_layer:before {
  -webkit-animation: ltranimation_a 1.5s cubic-bezier(1, 0, 0, 1);
  animation: ltranimation_a 1.5s cubic-bezier(1, 0, 0, 1);
}

@-webkit-keyframes ltranimation_a {
  0% {
    -webkit-transform: translateX(-101%);
  }

  47% {
    -webkit-transform: translateX(0%);
  }

  53% {
    -webkit-transform: translateX(0%);
  }

  100% {
    -webkit-transform: translateX(101%);
  }
}

@keyframes ltranimation_a {
  0% {
    -webkit-transform: translateX(-101%);
    -moz-transform: translateX(-101%);
    -o-transform: translateX(-101%);
    -ms-transform: translateX(-101%);
    transform: translateX(-101%);
  }

  47% {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -o-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }

  53% {
    -webkit-transform: translateX(0%);
    -moz-transform: translateX(0%);
    -o-transform: translateX(0%);
    -ms-transform: translateX(0%);
    transform: translateX(0%);
  }

  100% {
    -webkit-transform: translateX(101%);
    -moz-transform: translateX(101%);
    -o-transform: translateX(101%);
    -ms-transform: translateX(101%);
    transform: translateX(101%);
  }
}

.c_layer .c_layer_item {
  opacity: 0;
  visibility: hidden;
  transition: opacity 0;
}

.animated.c_layer .c_layer_item {
  visibility: visible;
  -webkit-animation: ltranimation_b 1.5s cubic-bezier(1, 0, 0, 1);
  animation: ltranimation_b 1.5s cubic-bezier(1, 0, 0, 1);
  opacity: 1;
}

@-webkit-keyframes ltranimation_b {
  0% {
    opacity: 0;
  }

  47% {
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

@keyframes ltranimation_b {
  0% {
    opacity: 0;
  }

  47% {
    opacity: 0;
  }

  53% {
    opacity: 1;
  }

  100% {
    opacity: 1;
  }
}

.fade-in, .fade-left, .fade-right, .fade-down, .fade-up, .fade-scale {
  opacity: 0;
  -webkit-transition: opacity .7s linear, -webkit-transform .7s cubic-bezier(0, .6, .2, 1);
  transition: opacity .7s linear, -webkit-transform .7s cubic-bezier(0, .6, .2, 1);
  transition: transform .7s cubic-bezier(0, .6, .2, 1), opacity .7s linear;
  transition: transform .7s cubic-bezier(0, .6, .2, 1), opacity .7s linear, -webkit-transform .7s cubic-bezier(0, .6, .2, 1);
}

/* fade-in */

.animated.fade-in {
  opacity: 1;
}

/* fade-up */

.fade-up {
  -webkit-transform: translate3d(0, 50px, 0);
  transform: translate3d(0, 50px, 0);
}

.animated.fade-up {
  opacity: 1;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/* fade-down */

.fade-down {
  -webkit-transform: translate3d(0, -20px, 0);
  transform: translate3d(0, -20px, 0);
}

.animated.fade-down {
  opacity: 1;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/* fade-left */

.fade-left {
  -webkit-transform: translate3d(-300px, 0, 0);
  transform: translate3d(-300px, 0, 0);
}

.animated.fade-left {
  opacity: 1;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

/* fade-right */

.fade-right {
  -webkit-transform: translate3d(300px, 0, 0);
  transform: translate3d(300px, 0, 0);
}

.animated.fade-right {
  opacity: 1;
  -webkit-transform: translateZ(0);
  transform: translateZ(0);
}

.text-color {
  animation: color-change 3s linear infinite;
  font-weight: bold;
}

@keyframes color-change {
  0%, 100% {
    color: #FF4927;
  }

  25% {
    color: #f10005;
  }

  50% {
    color: #FFB100;
  }

  75% {
    color: #FF4927;
  }
}

.background-color-change:after {
  animation: background-color-change 3s linear infinite;
}

@keyframes background-color-change {
  0%, 100% {
    background-color: #FF4927;
  }

  25% {
    background-color: #FF4927;
  }

  50% {
    background-color: #f10005;
  }

  75% {
    background-color: #FF4927;
  }
}

.smooth {
  clip-path: inset(0 100% 0 0);
  display: inline-block;
  font-size: 36px;
  font-weight: bold;
  transition: 0.8s cubic-bezier(0.37, 0, 0.63, 1);
  transition-property: clip-path;
  line-height: 1;
  height: auto;
  margin-top: 15px;
}

.animated.smooth {
  clip-path: inset(0);
}

/* fade-scale */

.fade-scale {
  -webkit-transform: scale(1.3);
  transform: scale(1.3);
  transition: all 1.5s;
}

.animated.fade-scale {
  opacity: 1;
  -webkit-transform: scale(1) translateZ(0);
  transform: scale(1) translateZ(0);
}

/* .exploding, .exploding:focus, .exploding:hover {
  background: transparent;
  color: transparent;
}

.exploding {
  pointer-events: none;
  position: relative;
  will-change: transform;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
} */

.left-bottm-scroll a {
  display: inline-block;
  position: absolute;
  left: 10px;
  bottom: 0px;
  z-index: 2;
  padding: 10px 10px 90px;
  overflow: hidden;
  margin: 0;
  font-size: 11px;
  font-family: 'Josefin Sans', sans-serif;
  line-height: 1;
  letter-spacing: .2em;
  text-transform: uppercase;
  text-decoration: none;
  writing-mode: vertical-lr;
}

.left-bottm-scroll a::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 50%;
  width: 1px;
  height: 100px;
}

.left-bottm-scroll a::after {
  height: 20px;
  animation: sdl 1.5s ease infinite;
}

@keyframes sdl {
  0% {
    transform: translateY(-70px);
    background-color: #FF4927;
  }

  25% {
    background-color: #FFB100;
  }

  50% {
    background-color: #ff2727;
    transform: translateY(30px);
  }

  75% {
    background-color: #ff5927;
  }

  100% {
    transform: translateY(30px);
    background-color: #ff6427;
  }

}

.benefit-title {
  color: #fff;
  font-weight: 500;
  position: relative;
  font-size: 18px;
}

.benefit-title:before {
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  border-bottom: solid 3px #FF4927;
  animation: border_anim 2s linear forwards;
}

@keyframes border_anim {
  0% {
    width: 0%;
  }

  100% {
    width: 100%;
  }
}

.particle {
  position: absolute;
  top: 0;
  left: 0;
}

.particle--debris {
  background: red;
}

.particle--fire {
  border-radius: 50%;
}

@media (prefers-color-scheme: dark) {
  body {
    background: #17181c;
  }
}

.image-scale {
  width: 150px;
  height: 132px;
  overflow: hidden;
}

.image-scale img {
  opacity: 0.7;
  width: 150px;
  transition: all 0.5s;
}

.image-scale img:hover {
  opacity: 1.0;
  transform: scale(1.1, 1.1);
}