/* Basics */


body {
    background-color: #ffffff;
    padding: 0 3em 20px 3em;
    margin: 0px;
    font-family:"proxima-nova", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
    font-size: 17px;
    font-weight: 400;
    line-height: 1.7;
}

@media only screen and (max-width: 400px) {
    body {
        padding-left: 1em;
        padding-right: 1em;
    }
}

body strong {
    font-weight: 700;
}

body .subdued {
    color: #747474;
}

.footnotes {
    font-size: 13px;
    line-height: 1.4;
    color: rgb(130, 130, 130);
}

.footnotes ol {
    padding-left: 20px;
}

.header {
    min-width: 240px;
    max-width: 300px;
    margin-left: auto;
    margin-right: auto;
    padding: 10px 0 13px 0;
    background-color: #890d0d;
    text-align: center;
    color: rgba(255, 255, 255, 0.93);
    border-bottom-left-radius: 6px;
    border-bottom-left-radius: 6px;
    border-bottom-right-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -webkit-border-bottom-left-radius: 6px;
    -webkit-border-bottom-right-radius: 6px;
    -moz-border-bottom-left-radius: 6px;
    -moz-border-bottom-left-radius: 6px;
    -moz-border-bottom-right-radius: 6px;
    font-family: "adelle", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
}

.header a {
    text-decoration: none;
    color: inherit;
}

.header h1 {
    margin: 0;
    font-size: 28px;
}


.content {
    width: 100%;
    margin: 0 auto 0 auto;
}


/* Navigation */

.nav {
    text-align: center;
    color: rgba(0, 0, 0, .70);
    margin: 1em 0;
    padding: 0;
}

.nav ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

.nav ul li {
    display: inline;
    list-style-type: none;
    list-style-position: inside;
}

.nav ul li :before {
    content: "  •  ";
}

.nav ul :nth-child(1) :before {
   content: "";
} 

.nav ul li a {
    text-decoration: none;
    color: rgba(137, 13, 13, 0.7);
}


/* Pagination */


.pagination {
    font-size: 16px;
    display: block;
    width: 100%;
    margin: 12px auto 0 auto;
    color: #C7C7C7;
}

.pagination .previous {
    display: block;
    float: left;
    margin: 0 8px 0 8px;
}

.pagination .next {
    display: block;
    float: right;
    margin: 0 4px 0 4px;
}

.pagination a {
    color: rgba(137, 13, 13, 0.7);
    text-decoration: none;
}

.pagination_clear {
    clear: both;
    padding: 0;
    margin: 0;
}

.pagination .page_number {
    margin: 0;
}

/* Posts */


.post {
    margin: 0 0 0 0;
    padding: 20px 8px 0 8px;
}

.post .title,
.post h1,
.post h2,
.post h3 {
    font-family: "adelle", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
    font-weight: 600;
}

.post .title {
    font-size: 24px;
    color: rgba(0, 0, 0, .65);
    margin-bottom: 16px;
    margin-top: 1px;
}

.post .title a, .post .date a {
    text-decoration: none;
    color: inherit;
}

.post .date {
    font-size: 16px;
    color: #747474;
    margin-top: 0;
    margin-bottom: 20px;
    line-height: 1em;
}

.post .content {
    line-height: 24px;
    padding: 0 0 5px 0;
    border-bottom: 1px solid #f0f0f0;
}

.post .content h1 {
    font-size: 20px;
}

.post .title a {
    color: rgba(137, 13, 13, 1);
}

.post .content h1+p,
.post .content h2+p,
.post .content h3+p {
    margin-top: 16px;
}

table {
    border-collapse: collapse;
}

table th {
    border-bottom: 1px solid #808080;
}

table th {
    font-weight: 700;
}

table tr {
    border-bottom: 1px solid #dbdbdb;
}

table td {
    vertical-align:top;
    padding: 3px 8px 3px 0;
}

table strong {
    font-weight: 600;
}

.post .content h2 {
    font-size: 17px;
    font-weight: 700;
    font-style: normal;
    color: rgba(0, 0, 0, .8);
    margin-bottom: .28em;
    margin-top: 1em;
}

.post .content h3 {
    font-size: 17px;
    font-weight: 700;
    font-style: normal;
    font-style: italic;
    line-height: 26px;
    color: rgba(0, 0, 0, .8);
}

.post .content img {
    max-width: 100%;
    max-height: 600px;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
}

.post .content img[alt^="Figure"],
.post .content img[alt^="Photo"] {
    border: 1px solid #e0e0e0;
}

.post .content code {
    font-family: "input-mono", Menlo, Consolas, Monaco, Liberation Mono, Lucida Console, monospace;
    font-size: 0.85em;
    line-height: normal;
}

.post .content a {
    text-decoration: none;
    color: rgba(137, 13, 13, 1);
}

.post .readmore {
}

.post ul.tags {
    padding: 0;
    list-style-type: none;
}

.post ul.tags li {
    display: inline;
    list-style-type: none;
    color: #a1a1a1;
    margin: 0 8px 0 0;
    font-size: 16px;
}

.post ul.tags li a {
    color: inherit;
}

.post ul.tags li a:hover {
    color: #8f8f8f;
}

.post .content blockquote {
    margin-left: 10px;
    padding-left: 16px;
    border-left: solid 4px #EDE8E8;
}

.post p > code {
    background-color:#f6f6f6;
    padding: 0 4px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius:2px;
}

.post li > code {
    background-color:#f6f6f6;
    padding: 0 4px;
    border-radius: 2px;
    -moz-border-radius: 2px;
    -webkit-border-radius:2px;
}

.post pre code {
    display: block;
    white-space: pre;
    overflow-x: auto;
    word-wrap: normal;
    background-color:#f6f6f6;
    padding: 12px 8px 14px 12px;
    border-radius: 6px;
    -moz-border-radius: 6px;
    -webkit-border-radius:6px;
}

.post .content .note {
    display: block;
    background-color: #f6f1e5;
    padding: 8px 16px 8px 16px;
    margin: 0 -16px 24px -16px;
    border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
}

.post .content .note p:first-child {
    margin-top: 0;
}

.post .content .note p:last-child {
    margin-bottom: 0;
}

.post .content .note code {
    background-color: #eddfbe;
}

.post .content .warn {
    display: block;
    background-color: #ffc1c1;
    padding: 8px 16px 8px 16px;
    margin: 0 -16px 24px -16px;
    border-radius: 12px 12px 12px 12px;
    -moz-border-radius: 12px 12px 12px 12px;
    -webkit-border-radius: 12px 12px 12px 12px;
}

.post .content .warn p:first-child {
    margin-top: 0;
}

.post .content .warn p:last-child {
    margin-bottom: 0;
}

.post .content .warn code {
    background-color: #f19f9f;
}

.post .caption {
    color: #8f8f8f;
    font-size: 80%;
}

.post .cw {
    color: #000000;
    background-color: #e4ebf0;
    border-radius: 10px;
    padding: 2px 8px 2px 8px;
    margin-left: -3px;
    font-size: 0.9em;
}

.post .cw:before {
    content: "Content warning: ";
    font-weight: bold;
    color: #570c0c;
}

@media only screen and (max-width: 400px) {
    .post .cw:before {
        content: "CW: ";
    }
}

/* Site pages */


.page {
    margin: 0 0 0 0;
    padding: 28px 8px 20px 8px;
    background-color: white;
}

.page a {
    text-decoration: none;
    color: rgba(123, 12, 12, .9);
}


/* Post index */


.page .postindex ul {
    padding: 0;
    list-style-type: none;
}

.page .postindex li {
    display: block;
    margin: 6px 8px 8px 24px;
    padding: 6px 8px 8px 0;
}

.page .postindex li .title {
    font-weight: bold;
    font-size: 17px;
}
    
.page .postindex li .date {
    font-size: 15px;
    color: rgba(0, 0, 0, .45);
}


/* Tags */

.page .taglist .tagname {
    color: #8f8f8f;
}

.page .taglist ul.posts {
    padding: 0;
    list-style-type: none;
}

.page .taglist ul.posts li {
    display: block;
    margin: 6px 8px 8px 24px;
    padding: 6px 8px 8px 0;
}

.page .taglist ul.posts li .title {
    font-family: "adelle", -apple-system, BlinkMacSystemFont, avenir next, avenir, segoe ui, helvetica neue, helvetica, Cantarell, Ubuntu, roboto, noto, arial, sans-serif;
    font-weight: 600;
    font-style: normal;
    font-size: 17px;
}

.page .taglist ul.posts li .date {
    font-size: 15px;
    color: rgba(0, 0, 0, .45);
}

/* Copyright */

.copyright {
    display: block;
    clear: both;
    text-align: center;
    padding: 0;
}

.copyright p {
    padding: 0 0 0 0;
    margin: 0;
    color: #c7c7c7;
    font-size: 14px;
}


/* About */

.about {
    color: #000000;
    line-height: 24px;
}

.about .title {
    font-size: 20px;
    color: rgba(0, 0, 0, .65);
    margin-bottom: 7px;
    margin-top: 1px;
}

/* Directory tree */

.dirtree {
    --line-height: 1.6em;           /* Vertical space between lines */
    --tree-line-color: #a3a3a3;     /* Color of the tree lines */
    --tree-line-offset: 0.5em;      /* Left offset of the tree line vs its parent element */
    --tree-line-length: 0.8em;      /* Horizontal length of the tree line */
    --tree-line-margin: 0.2em;      /* Space between tree line and its text */
    background-color: #f6f6f6;
    padding: 0.5em 0.75em;
    border-radius: 10px;
}

.dirtree>p:first-child {
    margin-top: 0;
}

.dirtree ul {
    padding: 0 0 0 calc(var(--tree-line-offset) + var(--tree-line-length) + var(--tree-line-margin));
    list-style: none;
    line-height: var(--line-height);
}

.dirtree>ul:first-of-type {
    padding: 0;
}

.dirtree>ul:first-of-type>li:before {
    display: none;
}

.dirtree ul li {
    position: relative;
}

.dirtree ul li:before {
    position: absolute;
    left: calc(0em - var(--tree-line-length) - var(--tree-line-margin));
    top: 0;
    height: calc(var(--line-height) / 2);
    width: var(--tree-line-length);
    content: '';
    border-left: 1px solid var(--tree-line-color);
    border-bottom: 1px solid var(--tree-line-color);
}

.dirtree ul li:after {
    position: absolute;
    left: calc(0em - var(--tree-line-length) - var(--tree-line-margin));
    top: 0em;
    height: 100%;
    content: '';
    border-left: 1px solid var(--tree-line-color);
}

.dirtree ul li:last-child:after {
    display: none;
}

