ernst phutaba css

/* media query */
@media only screen and (max-width: 480px) {

.desktop {
    display: none;
}

.mobile {
    display: inline!important;
}

.postarea td {
    width: 95%;
    float: left;
}

.postarea textarea {
    width: 100%;
}

.thread_reply .post {
    margin-left: 0em!important;
}

.thread_reply  {
    float: none!important;
}

}

/* default styles */
html, body, ul, ol, p, pre, table, td, img {
    margin: 0;
    padding: 0;
    border: 0;
    /* linux cannot render fonts without help */
    text-rendering: optimizeLegibility;
    font-variant-ligatures: common-ligatures;
    font-kerning: normal;
}

*:focus {
    outline: 0;
}

strong, b, .boardname, .caption, .subject, .postblock, .postername, .teampost, .sage, .ban, .user_banned, .title, .info th, .dellist {
    font-weight: bold;
}

em, i, .omittedposts, .notice, .slogan {
    font-style: italic;
}

.slogan {
    font-size: 1.2em;
}

hr {
    border: none;
    border-top: 1px solid #706B5E;
    margin: 1em 0 1em 0;
    clear: both;
}

code, pre {
    font: normal 10pt monospace;
}

ul {
    list-style-type: square;
}

td, th {
    display: table-cell;
    vertical-align: middle;
}

body {
    background-color: #ECE9E2;
    color: #000000;
    font: normal 0.8em sans-serif;
}

a:link, a:visited, a:hover {
    color: #702802;
    /*text-decoration: underline;*/
}

a:hover {
    text-decoration: none;
}

a:active {
    position: relative;
    top: 1px;
}

.content {
    margin: 0 1em;
}

/* top and bottom navigation menus */
ul.menu, ul.menu_bottom {
    margin-left: 0;
}

ul.right {
    float: right;
    margin-right: 0;
}

ul.menu li, ul.menu_bottom li, ul.pagelist li {
    display: inline;
}

ul.menu li a, ul.menu_bottom li a {
    background-color: #D7CFC0;
    color: #000000;
    font-weight: bold;
    text-decoration: none;
    padding: 0.5em;
    margin-right: 0.5em;
    float: left;
}

ul.menu li a {
    border-right: 1px solid #706B6E;
    border-bottom: 1px solid #706B5E;
    border-left: 1px solid #706B5E;
    border-bottom-right-radius: 0.5em;
    border-bottom-left-radius: 0.5em;
}

ul.menu_bottom li a {
    border-top: 1px solid #706B5E;
    border-right: 1px solid #706B6E;
    border-left: 1px solid #706B5E;
    border-top-right-radius: 0.5em;
    border-top-left-radius: 0.5em;
}

ul.menu li a:hover, ul.menu_bottom li a:hover {
    box-shadow: 1px 1px 2px #999999;
}

ul.menu li a:active, ul.menu_bottom li a:active {
    top: 0;
}
/* navigation menus END */

/* catalog styles */
.catalog {
    width: 240px;
    height: 260px;
    display: inline-block;
    font-size: 0.9em;
    overflow: hidden!important;
    position: relative;  /* allow freely placed lables */
    text-align: left;    /* revert center from container div */
    vertical-align: top; /* safari inline-block fix */
}
.catalog a, .catalog a:hover {
    text-decoration: none;
}
/* catalog styles END */

.header {
    text-align: center;
}

.banner {
    padding-top: 1em;
    clear: both;
}

.banner img {
    width: 300px;
    height: 100px;
}

.teampost img, .sticky img, .locked img {
    width: 16px;
    height: 16px;
}

.boardname, .caption {
    color: #333333;
    font-size: 2em;
    margin-top: 0.5em;
}

.postarea {
    text-align: center;
}

.postarea table {
    text-align: left;
    margin: 0 auto;
    border-spacing: 0.25em;
}

.postarea #fileInput img:hover {
    cursor: pointer;
}

.postblock {
    background-color: #706B5E;
    color: #FFFFFF;
    padding: 0.5em;
}

.postarea input[type='checkbox'], .postarea input[type='radio'] {
    margin: 5px;
}

.postarea input#name, .postarea input#subject {
    width: 20em;
}

.comment img {
}

input[type='text'], input[type='password'], textarea {
    background-color: #FFFFFF;
    font-family: monospace;
    border: 1px solid #706B5E;
    padding: 0.25em;
}

input[type='submit']:hover {
    cursor: pointer;
}

.trap, .hidden, .mobile {
    display: none;
}

ul.rules {
    margin-top: 1em;
    margin-left: 1.6em;
}

.doubledash {
    float: left;
    margin-top: 0.5em;
}

.doubledash a:link, .doubledash a:visited {
    color: #707070;
    text-decoration: none;
}

.doubledash a:hover {
    color: #000000;
}

.thread {
    overflow: hidden;
}

.thread_reply {
    float: left;
    clear: both;
}

.thread_reply .post {
    margin-left: 2em;
}

.post {
    background-color: #D7CFC0;
    border-right: 1px solid #BFB5A1;
    border-bottom: 1px solid #BFB5A1;
    margin-bottom: 0.5em;
    overflow: auto;
}

.post_new {
    border-right: 1px solid #B20000;
    border-bottom: 1px solid #B20000;
}

:target .filedeleted {
    color: #BFB5A1;
}

.thread_head {
    clear: left;
    background-color: #BFB5A1;
    padding: 5px;
}

.reflink a, .filename a, .filetype a, .togglethread a {
    color: #000000;
    text-decoration: none;
}

.reflink a:hover, .filename a:hover, .filetype a:hover {
    text-decoration: underline;
}

.post_head {
    padding: 0.4em 0.4em 0.1em 0.4em;
}

.subject {
    color: #B20000;
    font-size: 1.2em;
}

.postername {
    color: #635537;
}

.postername .tripcode {
    font-weight: normal;
}

.teampost {
    color: #A000CC;
}

.backreflink del {
    color: #702802;
}

.sticky {
}

.locked {
}

.sage {
    color: #B20000;
}

.post_body {
    padding: 1.2em 0 0 1.2em;
}

.file_container {
    float: left;
}

.file {
    background-color: #BFB5A1;
    text-align: center;
    margin: 0 1.2em 1.2em 0;
    float: left;
    display: block;
    vertical-align: top;
}

.filesize {
    font-size: 0.85em;
}

.filelink a img {
    display: block;
    margin: 0 auto;
}

.filelink a:active {
    top: 0;
}

.filetype, .filedeleted {
    font: bold 2em sans-serif;
    width: 200px;
    padding: 0.5em 0 0.5em 0;
}

.filebg {
    background-image: url("/img/erna-klein.png");
    background-position: bottom left;
    background-repeat: no-repeat;
}

.filedeleted {
    color: #D7CFC0;
}

.text {
    margin: 0 2em 1.2em 1.2em;
}

.text ul li, .text ol li {
    list-style-position: inside;
}

blockquote.unkfunc, span.quote {
    color: #BD3000;
    margin: 0;
}

blockquote.gruen, span.quote {
    color: #789922;
    margin: 0;
}

.spoiler {
    background-color: #000000;
    color: #000000;
    text-shadow:none;
}

.spoiler a {
    color: #000000;
}

.spoiler:hover, .spoiler a:hover {
    color: #FFFFFF;
}

.ban, .tldr, .user_banned {
    margin-top: 1em;
    padding-top: 0;
}

.ban, .user_banned {
    color: #B20000;
    text-transform: uppercase;
}

.omittedposts, .notice {
    color: #707070;
    margin-left: 2em;
}

.omittedposts {
    margin-bottom: 0.5em;
}

.notice img {
    vertical-align: middle;
}

.notice span {
    padding: 0 0.5em;
    border-right: 1px solid #B20000;
    border-bottom: 1px solid #B20000;
}

.togglethread a:hover, .togglethread img:hover {
    cursor: pointer;
}

ul.pagelist {
    background-color: #D7CFC0;
    border-right: 1px solid #BFB5A1;
    border-bottom: 1px solid #BFB5A1;
    padding: 0.5em;
    margin: 0 1em 0 0;
    float: left;
}

.delete {
    float: right;
}

input[type='password'] {
    width: 8em;
}

.passvalid {
    background-color: #706B5E;
    color: #FFFFFF;
    font-weight: bold;
    text-align: center;
    padding: 5px;
    margin: 5px 0;
}

.managehead th, .row1 td, .row2 td {
    padding: 5px;
}

.managehead {
    background-color: #706B5E;
    color: #FFFFFF;
    font-weight: bold;
    text-align: center;
}

.managearea {
    text-align: center;
}

.managearea table {
    margin: 1em;
    border-spacing: 0.25em;
}

.managechild {
    display: inline-block;
    text-align: left;
}

.row1 {
    background-color: #D7CFC0;
}

.row2 {
    background-color: #BFB5A1;
}

/* for static templates in tpl/ */
.title, .info th {
    background-color: #706B5E;
    color: #FFFFFF;
    font-weight: bold;
    padding: 5px;
}

.info {
    background-color: #D7CFC0;
    border-right: 1px solid #BFB5A1;
    border-bottom: 1px solid #BFB5A1;
    border-left: 1px solid #BFB5A1;
    padding: 1em;
    margin: 0 0 0.5em 0;
}

.info table {
    margin-top: 1em;
}

.info td {
    text-align: center;
    border: 1px solid #706B5E;
    padding: 5px;
}
/* static templates END */

.error {
    color: #B20000;
    font-size: 1.5em;
    text-align: center;
}

footer {
    text-align: center;
    padding: 1em 0 1em 0;
    clear: both;
}

footer img {
    vertical-align: middle;
}

/* stuff for context.js */
#ancbox {
    padding-top: 0.5em;
    padding-left: 0.5em;
    padding-right: 0.5em;
    bottom: 0.25em;
    box-shadow: 0 0 0 100000px rgba(112, 107, 94, 0.5);
}
#desbox {
    top: -0.25em;
}
.context {
    position: relative;
    clear: left;
}
.context > div, #preview {
    border: 1px solid rgb(99, 85, 55);
    background-color: rgb(236, 233, 226);
    position: absolute;
    left: 10em;
}
#preview {
    box-shadow: 1px 2px 2px #706B5E;
}
#preview .post {
    margin-bottom: 0;
    border-color: #BFB5A1;
}
#post_cache {
    visibility: hidden;
    position: absolute;
    top: -100000px;
}

/* TODO integrate colours into specific stylesheets */
.highlight .post, :target .post {
    background-color: #BFB5A1;
}

.highlight .post .file, :target .post .file {
    background-color: #D7CFC0;
}

#styleSwitcher {
    float: right; !important
}