/*==================================================
    MIRLO FILMS
    SCROLL ANIMATIONS
==================================================*/

/*------------------------------------------
    Base
------------------------------------------*/

.fade,
.fade-up,
.fade-down,
.fade-left,
.fade-right,
.zoom-in{

    opacity:0;

    transition:
        opacity .9s ease,
        transform .9s ease;

    will-change:
        opacity,
        transform;

}

/*------------------------------------------
    Fade
------------------------------------------*/

.fade{

    transform:none;

}

/*------------------------------------------
    Fade Up
------------------------------------------*/

.fade-up{

    transform:translateY(50px);

}

/*------------------------------------------
    Fade Down
------------------------------------------*/

.fade-down{

    transform:translateY(-50px);

}

/*------------------------------------------
    Fade Left
------------------------------------------*/

.fade-left{

    transform:translateX(-50px);

}

/*------------------------------------------
    Fade Right
------------------------------------------*/

.fade-right{

    transform:translateX(50px);

}

/*------------------------------------------
    Zoom In
------------------------------------------*/

.zoom-in{

    transform:scale(.92);

}

/*------------------------------------------
    Visible
------------------------------------------*/

.is-visible{

    opacity:1;

    transform:none;

}

/*------------------------------------------
    Delays
------------------------------------------*/

.delay-1{

    transition-delay:.15s;

}

.delay-2{

    transition-delay:.30s;

}

.delay-3{

    transition-delay:.45s;

}