@media (max-width: 1280px) {
    /* Overwrite tufte for responsive text size. */
    p,
    ol,
    ul {
        font-size: 1.25rem;
        line-height: 1.75;
    }
}

@media (max-width: 1025px) {
    /* Use a smaller logo */
    header.main a.logo {
        background: var(--logo-position) var(--small-logo-url);
    }

    /* Adapt header spacing/margin sizes */
    header.main a.logo {
        width: 4rem;
        margin-left: 1rem;
    }
    header.main h1 {
        margin-bottom: 0;
    }
    header.main nav[aria-role="prev-next"] ul {
        margin-right: 1rem;
    }

    /* Remove inter-chapter navigation. */
    header.main h2 a,
    header.main nav[aria-role="main"].opened {
        display: none;
    }

    /* Remove quick-access sidebar. */
    .toc {
        display: none;
    }
    article {
        margin-left: 1rem;
    }

    /* Remove bottom navigation labels. */
    footer nav .label {
        display: none;
    }

    /* To avoid scrollbars. */
    section {
        max-width: 99%;
    }
    .references p {
        max-width: 80%;
    }
    article ul,
    article ul li {
        max-width: 100%;
    }
    blockquote {
        margin-left: 0;
    }
    blockquote ul {
        width: 55%;
        margin-right: 40px;
    }
    figure .sidenote {
        margin-right: 0;
        width: 100%;
    }
}

@media (max-width: 760px) {
    /* Overwrite tufte for responsive text size. */
    p,
    ol,
    ul {
        font-size: 1.1rem;
        line-height: 1.5;
    }

    /* Overwrite tufte to avoid scrollbars. */
    hr,
    section > p,
    section > footer,
    section > table,
    section > ol , ul  {
        width: 80%;
        font-size: 1.1rem;
        line-height: 1.5;
    }
    header > h1.title {
        font-size: 2.2rem;
    }
    section > h2 {
        font-size: 1.8rem;
    }
    section > h3,
    .references summary {
        font-size: 1.6rem;
    }
    section > h4 {
        font-size: 1.4rem;
    }

    /* Hide logo */
    header.main a.logo {
        display: none;
    }
    /* Give some room to the title */
    header.main h1 {
        padding: 0 .5rem;
    }
    /* Hide prev/next */
    header.main nav[aria-role="prev-next"] {
        display: none;
    }

    footer nav ul {
        flex-direction: column;
    }
    footer nav ul li:not(:first-child):not(:last-child) {
        text-align: center;
    }
    footer nav ul li:last-child {
        margin-top: 0;
        padding-top: 0;
        text-align: right;
    }
}
