/* START: TEMPLATE */
.vertical-centered-box {
    position: absolute;
    width: 100%;
    height: 100%;
    text-align: center;
}
.vertical-centered-box:after {
    content: '';
    display: inline-block;
    height: 100%;
    vertical-align: middle;
    margin-right: -0.25em;
}

* {
    transition: all 0.3s;
}
/* END: TEMPLATE */

/* Particles Background and Foreground Styles */
/* Particles Background and Foreground Styles */
#particles-background, #particles-foreground {
    position: fixed; /* Keeps the particles fixed relative to the viewport */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: -1; /* Ensures particles are behind other content */
    pointer-events: none; /* Allows interactions to pass through */
    overflow: hidden; /* Prevents any child elements from overflowing */
}

/* Optional: Adjust background gradients if needed */
#particles-background {
    background: rgba(0, 20, 45, 100);
    background-image:linear-gradient(to bottom, rgba(0, 20, 45, 0.8), rgba(0, 20, 47, 0.8), rgba(0, 20, 49, 0.8), rgba(0, 20, 51, 0.8), rgba(0, 20, 53, 0.8));
}

/* Keyframes for Animations */
@keyframes rotate {
    0% { transform: rotate(0deg);}
    100% { transform: rotate(360deg);}
}

@keyframes fade {
    0% { opacity: 1;}
    50% { opacity: 0.25;}
}

@keyframes fade-in {
    0% { opacity: 0;}
    100% { opacity: 1;}
}