.scene_element {
    animation-duration: 1s;
    transition-timing-function: ease-in;
    animation-fill-mode: both;
}
/** An element that fades in */
.scene_element--fadein {
    animation-name: fadeIn;
}
/** An element that fades in and slides up */
.scene_element--fadeinup {
    animation-name: fadeInUp;
}
/** An element that fades in and slides from the right */
.scene_element--fadeinright {
    animation-name: fadeInRight;
}

.scene_element--fadeinleft {
    animation-name: fadeInLeft;
}
@keyframes fadeInUp {
    0% {
        opacity: 0;
        transform: translate3d(0, 20%, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@-moz-keyframes fadeInUp {
    /* Firefox */
    0% {
        opacity: 0;
        transform: translate3d(0, 20%, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@-webkit-keyframes fadeInUp {
    /* Safari and Chrome */
    0% {
        opacity: 0;
        transform: translate3d(0, 20%, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@-o-keyframes fadeInUp {
    /* Opera */
    0% {
        opacity: 0;
        transform: translate3d(0, 20%, 0);
    }

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

    100% {
        opacity: 1;
        transform: none;
    }
}
@-moz-keyframes fadeInRight {
    /* Firefox */
    0% {
        opacity: 0;
        transform: translate3d(20%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@-webkit-keyframes fadeInRight {
    /* Safari and Chrome */
    0% {
        opacity: 0;
        transform: translate3d(20%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@-o-keyframes fadeInRight {
    /* Opera */
    0% {
        opacity: 0;
        transform: translate3d(20%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@keyframes fadeInLeft {
    0% {
        opacity: 0;
        transform: translate3d(-20%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@-moz-keyframes fadeInLeft {
    /* Firefox */
    0% {
        opacity: 0;
        transform: translate3d(-20%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@-webkit-keyframes fadeInLeft {
    /* Safari and Chrome */
    0% {
        opacity: 0;
        transform: translate3d(-20%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@-o-keyframes fadeInLeft {
    /* Opera */
    0% {
        opacity: 0;
        transform: translate3d(-20%, 0, 0);
    }

    100% {
        opacity: 1;
        transform: none;
    }
}
@keyframes fadeIn {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@-moz-keyframes fadeIn {
    /* Firefox */
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@-webkit-keyframes fadeIn {
    /* Safari and Chrome */
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}
@-o-keyframes fadeIn {
    /* Opera */
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}