@import url(//fonts.googleapis.com/css?family=Libre+Baskerville:400,400italic,700);

article {
    margin: 2rem;
    font-family: "Libre Baskerville", Baskerville, Georgia, serif;
    ul, p { line-height: 1.5; }
    ul code { font-size: 1rem; }

    h1 { font-size: 2rem; }
}

ul.var-name-conventions code { background-color: #E4F0FC; padding: 1px 2px; }

section.intro { font-size: 16px; margin: auto; width: 100%; }

@media (min-width: 900px){section.intro{font-size:17px;margin-left:auto;margin-right:auto;margin-top:30px;margin-bottom:25px;width:836px}}
@media (min-width: 1800px){section.intro{font-size:18px;margin-left:auto;margin-right:auto;margin-top:30px;margin-bottom:25px;width:1000px}}

main {
    font-family: "Menlo", "Monaco", "Ubuntu Mono", "Consolas", "source-code-pro", monospace;
}

main {
    margin-top: 2rem;
    --column-0-width: 14rem;
    --column-1-width: 2.75rem;
    pre {
        margin: 2px 0px;
        min-height: 0.75rem;
    }
}

main div.chunk-code { --chunk-background: #F9F2AA; }
main div.chunk-data { --chunk-background: #E4F0FC; }
main div.chunk-unused { --chunk-background: #F0F0F0; }
main div.chunk-directive { --chunk-background: #B5FFEB; }
main div.chunk-prelude { --chunk-background: #f7eaf1; }

main div.listing-chunk {
    background-color: var(--chunk-background);
    padding: 4px 0px;
    width: 52rem;
    margin: 0.75rem auto;

    h2 {
        color: #005740;
        margin: 3px 0px 9px 0px;
    }

    img.gfx-img {
        margin: 0.25rem 0rem 0.25rem var(--column-0-width);
        border: 6px solid #1dae15;
        border-radius: 4px;
    }
}

pre.chunk-h2 {
    margin-bottom: 12px;
    span.asm-comment {
        font-size: 1.25rem;
    }
}
.asm-comment-intro,
.asm-comment {
    color: #005740;
    font-style: italic;
    font-weight: bold;
}
span.asm-directive-instr {
    display: inline-block;
    width: var(--column-1-width);
}
span.asm-directive-operand {
    display: inline-block;
    width: var(--column-0-width);
}

.asm-comment-intro,
span.asm-directive-label,
span.asm-code-label {
    display: inline-block;
    width: var(--column-0-width);
    padding-right: 0.5rem;
    box-sizing: border-box;
    text-align: right;
    font-weight: bold;
}
span.asm-code-instr {
    display: inline-block;
    width: var(--column-1-width);
    color: #944000;
}
span.asm-code-operand {
    display: inline-block;
    width: var(--column-0-width);
}
span.asm-code-dump-addr {
    color: #903768;
}
span.asm-code-dump-data {
    margin-left: 0.75rem;
    color: #005A8F;
}