html {
    overflow-y: scroll
}

:root {
    --bgcolor: white;
    --fontcolor: #444;
    --linkcolor: #00e;
    --visitedcolor: #551a8b;
    --precolor: #000;
    --prebgcolor: #EDF0F2;
}

hr {
    border-style: dashed;
    color: #ddd;
}

/* @media (prefers-color-scheme: dark) {
    :root {
        --bgcolor: black;
        --fontcolor: white;
        --linkcolor: #5bf;
        --visitedcolor: #ae5ee0;
        --precolor: #fff;
        --prebgcolor: #383838;
    }
} */

body {
    /* border-top-style: solid;
    border-top-color: #258852;
    border-top-width: 5px; */
    margin: 0px;
}

.realbody {
    max-width: 700px;
    margin: 0px auto;
    padding: 20px 0px;
    font-size: 16px;
    font-family: Optima, Candara, Calibri, Arial, sans-serif;
    color: var(--fontcolor);
    background: var(--bgcolor);
    text-align: justify;
    text-justify: inter-ideograph;
}



a {
    color: #258852;
    text-decoration: none;
}

/* a:link {
    color: var(--linkcolor)
}

a:visited {
    color: var(--visitedcolor)
}

a:active {
    color: var(--visitedcolor)
} */

h1,
h2,
h3,
h4 {
    line-height: 1.2
}

.ul-list {
    list-style-type: none;
    padding-inline-start: 0px;
    line-height: 1.5;
}

p>code {
    color: var(--precolor);
    background: var(--prebgcolor);
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 4px;
}

li>code {
    color: var(--precolor);
    background: var(--prebgcolor);
    padding-left: 3px;
    padding-right: 3px;
    border-radius: 4px;
}

pre {
    color: var(--precolor);
    background: var(--prebgcolor);
    padding: 20px;
    overflow-x: auto;
    border-radius: 2px;
    font-size: 14px;
    line-height: 1.3;
}

article {
    padding: 0px 0;
    line-height: 1.5
}

.center {
    display: block;
    margin-left: auto;
    margin-right: auto;
    width: 100%;
}

figcaption {
    color: #888;
    font: 12px/1.5 monospace;
    text-align: center;
}

figure {
    margin: auto
}

img {
    display: block;
    max-width: 100%;
    height: auto;
    margin: auto
}

.chroma {
    border-radius: 10px;
    font-family: ui-monospace, SFMono-Regular, SF Mono, Menlo, Consolas, Liberation Mono, monospace;
}

blockquote {
    border-left: 3px solid #258852;
    padding: 0 1.4em;
    color: #666;
    margin: 0 2px;
    quotes: "\201C" "\201D" "\2018" "\2019";
}

/* Footer */
footer {
    display: flex;
    align-items: center;
    padding: .0rem 0rem;
    margin-top: 8px;
}

.soc {
    display: flex;
    align-items: center;
    border-bottom: none;
}

.border {
    margin-left: 0.5rem;
    margin-right: 0.5rem;
    border: 1px solid;
}

.footer-info {
    padding: var(--footer-padding);
}

svg{
    max-height: 15px;
}