:root {
    --global-font-size: 15px;
    --global-line-height: 1.4em;
    --global-space: 10px;
    --fonts: JetBrains Mono, Menlo, Monaco, Lucida Console, Liberation Mono,
    DejaVu Sans Mono, Bitstream Vera Sans Mono, Courier New, monospace,
    serif;
    --font-stack: var(--fonts);
    --mono-font-stack: var(--fonts);
    --page-width: 60em;
    --input-style: solid;
    --display-h1-decoration: none;
    --background-color: #222225;
    --font-color: #e8e9ed;
    --invert-font-color: #222225;
    --secondary-color: #a3abba;
    --tertiary-color: #a3abba;
    --primary-color: #2a95d4;
    --error-color: #ff3c74;
    --progress-bar-background: #3f3f44;
    --progress-bar-fill: #2a95d4;
    --code-bg-color: #3f3f44;
    --light-theme-display: block;
    --dark-theme-display: none;
}

h1 {
    padding-top: 0;
}

.material-symbols-outlined {
    vertical-align: middle;
    line-height: inherit;
}

.terminal-nav {
    position: sticky;
    background-color: var(--background-color);
    z-index: 500;
}

.terminal-nav#top {
    top: 0;
    margin-bottom: 2em;
}

.terminal-nav#bottom {
    bottom: -1px;
}

.terminal-menu li {
    cursor: pointer;
}

#theme-switcher {
    user-select: none;
}

#theme-switcher #light-theme {
    display: var(--light-theme-display);
}

#theme-switcher #dark-theme {
    display: var(--dark-theme-display);
}

section#moi {
    display: grid;
    grid-template-rows: auto;
    grid-template-columns: 142px calc(100% - 143px);
}

.custom-image-card {
    border: 1px solid var(--secondary-color);
    border-right-width: 0;
}

.card-border {
    height: 36px;
    background-color: var(--secondary-color);
}

#avatar {
    display: block;
    width: 141px;
    margin-top: -37px;
}

section#moi .terminal-card {
    border-left-width: 0;
}

section#moi #details div {
    display: inline-block;
}

section#moi #details div.label {
    width: 4.5em !important;
}

section#moi #details div.colon {
    width: 1em !important;
}

section#moi #details #naissance {
    display: none;
}

.terminal-card>header {
    text-align: left;
    padding: 0.5em;
}

#competences-loisirs {
    display: grid;
    grid-template-rows: auto;
    grid-gap: 1em;
    grid-template-columns: repeat(auto-fit, calc(50% - 0.5em))
}

#competences-loisirs ul {
    margin-top: 0;
}

@media screen and (max-width: 511px) {
    #theme-switcher {
        padding: 0 0 0 1em;
    }

    .mobile-hidden {
        display: none !important;
    }
}

@media only screen and (max-width: 30em) {
    .terminal-nav {
        flex-direction: row;
        align-items: center;
    }

    .terminal-menu ul {
        display: flex;
        flex-direction: row;
        justify-items: flex-end;
        align-items: center;
        justify-content: flex-end;
        margin-top: calc(var(--global-space) * 2);
    }

    .terminal-menu li {
        margin: 0 2em 0 0;
    }

    .terminal-menu li:last-child {
        margin-right: 0;
    }

    .terminal-nav#bottom .terminal-menu ul {
        justify-content: center;
        margin: var(--global-space) 0;
    }
}

@media only screen and (max-width: 40em) {
    .terminal-timeline::before, .terminal-timeline .terminal-card::before {
        visibility: hidden;
    }

    .terminal-timeline {
        padding: 0;
    }
}

@media only screen and (max-width: 45em) {
    #competences-loisirs {
        display: block;
    }
}