@font-face {
    font-family: 'Jura';
    src: url('/fonts/Jura/Jura-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

@font-face {
    font-family: 'Exo2';
    src: url('/fonts/Exo2/Exo2-VariableFont_wght.ttf') format('truetype');
    font-weight: 100 900;
    font-style: normal;
    font-display: swap;
}

:root {
    /* Color palette */
    --dark-bg: #121212;
    --dark-nav: #1a1a2e;
    --dark-card: #1e1e30;
    --dark-text: #e0e0e0;
    --dark-heading: #03729e;
    --dark-heading2: #0076dd;
    --dark-text-secondary: #b0b0b0;
    --dark-primary: #073873;
    --dark-primary-hover: #4a617b;
    --dark-light-button: #2c2c44;
    --dark-light-button-hover: #3c3c54;
    --dark-link: #a0a0a0;
    --dark-link-hover: #ffffff;
    --dark-nav: #0f1014;    
    --dark-nav-hover: #1c2d5d;
    --dark-text-primary: lawngreen;

    --heading-font: 'Exo2', sans-serif;
    --body-font: 'Jura', sans-serif;
}
html {     
    background-color: var(--dark-bg);
    height: 100%;
    min-height: 100%;
}
body {
    font-family: var(--body-font);
    background-color: var(--dark-bg);
    color: var(--dark-text);
    padding-top: 3.25rem; /* This adds padding equal to the navbar height */
    min-height: 100%;
    display: flex;
    flex-direction: column;
}

.is-dark {
    background-color: var(--dark-bg);
    color: var(--dark-text);
    font-weight: bold;

}

.is-highlight {
    background-color:#073873;
    color: white;


}
.navbar {
    background-color: var(--dark-nav);
}

.navbar-item, .navbar-link {
    color: var(--dark-text);
        background-color: var(--dark-nav);
}

.navbar-item:hover, .navbar-link:hover {
    background-color: var(--dark-nav-hover);
    color: white;
}
a.navbar-item:hover {
    background-color: var(--dark-nav-hover);
    border-radius:10px;
}
.navbar-burger {
    color: var(--dark-text);
    background-color: var(--dark-nav);
}

.hero {
    background-color: var(--dark-card);
}

.hero-body h1, .hero-body h2 {
    color: var(--dark-text);
}

.section {
    background-color: var(--dark-bg);
}

.footer {
    background-color: var(--dark-nav);
    color: var(--dark-text);
}

.title {
    color: var(--dark-heading2);

}
 
.subtitle {
    color: var(--dark-text-secondary);
}

.button.is-primary {
    background-color: var(--dark-primary);
}

.button.is-primary:hover {
    background-color: var(--dark-primary-hover);
}

.button.is-light {
    background-color: var(--dark-light-button);
    color: var(--dark-text);
}

.button.is-light:hover {
    background-color: var(--dark-light-button-hover);
    color: white;
}

.content p {
    color: var(--dark-text-secondary);
}

.is-size-5 {
    color: var(--dark-text-secondary);
}

a.has-text-grey-lighter {
    color: var(--dark-link) !important;
}

a.has-text-grey-lighter:hover {
    color: var(--dark-link-hover) !important;
}

.box {
    background-color: var(--dark-card);
    color: var(--dark-text);
}
.card {
    background-color: var(--dark-card);
    color: var(--dark-text);
}
.content h1, .content h2, .content h3, .content h4, .content h5, .content h6 {
    color: var(--dark-heading);
    font-family: var(--heading-font);
}

strong { color:white; }




        .content p {
            color: #b0b0b0;
        }
        .is-size-5 {
            color: #b0b0b0;
        }
        a.has-text-grey-lighter {
            color: #a0a0a0 !important;
        }
        a.has-text-grey-lighter:hover {
            color: #ffffff !important;
        }

        .equal { 
            display: inline-flex;
            flex: 1;
         }