
.js-trigger {
  filter: alpha(opacity=0);
  -moz-opacity: 0;
  opacity: 0
}
.fadeIn.is-animated {
  animation: fadeIn 1s cubic-bezier(0.33, 1, 0.68, 1) 1 forwards
}

.slideIn.is-animated {
  animation: slideIn 1s cubic-bezier(0.33, 1, 0.68, 1) 1 forwards
}

.delay1 {
  animation-delay: .2s !important;
  transition-delay: .2s !important
}
.delay2 {
  animation-delay: .4s !important;
  transition-delay: .4s !important
}
.delay3 {
  animation-delay: .6s !important;
  transition-delay: .6s !important
}
.delay4 {
  animation-delay: .8s !important;
  transition-delay: .8s !important
}
.delay5 {
  animation-delay: 1s !important;
  transition-delay: 1s !important
}
.delay6 {
  animation-delay: 1.2s !important;
  transition-delay: 1.2s !important
}
.delay7 {
  animation-delay: 1.4s !important;
  transition-delay: 1.4s !important
}
.delay8 {
  animation-delay: 1.6s !important;
  transition-delay: 1.6s !important
}
.delay9 {
  animation-delay: 1.8s !important;
  transition-delay: 1.8s !important
}
.delay10 {
  animation-delay: 2s !important;
  transition-delay: 2s !important
}

@keyframes fadeIn {
  0% {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    opacity: 0
  }
  100% {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1
  }
}
@keyframes slideIn {
  0% {
    filter: alpha(opacity=0);
    -moz-opacity: 0;
    opacity: 0;
    transform: translateY(50px)
  }
  100% {
    filter: alpha(opacity=100);
    -moz-opacity: 1;
    opacity: 1;
    transform: translateY(0)
  }
}

@keyframes scroll {
  0% {
    transform: translateY(-100%)
  }
  30% {
    transform: translateY(0)
  }
  60% {
    transform: translateY(0)
  }
  to {
    transform: translateY(100%)
  }
}
@keyframes flipLeft {
  from {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(30deg);
    opacity: 0
  }
  to {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
    opacity: 1
  }
}
@keyframes flipRight {
  from {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(-30deg);
    opacity: 0
  }
  to {
    transform: perspective(600px) translate3d(0, 0, 0) rotateY(0deg);
    opacity: 1
  }
}
@keyframes RtoLextend {
  0% {
    transform-origin: left;
    transform: scaleX(0)
  }
  100% {
    transform-origin: left;
    transform: scaleX(1)
  }
}
@keyframes LtoRextend {
  0% {
    transform-origin: right;
    transform: scaleX(0)
  }
  100% {
    transform-origin: right;
    transform: scaleX(1)
  }
}
@keyframes lineMarker {
  0% {
    transform-origin: left;
    transform: scaleX(0)
  }
  100% {
    transform-origin: left;
    transform: scaleX(1)
  }
}

#scroll {
  position: fixed;
  bottom: 0;
  left: 2vw;
  display: flex
}
#scroll i {
  width: 1px;
  height: 80px;
  margin-right: -20px;
  background: #fff;
  position: relative;
  overflow: hidden
}
@media screen and (min-width: 0) and (max-width: 1024px) {
  #scroll i {
    height: 60px;
    margin-right: -30px
  }
}
#scroll i:after {
  width: 100%;
  height: 100%;
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  background: #119B7F;
  animation: scroll 2s cubic-bezier(0.11, 0.85, 0.14, 1) infinite
}
#scroll p {
  -webkit-transform: rotate(90deg);
  -moz-transform: rotate(90deg);
  -ms-transform: rotate(90deg);
  -o-transform: rotate(90deg);
  transform: rotate(90deg);
	font-size: 14px;
	color: #3A6254;
}
@media screen and (min-width: 0) and (max-width: 1024px) {
  #scroll p {
    font-size: 14px;
    font-size: .875rem
  }
}



