283 lines
4.4 KiB
Plaintext
283 lines
4.4 KiB
Plaintext
/* CSS Animations */
|
|
.wpb_animate_when_almost_visible {
|
|
.opacity(0);
|
|
}
|
|
|
|
.wpb_animate_when_almost_visible:not(.wpb_start_animation) {
|
|
.animation(none)
|
|
}
|
|
|
|
.wpb_top-to-bottom, .top-to-bottom {
|
|
.animation(wpb_ttb 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275));
|
|
}
|
|
|
|
.wpb_bottom-to-top, .bottom-to-top {
|
|
.animation(wpb_btt 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275));
|
|
}
|
|
|
|
.wpb_left-to-right, .left-to-right {
|
|
.animation(wpb_ltr 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275));
|
|
}
|
|
|
|
.wpb_right-to-left, .right-to-left {
|
|
.animation(wpb_rtl 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275));
|
|
}
|
|
|
|
.wpb_appear, .appear {
|
|
.animation(wpb_appear 0.7s 1 cubic-bezier(0.175, 0.885, 0.320, 1.275));
|
|
.scale(1);
|
|
}
|
|
|
|
.wpb_start_animation {
|
|
.opacity(1);
|
|
}
|
|
|
|
/* Top to bottom keyframes */
|
|
@-webkit-keyframes wpb_ttb {
|
|
0% {
|
|
-webkit-transform: translate(0, -10%);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-webkit-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-moz-keyframes wpb_ttb {
|
|
0% {
|
|
-moz-transform: translate(0, -10%);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-moz-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-o-keyframes wpb_ttb {
|
|
0% {
|
|
-o-transform: translate(0, -10%);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-o-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@keyframes wpb_ttb {
|
|
0% {
|
|
.translate(0, -10%);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
.translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
/* Bottom to top keyframes */
|
|
@-webkit-keyframes wpb_btt {
|
|
0% {
|
|
-webkit-transform: translate(0, 10%);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-webkit-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-moz-keyframes wpb_btt {
|
|
0% {
|
|
-moz-transform: translate(0, 10%);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-moz-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-o-keyframes wpb_btt {
|
|
0% {
|
|
-o-transform: translate(0, 10%);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-o-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@keyframes wpb_btt {
|
|
0% {
|
|
.translate(0, 10%);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
.translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
/* Left to right keyframes */
|
|
@-webkit-keyframes wpb_ltr {
|
|
0% {
|
|
-webkit-transform: translate(-10%, 0);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-webkit-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-moz-keyframes wpb_ltr {
|
|
0% {
|
|
-moz-transform: translate(-10%, 0);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-moz-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-o-keyframes wpb_ltr {
|
|
0% {
|
|
-o-transform: translate(-10%, 0);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-o-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@keyframes wpb_ltr {
|
|
0% {
|
|
.translate(-10%, 0);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
.translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
/* Right to left keyframes */
|
|
@-webkit-keyframes wpb_rtl {
|
|
0% {
|
|
-webkit-transform: translate(10%, 0);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-webkit-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-moz-keyframes wpb_rtl {
|
|
0% {
|
|
-moz-transform: translate(10%, 0);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-moz-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-o-keyframes wpb_rtl {
|
|
0% {
|
|
-o-transform: translate(10%, 0);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
-o-transform: translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@keyframes wpb_rtl {
|
|
0% {
|
|
.translate(10%, 0);
|
|
.opacity(0);
|
|
}
|
|
100% {
|
|
.translate(0, 0);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
/* Appear from center keyframes */
|
|
@-webkit-keyframes wpb_appear {
|
|
0% {
|
|
-webkit-transform: scale(0.5);
|
|
.opacity(0.1);
|
|
}
|
|
100% {
|
|
-webkit-transform: scale(1);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-moz-keyframes wpb_appear {
|
|
0% {
|
|
-moz-transform: scale(0.5);
|
|
.opacity(0.1);
|
|
}
|
|
100% {
|
|
-moz-transform: scale(1);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@-o-keyframes wpb_appear {
|
|
0% {
|
|
-o-transform: scale(0.5);
|
|
.opacity(0.1);
|
|
}
|
|
100% {
|
|
-o-transform: scale(1);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
@keyframes wpb_appear {
|
|
0% {
|
|
.scale(0.5);
|
|
.opacity(0.1);
|
|
}
|
|
100% {
|
|
.scale(1);
|
|
.opacity(1);
|
|
}
|
|
}
|
|
|
|
.vc-spinner {
|
|
&::before {
|
|
content: '';
|
|
width: 16px;
|
|
height: 16px;
|
|
display: inline-block;
|
|
pointer-events: none;
|
|
margin-top: 6px;
|
|
background: url('../images/spinner.gif') no-repeat;
|
|
background-position-x: center;
|
|
background-position-y: center;
|
|
}
|
|
&.vc-spinner-complete {
|
|
&::before {
|
|
background-image: url('../vc/tick.png');
|
|
}
|
|
}
|
|
&.vc-spinner-failed {
|
|
&::before {
|
|
background-image: url('../vc/remove.png');
|
|
}
|
|
}
|
|
}
|