/* ===========================
        AURORA
=========================== */

@keyframes aurora{

    0%{
        background-position:0% 50%;
    }

    50%{
        background-position:100% 50%;
    }

    100%{
        background-position:0% 50%;
    }

}

/* ===========================
      FLOATING HEART
=========================== */

@keyframes floatHeart{

    0%{

        transform:
        translateY(0)
        rotate(0deg);

        opacity:0;

    }

    20%{

        opacity:1;

    }

    100%{

        transform:
        translateY(-120vh)
        rotate(360deg);

        opacity:0;

    }

}

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

@keyframes fadeUp{

    from{

        opacity:0;

        transform:translateY(40px);

    }

    to{

        opacity:1;

        transform:translateY(0);

    }

}