/*
====================================
ANIMATIONS
====================================
*/


/* Fade In */

@keyframes fadeIn{

    from{

        opacity:0;

    }

    to{

        opacity:1;

    }

}


/* Slide Up */

@keyframes slideUp{

    from{

        opacity:0;

        transform:translateY(30px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}


/* Zoom In */

@keyframes zoomIn{

    from{

        opacity:0;

        transform:scale(.8);

    }

    to{

        opacity:1;

        transform:scale(1);

    }

}



/*
====================================
UTILITY CLASSES
====================================
*/


.fade-in{

    animation:fadeIn .6s ease;

}


.slide-up{

    animation:slideUp .7s ease;

}


.zoom-in{

    animation:zoomIn .5s ease;

}