/* ==============================
   FADE
============================== */

.fade-up{

    opacity:0;

    transform:translateY(60px);

    transition:1s ease;
}

.fade-up.show{

    opacity:1;

    transform:translateY(0);
}

/* ==============================
   FADE LEFT
============================== */

.fade-left{

    opacity:0;

    transform:translateX(-60px);

    transition:1s ease;
}

.fade-left.show{

    opacity:1;

    transform:translateX(0);
}

/* ==============================
   FADE RIGHT
============================== */

.fade-right{

    opacity:0;

    transform:translateX(60px);

    transition:1s ease;
}

.fade-right.show{

    opacity:1;

    transform:translateX(0);
}

/* ==============================
   ZOOM
============================== */

.zoom{

    opacity:0;

    transform:scale(.9);

    transition:1s ease;
}

.zoom.show{

    opacity:1;

    transform:scale(1);
}

/* ==============================
   FLOAT
============================== */

@keyframes float{

0%{

    transform:translateY(0);
}

50%{

    transform:translateY(-10px);
}

100%{

    transform:translateY(0);
}

}

.float{

    animation:float 4s ease-in-out infinite;
}

/* ==============================
   BUTTON HOVER
============================== */

.hover-lift{

    transition:.3s;
}

.hover-lift:hover{

    transform:translateY(-5px);
}