/ css / spooky.css
spooky.css
   1  /** GENERIC / ELEMENT STYLING **/
   2  html {
   3    -moz-text-size-adjust: 100%;
   4    -webkit-text-size-adjust: 100%;
   5    -ms-text-size-adjust: 100%;
   6  }
   7  
   8  body {
   9    background: #120c20;
  10    color: #F0F8FFD1;
  11    font-family: arial, helvetica, sans-serif;
  12    font-size: 10pt;
  13  
  14    margin-left: 0;
  15    margin-right: 0;
  16    margin-top: 5px;
  17  
  18    padding-left: 5px;
  19    padding-right: 5px;
  20  }
  21  
  22  .nwsb { display: none; }
  23  
  24  .adg-rects {
  25    margin: 0;
  26    text-align: center;
  27  }
  28  .adg, .adg-m { overflow: hidden; }
  29  .adg-rep .adg { margin-left: 15px }
  30  .adp-228 { margin: auto; width: 728px; height: 320px; }
  31  .adp-90 { margin: auto; width: 728px; height: 90px; }
  32  .adp-128 { margin: auto; width: 728px; height: 128px; }
  33  .adp-j { margin: auto; width: 728px; height: 102px; }
  34  .adp-50 { margin: auto; width: 320px; height: 50px; }
  35  .adp-250 { margin: auto; width: 300px; height: 250px; }
  36  .adp-row { display: inline-block; margin: 0 10px; }
  37  .adl { font-size: 10px; text-align: center; }
  38  .adl + .ad-bgls, .ad-bgls + .adl { margin-top: 8px; }
  39  
  40  .danbo-slot { width: 728px; height: 90px; margin: 10px auto; overflow: hidden; }
  41  @media only screen and (max-width: 480px) { .danbo-slot { width: 300px; height: 250px; } }
  42  
  43  .bsa-cnt {
  44    margin: 20px 0;
  45    height: 90px;
  46    text-align: center;
  47  }
  48  
  49  #t-root {
  50    overflow: hidden;
  51    box-sizing: border-box;
  52    background: #eee;
  53    border: 1px solid #777;
  54    margin: 2px 0 2px 0;
  55    width: 300px;
  56  }
  57  
  58  @media only screen and (max-width: 640px) {
  59    .bsa-cnt {
  60      height: 250px;
  61      display: flex;
  62      justify-content: center;
  63      align-items: center;
  64    }
  65  }
  66  
  67  hr#op, #ctrl-top { clear: both; }
  68  
  69  .party-hat {
  70    left: 0;
  71    margin-top: -80px;
  72    position: absolute;
  73    pointer-events: none;
  74  }
  75  
  76  .sjis, #quickReply .sjis {
  77    font-size: 16px;
  78    line-height: 17px;
  79    white-space: pre;
  80    font-family: 'IPAMonaPGothic', 'Mona', 'MS PGothic', monospace;
  81    overflow: auto;
  82    display: block;
  83    clear: left;
  84  }
  85  
  86  .tex-logo { font-size: 0.8em; }
  87  .tex-logo sub { font-size: 0.8em; text-transform: uppercase; }
  88  
  89  .mu-s { font-weight: bold }
  90  .mu-i { font-style: italic }
  91  .mu-r { color: #C41E3A }
  92  .mu-g { color: #00A550 }
  93  .mu-b { color: #1d8dc4 }
  94  
  95  .pu-lbl {
  96    color: #117743;
  97    font-weight: bold;
  98    font-size: 12px;
  99  }
 100  .pu-img {
 101    vertical-align: middle;
 102    margin-top: -3px;
 103    margin-right: 3px;
 104    display: inline-block;
 105    width: 16px;
 106    height: 16px;
 107    background: url('//s.4cdn.org/image/minileaf.gif');
 108  }
 109  
 110  .n-pu,
 111  .n-jol {
 112    vertical-align: middle;
 113    display: inline-block;
 114    width: 16px;
 115    height: 16px;
 116    margin-top: -2px;
 117  }
 118  
 119  .n-pu {
 120    /* Pumpkin icon by twemoji is licensed under CC BY 4.0 (https://twitter.github.io/twemoji/) */
 121    background: url('//s.4cdn.org/image/1f383.png');
 122    -webkit-filter: drop-shadow(0px 0px 6px rgba(217,133,24,1)) brightness(125%);
 123    filter: drop-shadow(0px 0px 6px rgba(217,133,24,1)) brightness(125%);
 124  }
 125  
 126  .n-jol {
 127    background: url('//s.4cdn.org/image/1f383.png');
 128  }
 129  
 130  .n-jol-1 {
 131    -webkit-filter: drop-shadow(0px 0px 4px rgba(217,133,24,1));
 132    filter: drop-shadow(0px 0px 4px rgba(217,133,24,1));
 133  }
 134  
 135  .n-jol-2 {
 136    -webkit-filter: drop-shadow(0px 0px 4px rgba(217,133,24,1)) brightness(115%);
 137    filter: drop-shadow(0px 0px 4px rgba(217,133,24,1)) brightness(115%);
 138  }
 139  
 140  .n-jol-3 {
 141    -webkit-filter: drop-shadow(0px 0px 6px rgba(217,133,24,1)) brightness(120%);
 142    filter: drop-shadow(0px 0px 6px rgba(217,133,24,1)) brightness(120%);
 143  }
 144  
 145  .n-jol-4 {
 146    -webkit-filter: drop-shadow(0px 0px 8px rgba(217,133,24,1)) brightness(130%);
 147    filter: drop-shadow(0px 0px 8px rgba(217,133,24,1)) brightness(130%);
 148  }
 149  
 150  .n-jol-5 {
 151    -webkit-filter: drop-shadow(0px 0px 8px rgba(217,133,24,1)) brightness(150%);
 152    filter: drop-shadow(0px 0px 8px rgba(217,133,24,1)) brightness(150%);
 153  }
 154  
 155  .n-jol-6 {
 156    -webkit-filter: drop-shadow(0px 0px 10px rgba(217,133,24,1)) brightness(175%);
 157    filter: drop-shadow(0px 0px 10px rgba(217,133,24,1)) brightness(175%);
 158  }
 159  
 160  .jla-it {
 161    height: 420px;
 162    width: 680px;
 163  }
 164  
 165  .jla-it-p {
 166    font-size: 0.85em;
 167    text-align: center;
 168  }
 169  
 170  .twtdisc {
 171    display: block !important;
 172  }
 173  
 174  @media only screen and (max-width: 700px) {
 175    .jla-it {
 176      width: 340px;
 177      height: 220px;
 178      margin: auto;
 179    }
 180    
 181    .jla-it img {
 182      width: 340px;
 183      height: 200px;
 184    }
 185  }
 186  
 187  .centeredThreads .party-hat {
 188    left: 12%;
 189  }
 190  
 191  #disclaimer {
 192    font-size: 14px;
 193    position: absolute;
 194    overflow: hidden;
 195    top: 0; left: 0;
 196    width: 100%; height: 100%;
 197    z-index: 9998;
 198  }
 199  
 200  #disclaimer-bg {
 201    position: fixed;
 202    top: 0; left: 0;
 203    width: 100%; height: 100%;
 204    background-color: rgba(0, 0, 0, 0.25);
 205  }
 206  
 207  #disclaimer-modal {
 208    z-index: 9999;
 209    width: 320px;
 210    top: 0;
 211    left: 50%;
 212    margin-left: -170px;
 213    display: block;
 214    padding: 10px;
 215    position: relative;
 216    background-color: #f0e0d6;
 217    box-shadow: 0 0 5px rgba(0, 0, 0, 0.25);
 218  }
 219  
 220  #disclaimer ol {
 221    margin-left: 20px;
 222    padding: 0;
 223  }
 224  
 225  #disclaimer li {
 226    margin: 10px 0;
 227  }
 228  
 229  #disclaimer h3 {
 230    border-bottom: 1px solid #d9bfb7;
 231    margin: 0;
 232    padding-bottom: 5px;
 233    text-align: center;
 234  }
 235  
 236  #disclaimer-modal div {
 237    margin-top: 10px;
 238    text-align: center;
 239  }
 240  
 241  #disclaimer-modal button {
 242    margin: 0 10px;
 243  }
 244  
 245  #disclaimer-accept {
 246    font-weight: bold;
 247  }
 248  
 249  #footer-links { margin-top: 5px; }
 250  
 251  .isMobileDevice blockquote.postMessage {
 252    font-size: 11pt;
 253  }
 254  
 255  .belowLeaderboard {
 256    width: 728px;
 257    max-width: 100%;
 258  }
 259  
 260  .aboveMidAd {
 261    width: 468px;
 262    max-width: 100%;
 263  }
 264  
 265  /* reCaptcha */
 266  #captchaContainerAlt { height: 80px; }
 267  #captchaContainerAlt .recaptcha_image_cell { padding: 0 0 5px 0 !important }
 268  #captchaContainerAlt #recaptcha_table { border: 0 !important; }
 269  #captchaContainerAlt #recaptcha_response_field { width: 300px !important; padding: 0 !important }
 270  
 271  #qrCaptchaContainerAlt #recaptcha_response_field {
 272    width: 296px !important;
 273  }
 274  
 275  #captchaContainerAlt #recaptcha_image,
 276  #qrCaptchaContainerAlt #recaptcha_image {
 277    border: 0 !important;
 278  }
 279  
 280  #qrCaptchaContainerAlt .recaptcha_image_cell {
 281    padding: 0 !important;
 282  }
 283  
 284  #qrCaptchaContainerAlt #recaptcha_table {
 285    border: 0 !important;
 286  }
 287  
 288  #captchaContainerAlt td:nth-child(2),
 289  #captchaContainerAlt td:nth-child(3),
 290  #qrCaptchaContainerAlt td:nth-child(2),
 291  #qrCaptchaContainerAlt td:nth-child(3) {
 292    display: none !important;
 293  }
 294  
 295  #qrCaptchaContainerAlt {
 296    height: 80px;
 297    width: 300px;
 298  }
 299  
 300  .recaptchatable {
 301    background-color: transparent !important;
 302    border: none !important;
 303  }
 304  
 305  .recaptcha_image_cell {
 306    background-color: transparent !important;
 307  }
 308  
 309  #g-recaptcha {
 310    height: 78px;
 311  }
 312  
 313  #recaptcha_div {
 314    height: 107px; width: 442px;
 315  }
 316  
 317  #recaptcha_challenge_field { width: 400px }
 318  
 319  .recaptcha_input_area {
 320    padding: 0!important;
 321  }
 322  #recaptcha_table tr:first-child {
 323    height: auto!important;
 324  }
 325  
 326  #recaptcha_table tr:first-child > td:not(:first-child) {
 327    padding: 0 7px 0 7px!important;
 328  }
 329  
 330  #recaptcha_table tr:last-child td:last-child {
 331    padding-bottom: 0!important;
 332  }
 333  
 334  #recaptcha_table tr:last-child td:first-child {
 335    padding-left: 0!important;
 336  }
 337  #recaptcha_image {
 338    cursor: pointer;
 339  }
 340  #recaptcha_response_field {
 341    width: 292px;
 342    margin-right: 0px!important;
 343    font-size: 10pt!important;
 344  }
 345  input:-moz-placeholder { color: gray !important; }
 346  #recaptcha_image {
 347    border: 1px solid #aaa !important;
 348  }
 349  #recaptcha_table tr > td:last-child {
 350    display: none !important;
 351  }
 352  #captchaContainer {
 353    width: 343px;
 354    height: 86px;
 355    line-height: 99px;
 356    overflow: hidden;
 357  }
 358  #captchaContainer .placeholder {
 359    font-style: italic;
 360    padding-left: 5px;
 361  }
 362  
 363  .mobile, .mobileinline, .mobileib {
 364    display: none !important;
 365  }
 366  
 367  a, a:visited {
 368    color: #d98518;
 369    text-decoration: none;
 370  }
 371  
 372  div.board > hr {
 373    clear: both;
 374  }
 375  
 376  img {
 377    border: none;
 378  }
 379  
 380  img.topad, .topad > div, .topad a img {
 381    width: 728px;
 382    height: 90px;
 383    max-width: 100%;
 384    overflow: hidden;
 385    margin: auto;
 386  }
 387  
 388  img.middlead, .middlead > div, .middlead a img{
 389    width: 468px;
 390    height: 60px;
 391    max-width: 100%;
 392    overflow: hidden;
 393    margin: auto;
 394  }
 395  
 396  img.bottomad, .bottomad > div, .bottomad a img {
 397    width: 728px;
 398    height: 90px;
 399    max-width: 100%;
 400    overflow: hidden;
 401    margin: auto;
 402  }
 403  
 404  hr {
 405    height: 1px;
 406    border: 0;
 407    border-bottom: 1px solid #96b4aa;
 408    opacity: 0.1;
 409  }
 410  
 411  hr.abovePostForm {
 412    width: 90%;
 413  }
 414  
 415  span.x-small {
 416    font-size: x-small;
 417  }
 418  
 419  #postFormError {
 420    background-color: #e62020;
 421    color: #fff;
 422    font-family: monospace;
 423    font-size: 13px;
 424    font-weight: bold;
 425    padding: 3px 5px;
 426    text-shadow: 0 1px rgba(0, 0, 0, 0.2);
 427    display: none;
 428    margin-top: 3px;
 429  }
 430  
 431  #postFormError a {
 432    color: #fff;
 433  }
 434  
 435  .painter-ctrl input[type="text"],
 436  #qr-painter-ctrl input[type="text"] {
 437    width: 30px !important;
 438    text-align: center;
 439  }
 440  
 441  #qr-painter-ctrl .oe-r-cb {
 442    vertical-align: sub;
 443  }
 444  
 445  #oe-canvas-preview {
 446    position: absolute;
 447    margin-left: 5px;
 448    margin-top: 3px;
 449    box-shadow: 0 0 1px 1px rgba(0, 0, 0, 0.25);
 450  }
 451  
 452  /** MOBILE ONLY DISABLES **/
 453  .mobile {
 454    display: none;
 455  }
 456  
 457  /** HEADER **/
 458  ul.rules {
 459    margin: 0px;
 460    padding: 0px;
 461    margin-top: 5px;
 462  }
 463  
 464  ul.rules > li {
 465    list-style: none;
 466    font-size: 11px;
 467  }
 468  
 469  .rules > li:before {
 470    content: "\2022 \20";
 471  }
 472  
 473  div.boardBanner {
 474    text-align: center;
 475    clear: both;
 476  }
 477  
 478  #bannerCnt {
 479    border: 1px solid #800;
 480    margin: 5px auto;
 481    width: 300px;
 482    height: 100px;
 483    max-width: 100%;
 484  }
 485  
 486  div.boardBanner > div.boardTitle {
 487    font-family: Tahoma, sans-serif;
 488    font-size: 28px;
 489    font-weight: bold;
 490    letter-spacing: -2px;
 491  
 492    margin-top: 0px;
 493  }
 494  
 495  div.boardBanner > div.boardSubtitle {
 496    font-size: x-small;
 497  }
 498  
 499  div#boardNavDesktop {
 500    color: transparent;
 501    font-size: 9pt;
 502    display: block;
 503  }
 504  
 505  .hasDropDownNav #navtopright {
 506    display: none;
 507  }
 508  
 509  #boardNavDesktop .pageJump {
 510    padding: 0;
 511  }
 512  
 513  #boardNavDesktop .pageJump a {
 514    padding-right: 5px;
 515  }
 516  
 517  div#boardNavDesktop a {
 518    font-weight: normal;
 519    padding: 1px;
 520    text-decoration: none;
 521  }
 522  
 523  /** General Containers **/
 524  div.pContainer {
 525  
 526  }
 527  
 528  div.opContainer {
 529    display: inline;
 530  }
 531  
 532  div.sideArrows {
 533    color: #707070;
 534  
 535    float: left;
 536  
 537    margin-right: 2px;
 538    margin-top: 0px;
 539    margin-left: 2px;
 540  }
 541  
 542  /** Thread Container **/
 543  div.thread {
 544  
 545    margin: 0px;
 546    clear: both;
 547  
 548  }
 549  
 550  /** Post Container **/
 551  div.post {
 552    margin: 4px 0;
 553    overflow: hidden;
 554  }
 555  
 556  div.thread > div:nth-of-type(2) > div.reply {
 557    margin-top: 2px !important;
 558  }
 559  
 560  div.op {
 561    display: inline;
 562  }
 563  
 564  div.reply {
 565    background-color: #261e37;
 566    border: none;
 567    display: table;
 568    padding: 2px;
 569  }
 570  
 571  div.reply input {
 572    float: none;
 573  }
 574  
 575  /** Post Information **/
 576  div.post div.postInfo {
 577    display: block;
 578    width: 100%;
 579  }
 580  
 581  div.post div.postInfo span.postNum {
 582  
 583  }
 584  
 585  div.post div.postInfo span.postNum a {
 586    text-decoration: none;
 587  }
 588  
 589  div.post div.postInfo span.postNum a:hover, .posteruid .hand:hover {
 590    color: red !important;
 591  }
 592  
 593  /* Name */
 594  div.post div.postInfo span.nameBlock {
 595    display: inline-block;
 596  }
 597  
 598  div.post div.postInfo span.nameBlock span.name {
 599    font-weight: bold;
 600  }
 601  
 602  div.post div.postInfo span.nameBlock span.postertrip {
 603    font-weight: normal !important;
 604  }
 605  
 606  /* Date/Time */
 607  div.post div.postInfo span.date {
 608  
 609  }
 610  
 611  div.post div.postInfo span.time {
 612  
 613  }
 614  
 615  /* Subject */
 616  div.post div.postInfo span.subject {
 617    font-weight: bold;
 618  }
 619  
 620  /** Message **/
 621  div.post blockquote.postMessage {
 622    display: block;
 623  }
 624  
 625  blockquote > span.quote {
 626    color: #b76d5e;
 627  }
 628  
 629  .quoteLink, .quotelink, .deadlink, .pageJump a {
 630    text-decoration: underline;
 631  }
 632  
 633  /* Archived threads list */
 634  .is_arclist .belowLeaderboard { display: none; }
 635  
 636  #arc-list {
 637    max-width: 80%;
 638    margin: 10px auto 0 auto;
 639  }
 640  
 641  #arc-list td {
 642    text-align: center;
 643  }
 644  
 645  #arc-list .teaser-col {
 646    text-align: left;
 647    word-break: break-all;
 648  }
 649  
 650  #arc-sort {
 651    border-bottom: 1px dotted;
 652    cursor: pointer;
 653  }
 654  
 655  /** File Information **/
 656  div.post div.file {
 657    display: block;
 658  }
 659  
 660  div.post div.file div.fileInfo {
 661    margin-right: 10px;
 662    word-break: break-all;
 663  }
 664  
 665  div.replyContainer div.post div.file div.fileInfo {
 666    margin-left: 20px;
 667  }
 668  
 669  div.post div.file .fileThumb {
 670    float: left;
 671    margin-left: 20px;
 672    margin-right: 20px;
 673    margin-top: 3px;
 674    margin-bottom: 5px;
 675    filter: contrast(90%) brightness(90%);
 676  }
 677  
 678  span.fileThumb {
 679    margin-left: 0px !important;
 680    margin-right: 5px !important;
 681  }
 682  
 683  div.reply span.fileThumb, div.reply span.fileThumb img {
 684    float: none !important;
 685    margin-top: 0px !important;
 686    margin-bottom: 0px !important;
 687  }
 688  
 689  div.post div.file .fileThumb img {
 690    border: none;
 691  
 692    float: left;
 693  }
 694  
 695  /** Summary **/
 696  span.summary {
 697    color: #707070;
 698    margin-top: 10px;
 699  }
 700  
 701  /** POST FORM **/
 702  div.postingMode {
 703    background-color: #e04000;
 704    padding: 1px;
 705    text-align: center;
 706  
 707    color: #fff;
 708    font-weight: bold;
 709    font-size: larger;
 710  
 711    margin-top: 8px;
 712  }
 713  
 714  #verification table {
 715    border: none !important;
 716    margin: 0px;
 717  }
 718  
 719  /** FOOTER **/
 720  div.thread:last-child {
 721    padding-bottom: 21px;
 722    margin-bottom: 6px;
 723  
 724  }
 725  
 726  div.pagelist {
 727    font-size: 13px !important;
 728  
 729    margin: 0;
 730    padding: 3px 7px;
 731  
 732    float: left;
 733  
 734    border: none;
 735    background: #F0E0D6;
 736  
 737    border-right: 1px solid #D9BFB7;
 738    border-bottom: 1px solid #D9BFB7;
 739  
 740    list-style: none;
 741    overflow: hidden;
 742  
 743    color:#96b4aa;
 744  }
 745  
 746  div.pagelist > div {
 747    float: left;
 748  }
 749  
 750  div.pagelist > div span {
 751    padding: 4px;
 752    display: inline-block;
 753  }
 754  
 755  div.pagelist div.pages {
 756    padding: 4px;
 757  }
 758  
 759  div.pagelist div.pages a {
 760    text-decoration: none !important;
 761    /* FINE MOOT GOSH JEEZ */
 762  }
 763  
 764  div.pagelist form {
 765    display: inline;
 766  }
 767  
 768  div.pagelist div.cataloglink {
 769    border-left: 1px solid #D9BFB7;
 770    padding-left: 12px;
 771    margin-left: 7px;
 772  }
 773  
 774  .bottomCtrl {
 775    float: right;
 776    margin-top: 2px;
 777  }
 778  
 779  input[type=password] {
 780    width: 50px;
 781    text-align: center;
 782  }
 783  
 784  div.deleteform input[type=checkbox] {
 785    margin: 1px 2px 1px 2px;
 786  }
 787  
 788  .stylechanger {
 789    margin-left: 5px;
 790    font-size: 10pt;
 791  }
 792  
 793  div#boardNavDesktopFoot {
 794    font-size: 9pt;
 795    color: transparent;
 796  
 797    clear: both;
 798  
 799    padding-top: 10px;
 800    padding-bottom: 3px;
 801  }
 802  
 803  div#boardNavDesktopFoot a {
 804    font-weight: normal;
 805    padding: 1px;
 806    text-decoration: none;
 807  }
 808  
 809  div.homelink {
 810    float: right
 811  }
 812  
 813  div#absbot {
 814    text-align: center;
 815    font-size: x-small !important;
 816    padding-bottom: 4px;
 817    padding-top: 10px;
 818    clear: both;
 819  }
 820  
 821  #recaptcha_response_field {
 822    padding: 0px;
 823  }
 824  
 825  /** POST FORM **/
 826  table {
 827    border-spacing: 1px;
 828  
 829    margin-left: auto;
 830    margin-right: auto;
 831  }
 832  
 833  table.postForm > tbody > tr > td:first-child {
 834    color: inherit;
 835    font-weight: bold;
 836    padding: 0 5px;
 837    font-size: 10pt;
 838  }
 839  
 840  tr.rules td {
 841    border: 0px !important;
 842    background-color: transparent !important;
 843    font-weight: normal !important;
 844  }
 845  
 846  td {
 847    margin: 0px;
 848    padding: 0px;
 849  
 850    font-size: 10pt;
 851  }
 852  
 853  input[type="checkbox"] {
 854    opacity: 0.75;
 855  }
 856  
 857  input[type=text], input[type=password],
 858  table.postForm > tbody textarea,
 859  #recaptcha_response_field {
 860    margin: 0px;
 861    margin-right: 2px;
 862    padding: 2px 4px 3px 4px;
 863    border: 1px solid rgba(150, 180, 170, 0.3);
 864    outline: none;
 865    font-family: arial, helvetica, sans-serif;
 866    font-size: 10pt;
 867  }
 868  
 869  #recaptcha_response_field:not(:focus) {
 870    border: 1px solid #AAA !important;
 871  }
 872  
 873  table.postForm > tbody > tr > td > input[type=text] {
 874    width: 244px;
 875  }
 876  
 877  table.postForm > tbody > tr > td > input[name="subject"] {
 878    width: 300px;
 879  }
 880  
 881  .postblock {
 882    color: inherit;
 883    font-weight: bold;
 884    padding: 0 5px;
 885    font-size: 10pt;
 886  }
 887  
 888  div.closed {
 889    font-size: x-large;
 890    text-align: center;
 891    color: red;
 892    font-weight: bold;
 893  
 894    padding-top: 100px;
 895    padding-bottom: 100px;
 896  }
 897  
 898  .arc-ads {
 899    width: 300px;
 900    margin: 30px auto -60px auto;
 901  }
 902  
 903  .arc-ads::after {
 904    display: block;
 905    content: '';
 906    clear: both;
 907  }
 908  
 909  @media screen and (-webkit-min-device-pixel-ratio:0) {
 910    tbody textarea {
 911      margin-bottom: -3px !important;
 912      width: 292px
 913    }
 914  }
 915  
 916  .commentpostername {
 917    font-weight: bold;
 918  }
 919  
 920  .identityIcon {
 921    margin-bottom: -3px;
 922    height: 16px;
 923    width: 16px;
 924  }
 925  
 926  .stickyIcon {
 927    margin-bottom: -1px;
 928    padding-left: 2px;
 929    height: 16px;
 930    width: 16px;
 931  }
 932  
 933  .archivedIcon,
 934  .closedIcon {
 935    margin-bottom: -1px;
 936    margin-left: -1px;
 937    height: 16px;
 938    width: 16px;
 939  }
 940  
 941  .trashIcon {
 942    width: 16px;
 943    height: 16px;
 944    margin-bottom: -2px;
 945  }
 946  
 947  .fileDeleted {
 948    height: 13px;
 949    width: 172px;
 950  }
 951  
 952  .fileDeletedRes {
 953    height: 13px;
 954    width: 127px;
 955  }
 956  
 957  .navSmall {
 958    font-size: 90%;
 959  }
 960  
 961  .center {
 962    text-align: center;
 963  }
 964  
 965  .bold {
 966    font-weight: bold;
 967  }
 968  
 969  .smaller {
 970    font-size: smaller;
 971  }
 972  
 973  .password {
 974    font-size: smaller;
 975  }
 976  
 977  .passNotice {
 978    font-size: smaller;
 979    padding-left: 6px;
 980  }
 981  
 982  .qcDiv {
 983    display: none;
 984  }
 985  
 986  .qcImg {
 987    height: 1px;
 988    width: 1px;
 989    border: 0px;
 990  }
 991  
 992  .jpnFlag {
 993    height: 11px;
 994    width: 17px;
 995  }
 996  
 997  .globalMessage {
 998    color: red;
 999    text-align: center;
1000  }
1001  
1002  .highlightPost:not(.op) {
1003    background: #f0d6d6 !important;
1004    border-color: #d69595 !important;
1005  }
1006  
1007  .reply:target, .reply.highlight {
1008    box-shadow: 0 0 4px 1px #e79e4f;
1009    border: none;
1010    padding: 2px;
1011  }
1012  
1013  .hand {
1014    cursor: pointer;
1015  }
1016  
1017  .nameBlock.capcodeAdmin span.name, span.capcodeAdmin a span.name, span.capcodeAdmin span.postertrip, span.capcodeAdmin strong.capcode {
1018    color: #F00 !important;
1019  }
1020  
1021  span.capcodeFounder span.name, span.capcodeFounder span.name a, span.capcodeFounder span.postertrip, span.capcodeFounder strong.capcode {
1022    color: #117743 !important;
1023  }
1024  
1025  .nameBlock.capcodeMod span.name, span.capcodeMod a span.name, span.capcodeMod span.postertrip, span.capcodeMod strong.capcode {
1026    color: #800080 !important;
1027  }
1028  
1029  .nameBlock.capcodeDeveloper span.name, span.capcodeDeveloper a span.name, span.capcodeDeveloper span.postertrip, span.capcodeDeveloper strong.capcode {
1030    color: #0000F0 !important;
1031  }
1032  
1033  .nameBlock.capcodeManager span.name, span.capcodeManager a span.name, span.capcodeManager span.postertrip, span.capcodeManager strong.capcode {
1034    color: #FF0080 !important;
1035  }
1036  
1037  .nameBlock.capcodeVerified span.name, span.capcodeVerified span.name a, span.capcodeVerified span.postertrip, span.capcodeVerified strong.capcode {
1038    color: #007FFF !important;
1039  }
1040  
1041  #reportTypes a,
1042  .useremail {
1043    text-decoration: underline;
1044  }
1045  
1046  .omittedposts, .abbr {
1047    color: #707070;
1048  }
1049  
1050  span.spoiler {
1051    color: #000 !important;
1052    background: #000 !important;
1053  }
1054  
1055  span.spoiler:hover, span.spoiler:focus {
1056    color: #fff !important;
1057  }
1058  
1059  s, s a:not(:hover) {
1060    color: #000 !important;
1061    background: #000 !important;
1062    text-decoration: none;
1063  }
1064  
1065  s:hover, s:focus, s:hover a {
1066    color: #fff !important;
1067  }
1068  
1069  s:hover a {
1070    text-decoration: underline;
1071  }
1072  
1073  table.exif {
1074    display: none;
1075    min-width: 450px;
1076  }
1077  
1078  table.exif td {
1079    color: #707070;
1080    min-width: 150px;
1081    font-size: 8pt;
1082  }
1083  
1084  table.exif td b {
1085    text-decoration: underline;
1086  }
1087  
1088  div.posthover {
1089    max-width: 400px;
1090    margin-left: 20px;
1091  
1092  }
1093  
1094  div.posthover {
1095    padding: 5px;
1096  
1097    padding-left: 10px;
1098    padding-right: 10px;
1099  
1100  }
1101  
1102  div.posthover a.fileThumb {
1103    margin-left: 5px !important;
1104    margin-right: 10px !important;
1105  }
1106  
1107  div.posthover blockquote {
1108    margin: 5px;
1109  
1110  }
1111  
1112  div.posthover img[data-md5] {
1113    max-width: 80px;
1114    max-height: 80px;
1115  
1116    height: auto !important;
1117    width: auto !important;
1118  }
1119  
1120  div.posthover div.fileThumb {
1121    margin-left: 0px !important;
1122    margin-right: 10px !important;
1123  }
1124  
1125  #navtopright, #navbotright {
1126    float: right;
1127  }
1128  
1129  .preview {
1130    background: #F0E0D6;
1131    border-color: #707070 !important;
1132    border-width: 1px !important;
1133  }
1134  
1135  #settingsBox {
1136    position: absolute;
1137  
1138    right: 10px;
1139    margin-top: 10px;
1140  }
1141  
1142  div.backlink {
1143    font-size: x-small !important;
1144    padding-left: 10px;
1145    padding-bottom: 5px;
1146    padding-right: 10px;
1147  }
1148  
1149  .backlink span {
1150    padding-right: 5px;
1151  }
1152  
1153  .persistentNav,
1154  div#boardNavMobile {
1155    padding: 2px 4px;
1156    background-color: #F0E0D6;
1157    overflow: hidden;
1158    border-bottom: 2px solid #D9BFB7;
1159    position: fixed;
1160    top: 0px;
1161    left: 0px;
1162    right: 0px;
1163    font-size: 12px;
1164    z-index: 9001;
1165  }
1166  
1167  div#boardNavMobile select, div#boardNavMobile option {
1168    font-size: 11px;
1169  }
1170  
1171  div.boardSelect {
1172    float: left;
1173  }
1174  
1175  div.boardSelect > strong {
1176    padding-right: 5px;
1177  }
1178  
1179  div.pageJump {
1180    float: right;
1181    padding-right: 5px;
1182    padding-top: 3px;
1183  }
1184  
1185  .pageJump a {
1186    text-decoration: none;
1187    padding-right: 5px;
1188  }
1189  
1190  /** QUICK REPLY **/
1191  div.qrWindow {
1192    position: absolute;
1193    z-index: 8000;
1194  }
1195  
1196  div.qrHeader {
1197    padding: 2px;
1198    font-size: small;
1199    text-align: center;
1200  
1201  }
1202  
1203  div.qrForm {
1204    padding: 3px;
1205  }
1206  
1207  span.qrButtonHolder {
1208    position: absolute;
1209    right: 5px;
1210    text-align: right;
1211  
1212    top: 3px;
1213  }
1214  
1215  span.qrButtonHolder a {
1216    text-decoration: none;
1217  }
1218  
1219  span.qrButtonHolder img {
1220    cursor: pointer;
1221  
1222    margin-bottom: -1px;
1223    margin-top: 1px;
1224  }
1225  
1226  .extButton img {
1227    margin-top: 3px;
1228    margin-bottom: -3px;
1229    margin-left: 4px;
1230  }
1231  
1232  .qrMessage {
1233    padding: 2px;
1234    text-align: center;
1235  }
1236  
1237  .op .backlinkHr {
1238    width: 55%;
1239  }
1240  
1241  .useremail:not(:hover) .name, .useremail:not(:hover) .postertrip {
1242    color: #0000EE !important;
1243  }
1244  
1245  .useremail:hover * {
1246    color: red !important;
1247  }
1248  
1249  img.expandedImg {
1250    max-width: none !important;
1251    max-height: none !important;
1252  }
1253  
1254  /** this is not important **/
1255  #captchaContainer > img {
1256    float: left;
1257    border: 1px solid #aaa;
1258    margin-bottom: 1px;
1259  }
1260  
1261  #captchaInfo {
1262    float: left;
1263    margin-left: 5px;
1264  
1265    visibility: hidden;
1266  }
1267  
1268  #captchaResponse {
1269    width: 292px;
1270  }
1271  
1272  .prettyprint {
1273    border: none !important;
1274    background-color: #fff;
1275    padding: 5px !important;
1276    display: inline-block;
1277  
1278    max-height: 400px;
1279    overflow-x: auto;
1280    max-width: 600px;
1281    
1282    margin: 0;
1283  }
1284  
1285  .embed {
1286    position: absolute;
1287    width: 0px;
1288    height: 0px;
1289  
1290    overflow: hidden;
1291  }
1292  
1293  table.flashListing td.postblock {
1294    padding: 5px;
1295    text-align: center;
1296  }
1297  
1298  table.flashListing td {
1299    padding: 2px;
1300    font-size: 9pt;
1301  }
1302  
1303  table.flashListing td:not(.subject) {
1304    text-align: center;
1305  }
1306  
1307  table.flashListing .name {
1308    color: #117743;
1309    font-weight: bold;
1310  }
1311  
1312  table.flashListing .postertrip {
1313    color: #117743;
1314  }
1315  
1316  table.flashListing .subject {
1317    color: #cc1105;
1318    font-weight: bold;
1319  }
1320  
1321  table.flashListing tr:nth-of-type(odd) {
1322    background-color: #ede2d4;
1323  }
1324  
1325  input[type="text"], input[type="password"], textarea {
1326    -webkit-appearance: none;
1327    -webkit-border-radius: 0;
1328    border-color: #140814 !important;
1329  }
1330  
1331  .countryFlag {
1332    padding-top: 1px;
1333    margin-bottom: -1px;
1334  }
1335  
1336  .deadlink {
1337    text-decoration: line-through;
1338  }
1339  
1340  .oldpost {
1341    background: inherit;
1342    color: #f00000;
1343    font-weight: 800;
1344  }
1345  
1346  #enable-mobile {
1347    font-size: small !important;
1348  }
1349  
1350  #disable-mobile {
1351    font-size: small !important;
1352  }
1353  
1354  .mFileInfo {
1355    padding-top: 5px;
1356    text-align: center;
1357    color: #707070 !important;
1358    font-size: 9pt !important;
1359    text-decoration: none!important;
1360  }
1361  
1362  .name-col,
1363  .file-col,
1364  table.flashListing .subject {
1365    max-width: 250px;
1366    overflow: hidden;
1367    text-overflow: ellipsis;
1368    white-space: nowrap;
1369    word-wrap: break-word;
1370  }
1371  
1372  .ad-plea {
1373    margin-top: 2px;
1374    text-align: center;
1375    font-size: smaller;
1376  }
1377  
1378  .ad-plea a {
1379    text-decoration: none;
1380  }
1381  
1382  .fileText a {
1383    text-decoration: underline;
1384  }
1385  
1386  #search-box {
1387    height: 16px;
1388    line-height: 16px;
1389    margin-left: 2px;
1390    padding: 0 2px;
1391    width: 120px;
1392  }
1393  
1394  #blotter {
1395    width: 468px;
1396    margin: auto;
1397  }
1398  #blotter td {
1399    vertical-align: top;
1400    font-size: 11px;
1401  }
1402  .blotter-date {
1403    width: 50px;
1404    text-align: center;
1405  }
1406  #blotter tfoot {
1407    text-align: right;
1408    color: #140814;
1409  }
1410  .redtxt {
1411    color: red;
1412  }
1413  #blotter-msgs s {
1414    background-color: inherit !important;
1415    color: inherit !important;
1416    text-decoration: line-through;
1417  }
1418  #postForm textarea {
1419    width: 292px;
1420  }
1421  
1422  #postForm tr > td > .desktop,
1423  #ctrl-top,
1424  .navLinks.desktop,
1425  .postNum.desktop > span { color: transparent }
1426  .open-qr-wrap { color: transparent !important }
1427  .navLinks.desktop > * { color: #FF7518CF }
1428  td { border-color: #140814 !important }
1429  
1430  #postForm {
1431    width: 468px;
1432    display: none;
1433  }
1434  
1435  #togglePostFormLink {
1436    color: transparent;
1437    font-size: 22px;
1438    font-weight: bold;
1439    text-align: center;
1440  }
1441  
1442  .fileWebm:hover:before {
1443    background-color: rgba(0, 0, 0, 0.75);
1444    color: #FFF;
1445    font-weight: bold;
1446    line-height: 18px;
1447    padding: 0 3px 0 2px;
1448    position: absolute;
1449    content: 'webm';
1450    display: block;
1451    font-size: 11px;
1452    text-decoration: none;
1453  }
1454  
1455  .expandedWebm {
1456    margin: 3px 20px 5px;
1457  }
1458  
1459  #tooltip {
1460    position: absolute;
1461    background-color: #181f24;
1462    font-size: 11px;
1463    line-height: 13px;
1464    padding: 3px 6px;
1465    z-index: 100000;
1466    word-wrap: break-word;
1467    white-space: pre-line;
1468    max-width: 400px;
1469    color: #fff;
1470    text-align: center;
1471  }
1472  
1473  .tip-top-left:before,
1474  .tip-top-right:before,
1475  .tip-top:before {
1476    content:"";
1477    display:block;
1478    width:0;
1479    height:0;
1480    position:absolute;
1481    border-left: 4px solid transparent;
1482    border-right: 4px solid transparent;
1483    border-top: 4px solid #181f24;
1484    margin-left: -4px;
1485    bottom: -4px;
1486  }
1487  
1488  .tip-top:before {
1489    left: 50%;
1490  }
1491  
1492  .tip-top-right:before {
1493    left: 2px;
1494    margin-left: 0;
1495  }
1496  
1497  .tip-top-left:before {
1498    right: 2px;
1499  }
1500  
1501  .boardSelect .customBoardList,
1502  .boardSelect .custom-menu-ctrl { color: #89A; }
1503  
1504  #postFile {
1505    margin-right: 10px;
1506    width: 200px;
1507  }
1508  
1509  .dd-menu {
1510    position: absolute;
1511    font-size: 12px;
1512    line-height: 1.3em;
1513  }
1514  .dd-menu a {
1515    text-decoration: none;
1516    color: inherit !important;
1517    display: block;
1518  }
1519  .dd-menu ul {
1520    border: 1px solid;
1521    list-style: none;
1522    padding: 0;
1523    margin: 0;
1524    white-space: nowrap;
1525    border-color: #FF7518CF;
1526    border-bottom: 0;
1527    border-right-width: 1px;
1528  }
1529  .dd-menu ul ul {
1530    display: none;
1531    position: absolute;
1532  }
1533  .dd-menu li {
1534    cursor: pointer;
1535    position: relative;
1536    padding: 2px 4px;
1537    vertical-align: middle;
1538    border-bottom: 1px solid #FF7518CF;
1539  }
1540  .dd-menu li:hover {
1541    background-color: transparent;
1542  }
1543  .dd-menu li:hover ul {
1544    display: block;
1545    left: 100%;
1546    margin-top: -3px;
1547  }
1548  .dd-menu.dd-menu-left li:hover ul {
1549    left: auto;
1550    right: 100%;
1551  }
1552  
1553  .blink {
1554    -webkit-animation: blink 1.5s step-end infinite;
1555    -moz-animation: blink 1.5s step-end infinite;
1556    -o-animation: blink 1.5s step-end infinite;
1557    animation: blink 1.5s step-end infinite;
1558  }
1559  
1560  @-webkit-keyframes blink { 50% { opacity: 0 } }
1561  @-moz-keyframes blink { 50% { opacity: 0 } }
1562  @-o-keyframes blink { 50% { opacity: 0 } }
1563  @keyframes blink { 50% { opacity: 0 } }
1564  
1565  .post.reply.highlight-anti {
1566    background-color: #1a224d !important;
1567  }
1568  
1569  #quote-preview {
1570    border: 1px solid rgba(150, 180, 170, 0.3) !important;
1571  }
1572  
1573  div.post div.postInfo span.postNum a:hover, .posteruid .hand:hover,
1574  .backlink span a.quotelink:hover,
1575  a:hover, .button:hover, .dd-menu li:hover, #arc-list .quotelink:hover, s .sjis:hover {
1576    color: #ff9d1c !important;
1577    text-shadow: 0px 0px 12px rgba(217, 133, 24, 1);
1578  }
1579  
1580  .ws div.post div.postInfo span.subject {
1581    color: #5995b3;
1582  }
1583  
1584  .nws div.post div.postInfo span.subject {
1585    color: #b35968;
1586  }
1587  
1588  .flashListing .highlightPost,
1589  table.flashListing tr:nth-of-type(2n+1),
1590  div.pagelist {
1591    background-color: transparent !important;
1592    border: none !important;
1593  }
1594  
1595  div.pagelist div.cataloglink {
1596    border: none;
1597  }
1598  
1599  .panel,
1600  .preview {
1601    background-color: #241023;
1602  }
1603  
1604  #skellington {
1605    position: fixed;
1606    right: 0;
1607    bottom: 0;
1608    pointer-events: none;
1609    -webkit-animation: spookyhover 3s linear;
1610    -moz-animation: spookyhover 3s linear;
1611    animation: spookyhover 3s linear;
1612  }
1613  
1614  .topskel {
1615    transform: rotate(180deg);
1616    bottom: auto;
1617    top: 0px;
1618  }
1619  
1620  div.sideArrows, hr { visibility: hidden; }
1621  
1622  @-webkit-keyframes spookyhover { from { opacity: 0; } to { opacity: 1; } }
1623  @-moz-keyframes spookyhover { from { opacity: 0; } to { opacity: 1; } }
1624  @keyframes spookyhover { from { opacity: 0; } to { opacity: 1; } }
1625  
1626  #image-hover {
1627    -webkit-animation: spookyhover 0.2s ease-in;
1628    -moz-animation: spookyhover 0.2s ease-in;
1629    animation: spookyhover 0.2s ease-in;
1630  }
1631  
1632  @media (max-width: 480px) {
1633    .ws .dd-menu ul {
1634      background-color: #D6DAF0;
1635      border: 1px solid #B7C5D9;
1636      border-right-width: 2px;
1637    }
1638    .ws .dd-menu li {
1639      border-bottom: 1px solid #B7C5D9;
1640    }
1641    .ws .dd-menu li:hover {
1642      background-color: #EEF2FF;
1643    }
1644    .nws .dd-menu ul {
1645      background-color: #F0E0D6;
1646      border: 1px solid #D9BFB7;
1647      border-right-width: 2px;
1648    }
1649    .nws .dd-menu li {
1650      border-bottom: 1px solid #D9BFB7;
1651    }
1652    .nws .dd-menu li:hover {
1653      background-color: #FFFFEE;
1654    }
1655  }
1656  
1657  @media (min-width: 481px) {
1658    .ws div.boardBanner {
1659      color: #5995b3;
1660    }
1661  
1662    .nws div.boardBanner {
1663      color: #b35968;
1664    }
1665    
1666    .quoteLink, .quotelink, .deadlink,
1667    a, a.visited, .button, .dd-menu li,
1668    .backlink span a.quotelink,
1669    #arc-list .quotelink, s .sjis {
1670      color: #FF7518CF !important;
1671    }
1672    
1673    .middlead a img,
1674    #bannerCnt {
1675      filter: contrast(90%) brightness(90%);
1676    }
1677    
1678    select {
1679      border: 1px solid #FF7518CF;
1680      background-color: #261e37;
1681      color: #FF7518CF;
1682    }
1683    
1684    #qrForm textarea,
1685    .extPanel input[type="text"],
1686    .extPanel textarea {
1687      background-color: #261e37 !important;
1688    }
1689    
1690    .extPanel {
1691      box-shadow: 0 0 6px #000;
1692    }
1693    
1694    table.postForm > tbody > tr > td:first-child {
1695      color: inherit;
1696      font-weight: bold;
1697      padding: 0 5px;
1698      font-size: 10pt;
1699      background-color: #261e37;
1700      border: 1px solid rgba(150, 180, 170, 0.3);
1701    }
1702    
1703    .dd-menu ul {
1704      background-color: #261e37;
1705    }
1706    
1707    input::-moz-placeholder,
1708    textarea::-moz-placeholder,
1709    input::placeholder,
1710    textarea::placeholder,
1711    #quickReply #qrForm input::-moz-placeholder,
1712    #quickReply #qrForm input::placeholder,
1713    #quickReply #qrForm textarea::-moz-placeholder,
1714    #quickReply #qrForm textarea::placeholder {
1715      color: #8f95b3 !important;
1716      opacity: 0.6 !important;
1717    }
1718    
1719    input[type=text]:focus, input[type=password]:focus, input:not([type]):focus,
1720    textarea:focus, .extPanel #qrForm textarea:focus {
1721      border: 1px solid #dfbaba !important;
1722    }
1723    
1724    #quickReply textarea {
1725      color: #96b4aa;
1726    }
1727    
1728    input[type=text], input[type=password],
1729    table.postForm > tbody textarea,
1730    #recaptcha_response_field {
1731      background-color: #261e37;
1732      color: #F0F8FFD1;
1733    }
1734    
1735    a.replylink:not(:hover) {
1736      /*color: #d98518 !important;*/
1737    }
1738    
1739    .postblock {
1740      border: 1px solid rgba(150, 180, 170, 0.3);
1741    }
1742  }
1743  
1744  .ogv-cnt {
1745    position: relative;
1746    display: inline-block;
1747    text-align: center;
1748    min-height: 16px;
1749  }
1750  
1751  .ogv-cnt:not(.ogv-detached)::before {
1752    content: 'Loading…';
1753    position: absolute;
1754    top: 8px;
1755    left: 0;
1756    font-weight: bold;
1757  }
1758  
1759  .ogv-cnt.ogv-loaded::before {
1760    display: none;
1761  }
1762  
1763  .ogv-cnt > ogvjs {
1764    position: initial !important;
1765  }
1766  
1767  .ogv-ctrl {
1768    position: absolute;
1769    bottom: 0;
1770    z-index: 2;
1771    background: rgba(0, 0, 0, 0.65);
1772    width: 100%;
1773    height: 32px;
1774    gap: 0;
1775    display: none;
1776  }
1777  
1778  .ogv-btn {
1779    width: 32px;
1780    height: 32px;
1781    line-height: 32px;
1782    text-align: center;
1783    color: white;
1784  }
1785  
1786  .ogv-btn svg {
1787    vertical-align: middle;
1788  }
1789  
1790  .ogv-btn svg:last-child   {
1791    display: none;
1792  }
1793  
1794  .ogv-btn.ogv-toggled svg:first-child   {
1795    display: none;
1796  }
1797  
1798  .ogv-btn.ogv-toggled svg:last-child   {
1799    display: inline;
1800  }
1801  
1802  .ogv-ts {
1803    font-family: sans-serif;
1804    font-size: 10px;
1805    text-align: center;
1806    line-height: 32px;
1807    width: 70px;
1808    color: white;
1809    overflow: hidden;
1810  }
1811  
1812  .ogv-vol {
1813    width: 50px;
1814    margin: 0;
1815  }
1816  
1817  .ogv-seek {
1818    width: 0;
1819    margin: 0;
1820    flex-grow: 1;
1821  }