html {
    main {
        max-width: 1024px;
        margin: 0 auto;
    }

    main.sage-bg-page {
        background-color: var(--color-sage);
    }

    main.dark-bg-page {
        background-color: black;
        color: white;
    }

    main.dark-bg-page h1,
    main.dark-bg-page p,
    main.dark-bg-page label,
    main.dark-bg-page h4 {
        color: var(--color-background);
    }

    main.dark-bg-page button {
        background-color: var(--color-highlight);
        color: black;
    }

    main.dark-bg-page table {
        border-color: var(--color-background);
    }

    main.dark-bg-page th,
    main.dark-bg-page td {
        color: var(--color-background);
        border-color: var(--color-background);
    }

    main.dark-bg-page thead th {
        background-color: var(--color-background);
        color: var(--color-foreground);
    }

    main.container {
        max-width: 1024px;
        margin: 0 auto;
        /*padding: 1.5rem 1rem;*/
        min-height: 80vh;
    }

    main.full-width-page .container {
        max-width: 1480px;
        margin-left: auto;
        margin-right: auto;
        padding: 1.5rem 2rem;
        min-height: 80vh;
    }

    nav {
        max-width: 72rem;
    }

    footer {
        max-width: 800px;
        margin: 0 auto;
        text-align: center;
        font-size: 9px;
        padding: 1.5rem 2rem;
    }

    section {
        margin: 1rem 0;
    }

    article {
        margin: 1rem 0;
    }

    aside {
        padding: 1rem;
        margin: 1rem 0;
        background-color: var(--color-surface);
        border-left: 3px solid var(--color-highlight);
        /*border-radius: 0.25rem;*/
    }

    figure {
        margin-bottom: 1rem;
    }

    details {
        border: 1px solid var(--color-border);
        border-radius: 0.25rem;
        padding: 0.5rem;
        margin-bottom: 1rem;
        background-color: var(--color-surface);
    }

    summary {
        cursor: pointer;
        font-weight: 600;
        padding: 0.5rem;
        margin: -0.5rem;
        border-radius: 0.25rem;
    }

    summary:hover {
        background-color: var(--color-background);
    }

    details[open] summary {
        margin-bottom: 0.5rem;
        border-bottom: 1px solid var(--color-border);
    }

}