.slideUp,
[class*="slideUp-"] {
    opacity: 0;
    transform: translate3d(0, 40px, 0);
}

.slideDown,
[class*="slideDown-"] {
    opacity: 0;
    transform: translate3d(0, -40px, 0);
}

.slideLeft,
[class*="slideLeft-"] {
    opacity: 0;
    transform: translate3d(-40px, 0, 0);
}

.slideRight,
[class*="slideRight-"] {
    opacity: 0;
    transform: translate3d(40px, 0, 0);
}

.scroll-animate {
    opacity: 0;
    transition: opacity 0.6s ease, transform 0.6s ease;
    will-change: opacity, transform;
}

.scroll-animate.is-animated {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    will-change: auto;
}

.slideUp.scroll-animate:not(.is-animated) {
    transform: translate3d(0, 40px, 0);
}

.slideDown.scroll-animate:not(.is-animated) {
    transform: translate3d(0, -40px, 0);
}

.slideLeft.scroll-animate:not(.is-animated) {
    transform: translate3d(-40px, 0, 0);
}

.slideRight.scroll-animate:not(.is-animated) {
    transform: translate3d(40px, 0, 0);
}

@media (prefers-reduced-motion: reduce) {
    .slideUp,
    [class*="slideUp-"],
    .slideDown,
    [class*="slideDown-"],
    .slideLeft,
    [class*="slideLeft-"],
    .slideRight,
    [class*="slideRight-"],
    .scroll-animate,
    .slideUp.scroll-animate,
    .slideDown.scroll-animate,
    .slideLeft.scroll-animate,
    .slideRight.scroll-animate {
        opacity: 1;
        transform: none;
        transition: none;
    }
}