html {
    -webkit-text-size-adjust: 100%;
}

body {
    margin: 0;
    font:18px/1.5 sans-serif;
    background: #24292F;
}
main {
    display: block;
    background: white;
    color: #111;
    padding: 3em 0;
}

a {
    color: rgb(0, 0, 238);
    text-decoration: underline;
}

.container {
    /* optimal line length is 50-75 chars */
    max-width: 650px;
    margin-left:auto;
    margin-right:auto;
    padding-left:1em;
    padding-right:1em;
    clear: both;
}
.site-header {
    padding:1em 0;
}
.site-header h1, 
.site-header h3 {
    margin: 0 0 1em 0;
    font-size: 1em;
}
.site-header a{
    margin-right: 1em;
}
.site-header a {
    text-decoration: none;
    color: white;
}
.site-footer a {
    text-decoration: underline;
    color: white;
}
.site-header nav{
    display:inline-block
}
.site-header a:hover,
.site-header a:focus,
.site-footer a:hover {
    text-decoration:underline
}
.site-footer{
    font-size: 0.9em;
    margin: 3em 0 0;
    background: #24292F;
    color: white;
    padding-bottom: 3em;
}
.site-footer h3 { 
    margin-top: 0;
}
.site-footer svg{
    vertical-align:middle
}

b, strong {
    font-weight: bolder;
}
li {
    margin: 4px 0;
}
img{
    max-width:100%;
    height:auto
}
h1{
    line-height: 1.2;
    margin: 0;
    font-size: 26px;
}
h2,h3,h4,h5{
    line-height: 1.2;
    margin:3em 0 1em
}
p,blockquote,ul,table,pre,hr{
    margin:1em 0
}
ul{
    padding-left:1em
}
blockquote{
    background:#FFF8C5;
    padding:0 1em;
    border:1px solid rgba(212, 167, 44, 0.4);
}
hr{
    display: block;
    height: 1px;
    background: #EEE;
    border: 0; 
    margin:2em 0
}

code,
pre { 
    font-family: monospace, monospace;
    font-size: 16px;
    background: #EEE;
}

code {
    padding: 4px;
    border: 1px solid #CCC;
}

pre code{
    display:block;
    padding: 6px 10px;
    overflow-x:auto;
}

table{
    width: 100%;
    table-layout: auto;
    border-collapse:collapse;
    border: 1px solid #EEE;
    line-break: strict;
}

img {
    border: 0px solid #EEE;
}

th,
td{
    border: 0;
    text-align:left;
    padding: 4px 8px;
}

thead {
    background: #24292F;
    color: white;
}
tr:nth-child(even) {
    background: rgba(0, 0, 0, 0.02);
}
sub,
sup {
    font-size: 80%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
}
sub { bottom: -0.25em; }
sup { top: -0.5em; }
sup a {
    font-size: 0.8em;
    color: #24202F;
    vertical-align: text-top;
}

small {
    font-size: 80%;
}
small, 
small a{
    color: #555;
}

.icon:before {
    display: inline-block;
    width: 16px;
    height: 16px;
    content: " ";
    margin-right: 4px;
    vertical-align: middle;
}

.icon.sourcehut:before {
    background-image: url("data:image/svg+xml,%3Csvg height='16' viewBox='0 0 512 512' width='16' fill='%23828282' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M256 8C119 8 8 119 8 256s111 248 248 248 248-111 248-248S393 8 256 8zm0 448c-110.5 0-200-89.5-200-200S145.5 56 256 56s200 89.5 200 200-89.5 200-200 200z'%3E%3C/path%3E%3C/svg%3E");
}
.icon.github:before {
    background-image: url("data:image/svg+xml,%3Csvg aria-hidden='true' data-icon='github' role='img' xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' height='16' width='16'%3E%3Cpath fill='%23828282' d='M7.999,0.431c-4.285,0-7.76,3.474-7.76,7.761 c0,3.428,2.223,6.337,5.307,7.363c0.388,0.071,0.53-0.168,0.53-0.374c0-0.184-0.007-0.672-0.01-1.32 c-2.159,0.469-2.614-1.04-2.614-1.04c-0.353-0.896-0.862-1.135-0.862-1.135c-0.705-0.481,0.053-0.472,0.053-0.472 c0.779,0.055,1.189,0.8,1.189,0.8c0.692,1.186,1.816,0.843,2.258,0.645c0.071-0.502,0.271-0.843,0.493-1.037 C4.86,11.425,3.049,10.76,3.049,7.786c0-0.847,0.302-1.54,0.799-2.082C3.768,5.507,3.501,4.718,3.924,3.65 c0,0,0.652-0.209,2.134,0.796C6.677,4.273,7.34,4.187,8,4.184c0.659,0.003,1.323,0.089,1.943,0.261 c1.482-1.004,2.132-0.796,2.132-0.796c0.423,1.068,0.157,1.857,0.077,2.054c0.497,0.542,0.798,1.235,0.798,2.082 c0,2.981-1.814,3.637-3.543,3.829c0.279,0.24,0.527,0.713,0.527,1.437c0,1.037-0.01,1.874-0.01,2.129 c0,0.208,0.14,0.449,0.534,0.373c3.081-1.028,5.302-3.935,5.302-7.362C15.76,3.906,12.285,0.431,7.999,0.431z' /%3E%3C/svg%3E");
}
.icon.mastodon:before {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' fill='%23828282' viewBox='0 0 61 65'%3E%3Cpath d='M60.754 14.39C59.814 7.406 53.727 1.903 46.512.836 45.294.656 40.682 0 29.997 0h-.08C19.23 0 16.938.656 15.72.836 8.705 1.873 2.299 6.82.745 13.886c-.748 3.48-.828 7.338-.689 10.877.198 5.075.237 10.142.697 15.197a71.482 71.482 0 0 0 1.664 9.968c1.477 6.056 7.458 11.096 13.317 13.152a35.718 35.718 0 0 0 19.484 1.028 28.365 28.365 0 0 0 2.107-.576c1.572-.5 3.413-1.057 4.766-2.038a.154.154 0 0 0 .062-.118v-4.899a.146.146 0 0 0-.055-.111.145.145 0 0 0-.122-.028 54 54 0 0 1-12.644 1.478c-7.328 0-9.298-3.478-9.863-4.925a15.258 15.258 0 0 1-.857-3.882.142.142 0 0 1 .178-.145 52.976 52.976 0 0 0 12.437 1.477c1.007 0 2.012 0 3.02-.026 4.213-.119 8.654-.334 12.8-1.144.103-.02.206-.038.295-.065 6.539-1.255 12.762-5.196 13.394-15.176.024-.393.083-4.115.083-4.523.003-1.386.446-9.829-.065-15.017Z'/%3E%3Cpath fill='%23fff' d='M50.394 22.237v17.35H43.52V22.749c0-3.545-1.478-5.353-4.483-5.353-3.303 0-4.958 2.139-4.958 6.364v9.217h-6.835v-9.217c0-4.225-1.657-6.364-4.96-6.364-2.988 0-4.48 1.808-4.48 5.353v16.84H10.93V22.237c0-3.545.905-6.362 2.715-8.45 1.868-2.082 4.317-3.152 7.358-3.152 3.519 0 6.178 1.354 7.951 4.057l1.711 2.871 1.714-2.871c1.773-2.704 4.432-4.056 7.945-4.056 3.038 0 5.487 1.069 7.36 3.152 1.81 2.085 2.712 4.902 2.71 8.449Z'/%3E%3C/svg%3E");
}

.mb { margin-bottom: 40px; }

@media(min-width:620px) {
    /* move header inline on large screens */
   .site-header h1, 
   .site-header h3{ 
        display: inline-block; 
        margin: 0; 
    }
   .site-header nav{ 
        float: right;
    }
    .site-header nav a:last-child {
        margin-right: 0;
    }
    .footer-col { float: left; width:50%; padding-right: 20px; box-sizing: border-box; }
}