@import url('https://fonts.googleapis.com/css2?family=Roboto+Slab:wght@100..900&display=swap');
@import "./hero.css";
@import "./content.css";
@import "./countdown.css";

* {
    font-family: 'Roboto Slab', Arial, Helvetica, sans-serif;
}

body {
    min-height: 100vh; /* make sure footer has space to go to the bottom */
}

/* hero size */
main {
    height: 100vh;
}

.divider {
    height: 3rem;
    box-shadow: inset 0 0 1.5rem rgba(0, 0, 0, 0.25);
    background-color: rgba(0, 0, 0, 0.075);
}

.material-symbols-outlined {
    font-variation-settings:
        'FILL' 0,
        'wght' 400,
        'GRAD' 0,
        'opsz' 40
}

#halftone {
    /* circles that have instant gradient transition */
    background-image: radial-gradient(circle at center,
            rgba(0, 0, 0, 0.035) 0.25rem,
            transparent 0),
        radial-gradient(circle at center,
            rgba(0, 0, 0, 0.035) 0.25rem,
            transparent 0);
    background-size: 2rem 2rem;
    background-position: 0 0, 1rem 1rem;
    z-index: -4;
}

#background {
    z-index: -5;
    max-width: 1200px;
    width: 150%;
}

.progress-bar {
    transition: 0.25s;
}

.icon-link > .bi {
    height: auto !important; /* strange fix for misaligned icon */
}