* { box-sizing: border-box; -moz-box-sizing: border-box; -webkit-box-sizing: border-box; } body { font-family: arial; } /* Patch for Edge */ @supports (-ms-ime-align:auto) { .user_content { font-family: Segoe UI Emoji, arial; } } /*.move_left{float: left;position: relative;left: 50%;} .move_right{float: left;position: relative;left: -50%;}*/ ul { padding-left: 0px; padding-right: 0px; height: 28px; list-style-type: none; border: 1px solid #ccc; } li { height: 26px; padding-left: 10px; padding-top: 5px; padding-bottom: 5px; font-weight: bold; text-transform: uppercase; } li:hover { background: rgb(250,250,250); } li a { text-decoration: none; color: #515151; } /*li a:hover { color: #7a7a7a; }*/ .menu_left { float: left; border-right: 1px solid #ccc; padding-right: 10px; } .menu_right { float: right; border-left: 1px solid #ccc; padding-right: 10px; } .container { width: 90%; padding: 0px; margin-left: auto; margin-right: auto; } .rowblock { border: 1px solid #ccc; width: 100%; padding: 0px; padding-top: 0px; } .rowblock:empty { display: none; } .colblock_left { border: 1px solid #ccc; padding: 0px; padding-top: 0px; width: 30%; float: left; margin-right: 8px; } .colblock_right { border: 1px solid #ccc; padding: 0px; padding-top: 0px; width: 65%; overflow: hidden; word-wrap: break-word; } .colblock_left:empty { display: none; } .colblock_right:empty { display: none; } .rowitem { width: 100%; padding-left: 8px; padding-right: 8px; padding-top: 17px; padding-bottom: 12px; font-weight: bold; text-transform: uppercase; } .rowitem.passive { font-weight: normal; text-transform: none; } .rowitem:not(:last-child) { border-bottom: 1px dotted #ccc; } .rowitem a { text-decoration: none; color: black; } .rowitem a:hover { color: silver; } .col_left { width: 30%; float: left; } .col_right { width: 69%; overflow: hidden; } .colitem { padding-left: 8px; padding-right: 8px; padding-top: 17px; padding-bottom: 12px; font-weight: bold; text-transform: uppercase; } .colitem.passive { font-weight: normal; text-transform: none; } .colitem a { text-decoration: none; color: black; } .colitem a:hover { color: silver; } .formrow { /*height: 40px;*/ width: 100%; } /*Clearfix*/ .formrow:before, .formrow:after { content: " "; display: table; } .formrow:after { clear: both; } .formrow:not(:last-child) { border-bottom: 1px dotted #ccc; } .formitem { float: left; padding-left: 8px; padding-right: 8px; padding-top: 13px; padding-bottom: 8px; font-weight: bold; } .formitem:first-child { font-weight: bold; } .formitem:not(:last-child) { border-right: 1px dotted #ccc; } .formitem.invisible_border { border: none; } /* Mostly for textareas */ .formitem:only-child { width: 97%; } .formitem textarea { width: 100%; height: 100px; } .formitem:has-child() { margin: 0 auto; float: none; } button { background: white; border: 1px solid #8e8e8e; } /* Topics */ .topic_status { text-transform: none; margin-left: 8px; padding-left: 2px; padding-right: 2px; padding-top: 2px; padding-bottom: 2px; background-color: #E8E8E8; /* 232,232,232. All three RGB colours being the same seems to create a shade of gray */ color: #505050; /* 80,80,80 */ border-radius: 2px; } .topic_status:empty { display: none; } .username { text-transform: none; margin-left: 0px; padding-left: 4px; padding-right: 4px; padding-top: 2px; padding-bottom: 2px; color: #505050; /* 80,80,80 */ background-color: #FFFFFF; border-style: dotted; border-color: #505050; /* 232,232,232. All three RGB colours being the same seems to create a shade of gray */ border-width: 1px; font-size: 15px; } button.username { position: relative; top: -0.25px; } .tag-mini { text-transform: none; margin-left: 0px; padding-left: 3px; padding-right: 3px; padding-top: 1.5px; padding-bottom: 0px; color: #505050; /* 80,80,80 */ background-color: #FFFFFF; border-style: dotted; border-color: #505050; /* 232,232,232. All three RGB colours being the same seems to create a shade of gray */ border-width: 1px; font-size: 10px; } .show_on_edit { display: none; } .alert { display: block; padding: 5px; margin-bottom: 10px; border: 1px solid #ccc; } .alert_success { display: block; padding: 5px; border: 1px solid A2FC00; margin-bottom: 10px; background-color: DAF7A6; } .alert_error { display: block; padding: 5px; border: 1px solid #FF004B; margin-bottom: 8px; background-color: #FEB7CC; } /* Tempra Conflux */ .user_content { padding: 5px; margin-top: 3px; margin-bottom: 0; background: white; min-height: 129px; padding-bottom: 0; width: 100%; } .button_container { border-top: solid 1px #eaeaea; border-spacing: 0px; border-collapse: collapse; padding: 0; margin: 0; margin-top: 3px; display: block; height: 20px; } .action_button { display: block; float: left; border-right: solid 1px #eaeaea; color: #505050; font-size: 13px; padding-top: 2px; padding-bottom: 2px; padding-left: 5px; padding-right: 5px; } /* Media Queries from Simple. Probably useless in Conflux */ @media (max-width: 880px) { li { height: 25px; font-size: 15px; padding-left: 7px; } ul { height: 26px; margin-top: 8px; } .menu_left { padding-right: 7px; } .menu_right { padding-right: 7px; } body { padding-left: 4px; padding-right: 4px; margin: 0px !important; width: 100% !important; height: 100% !important; overflow-x: hidden; } .container { width: auto; } } @media (max-width: 810px) { li { font-weight: normal; text-transform: none; } .rowitem { text-transform: none; } } @media (max-width: 620px) { li { padding-left: 5px; padding-top: 2px; padding-bottom: 2px; height: 23px; } ul { height: 24px; } .menu_left { padding-right: 5px; } .menu_right { padding-right: 5px; } .menu_create_topic { display: none;} .hide_on_mobile { display: none; } } @media (max-width: 470px) { .menu_overview { display: none; } .menu_profile { display: none; } .hide_on_micro { display: none; } .post_container { overflow: visible !important; } .post_item { background-position: 0px 2px !important; background-size: 64px 64px !important; padding-left: 2px !important; min-height: 96px; position: relative !important; } .post_item > .user_content { margin-left: 75px !important; width: 100% !important; } .post_item > .mod_button { float: right !important; margin-left: 2px !important; position: relative; top: -14px; } .post_item > .real_username { position: absolute; top: 70px; float: left; margin-top: 0px; padding-top: 3px !important; margin-right: 2px; width: 60px; font-size: 15px; } .container { width: 100% !important; } }