:root {
    --pop-color: #37c4eb;
    --text: #eeeeee;
}

@font-face {
    font-family: 'SUV';
    src: url('/fonts/SegoeUI.woff2') format('woff2-variations');
    font-weight: 300 700;
    font-display: swap;
}
@font-face {
    font-family: 'Console Sans';
    src: url('/fonts/ConsoleSansVF.ttf');
    font-weight: 400 500 600 700 800;
}
@font-face {
    font-family: 'Inter';
    src: url('/fonts/InterVariable.ttf');
    font-weight: 100 200 300 400 500 600 700 800 900;
    font-optical-sizing: auto;
}
@font-face {
    font-family: 'JetBrains Mono';
    src: url('/fonts/JetBrainsMono.ttf');
    font-weight: 100 200 300 400 500 600 700 800 900;
}
@font-face {
    font-family: 'Console Sans Ext';
    src: url('/public/fonts/ConsoleSansExt-Regular.otf');
}

body {
    color: var(--text);
    background-color: #011a1e;
    /* #03262c */
    /* #0c2c31 */
    font-family: 'Inter', 'Segoe UI', 'SUV', Tahoma, Geneva, Verdana, sans-serif !important;
    font-size: 16px;
    font-weight: 350;
    font-variation-settings: 'opsz' 14;
    line-height: 2em;
}
h1, h2, h3, h4, h5, h6 {
    font-weight: 600;
    font-variation-settings: 'opsz' 24;
}

a { color: var(--pop-color); }
a:hover { opacity: 70%; color: #37c4eb; }
.link-info { color:#5488d7!important; } 
.link-info:hover { color:#4672b3!important; } 

.pop {
    font-weight: bold;
    /* text-shadow: #29acd0 0px 0px 10px, #29acd0c9 0px 0px 40px; */
    color: var(--pop-color);
}
.title {
    font-size:300%;
    text-align: center;
}

.w-fit {
    width:fit-content;
}
.w-read-1000 {
    width: 90%;
    max-width: 1000px;
}
.w-read-1600 {
    width: 90%;
    max-width: 1600px;
}

/* .text-justify {
    text-align: start;
}
@media (min-width: 950px) {
    .text-justify {
        text-align: justify !important;
    }
} */

.monospace {
    font-family: 'JetBrains Mono';
}

.mono-block {
    display: block !important;
    background: #00000080;
    border-radius: 5px;
    margin: -0.25rem 0.5rem 0.5rem 0.25rem;
    padding: 0.75rem; 
    width: fit-content;
}

.text-success {
    color: #1cb86f !important;
}

blockquote p {
    display: inline;
}
blockquote {
    font-style: italic;
    color: #6c757d;
}
blockquote::before {
    font-weight: bold;
    content: "|";
}

input[type="text"], textarea {
    background-color:#0a262a;
    color: #aaa;
    border: 2px solid #aaa;
}

.in {
    display:inline-block;
    min-width: 30px;
}

.text-book {
    display: block !important;
    font-family: 'Times New Roman', Times, serif;
    text-align: left;
    margin: 0px 10% 1rem;
}