body {
    justify-content: center;
    align-items: center;
}

.background {
    overflow-x: hidden;
    overflow-y: hidden;
    z-index: -10;
    background-image: radial-gradient(transparent, #000000);
}

#particles {
    z-index: -11;
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    filter: url('#goo');
}

/* Firefox specific */
@-moz-document url-prefix() {
    #particles {
        filter: none;
    }
}

.particle {
    z-index: -10;
    position: absolute;
    border-radius: 50%;
    background: linear-gradient(120deg, var(--bs-primary-800) 0%, var(--bs-primary) 100%);
}

@keyframes float {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(180px);
    }
}

@keyframes floatReverse {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-180px);
    }
}

@keyframes float2 {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(280px);
    }
}

@keyframes floatReverse2 {

    0%,
    100% {
        transform: translateY(0);
    }

    50% {
        transform: translateY(-280px);
    }
}

/* Glassmorphism Container */
.glassmorph {
    background: rgb(137 104 89 / 18%);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
    box-shadow: 2px 4px 25px 0px rgba(0, 0, 0, 17%);
    border: 1px solid rgba(255, 255, 255, 17%);
    color: white;
}

.glassy {
    backdrop-filter: blur(16px);
}