/* ==========================================
   New Year Event
========================================== */

.firework-particle{

    position:fixed;

    width:8px;

    height:8px;

    border-radius:50%;

    pointer-events:none;

    z-index:-1;

    animation:explode 1.3s ease-out forwards;

    box-shadow:0 0 12px currentColor;

}

@keyframes explode{

    0%{

        transform:
        translate(0,0)
        scale(.2);

        opacity:1;

    }

    100%{

        transform:
        rotate(var(--angle))
        translateX(var(--distance))
        scale(1);

        opacity:0;

    }

}