@import url(https://fonts.googleapis.com/css2?family=REM:wght@100;200;400;500;600;700;800&display=swap);

*,
::after,
::before {
    box-sizing: border-box;
    border: 0 solid #e5e7eb;
    --textcolor: #121212;
    --highlight: #2749c9;
    --bgcolor: #fff;
    --header-height: 55px;
}

/* @media (prefers-color-scheme: dark) {
  * {
    --textcolor: #dadada;
    --bgcolor: #141414;
    --highlight: #ffc400;
  }
} */

h1 {
    color: rgb(55 65 81);
    font-weight: 600;
}

html {
    line-height: 1.5;
    font-family: REM, sans-serif;
    scroll-behavior: smooth;
}

body {
    margin: 0;
    font-size: 15px;
    line-height: inherit;
    place-content: center;
}

header {
    display: flex;
    justify-content: center;
    gap: 32px;
    padding: 16px 5vw;
    background-color: lightgray;
    width: 100%;
}

nav {
    display: flex;
    gap: 16px;
    width: 800px;
    max-width: 90%;
}

main {
    display: flex;
    justify-content: center;
}

main > section {
    width: 800px;
    max-width: 90%;
    padding: 2vw 0;
}

a {
    color: inherit;
    text-align: center;
    text-decoration: inherit;
}

pre {
    margin: 0;
}