style_print.scss

---
---

html,
body {
    height: 100%;
}

// 16px = 1em

$background: #ffffff;
$primary: #04100d;
$secondary: #005ca3;
$links: #295147;
$accent: #cec452;
$font-stack: -system-ui, "Gill Sans", sans-serif;
$font-mono: ui-monospace, monospace, "Courier New";

body {
    border-top: 0;
    margin: 0;
    font-family: $font-stack;
    color: $primary;
    font-size: 1em;
    background: $background;
    box-sizing: border-box;
}

#outer-wrapper {
    border-top: 0;
    min-height: 80%;
    margin-bottom: -40px;
}

#wrapper {
    width: 860px;
    margin: 1px auto;
    padding: 0px;
    -webkit-box-sizing: content-box;
    -moz-box-sizing: content-box;
    box-sizing: content-box;
}

.page,
.page-break {
    break-after: page;
}

.blog-title,
.blog-slogan,
.blog-menu,
.blog-image,
.footer,
.sr-only {
    display: none;
}

.book-list .book {
    display: flex;
}

.book-list {
    display: grid;
    grid-gap: 0;
    grid-template-columns: repeat(auto-fill, minmax(90px, 1fr));
    max-width: 860px;
}

.book-list .book-img {
    flex-shrink: 0;
    width: 90px;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    color: $primary;
    position: relative;
    display: block;
    margin-top: 0.5em;
}

h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a {
    text-decoration: none;
    color: $primary;
}

h1:hover a,
h2:hover a,
h3:hover a,
h4:hover a,
h5:hover a,
h6:hover a,
h1:focus a,
h2:focus a,
h3:focus a,
h4:focus a,
h5:focus a,
h6:focus a {
    text-decoration: none;
}

h1 {
    color: $primary;
}

h3 {
    border-bottom: $secondary dashed 2px;
}

article,
ol li,
ul li {
    margin-bottom: 7px;
    line-height: 1.4;
}

article,
ul ul,
ol ol,
ol ul,
ul ol {
    margin-top: 10px;
    margin-bottom: 10px;
}

p {
    line-height: 1.4;
}

a {
    color: $links;
}

a:hover,
a:focus,
a:active {
    text-decoration: underline;
}

img {
    display: block;
    max-width: 100%;
    height: auto;
}
.codeblock {
    font-family: $font-mono;
    border: 0.125em solid $secondary;
    border-radius: 1em;
    font-size: 0.9em;
    padding: 0.625em;
}

pre,
code {
    font-family: $font-mono;
    font-size: 0.75em;
}

pre > code {
    font-family: $font-mono;
    font-size: 0.9em;
}

blockquote,
cite {
    padding: 0 1em;
    border-left: 0.25em solid $accent;
    width: 90%;
    margin-left: 0.625em;
}

.footnote {
    font-size: 0.75em;
    color: $primary;

    sup {
        color: $primary;
        margin-right: 5px;
    }
}

.post {
    position: relative;

    > h2 {
        margin-top: 60px;
        margin-right: 130px;
    }
}

.entry {
    margin-bottom: 20px;
}

.meta {
    color: $secondary;
    display: block;
    float: right;
    margin-right: 0;
    display: block;
    font-size: 12px;
}

.posts {
    margin-left: 0;
    padding-left: 0;
    margin-bottom: 12px;
}

.poster {
    width: 100px;
    vertical-align: top;
}

.floated {
    float: left;
    vertical-align: top;
    margin-right: 20px;
    margin-top: 10px;
}

.content {
    position: relative;
}