@namespace url(http://www.w3.org/1999/xhtml);

/* body styles, inherited by whole page */
/*
 * Name           : DarkEnd
 * About          : This is copyed and edited from the Endchan Global CSS.
 * Author         : TheJellyBeanKing
 * Orginal Author : cssguy
 * Version        : 2.5
 * Latest Update  : Major changes
 */

/* body */
body {
/*
    background: #1d1f21 none !important;
    color: #C5C8C6 !important; */
  background: #0B0B0B none  !important;
    color: #DADADA !important;
  font-family: arial, helvetica, sans;
  font-size: 100%;
  margin: 0px;
}

/* header and nav / top of page styles */
header {
  width: 50%;
  margin: 3em auto 0 auto;
  text-align: center;
}

/* front page */
#divLatestImages , #divLatestPosts , #divBoards , #newsBox , #topBox {
    background-color: #282a2e !important;
    border-color: #111 !important;
    color: #C5C8C6;
}

nav {
  position: fixed;
  top: 0;
  width: 100%;
  background-color: #121212 !important;
  border-bottom: solid 1px #535353 !important;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.15);
  float: none;
  /* looks horrible - odili 4/23/16
  text-align: center; */
/*
    background-color: #282a2e !important;
    color: #C5C8C6;
    border-bottom: 1px solid #000 !important;
*/
}

nav a {
  display: inline-block;
  text-decoration: none;
  font-size: 70%;
  float: none;
  margin: 0 0.2em 0 0.2em;
  overflow: hidden;
}

nav span {
  display: none;
}

/* board list */
.boardsHeader {
  font-size: 150%;
}

#boardsWrapper {
  width: 80%;
  margin: 1em auto 1em auto;
}

#divBoards {
  margin: 1em auto 0.5em auto;
}

.boardsCell, #boardsCellHeader {
  border: solid 1px #535353;
  width: 100%;
  margin: 0.25em 0 0.25em 0;
}

.boardsCell:nth-of-type(odd) span {
  background-color: #121212;
}

.boardsCell span {
  display: inline-block;
  text-overflow: ellipsis;
  text-decoration: none;
  padding: 0.25em;
  margin: 0.05em;
}

#boardsCellHeader span {
  font-weight: bold;
  display: inline-block;
    background-color: #121212;
  border-bottom: none;
    color: #DADADA;
}

.search {
  margin: 1em 0 1em 0;
}

input[type="text"], input[type="submit"] {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
}

.search form {
  display: inline-block;
}

#divPages {
  display: inline-block;
  background: #121212;
  margin-left: 0;
}

#divPages a {
  text-decoration: none;
  padding: 0 0.25em;
}

/* thread and board pages */
.threadPages {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
    padding: 0.25em;
    float: none;
    font-size: 12px;
    margin-top: 0.5em;
}

.threadPages a {
    text-decoration: none
}

.divPages #divPages, .boardPages #divPages {
    border: none;
}

.threadPages span {
    color: #121212;
}

.boardPages {
  background: #121212;
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
    padding: 0.1em 0.25em;
}


/* board banner */
.boardHeader p {
  color: #af0a0f;
}

.boardHeader p#labelName {
  font-size: 200%;
}
a {
  color: #56567c !important;
}

a:visited {
  color: #81a2be;
}

.boardHeader p#labelDescription {
  font-size: 100%;
}

.boardHeader a {
  font-size: 75%;
  display: inline-block;
  text-decoration: none;
}

#modeBanner {
    background-color: #770A0D;
    color: #fff;
    padding-bottom: 0.1em;
    padding-top: 0.1em;
  text-align: center;
  margin: 1em;
}

#modeBanner h3 {
  font-size: 95%;
}

img#bannerImage {
    width: initial;
}

/* post new thread */
#postBox {
  margin: 1em auto;
  padding: 0.5em;
  text-align: center;
}

#postBox table {
  width: 100%;
  font-size: 75%;
}

#postBox textarea {
  width: 100%;
  height: 8em;
}

.form-post {
  background: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  padding: 1em;
  margin: auto;
  display: inline-block;
}

.form-post td {
  text-align: left;
  padding: 0.1em;
}

/* footer */
footer {
    background-color: #282a2e !important;
    border-color: #111;
    color: #C5C8C6;
}

/* boards */
.boardsCell:nth-of-type(odd) span {
    background-color: #262a40;
}

.boardPages, #divPages {
    border-color: #282a2e;
    background-color: #282a2e;
}

#boardsCellHeader span {
    background-color: #383a3e;
}

/* post form plus qr */
.form-post th {
  text-align: left;
  padding: 0 1em 0 0.5em;
}

.form-post th {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
}

.spoilerCheckbox, #flagsDiv {
  display: inline-block;
}

input, textarea {
   border: 1px solid #AAA;
   background-color: #444;
   color: #BBB;
}

input#files, input#qrfiles {
    border: none !important;
}

#postBox #captchaDiv {
  text-align: left;
}

input#fieldName, input#fieldEmail, input#fieldSubject, textarea#fieldMessage, input#fieldPostingPassword, input#files, button#jsButton {
  background-color: #121212;
    border: solid 1px #535353;
  box-sizing: border-box;
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    color: #DADADA;
  width: 100%;
}

button#jsButton {
  cursor: pointer;
}

/* thread/post report and management form */
.threadPages {
    background-color: #282a2e !important;
    border-color: #282a2e !important;
}

.contentAction, #transferControls, #ipDelete {
  clear: both;
    background-color: #121212;
    border: solid 1px #535353;
  color: #DADADA;
  padding: 0.5em;
  margin: 4em auto 1em auto;
  float: none;
  width: 25em;
  text-align: -webkit-center;
  text-align: -moz-center;
}

#threadReport label, #threadReport img, .contentAction label, .contentAction img, #transferControls, #ipDelete {
  display: block;
}

#threadReport label.checkbox {
  display: inline-block;
}

#transferControls, #ipDelete {
  margin: 1em;
  display: none;
}

.buttonBox {
  margin-top: 0.5em;
}

#divControls input, #divControls label {
  display: inline-block;
}

input#reportFieldReason, input#deletionFieldPassword, input#fieldCaptchaReport, input#reloadCaptchaButtonReport, #fieldBoards , #deleteFromIpFormButton , #transferFormButton , #fieldDestinationBoard, #ipField {
  width: 100%;
}

input#reportFieldReason, input#deletionFieldPassword, input#fieldCaptchaReport, input#reloadCaptchaButtonReport, input#deleteJsButton, input#reportJsButton, #deleteFromIpFormButton , #ipField , #transferFormButton , #fieldDestinationBoard, #fieldBoards {
    background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
}

input#fieldCaptchaReport {
  margin-bottom: 0.5em;
}

img#captchaImageReport {
    width: 100%;
    max-width: 100%;
}

input#deleteJsButton {
  cursor: pointer;
}

input#reportJsButton {
    cursor: pointer;
    float: none;
}

#reportJsButton , #banJsButton , #spoilJsButton , #deleteJsButton {
    background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
    width: 100%;
}

#fieldbanMessage, #fieldExpiration {
    width: 100%;
}

/* thread pages */
.threadPages {
  margin: 1em auto;
  width: 99%;
  text-align: center;
}

.threadPages a {
  padding: 0.5em;
  font-size: 12px;
  text-decoration: none
}

/* thread list, some elements are in the post section */
#threadList {
  margin: 1em;
}

#threadList #divThreads, #threadList #threadLinks {
  font-size: 75%;
}

#panelMessage {
  margin: 1em;
}

#divMessage {
  text-align: center;
}

/* posts */
.divPosts {
  margin: 1em 0;
}

.postCell {
  margin: 0.25em 0;
}

.innerPost, .markedPost {
    background-color: #121212;
    border: solid 1px #535353 !important;
    color: #DADADA;
  display: inline-block;
  overflow: visible;
  padding-right: 0.25em;
  max-width: 100%;
}

.markedPost {
    background-color: #363636;
}

.linkName {
  font-weight: bold;
  color: #117743;
}

.linkName:hover {
  color: #ff0000;
}

.noEmailName, .noEmailName:hover {
  color: #117743;
}

.quoteLink {
  color: #ff0000;
}

.linkSelf {
  color: #DADADA;
  text-decoration: none;
}

.linkSelf:hover {
  color: #ff0000;
}

.linkQuote {
  color: #DADADA;
  text-decoration: none;
}

.linkQuote:hover {
  color: #ff0000;
}

.labelSubject {
  color: #A03F4C;
  font-weight: bold;
}

.labelRole {
  color: #ff0000;
  font-weight: bold;
}

.divMessage {
  margin-left: 3em;
  margin-top: 1em;
  margin-bottom: 0.5em;
  word-wrap: break-word;
}

.divBanMessage {
  color: #ff0000;
  font-weight: bold;
  margin-top: 1em;
  margin-left: 1em;
  font-size: 120%;
}

.uploadCell {
  margin: 0.25em 1em 0.25em 0.5em;
  float: none;
}

.uploadCell img {
  float: left;
  margin-right: 1em;
  margin-bottom: 1em;
}

.multipleUploads .uploadCell {
  float: left;
}

.uploadDetails {
  margin-bottom: 0.5em;
}

.opCell {
  clear: left;
}

.panelIp, .panelProxyIp {
  margin: 0.25em 1em 0.25em 0.5em;
}

#divControls {
  margin: 1em;
}

.panelBacklinks a {
  padding-left: 0.5em;
}

.hideLink {
  vertical-align: top;
}

.aa {
  font-family: Mona, "MS PGothic", "ＭＳ Ｐゴシック", sans-serif;
  display: block !important;
  font-size: 12pt;
  line-height: 1.1;
}

.labelLastEdit {
  margin-top: 0.75em;
  margin-left: 0.75em;
}

.contentOmissionIndicator {
  margin: 1em 0;
}

.labelOmission {
  margin-top: 0.5em;
  margin-left: 0.5em;
}

.multipleUploads .opUploadPanel, .multipleUploads .panelUploads {
    float: left;
    width: 100%;
}

/* this is the preview box */
#panelContent {
  font-size: 75%;
}

/* markdown */
.greenText {
  color: #A1D41C;
}

.redText {
  color: #AF0A0F;
  font-weight: bold;
  font-size: 125%;
}

span.spoiler {
    background: #0B0B0B;
    border: 1px solid #535353;
    color: #0B0B0B;
  padding: 0 1px;
}

.spoiler:hover {
    background: #0B0B0B;
    border: 1px solid #535353;
    color: #DADADA;
}

/* refresh timer */
.divRefresh {
  display: block !important;
  float: none;
  clear: both;
  text-align: center;
  margin-left: auto;
    margin-right: auto;
  padding: 0;
  height: 1.5em;
}

.divRefresh label, .divRefresh input {
  display: inline-block;
  margin: 0;
}

input#refreshButton {
  background-color: #121212;
    border: solid 1px #535353;
  color: #DADADA;
}

/* catalog */
/* this is important since the catalog cell container shares the same id as the actual threads container on other pages */
.catalogDiv {
  width: 105%;
  margin: 1em auto;
}

#catalogId {
  text-align: center;
  margin: 1.5em 0 1em 0;
  font-size: 150%;
}

.red {
  color: #af0a0f;
}

.linkThumb img {
  max-height: 128px;
  max-width: 128px;
    color: #6f0a0f;
}

.catalogCell {
  float: left;
  width: 10em;
  text-align: center;
  padding: 0.25em;
  height: 14em;
  overflow: hidden;
  background-color: rgba(182, 182, 182, 0.12);
  margin: 0.1em;
  border: 2px solid rgba(111, 111, 111, 0.34);
}

.catalogCell .divMessage {
  margin: 0;
  font-size: 75%;
}

.catalogCell .labelSubject {
  font-size: 75%;
}

.threadStats {
  font-size: 75%;
}

/* archive pages */
#archiveThreadList, #archiveBoardList {
  margin: 1em;
}

#archiveThreadList div, #archiveBoardList div {
  margin: 0.25em 0;
}

/* static pages */
#help {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  margin: 1em auto;
    width: 60%;
    text-align: center;
}

.marker {
  font-weight: bolder;
}

/* index page */
#topBox {
    background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  width: 70%;
  margin: 2.5em auto 1em auto;
  padding: 0.5em;
}

#topBox p {
  display: inline-block;
  font-size: 80%;
  vertical-align: top;
}

#topBox img {
  width: 10em;
}

#indexWrapper {
  width: 70%;
  margin: 1em auto;
  padding: 0.5em;
}

#innerWrapper {
  width: 69%;
  float: right;
  padding-right: 0.5em;
}

#newsBox {
    background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  width: 100%;
  padding: 0.5em 0 0.5em 0.5em;
  text-align: center;
}

#links {
  padding: 0.5em 0.5em 0.5em 0.5em;
  font-size: 75%;
  display: inline-block;
}

#links a {
  text-decoration: none;
}

.topBoards {
    background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  width: 100% !important;
  margin: 1em 0 1em 0 !important;
  padding: 0.5em 0 0.5em 0.5em;
  /* looks horrible - odili 4/24/16
  text-align: center; */
}

.topBoards h3 {
  margin-bottom: 0.25em;
}

.topBoards br {
  margin-bottom: 0.5em;
}

#divLatestPosts {
    background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  width: 100%;
  margin: 1em 0 1em 0;
  padding: 0.5em 0 0.5em 0.5em;
  overflow: hidden;
}

#divLatestPosts div {
  margin: 0.25em 0;
}

#divLatestImages {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  float: left;
  max-width: 20%;
  padding: 0.5em;
  margin: 0 1em 1.5em auto;
  text-align: center;
}

#divLatestImages div {
  max-width: 100%;
}

div#innerWrapper table {
    margin: auto;
}

div#divLatestPosts h3 {
    text-align: center;
}

/* CSS for pages that deal with site and account settings and bans */
.settings {
    border: solid 1px #535353;
  width: 40%;
  padding: 0.5em;
  margin: 1em auto;
  text-align: center;
}

label {
  display: block;
}

.banners {
  margin: 1em;
  width: auto;
  padding: 0.5em;
}

.settings textarea {
  display: block;
  height: 5em;
}

.settings hr {
  height: 1px;
  color: #e9edf3;
}

input.wide, textarea.wide {
  width: 90%;
}

#redirect, #maint, #hashBan {
  text-align: center;
}

#divSolvedCaptcha {
  font-size: 125%;
}

#labelCaptchaId {
  color: #ff0000;
}

#rules {
  text-align: center;
}

#divRules {
  margin: 1em auto;
}

input#loginFieldLogin, input#loginFieldPassword, input#registerFieldLogin, input#registerFieldPassword, input#registerFieldEmail, input#fieldCaptcha, input#recoverFieldLogin, input#fieldCaptchaRecover, input#emailField, input#fieldPassword, input#fieldNewPassword, input#fieldConfirmation, input#newBoardFieldUri, input#newBoardFieldName, input#newBoardFieldDescription, #boardNameField , #maxFileSizeField , #hourlyThreadLimitField , #autoCaptchaThresholdField , #captchaModeComboBox , #autoSageLimitField , #maxThreadFields , #maxFilesField , #anonymousNameField, input#validMimesField {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  width: 100%;
}

input#loginJsButton, input#reloadCaptchaButton, input#registerJsButton, input#reloadCaptchaButtonRecover, input#recoverJsButton, input#logoutJsButton, input#saveJsButton, input#passwordJsButton, input#newBoardJsButton {
    background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
    cursor: pointer;
    width: 100%;
    margin-bottom: 1px;
}

#saveSettingsJsButton , #tagsField , #autoCaptchaThresholdField , #hourlyThreadLimitField , #anonymousNameField , #boardDescriptionField , #boardNameField , #filesSpoiler , #spoilerJsButton , #cssJsButton , #files , #deleteBoardJsButton , #transferBoardFieldLogin , #boardMessageField , #transferBoardJsButton , #addVolunteerJsButton , #addVolunteerFieldLogin {
    background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
    width: 100%;
}

img#captchaImage, img#captchaImageRecover {
    width: 100%;
    max-width: 100%;
}

/* footer styles */
footer {
  background-color: #121212;
    border-top: solid 1px #535353;
    color: #DADADA;
  width: 100%;
  clear: both;
  margin-top: 2em;
  text-align: center;
  padding: 0.25em 0 0.25em 0;
}

footer a, footer p {
  margin: 0 0.5em 0.5em 0.5em;
  text-decoration: none;
}

/* Scroll Bar Chrome Only*/
*::-webkit-scrollbar {
    width: 0.65%;
    height: 10px;
    background: #0B0B0B;
    border: 1px solid #535353;
}

*::-webkit-scrollbar-button {
    display: none;
}

*::-webkit-scrollbar-corner, *::-webkit-scrollbar-track {
    background: #121212;
}

*::-webkit-scrollbar-thumb {
    min-height: 28px;
    background: #828181;
}

*::-webkit-scrollbar-thumb, *::-webkit-scrollbar-track {
    border: 0;
    box-shadow: none;
}

*::-webkit-scrollbar-corner, *::-webkit-scrollbar-track {
    background: #121212;
}

*::-webkit-scrollbar-thumb, *::-webkit-scrollbar-track {
    border: 0;
    box-shadow: none;
}


/* Quick reply */
#quick-reply {
    position: fixed;
    right: 5%;
    top: 5%;
    float: right;
    display: block;
    padding: 0 0 0 0;
    width: 300px;
    z-index: 100;
}
#quick-reply #post-form-inner {
    min-width: 300px;
}
#quick-reply .post-table tr td:nth-child(2) {
    width: 33%;
    text-align: right;
    padding-right: 4px;
}
#quick-reply tr td:nth-child(2) input[type="submit"] {
    width: 99%;
}
#quick-reply th, #quick-reply td {
    margin: 0;
    padding: 0;
}
#quick-reply th {
    text-align: center;
    padding: 0;
    border: 1px solid #222;
}
#quick-reply th .handle {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
    float: left;
    width: 100%;
    display: inline-block;
}
#quick-reply th .close-btn {
    float: right;
    padding: 0 5px;
    cursor: pointer;
}
#quick-reply input[type="text"], #quick-reply select {
    width: 100%;
    padding: 2px;
    font-size: 10pt;
    box-sizing: border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
}
#quick-reply input[type="password"], #quick-reply select {
    width: 100%;
    padding: 2px;
    font-size: 10pt;
    box-sizing: border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
}
#quick-reply textarea {
    min-width: 100%;
    box-sizing: border-box;
    -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
    font-size: 10pt;
    resize: both;
}
#quick-reply input, #quick-reply select, #quick-reply textarea {
    margin: 0 0 1px 0;
}
#quick-reply input[type="file"] {
    padding: 5px 2px;
}
#quick-reply .nonsense {
    display: none;
}
#quick-reply td.recaptcha {
    text-align: center;
    padding: 0 0 1px 0;
}
#quick-reply td.recaptcha span {
    display: inline-block;
    width: 100%;
    background: white;
    border: 1px solid #ccc;
    cursor: pointer;
}
#quick-reply td.recaptcha-response {
    padding: 0 0 1px 0;
}

#quick-reply table {
    border-collapse: collapse;
    background: #121212;
    border: solid 1px #535353;
    color: #DADADA;
    margin: 0;
    width: 100%;
}

button#qrbutton {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
  margin-bottom: 2px;
    cursor: pointer;
}

textarea#qrbody, input#qrpassword {
  background-color: #121212;
    border: solid 1px #535353;
    color: #DADADA;
}

*:focus {
    outline-color: #DADADA;
}

.selectedCell, #dropzone {
  top: 5px;
  background-color: rgb(11, 11, 11);
  margin-bottom: 5px;
  padding: 10px 0px;
}

.selectedCell {
  margin-top: 10px;
}

#selectedDiv {
  text-align: left;
  padding-bottom: 5px;
}

#dropzone {
  color: #DADADA;
  cursor: pointer;
  text-align: center;
  position: relative;
  transition: all 0.2s ease 0s;
  border: solid 1px #535353;
}

.removeButton {
  cursor: pointer;
  color: rgba(125, 125, 125, 0.5);
  display: inline-block;
  margin-right: 5px;
  font-size: 20px;
}

.removeButton:hover {
  color: #7D7D7D;
}