/* ==================================================
   1A. ANIMACIONS BASE
================================================== */

.fade-up{

    opacity:0;

    transform:translateY(40px);

    transition:.8s ease;

}

.fade-left{

    opacity:0;

    transform:translateX(-40px);

    transition:.8s ease;

}

.fade-right{

    opacity:0;

    transform:translateX(40px);

    transition:.8s ease;

}

.zoom{

    opacity:0;

    transform:scale(.9);

    transition:.8s ease;

}

/* ==================================================
   2A. ESTAT VISIBLE
================================================== */

.show{

    opacity:1;

    transform:none;

}

/*===================================================
    3a. HERO
===================================================*/

@keyframes float{

    0%{

        transform:translateY(0);

    }

    50%{

        transform:translateY(-10px);

    }

    100%{

        transform:translateY(0);

    }

}