@font-face {
    font-family: 'ProggyTinyTT';
    src: url('font/ProggyTinyTT.eot?#iefix') format('embedded-opentype'),  url('font/ProggyTinyTT.woff') format('woff'), url('font/ProggyTinyTT.ttf')  format('truetype'), url('font/ProggyTinyTT.svg#ProggyTinyTT') format('svg');
    font-weight: normal;
    font-style: normal;
}

html, body {
    width: 100%;
    max-width: 720px;
    height: 100%;

    font-family: ProggyTinyTT, sans-serif;
    font-kerning: none;
    font-size: 26px;

    padding: 8px;
    margin: 0 auto;

    line-height: 0.75em;

    background: #000;
    color: #ccc;

    scrollbar-color: #282828 #181818;
}

* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;

    -webkit-user-select: text;
    -moz-user-select: text;
    -ms-user-select: text;
}

::-moz-selection { background: #ff0; color: #000; }
::-webkit-selection { background: #ff0; color: #000; }
::selection { background: #ff0; color: #000; }

header, section, footer {
    padding: 16px 0;
}

p {
    padding: 16px 0;
}

a {
    font-weight: 300;

    color: #888;
    text-decoration: none;
}

a:visited {
    color: #555;
}

a:hover, a:active {
    color: #aaa;
    text-decoration: underline;
}

a:focus {
    background: #ff0;
    color: #000;
}

a.unstyled-link {
    font-size: inherit;
    text-transform: inherit;
    font-weight: inherit;
    background: inherit;
    border: none;
    color: inherit;
    padding: inherit;
    margin: inherit;
}

a.unstyled-link:hover {
    text-decoration: underline;
}

a[href*="//"]:not([href*="demonastery.org"]):after {
    margin-left: 4px;
    position: relative;
    top: 4px;
    content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABAAAAAQCAYAAAAf8/9hAAAAO0lEQVQ4jWNgIBGkpaX9R8ak6scwhLoGoDsPm0JcbOwCWGwm6DSyNeNThNfZpNoyagARBhCDCVkyxAAAkLlkz2B7mCMAAAAASUVORK5CYIIA);
}

i, em {
    color: #aaa;
}

ul {
    list-style: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAgAAAAICAYAAADED76LAAAAAXNSR0IArs4c6QAAACJJREFUGJVjYKA5YIQxQkND/yNLrF69mpGBgYGBifZuIAgATLMEBNiAzw0AAAAASUVORK5CYII=);
    list-style-position: inside;
}

ul.inline {
    padding-left: 0;
}

ul.inline li {
    display: inline-block;
}

ul.indent li {
    padding-left: 16px;
}

ul.unstyled {
    list-style: none;
}

h1 {
    font-size: 1.5em;
}

h2 {
    font-size: 1.2em;
}

#header {
    border-bottom: 1px solid #333;
}

#header h1 {
    margin-bottom: 2px;
}

#header h2 {
    margin-left: 16px;
}

#footer {
    margin: 16px 0;
    padding: 16px 0;
    border-top: 1px solid #333;
}

.published {
    color: #aaa;
    font-size: 0.9em;
    margin-left: 8px;
}

.post-title {
    padding: 0 !important;
}

.post-header h3 {
    margin-bottom: 0;
}

.post-header .published {
    color: #666;
    margin-left: 0;
}

.post-content {
    font-size: 0.9em;
}

.post-mini {
    margin-bottom: 16px;
}

.post-excerpt {
    font-size: 0.8em;
}

code {
    font-family: ProggyTinyTT, monospace;
    font-size: 1.0em;
    font-weight: 400;
    padding: 2px 4px;
    background: #181818;
    color: #888;
}

pre {
    margin: 16px 0;
    line-height: 0.8em;
    font-size: 1.1em;
    padding: 16px;
    background: #181818;
    color: #888;
    overflow: auto;
}

.draft {
    color: #f00;
    text-transform: uppercase;
}

img {
    max-width: 100%;
}

#page {
    font-size: 1.1em;
}

#page h1,
#page h2,
#page h3,
#page h4,
#page h5,
#page h6 {
    margin-top: 4px;
    margin-bottom: 4px;
    padding-top: 32px;
}

dd {
    padding: 8px;
    margin-left: 8px;
}

#footer {
    text-align: center;
}

#latest-post {
    background: #111;
    padding: 16px;
    margin: 16px 0;
}

code .k { color: #777; }
code .p { color: #444; }
code .o { color: #777; }
code .c1 { color: #555; }
code .cm { color: #555; }
code .n { color: #aaa; }
code .nv { color: #888; }
code .mi { color: #ccc; }
code .s1, code .s2 { font-style: italic; color: #ccc; }