html {
    margin: 0;
    background: #EEEEEE;
}
body { 
    margin: 0;
    padding: 0 1em;
    font-family: sans-serif;
    font-size: 80%;
    word-wrap: break-word;
}

hr {
    clear: both;
}
a {
    font-weight: bold;
}
a:link {
    text-decoration: none;
    color: #222299;
    font-weight: normal;
}
a:visited {
    color: #992222;
}
a:hover, a:focus {
    background: #EEEEEE;
}

.spoiler {
    background: #000000;
    color: #000000;
}
.spoiler:hover, .spoiler:focus {
    background: #000000;
    color: #FFFFFF;
}
.quote {
    color: #077;
}
.js {
    position: absolute;
    visibility: hidden;
}
.jsenabled .js {
    position: static;
    visibility: inherit;
}
.invisible {
    visibility: hidden;
}
.empty, .collapsed {
    display: none;
}

nav {
    overflow: hidden;
    background: #BBBBDD;
    padding: 0 1em;
    margin: 0 -1em;
    line-height: 1em;
}
ul.menu {
    margin: 0;
    padding: 0;
    float: left;
}
.menu.right {
    float: right;
}
.menu li {
    margin: 0;
    display: block;
    float: left;
}
nav a {
    display: block;
    padding: 0.5em;
}

.banner {
    text-align: center;
    margin: 1em;
}

.postarea {
    margin-bottom: 2em;
}
#postform {
    display: table;
    margin: 0 auto;
}

#postform input {
    font-size: 1em;
}
#postform textarea {
    font-size: 1.25em;
    margin: 0;
}
#postform input[type=text], #postform input[type=password] {
    height: 1.4em;
}
#postform input[type=text], #postform input[type=password], #postform textarea {
    border: 1px solid #313370;
    padding: 0.3em;
}
#postform input[type=text]:focus, #postform input[type=password]:focus, #postform textarea:focus {
    background: #ffd;
}

.postarea label {
    display: block;
    padding: 0.5em;
    height: 1em;
    font-weight: bold;
    color: #ffffff;
    background: #313370;
    border: 1px solid #313370;
}

.postform_inputs, .postform_commentbox {
    float: left;
    position: relative;
    border-spacing: 0 0.25em;
}

.postform_inputs {
    display: table;
}
.postform_inputs div {
    display: table-row;
    border-spacing: 0;
}
.postform_inputs div div {
    display: table-cell;
    vertical-align: middle;
}

.postform_inputs label {
}
.postform_inputs input {
    margin-right: 0.5em;
}
.postform_inputs input {
    width: 20em;
    border-left-width: 0;
}
.row_sage input {
    margin-left: 0.5em;
}

.postform_commentbox > div {
    margin-top: 0.25em;
}
.row_captcha, .row_files {
    display: table-row;
}
.row_captcha div, .row_files div, .row_submit div {
    display: table-cell;
    vertical-align: middle;
}
.row_captcha * { /* wtf */
    vertical-align: middle;
}
.row_captcha img {
    height: 2em;
}
.row_files input {
    margin-left: 0.5em;
}
.row_submit {
    position: absolute;
    bottom: 0;
    right: 0;
}
.row_submit div:first-child {
    visibility: hidden;
}

.postform_messages {
    clear: both;
}

.page_head h1 {
    text-align: center;
}

.thread {
    margin-bottom: 2em;
}
.thread article {
    position: relative;
}

.stub {
}
.full {
}
.thread_head {
    margin: 0;
    padding: 0.5em;
    background: #9999BB;
}
.thread_OP {
}
.thread_OP h1 {
    display: none;
}
.thread_OP .bullet {
    display: none;
}
.thread_OP .post {
    margin-left: 0;
    display: block;
}
.post_tools {
    display: inline-block;
    margin: 0 0.5em;
}
.post_tools span {
    display: inline-block;
}
.post_tools .text {
    margin-right: 1em;
}
.full .link_reply {
    display: none;
}
.link_reply {
    margin-left: 0.5em;
}
.icon a:link {
    font-weight: bold;
}
span.js::before {
    content: "÷ ";
}
span.link_reply::before {
    content: "» ";
}
span.icon::before {
    content: "";
}

.thread_reply {
    margin: 0.5em 0;
}

.bullet {
    float: left;
    line-height: 1em;
}
.bullet a {
    display: block;
    padding: 1em 0;
}
.bullet a:hover, .bullet a:focus {
    background: #FFFFFF;
}

.omittedposts {
    margin: 0.5em 0 0.5em 2em;
    color: #888888;
}

input[name=posts] {
    display: none;
    float: left;
    margin-top: 0.5em;
}
.thread_OP input[name=posts] {
    position: absolute;
}
input[name=posts]:checked {
    display: block;
}
input[name=posts]:checked + .bullet {
    display: none;
}
.post label, .thread_head label {
    cursor: pointer;
}
.postdata {
    display: block;
}

.post {
    margin-left: 2em;
    background: #AAAACC;
    display: table;
}
.post::after {
    content: "";
    display: block;
    clear: both;
}
.post header {
    padding: 1em;
    line-height: 1em;
}
.postername { 
    color: #3333CC;
    font-weight: bold;
}
article h1 {
    padding: 0;
    margin: 0 0 0.5em;
    font-size: 1.5em;
    color: #CC3333;
}

.post_files {
    display: table;
    border-spacing: 0.5em;
    margin-bottom: 0.5em;
    margin-top: -0.5em;
    position: relative;
}
.post_files.unary {
    float: left;
    margin-right: 1em;
}
.post_files.multiple {
}
.post_files.empty {
    display: none;
}
figure {
    background: #9999BB;
    display: table-cell;
    margin: 0;
}
figure:hover, figure:focus {
    background: #BBBBDD;
}
figure:hover .metadata, figure:focus .metadata {
    visibility: visible;
}
figure:hover .metadata {
    z-index: 2;
}
.filename, .thumbnail, figcaption {
    background: inherit;
}
.filename, .thumbnail {
    max-width: 200px;
    margin: 0.5em 0.5em 0;
}
.filename a {
    display: block;
}
.thumbnail img {
    display: block;
    max-height: 200px;
    margin: 0 auto;
}
.thumbnail a {
    display: inline-block;
    max-width: 100%;
}
figcaption {
    position: relative;
    margin: 0;
}
.filesize {
    padding: 0.5em;
    text-align: center;
}
.metadata {
    visibility: hidden;
    position: absolute;
    min-width: 100%;
    background: inherit;
    z-index: 1;
    border-spacing: 0.5em;
}
.metadata tr {
    vertical-align: top;
}
.metadata td:first-child {
    font-weight: bold;
}

.post_text {
    margin: 0 1em;
    padding-bottom: 1em;
}

.catalog {
    text-align: center;
}
.teaser {
    width: 210px;
    display: inline-block;
    vertical-align: top;
    max-height: 400px;
    overflow: hidden;
    position: relative;
    border: 1px solid black;
}
.teaser a {
    display: block;
    background: none;
    height: auto;
    color: #000;
}
.teaser * {
    background: none;
}
.teaser h1 {
    font-size: 1em;
    display: block;
}
.teaser header {
    padding: 0;
}
.teaser header a {
    display: block;
}
.teaser .post_country {
    float: left;
}
.teaser:hover, .teaser:focus {
    overflow: visible;
    z-index: 1;
}
.teaser:hover .post, .teaser:focus .post {
    background: #AAAACC;
}
.teaser:hover .thread_tools, .teaser:focus .thread_tools {
    visibility: visible;
}
.teaser .text {
    display: none;
}
.teaser .thread_tools {
    position: absolute;
    top: 0.5em;
    right: 0.5em;
    visibility: hidden;
}
.teaser .post_files {
    float: none;
    display: block;
    margin: 0.5em 0;
    word-spacing: -0.1em; /* hack, probably brittle */
}
.teaser figure {
    display: block;
    margin: 0;
    background: none;
}
.teaser figure + figure {
    width: 32%;
    display: inline-block;
}
.teaser figure + figure img {
    width: 100%;
}
.teaser .omittedposts {
    margin: 0.5em 0;
}
.teaser .post {
    padding: 5px;
}
.teaser .post_text {
    margin: 0;
    text-align: left;
}
.teaser .thumbnail {
    margin: 0;
    padding: 0;
    line-height: 0;
}
.teaser .thumbnail img {
    display: inline-block;
}

.page_tools::after {
    content: "";
    display: block;
    clear: both;
}
.page_tools nav {
    margin: 0;
    float: left;
}
.page_tools > * {
    margin-bottom: 0;
}
li.pages_catalog {
    margin-left: 0.5em;
}
.pages_next {
}
.page_actions {
    float: right;
    text-align: right;
}
footer {
    text-align: center;
}

#mngform {
    float: right;
    border-spacing: 0.25em 0;
}
#mngform > div {
    float: left;
    margin-left: 0.5em;
}
#mngform .fieldset {
    display: table;
    border-spacing: 0;
    border: 1px solid #313370;
    background: #EEEEEE;
}
.fieldset > div {
}
.legend {
    display: table-cell;
    font-weight: bold;
    color: #ffffff;
    background: #313370;
    padding: 0 0.5em;
    cursor: pointer;
}
#mngform .buttons {
    display: none;
    padding: 0.25em;
}
.buttons label {
    display: inline-block;
}
#mngform input:checked ~ .buttons {
    display: table-cell;
}
#mngform input[name=tasks] {
}
#mngform input[type=submit] {
}
#mngform .textarea {
}
#mngform textarea {
    margin: 0;
    padding: 0;
    height: 1.5em;
    resize: none;
}
#mngform .select::before {
    content: " • ";
}
#mngform textarea:focus {
    height: 4.5em;
    resize: horizontal;
}

/** interactive styles */
/* tooltips */
.tooltip {
    padding: 0.25em;
    background: #E2E7FF;
    border: 1px solid #888;
    float: left;
    box-shadow: 3px 3px 0 0 rgba(0,0,0,0.5);
    position: absolute;
    z-index: 20;
}

/* hiding */
.hidden, .hidden h1 {
    color: gray;
}
.hidden a:hover, .hidden a:focus {
    background: #FFFFFF;
}
.hidden * {
    background: none;
}
.hidden .postername {
}
.thread.hidden .thread_reply, .thread.hidden .omittedposts, .hidden input[name="posts"], .hidden .post_body {
    display: none;
}
.hide_reason:not(:empty)::before {
    content: "[hidden: "
}
.hide_reason:not(:empty)::after {
    content: "]";
}

span.link_show, span.link_show_recursive, span.link_kill, span.link_kill_recursive {
    display: none;
}
.hidden span.link_show, .hidden span.link_show_recursive, .hidden span.link_kill, .hidden span.link_kill_recursive {
    display: inline-block;
}
.hidden span.link_reply, .hidden span.link_hide, .hidden span.link_hide_recursive, .hidden span.link_translate, .hidden span.link_watch {
    display: none;
}

.killed, .killed + hr {
    display: none;
}

/* preview */
:target .post, .highlight .post {
    background: #BBBBDD;
}
:target figure, .highlight figure {
    background: #AAAACC;
}

.progress {
    cursor: progress;
}

a.thread_OP::after {
    content: " (OP)";
}
#preview {
    margin-right: 0.5em;
    box-shadow: 1px 2px 2px 1px gray;
    z-index: 10;
}
#preview.hidden {
    visibility: hidden;
}
#preview .bullet, #preview input {
    display: none;
}
#preview .thread_reply {
    margin: 0;
}
#preview .post {
    margin: 0;
}
#preview .thread_OP .postername::after {
    content: " (OP)";
}

.cache {
    position: absolute;
    top: -100000px;
    visibility: hidden;
}

/* context */
.ancbox {
    border-width: 1px 0 0 1px;
}
.desbox {
    border-width: 0 0 1px 1px;
}
.context {
    position: relative;
    margin-left: 2em;
    border-color: lightgray;
    border-style: solid;
}
.context:empty {
    height: 1em;
}
.context article {
    margin: 0.5em;
}
.context .thread_OP {
}
.context .thread_OP .postername::after {
    content: " (OP)";
}

.context .post {
    display: table;
    margin-left: 2em;
}
.context .bullet {
    display: block;
}
/*
.thread_OP .post {
    margin-left: 0;
    display: block;
}
*/

.replaced {
    color: gray;
    background: none;
    padding: 0 1em;
}
.context .replaced {
    margin-left: 0;
}
.replaced a:hover, .replaced a:focus {
    background: #FFFFFF;
}

/* manageform */
.jsenabled #toolbox {
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 0.5em 1em 0;
    background: #9999BB;
    border-top: 0.5em solid #313370;
    z-index: 7;
}
#toolbox_manage, #toolbox_logbox {
    margin-bottom: 0.5em;
    overflow: hidden;
}
#toolbox_a {
    float: left;
}
#toolbox_references {
    display: inline-block;
}
#toolbox .ip::before {
    content: "[";
}
#toolbox .ip::after {
    content: "]";
}
#toolbox abbr {
    border: none;
}

/* logging */
#log_clear {
    display: block;
}
#toolbox_logbox {
    text-align: left;
    margin-bottom: 0.5em;
}
#toolbox_logbox label {
    float: left;
}
#toolbox_log {
    max-height: 5em;
    overflow-y: auto;
}
#toolbox_log > div {
    height: 1.5em;
    background: #EEEEEE;
    margin-left: 0.5em;
    padding: 0 0.5em;
}
#toolbox_log .error {
    color: red;
}

/* image expansion */
.hasexpanded, .hasexpanded .post_files {
    display: block;
    float: none;
    margin-right: 0;
}
.hasexpanded figure {
    vertical-align: top;
    display: inline-block;
    margin: 0.5em 0;
}
figure.expanded {
}
.expanded img, .expanded .thumbnail, .expanded {
    max-height: none;
    max-width: 100%;
    margin: 0;
}
.expanded .thumbnail {
    margin: 0.5em;
}
.expanded .smallthumb {
    visibility: hidden;
    position: absolute;
}
.expanded .metadata {
    visibility: visible;
    position: static;
}
.expanded figcaption, .expanded .filename {
    max-width: none;
}

/* replies */
.post_replies {
    font-size: 84%;
    border-top: 1px solid gray;
    display: table;
    clear: left;
    margin: 0 1.2em;
    padding-bottom: 0.6em;
}

.post_replies .reflink + .reflink:before {
    content: ", ";
}

/* thread expansion */
.omittedposts a:hover, .omittedposts a:focus {
    background: #FFFFFF;
}
.omittedposts .link_condensethread {
    display: none;
}
.omittedposts.shown .link_condensethread {
    display: inline;
}
.omittedposts.shown .link_expandthread, .omittedposts.shown .omitted_text {
    display: none;
}

/* settings */
#settings {
    position: absolute;
    right: 0.5em;
    padding: 0.5em;
    overflow: auto;
    background: #BBBBDD;
    z-index: 9;
}
