*[data-animate]{visibility:hidden;animation-delay:0.15s;-webkit-animation-duration:0.75s;animation-duration:0.75s;-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out}
*[data-animate].visible{visibility:visible}
.fade-in-right{-webkit-animation-name:fadeInRight;animation-name:fadeInRight}
@-webkit-keyframes fadeInRight{
0%{transform:translate3d(20px,0,0);opacity:0}
100%{transform:translate3d(0,0,0);opacity:1}
}
@keyframes fadeInRight{
0%{transform:translate3d(20px,0,0);opacity:0}
100%{transform:translate3d(0,0,0);opacity:1}
}
.fade-in-left{-webkit-animation-name:fadeInLeft;animation-name:fadeInLeft}
@-webkit-keyframes fadeInLeft{
0%{transform:translate3d(-20px,0,0);opacity:0}
100%{transform:translate3d(0,0,0);opacity:1}
}
@keyframes fadeInLeft{
0%{transform:translate3d(-20px,0,0);opacity:0}
100%{transform:translate3d(0,0,0);opacity:1}
}
.fade-in-down{-webkit-animation-name:fadeInDown;animation-name:fadeInDown}
@-webkit-keyframes fadeInDown{
0%{transform:translate3d(0,-20px,0);opacity:0}
100%{transform:translate3d(0,0,0);opacity:1}
}
@keyframes fadeInDown{
0%{transform:translate3d(0,-20px,0);opacity:0}
100%{transform:translate3d(0,0,0);opacity:1}
}
.fade-in-up{-webkit-animation-name:fadeInUp;animation-name:fadeInUp}
@-webkit-keyframes fadeInUp{
0%{transform:translate3d(0,20px,0);opacity:0}
100%{transform:translate3d(0,0,0);opacity:1}
}
@keyframes fadeInUp{
0%{transform:translate3d(0,20px,0);opacity:0}
100%{transform:translate3d(0,0,0);opacity:1}
}
.fade-in{-webkit-animation-name:fadeIn;animation-name:fadeIn;opacity:0}
@-webkit-keyframes fadeIn{
0%{opacity:0}
50%{opacity:.5}
100%{opacity:1}
}
@keyframes fadeIn{
0%{opacity:0}
50%{opacity:.5}
100%{opacity:1}
}
.fade-in.delay-1{animation-delay:1s}
.fade-in.delay-2{animation-delay:2s}
[data-animate='fade-in-20']{animation-delay:1s;animation-duration:1s}
.fade-in-20{-webkit-animation-name:fadeIn20;animation-name:fadeIn20;opacity:0}
@-webkit-keyframes fadeIn20{
0%{opacity:.4}
50%{opacity:.3}
100%{opacity:.2}
}
@keyframes fadeIn20{
0%{opacity:.4}
50%{opacity:.3}
100%{opacity:.2}
}
.zoom-out{-webkit-animation-name:zoomOut;animation-name:zoomOut}
@-webkit-keyframes zoomOut{
0%{transform:scale(1.1)}
100%{transform:scale(1)}
}
@keyframes zoomOut{
0%{transform:scale(1.1)}
100%{transform:scale(1)}
}
.zoom-out-md{-webkit-animation-name:zoomOut;animation-name:zoomOut}
@-webkit-keyframes zoomOut{
0%{transform:scale(1.25)}
100%{transform:scale(1)}
}
@keyframes zoomOut{
0%{transform:scale(1.25)}
100%{transform:scale(1)}
}
.scale-dot-in{-webkit-animation-name:scaleDot;animation-name:scaleDot;animation-duration:2s;animation-iteration-count:infinite;transform-origin:center center;opacity:0}
@keyframes scaleDot{
0%{transform:scale(1);opacity:.75}
100%{transform:scale(1);opacity:1}
}
.scale-x-in-left{-webkit-animation-name:scaleInXLeft;animation-name:scaleInXLeft;transform-origin:left center;transform:scaleX(0);-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-timing-function:cubic-bezier(.19,1,.22,1);animation-timing-function:cubic-bezier(.19,1,.22,1)}
@-webkit-keyframes scaleInXLeft{
0%{transform:scaleX(0)}
100%{transform:scaleX(1)}
}
@keyframes scaleInXLeft{
0%{transform:scaleX(0)}
100%{transform:scaleX(1)}
}
.scale-x-in-right{-webkit-animation-name:scaleInXRight;animation-name:scaleInXRight;transform-origin:right center;transform:scaleX(0);-webkit-animation-duration:2s;animation-duration:2s;-webkit-animation-timing-function:cubic-bezier(.19,1,.22,1);animation-timing-function:cubic-bezier(.19,1,.22,1)}
@-webkit-keyframes scaleInXRight{
0%{transform:scaleX(0)}
100%{transform:scaleX(1)}
}
@keyframes scaleInXRight{
0%{transform:scaleX(0)}
100%{transform:scaleX(1)}
}
.floating{-webkit-animation:floating 3s infinite;animation:floating 3s infinite}
@-webkit-keyframes floating{
0%{transform:translateY(-6%)}
50%{transform:translateY(6%)}
100%{transform:translateY(-6%)}
}
@keyframes floating{
0%{transform:translateY(-6%)}
50%{transform:translateY(6%)}
100%{transform:translateY(-6%)}
}
.floating-lg{-webkit-animation:floatingLg 3s infinite;animation:floatingLg 3s infinite}
@-webkit-keyframes floatingLg{
0%{transform:translateY(-12%)}
50%{transform:translateY(6%)}
100%{transform:translateY(-12%)}
}
@keyframes floatingLg{
0%{transform:translateY(-12%)}
50%{transform:translateY(6%)}
100%{transform:translateY(-12%)}
}
.animation-smooth-out{animation:animation-smooth-out 3s;-webkit-transition:opacity 0.5s cubic-bezier(.694,0,.335,1),transform 0.7s cubic-bezier(.694,0,.335,1);-o-transition:opacity 0.5s cubic-bezier(.694,0,.335,1),transform 0.7s cubic-bezier(.694,0,.335,1);-webkit-transition:opacity 0.5s cubic-bezier(.694,0,.335,1),-webkit-transform 0.7s cubic-bezier(.694,0,.335,1);transition:opacity 0.5s cubic-bezier(.694,0,.335,1),-webkit-transform 0.7s cubic-bezier(.694,0,.335,1);transition:opacity 0.5s cubic-bezier(.694,0,.335,1),transform 0.7s cubic-bezier(.694,0,.335,1);transition:opacity 0.5s cubic-bezier(.694,0,.335,1),transform 0.7s cubic-bezier(.694,0,.335,1),-webkit-transform 0.7s cubic-bezier(.694,0,.335,1)}
@keyframes animation-smooth-out{
0%{opacity:0;-webkit-transform:translateY(20px);-ms-transform:translateY(20px);transform:translateY(20px)}
100%{opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0)}
}
.zoom-image{animation-name:zoom-out;-webkit-animation-duration:2.5s;animation-duration:2.5s}
@keyframes zoom-out{
0%{transform:scale(1.15) rotate(360deg)}
100%{transform:scale(1) rotate(360deg)}
}
.bottom-0-to-100{animation-name:bottom-0-to-100}
@keyframes bottom-0-to-100{
0%{height:0}
50%{height:50%}
100%{height:100%}
}
.top-0-to-100{animation-name:top-0-to-100}
@keyframes top-0-to-100{
0%{height:0}
50%{height:50%}
100%{height:100%}
}
.stripe-btn-line{overflow:hidden}
.stripe-line{width:100%;height:1px;display:block;transition:background-color 0.3s ease-in-out}
.stripe-open .stripe-line{background-color:var(--Green)}
.line-white{background-color:var(--White)}
.line-light{background-color:var(--White-15)}
.line-green{background-color:var(--Green)}
.line-purple{background-color:var(--Purple)}
.line-black{background-color:var(--Black)}
[data-animate="line"]{width:0;transition:width 1s ease}
[data-animate="line"].visible{width:100%}
[data-anim*="title"]{opacity:0;will-change:transform}
[data-anim*="title"] *{will-change:transform}
[data-anim*="subtitle"]{opacity:0;will-change:transform}
[data-anim*="subtitle"] *{will-change:transform}