resolver/app/styles/base/_animate.scss

.animate__up {
    animation-duration: .3s;
    animation-name: staggerItems;
    animation-timing-function: ease-out;
}

@keyframes staggerItems {
    0% {
        -webkit-transform: translateY(30px);
        transform: translateY(30px)
    }
}

.spin {
    animation: spin 2s infinite linear
}

@keyframes spin {
    0% {
        transform: rotate(0deg)
    }
    100% {
        transform: rotate(359deg)
    }
}

.animate-fading {
    animation: fading 10s infinite
}

@keyframes fading {
    0% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.animate-fading2 {
    animation: fading 2s infinite
}

@keyframes fading {
    0% {
        opacity: 0
    }
    50% {
        opacity: 1
    }
    100% {
        opacity: 0
    }
}

.animate-opacity {
    animation: opac 0.8s
}

@keyframes opac {
    from {
        opacity: 0
    }
    to {
        opacity: 1
    }
}

.animate-top {
    position: relative;
    animation: animatetop 0.4s
}

@keyframes animatetop {
    from {
        top: -300px;
        opacity: 0
    }
    to {
        top: 0;
        opacity: 1
    }
}

.animate2-top10 {
    position: relative;
    animation: animatetop 0.2s
}

@keyframes animatetop {
    from {
        top: -10px;
        opacity: 0
    }
    to {
        top: 0;
        opacity: 1
    }
}

.animate-left {
    position: relative;
    animation: animateleft 0.4s
}

@keyframes animateleft {
    from {
        left: -300px;
        opacity: 0
    }
    to {
        left: 0;
        opacity: 1
    }
}

.animate-right {
    position: relative;
    animation: animateright 0.4s
}

@keyframes animateright {
    from {
        right: -300px;
        opacity: 0
    }
    to {
        right: 0;
        opacity: 1
    }
}

.animate-bottom {
    position: relative;
    animation: animatebottom 0.4s
}

@keyframes animatebottom {
    from {
        bottom: -300px;
        opacity: 0
    }
    to {
        bottom: 0;
        opacity: 1
    }
}

.animate-bottom50 {
    position: relative;
    animation: animatebottom 0.4s
}

@keyframes animatebottom {
    from {
        bottom: -50px;
        opacity: 0
    }
    to {
        bottom: 0;
        opacity: 1
    }
}