/* ==========================
   BACKGROUND EFFECTS
========================== */

.background-effects{

    position:fixed;

    inset:0;

    overflow:hidden;

    pointer-events:none;

    z-index:-1;

}

.glow{

    position:absolute;

    border-radius:50%;

    filter:blur(120px);

}

.glow-1{

    width:500px;

    height:500px;

    background:#00A8FF;

    opacity:.18;

    top:-120px;

    left:-120px;

    animation:floatGlow1 12s ease-in-out infinite;

}

.glow-2{

    width:450px;

    height:450px;

    background:#7CFF4D;

    opacity:.12;

    bottom:-150px;

    right:-100px;

    animation:floatGlow2 15s ease-in-out infinite;

}

.stars{

    position:absolute;

    inset:0;

    background-image:
        radial-gradient(circle,#ffffff 1px,transparent 1px);

    background-size:70px 70px;

    opacity:.08;

}

@keyframes floatGlow1{

    50%{

        transform:translate(80px,40px);

    }

}

@keyframes floatGlow2{

    50%{

        transform:translate(-80px,-60px);

    }

}