@import '/font/montserrat/Montserrat.css';
@import '/font/notosansmono/NotoSansMono.css';
@import '/css/theme/example.css?v6';
@import '/css/theme/practice.css?v6';
@import '/css/theme/read.css?v6';
@import '/css/theme/infobox.css?v6';
@import '/css/theme/skip-link.css?v6';
@import '/css/theme/nav.css?v6';
@import '/css/theme/settings.css?v6';

* {
    box-sizing: border-box;
}

input[type="checkbox"] {
    vertical-align: middle;
}

:focus {
    outline: 3px solid cyan;
}

body {
    font-family: Montserrat, sans-serif;
    color: #29292a;
    min-height: 100%;
    margin: 0;
}

.container {
    max-width: 1400px;
    margin: 0 auto;
}

.sample {
    border: 3px solid #b6b6b6;
    border-radius: 1rem;
    padding: 1rem;
    max-width: 800px;
}

.visually-hidden {
    font-size: 0;
    user-select: none;
    color: transparent;
}

/* Success Criterion 2.5.8 Target Size (Minimum) */
button, a, input, textarea {
    min-height: 24px;
    min-width: 24px;
    display: inline-block;
    vertical-align: middle;
}

body[data-high-contrast] {
    background-color: black;
    color: white;
}

body[data-high-contrast] a {
    color: #89edff;
}

body[data-high-contrast] a:visited {
    color: #bf91ff;
}

body[data-high-contrast] a:active {
    color: #ff5151;
}

@media only screen and (max-width: 1400px) {
    .container {
        padding: 1em;
    }
}