@media (max-width: 600px) {
    code {
        font-size: 0.8em;
        &.terminal { margin: 20px 0px; }
    }
    div.chapter {
        padding: 10px;
        & .marged { margin: 0px; }
        &.marged  { margin: 0px 20px; }
        & ol.chapter-list, & ul.chapter-list { padding: 0px; }
        & h1, & h2, & h3, & h4 { text-align: center; }
    }
    div.framework-choice {
        & > div {
            text-align: center; margin-bottom: 20px;
            &:hover { padding-left: 0px }
            & h2 { padding-top: 0; }
            & > a { margin-right: 0 !important; }
            & > * { display: block; }
        }
    }
}
@media (max-width: 1000px) {
    header {
        text-align: center; padding: 0; height: auto;
        & .title {
            padding: 0px 20px;
            & a > span { display: none; }
        }
        & .frameworks {
            display: block;
            float: none;
            background: var(--darkerColor);
            width: 100%;
            position: relative;
            left: 0;
            border-top: 2px solid var(--accentColor);
            & > div { height: 1.7em;  }
        }
    }
    div.subtitle { text-align: center; }
}
