/* <-- fadeInUp */
@keyframes fadeInUp {
    from {
        transform: translate3d(0, 40px, 0)
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@-webkit-keyframes fadeInUp {
    from {
        transform: translate3d(0, 40px, 0)
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@-moz-keyframes fadeInUp {
    from {
        transform: translate3d(0, 40px, 0)
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

@-o-keyframes fadeInUp {
    from {
        transform: translate3d(0, 40px, 0)
    }

    to {
        transform: translate3d(0, 0, 0);
        opacity: 1
    }
}

.animated {
    animation-duration: 0.8s;
    animation-fill-mode: both;
    -webkit-animation-duration: 0.8s;
    -webkit-animation-fill-mode: both;
}

.animatedBefore {
    opacity: 0
}

.fadeInUp {
    opacity: 0;
    animation-name: fadeInUp;
    -webkit-animation-name: fadeInUp;
}

/* fadeInUp --> */

/* <-- fade */
@keyframes fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-webkit-keyframes fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-moz-keyframes fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

@-o-keyframes fade {
    0% {
        opacity: 0;
    }

    100% {
        opacity: 1;
    }
}

.fade {
    opacity: 0;
    animation-name: fade;
    -webkit-animation-name: fade;
}

/* fade --> */

/* delay */
.delay_1 {
    animation-delay: 0.2s;
}

.delay_2 {
    animation-delay: 0.4s;
}

.delay_3 {
    animation-delay: 0.6s;
}

.delay_4 {
    animation-delay: 0.8s;
}