/* 1em = 16px */

body {
    font-family: "Georgia";
    background: #fff;
}

#wrap {
    position: relative;
    width: 50em;
    max-width: 95%;
    margin: 2em auto;
}

#content_wrap {
    padding-top: 6.5em;
}

#nav {
    position: absolute;
    top: 4em;
    left: 18.5em;
    font-family: "Gill Sans";
    font-size: 0.875em;
}

#nav h2 {
    display: inline;
    font-variant: small-caps;
    margin: 0 0.5em 0 0;
}

#nav ul,
#nav ol {
    display: inline;
}

#nav li {
    display: inline;
}

#nav li + li:before {
    content: ' • ';
    color: #444;
}

#logo {
    position: absolute;
    top: 0;
    left: 0;
}

#logo span {
    display: none;
}

#logo a {
    display: block;
    width: 245px;
    height: 100px;
    border: 0;
    background: url("/images/zognot.png") no-repeat;
}

a {
    border-bottom-width: 1px;
    border-style: dotted;
    text-decoration: none;
}

a:hover {
    border-style: solid;
}

.photostream a {
    border: 0;
}

.post {
    text-align: justify;
    margin-bottom: 2em;
}

.post h1 {
    font-size: 1.5em;
    line-height: 1.5em;
}

h2 {
    font-size: 1.25em;
    color: #444;
}

.post .timestamp {
    font-size: 0.75em;
    line-height: 1.5em;
    color: #666;
    margin: 0 0 1.5em;
}

ol.comments > li {
    border: 1px solid #eee;
    margin: 1em 0;
    padding: 0.5em;
}

ol.comments .timestamp {
    margin-bottom: 0.5em;
}

ol.comments .timestamp a,
h2 a {
    border: 0;
    color: inherit;
}

form.comments textarea {
    width: 100%;
    height: 10em;
}

input[type=text], textarea {
    font-family: "Andale Mono", monospace;
    font-size: 1em;
}

p + p {
    margin-top: 0.5em;
    text-indent: 1em;
}

pre, blockquote {
    margin: 1em 0;
    padding: 0.5em;
    border: 1px solid #eee;
}