/* 
#######################################################################################################
                                            ANIMATIONS.CSS
#######################################################################################################
*/

/* Animate in (images) */

img.animate-in {
    width: 25%;
    opacity: 0;
    transform-origin: center top;
    transition: width 1s ease-out, opacity 1s ease-out;
}

    img.animate-in.visible {
        width: 100%;
        opacity: 1;
    }

/* Animate up (numbers) */

.animate-up {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 0.5s ease-out, transform 0.5s ease-out;
}

    .animate-up.visible {
        opacity: 1;
        transform: translateY(0);
    }