.fadein-appear,
.fadein-enter {
    opacity: .01;

    &.fadein-appear-active,
    &.fadein-enter-active {
        opacity: 1;
        transition: 200ms ease-in;
    }
}

.fadein-exit {
    opacity: 1;
    transition: 200ms ease-in;

    &.fadein-exit-active {
        opacity: .01;
    }
}

.movein-appear,
.movein-enter {
    opacity: .01;
    transform: translate3d(0, 3rem, 0);

    &.movein-appear-active,
    &.movein-enter-active {
        opacity: 1;
        transform: translate3d(0, 0, 0);
        transition: 300ms ease-out;
    }
}

.movein-exit {
    opacity: 1;
    transform: translate3d(0, 0, 0);
    transition: 100ms ease-out;

    &.movein-exit-active {
        opacity: .01;
        transform: translate3d(0, 3rem, 0);
    }
}