/* Custom WPE Animate animations */
@keyframes wpeRotate360 {
    from {
        opacity: 0;
        transform: rotate(0deg);
        transform-origin: center center;
    }
    to {
        opacity: 1;
        transform: rotate(360deg);
        transform-origin: center center;
    }
}

.animate__wpeRotate360 {
    animation-name: wpeRotate360;
    animation-duration: 1s;
    animation-fill-mode: both;
    transform-origin: center center;
}

@keyframes wpeRotate270 {
    from {
        opacity: 0;
        transform: rotate(0deg);
        transform-origin: center center;
    }
    to {
        opacity: 1;
        transform: rotate(270deg);
        transform-origin: center center;
    }
}

.animate__wpeRotate270 {
    animation-name: wpeRotate270;
    animation-duration: 0.8s;
    animation-fill-mode: both;
    transform-origin: center center;
}

@keyframes wpeRotate180 {
    from {
        opacity: 0;
        transform: rotate(0deg);
        transform-origin: center center;
    }
    to {
        opacity: 1;
        transform: rotate(180deg);
        transform-origin: center center;
    }
}

.animate__wpeRotate180 {
    animation-name: wpeRotate180;
    animation-duration: 0.6s;
    animation-fill-mode: both;
    transform-origin: center center;
}

@keyframes wpeRotate720 {
    from {
        opacity: 0;
        transform: rotate(0deg);
        transform-origin: center center;
    }
    to {
        opacity: 1;
        transform: rotate(720deg);
        transform-origin: center center;
    }
}

.animate__wpeRotate720 {
    animation-name: wpeRotate720;
    animation-duration: 1.5s;
    animation-fill-mode: both;
    transform-origin: center center;
}

@keyframes wpeScaleRotate {
    from {
        opacity: 0;
        transform: scale(0.3) rotate(0deg);
        transform-origin: center center;
    }
    50% {
        opacity: 0.8;
        transform: scale(1.1) rotate(180deg);
        transform-origin: center center;
    }
    to {
        opacity: 1;
        transform: scale(1) rotate(360deg);
        transform-origin: center center;
    }
}

.animate__wpeScaleRotate {
    animation-name: wpeScaleRotate;
    animation-duration: 1.2s;
    animation-fill-mode: both;
    transform-origin: center center;
}