@font-face {
  font-family: "Kaffeesatz-Regular";
  src: local("Kaffeesatz-Regular"),
        url("kaffeesatz/YanoneKaffeesatz-Regular.otf") format("opentype");
}

@font-face {
  font-family: "Kaffeesatz-Light";
  src: local("Kaffeesatz-Light"),
        url("kaffeesatz/YanoneKaffeesatz-Light.otf") format("opentype");
}

@font-face {
  font-family: "Kaffeesatz-Thin";
  src: local("Kaffeesatz-Thin"),
        url("kaffeesatz/YanoneKaffeesatz-Thin.otf") format("opentype");
}

body {
    background-image: url("background.png");
    font-family: "Calibri", "DejaVu Sans", "Helvetica", sans-serif;
}

img {
    border: 0px;
}

label {
    font-style: italic;
    font-size: 0.7em;
}

#header {
    margin: 0 auto;
    width: 40em;
    text-align: center;
}

#navigation {
    margin: 0 auto;
    font-family: "Kaffeesatz-Light", "DejaVu sans", Helvetica, sans-serif;
    font-size: 2em;
    color: #fff;
    text-align: center;
    padding-bottom: 0em;
}

#navigation li {
    display: inline;
    padding-left: 1em;
    padding-right: 1em;
}

#navigation a {
    color: #fff;
    text-decoration: none;
}

#content-wrapper  {
    margin: 0 auto;
    width: 40em;
    background-color: white;
    box-shadow: 0 0 50px #000;
    -moz-box-shadow: 0 0 50px #000;
    -webkit-box-shadow: 0 0 50px #000;
    border-top-left-radius: 10px;
    -moz-border-radius-topleft: 10px;
    -webkit-border-top-left-radius: 10px;
    border-top-right-radius: 10px;
    -moz-border-radius-topright: 10px;
    -webkit-border-top-right-radius: 10px;
    border-bottom-left-radius: 10px;
    -moz-border-radius-bottomleft: 10px;
    -webkit-border-bottom-left-radius: 10px;
    border-bottom-left-radius: 10px;
    -moz-border-radius-bottomright: 10px;
    -webkit-border-bottom-right-radius: 10px;
}

.post {
    padding-bottom: 0em;
    font-family: "Calibri", "DejaVu Sans", "Helvetica", sans-serif;
    line-height: 1.5em;
    border-bottom: 2px solid #333;
    margin-bottom: 0.5em;
}

.post a img {
    margin: 0.5em;
    -moz-box-shadow: 0 0 12px #000;
    -webkit-box-shadow: 0 0 12px #000;
}

.post a:hover img {
    -moz-box-shadow: 0 0 24px #000;
    -webkit-box-shadow: 0 0 24px #000;
}

.post p {
    padding: 0.5em;
    padding-left: 1.5em;
    padding-right: 1.5em;
}

.post h3, .post h4, .post h5, .post h6{
    font-family: "Kaffeesatz-Thin", "DejaVu sans", Helvetica, sans-serif;
    font-size: 1.6em;
    margin-top: 0.8em;
    padding-left: 2em;
    padding-right: 1.5em;
    padding-top: 1.5em;
}

.post h4 {
    padding-top: 0em;
    font-size: 1.2em;
}

.post h5 {
    padding-top: 0em;
    font-size: 1em;
    font-weight: bold;
}

.post h6 {
    padding-top: 0em;
    font-size: 1em;
    font-style: italic;
}

.post h3 a {
    color: #000;
    text-decoration: none;
}

.post li, #comments ol li li {
    margin-left: 5em;
    margin-right: 1.5em;
}

.post a, #comments li a {

}

.post p a:hover, #comments li a:hover {

}

.more-link {
    background-color: #555;
    font-family: "Kaffeesatz-Light", "DejaVu sans", Helvetica, sans-serif;
    text-align: center;
    margin: 0em;
    display: block;
    margin-left: -1.5em;
    margin-right: -1.5em;
    margin-bottom: -0.5em;
    margin-top: 0.7em;

}

.post-about {
    background-color: #444;
    padding: 0.1em;
    padding-left: 1em;
    padding-right: 1em;
    font-size: 0.7em;
    color: #fff;
    line-height: 1.4em;
}

.post-about a {
    color: #fff;
    text-decoration: none;
}

blockquote {
    background-image: url("blockquote_right.png");
    background-position: top right;
    background-repeat: no-repeat;
    margin: 0.5em;
    margin-left: 1.5em;
    margin-right: 1.5em;
    border: 1px dotted #000;
    }

blockquote p {
    background-image: url("blockquote_left.png");
    background-position: bottom left;
    background-repeat: no-repeat;
    padding-left: 1em;
    padding-right: 1em;
    }

#comments {
    background-color: #555;

}

#comments h3 {
    font-family: "Kaffeesatz-Thin", "DejaVu sans", Helvetica, sans-serif;
    font-size: 1.6em;
    margin-top: 0.8em;
    padding-left: 2em;
    padding-right: 1.5em;
    padding-top: 0.5em;
    color: #fff;
}

#comments ol {
    margin-left: 2em;
    font-family: "Kaffeesatz-Light", "DejaVu sans", Helvetica, sans-serif;
    color: #222;
    font-size: 1.8em;
}

#comments ol li {
    background-color: #fff;
    border: 3px solid #444;
    /*border-radius: 5px;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;*/
    box-shadow: 0 0 30px #000;
    -moz-box-shadow: 0 0 30px #000;
    -webkit-box-shadow: 0 0 30px #000;
    margin: 1em;
    margin-top: 0.5em;
    margin-right: 4em;
    position: relative;
}

#comments ol li p, #comments ol li h4 {
    font-family: "Calibri", "DejaVu Sans", "Helvetica", sans-serif;
    color: #000;
    font-size: 0.5em;
    padding: 0.5em;
}

#comments ol li h4 {
    background-color: #333;
    color: #fff;
    font-weight: normal;
    font-size: 0.4em;
}

#comments ol li h4 a {
    color: #fff;
    text-decoration: none;
}

.avatar {
    position: absolute;
    display: block;
    top: 0.2em;
    right: -0.5em;
    border: 2px solid #333;
    border-radius: 3px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    box-shadow: 0 0 10px #000;
    -moz-box-shadow: 0 0 10px #000;
    -webkit-box-shadow: 0 0 10px #000;
}

#comment-post {
    font-family: "Calibri", "DejaVu Sans", "Helvetica", sans-serif;
    background-color: #525252;
    padding: 1em;
    color: #fff;
    padding-left: 3em;
    padding-right: 3em;
}

#comment-post p {
    margin: 0.5em;
}

#comment-post input, #comment-post textarea {
    font-family: "Calibri", "DejaVu Sans", "Helvetica", sans-serif;
    width: 75%;
}

#comment-post #submit {
    font-family: "Kaffeesatz-Light", "DejaVu sans", Helvetica, sans-serif;
    font-size: 1.1em;
    width: 76%;
}

#pages-navigation {
    background-color: #444;
    font-family: "Kaffeesatz-Thin", "DejaVu sans", Helvetica, sans-serif;
    text-align: center;
    font-size: 1.4em;
    padding: 0.2em;
}

#pages-navigation a, #footer a, .more-link {
    color: #fff;
    text-decoration: none;
}

#pages-navigation a:hover , #pages-navigation a:focus, #footer a:hover, #footer a:focus {
    color: #999;
    text-decoration: underline;
}

#twitter_status {
    position: fixed;
    right: 0px;
    bottom: 0px;
    text-align: right;
    z-index: 10;
}

#twitter_status img {
    cursor: crosshair;
}

#dudel-weltuntergang {
    position: absolute;
    top: 0em;
    left: 0em;
}


#footer {
    background-color: #333;
    font-family: "Kaffeesatz-Thin", "DejaVu sans", Helvetica, sans-serif;
    text-align: center;
    padding: 0.2em;
    font-size: 1.2em;
}
