@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 100%, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

@keyframes fadeInRight {
    0% {
        opacity: 0;
        transform: translate3d(100%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}

.pageEffect {
    animation-duration: 0.6s;
    transition-timing-function: ease-in;
    animation-fill-mode: both;
}

.pageEffect--fadein {
    animation-name: fadeIn;
}

.pageEffect--fadeinup {
    animation-name: fadeInUp;
}

.pageEffect--fadeinright {
    animation-name: fadeInRight;
}

.is-exiting {
    animation-direction: alternate-reverse;
}