:root {
    --color-primary: #5888aa;
    --color-callout: #fad188;
    --color-text: #fff;
    --color-dark-bg: #2a6787;
    --color-dark-border: #2a6787;
    --color-light-bg: rgb(255 255 255 / 15%);
    --color-light-border: rgb(255 255 255 / 60%);
    --color-gold: #ffda71;
    --color-silver: #ced0ca;
    --color-bronze: #bba6a2;
    --section-padding: clamp(85px, 15vw, 150px);
    --container-padding: clamp(15px, 4vw, 30px);
    --header-color: var(--color-gold);
    --mm-max-size: 420px;
}

.high-contrast {
    --color-primary: #265d79;
    --color-callout: #fff;
    --color-dark-bg: #22526c;
    --color-dark-border: #22526c;
    --color-light-bg: #fff;
    --color-light-border: #fff;
}

#menu:not(.mm-menu):not(.mm) {
    display: none;
}

.mm-wrapper__blocker {
    /* background: none; */
}

.mm-menu {
    --mm-color-background: #f5f5f5;
    font-family: 'Rubik-M';
}

.mm-panel:after {
    content: none;
}

.mm-listview {
    display: flex;
    flex-direction: column;
    justify-content: stretch;
    /* height: 100%; */
    background: #f5f5f5;
}

.mm-listitem {
    height: 50%;
    border-bottom: 1px solid #162b64;
    color: #162b64;
}

.mm-listitem:after {
    content: none;
}

.mm-listitem > a {
    /* display: flex; */
    align-items: center;
    transition: padding 0.5s ease;
}

.mm-listitem > a:hover {
    /* padding-left: 40px; */
}

#header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: -webkit-sticky;
    position: absolute;
    top: 19px;
    z-index: 4;
    height: 40px;
    left: 10px;
    font-size: 24px;
    color: #fff;
    background: #162b64;
    width: 40px;
    border-radius: 50%;
}

#header a {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    position: absolute;
    top: 10px;
    left: 10px;
    width: 20px;
    height: 20px;
    text-decoration: none;
    color: #fff;
}

#header a[href="#menu"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.mm-wrapper--opened #header a[href="#menu"] {
    display: none;
}

#header a[href="#page"] {
    display: none;
}

.mm-wrapper--opened #header a[href="#page"] {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

#content {
    position: relative;
    padding: 125px 50px 50px 50px;
    text-align: center;
}