:root {
    --background: #353535;
    --foreground: #ece3db;
    --highlight: #decb1c;
}

::selection {
  background: var(--highlight);
  color: var(--background);
  text-decoration-color: var(--background);
}

body {
    font-family: "Source Serif 4", serif;
    font-weight: 500;
    color: var(--foreground);
    line-height: 2;
    background-color: var(--background);
    min-height: 100vh;
    margin: 0px 16px auto;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}

a {
    color: var(--foreground);
    text-decoration-thickness: 10%;
}

a:hover {
    text-decoration-style: dotted;
}

#container {
    max-width: 1200px;
    flex-grow: 1;
    display: flex;
    align-items: center;
    justify-content: center;
    align-content: center;
    flex-wrap: wrap;
    gap: 16px;
}

#logo {
    flex: 6 1 500px;
    display: flex;
}

#logo img {
    max-width: 100%;
}

#info {
    padding: 0px 16px;
    flex: 4 1 300px;
    font-size: x-large;
}

#footer {
    padding: 10px 0px;
    font-size: medium;
    text-align: center;
}