:root {
    --white: #fff;

    --color-1: #0d70ff;
    --color-2: #045bd6;
    --color-3: #002f94;
    --color-4: #001749;
    --color-5: #385cff;
}

.bg {
    display: block;
    position: fixed;
    inset: 0;
    background: rgba(0, 0, 0, .5);
    z-index: -1;
}

.container {
    max-width: 45rem !important;
}

.bg-black {
    background: #000 !important;
}

header {
    border: 1px solid var(--color-2);
    border-bottom: 0px !important;
    border-radius: 20px 20px 0 0 !important;
}
header img.header-promo {
    display: block;
    position: relative;
    border-radius: 20px 20px 0 0 !important;
}

section {
    border: 1px solid var(--color-2);
}
section .navbar > .navbar-nav {
    gap: 10px !important;
}
section .navbar > .navbar-nav > .nav-item > .nav-link {
    padding: 8px 15px !important;
    background: radial-gradient(circle at bottom center, var(--color-2), var(--color-4)) !important;
    border: 1px solid var(--color-1);
    border-radius: 10px;
    color: var(--white) !important;
    cursor: pointer !important;
    font-weight: 700 !important;
}
section .navbar > .navbar-nav > .nav-item > .nav-link:hover {
    background: linear-gradient(to bottom, var(--color-2), var(--color-4)) !important;
}
section .promo-content {
    padding: 10px;
}
section .promo-content * {
    color: #fff !important;
}

footer {
    border: 1px solid var(--color-2);
    border-top: 0px !important;
    border-radius: 0 0 20px 20px !important;
}
footer b {
    font-weight: 600 !important;
}

marquee {
    line-height: 1 !important;
}

button.collapsible {
    padding: 0 !important;
    background: transparent !important;
    border: 0 !important;
}
button.collapsible.show {
    animation: blink .4s linear;
}

#particles-js {
    display: block;
    position: fixed;
    inset: 0;
    z-index: -1;
}


/* Mobile */
@media (max-width: 993px) {
    section .navbar > .navbar-nav {
        gap: 5px !important;
    }
    section .navbar > .navbar-nav > .nav-item > .nav-link {
        padding: 6px 10px !important;
        font-size: 11px !important;
        font-weight: 600px !important;
    }
    section .promo-content p,
    section .promo-content li {
        font-size: 14px !important;
    }

    footer b {
        font-size: 10px !important;
    }
}

@keyframes blink {
    0% { opacity: 1; }
    25% { opacity: 0; }
    50% { opacity: 1; }
    75% { opacity: 0; }
    100% { opacity: 1; }
}