catalog_0ch.css
1 /* YUI Reset */ 2 html { 3 -moz-text-size-adjust: 100%; 4 -webkit-text-size-adjust: 100%; 5 -ms-text-size-adjust: 100%; 6 color: #000; 7 } 8 9 body, div, dl, dt, dd, ul, ol, li, pre, code, form, fieldset, legend, p, blockquote, th, td { 10 margin: 0; 11 padding: 0; 12 } 13 14 body { 15 margin-bottom: 8px; 16 font-family: 'Times New Roman', serif; 17 } 18 19 div.reply { 20 background-color: #D6DAF0; 21 } 22 .click-me { 23 border-radius: 5px; 24 margin-top: 5px; 25 padding: 2px 5px; 26 position: absolute; 27 font-weight: bold; 28 z-index: 2; 29 white-space: nowrap; 30 } 31 .burichan_new .click-me { 32 color: #000; 33 background-color: #D6DAF0; 34 border: 2px solid #B7C5D9; 35 } 36 .click-me:before { 37 content: ""; 38 border-width: 0 6px 6px; 39 border-style: solid; 40 left: 50%; 41 margin-left: -6px; 42 position: absolute; 43 width: 0; 44 height: 0; 45 top: -6px; 46 } 47 .burichan_new .click-me:before { 48 border-color: #B7C5D9 transparent; 49 } 50 .click-me:after { 51 content: ""; 52 border-width: 0 4px 4px; 53 top: -4px; 54 display: block; 55 left: 50%; 56 margin-left: -4px; 57 position: absolute; 58 width: 0; 59 height: 0; 60 } 61 .burichan_new .click-me:after { 62 border-color: #D6DAF0 transparent; 63 border-style: solid; 64 } 65 66 .party-cnt { 67 position: relative; 68 display: inline-block; 69 } 70 71 .party-hat { 72 position: absolute; 73 pointer-events: none; 74 } 75 76 .small .party-hat, 77 .extended-small .party-hat { 78 width: 100px; 79 left: -10px; 80 margin-top: -55px; 81 } 82 83 .large .party-hat, 84 .extended-large .party-hat { 85 left: -15px; 86 margin-top: -95px; 87 } 88 89 #disclaimer { 90 font-size: 14px; 91 position: absolute; 92 overflow: hidden; 93 top: 0; left: 0; 94 width: 100%; height: 100%; 95 z-index: 9998; 96 } 97 98 #disclaimer a { 99 color: #0000ff; 100 } 101 102 #disclaimer-bg { 103 position: fixed; 104 top: 0; left: 0; 105 width: 100%; height: 100%; 106 background-color: rgba(0, 0, 0, 0.25); 107 } 108 109 #disclaimer-modal { 110 z-index: 9999; 111 width: 320px; 112 top: 0; 113 left: 50%; 114 margin-left: -170px; 115 display: block; 116 padding: 10px; 117 position: relative; 118 background-color: #d6daf0; 119 box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); 120 } 121 122 #disclaimer ol { 123 margin-left: 20px; 124 padding: 0; 125 } 126 127 #disclaimer li { 128 margin: 10px 0; 129 } 130 131 #disclaimer h3 { 132 border-bottom: 1px solid #b7c5d9; 133 margin: 0; 134 padding-bottom: 5px; 135 text-align: center; 136 } 137 138 #disclaimer-modal div { 139 margin-top: 10px; 140 text-align: center; 141 } 142 143 #disclaimer-modal button { 144 margin: 0 10px; 145 } 146 147 #disclaimer-accept { 148 font-weight: bold; 149 } 150 151 #footer-links { margin-top: 5px; } 152 153 .belowLeaderboard { 154 width: 728px; 155 max-width: 100%; 156 } 157 158 .aboveMidAd { 159 width: 468px; 160 max-width: 100%; 161 } 162 163 body.hasDropDownNav { 164 margin-top: 45px; 165 } 166 167 #postFormError { 168 background-color: #e62020; 169 color: #fff; 170 font-family: monospace; 171 font-size: 13px; 172 font-weight: bold; 173 padding: 3px 5px; 174 text-shadow: 0 1px rgba(0, 0, 0, 0.2); 175 display: none; 176 margin-top: 3px; 177 } 178 179 #postFormError a { 180 color: #fff; 181 } 182 183 .painter-ctrl input, 184 #qr-painter-ctrl input { 185 width: 30px !important; 186 text-align: center; 187 } 188 189 /* reCaptcha */ 190 .recaptchatable { 191 background-color: transparent !important; 192 border: none !important; 193 } 194 195 .recaptcha_image_cell { 196 background-color: transparent !important; 197 } 198 199 #g-recaptcha { 200 height: 78px; 201 } 202 203 #recaptcha_div { 204 height: 107px; width: 442px; 205 } 206 207 #recaptcha_challenge_field { width: 400px } 208 209 @media only screen and (min-width: 481px) { 210 .recaptcha_input_area { 211 padding: 0!important; 212 } 213 #recaptcha_table tr:first-child { 214 height: auto!important; 215 } 216 217 #recaptcha_table tr:first-child > td:not(:first-child) { 218 padding: 0 7px 0 7px!important; 219 } 220 221 #recaptcha_table tr:last-child td:last-child { 222 padding-bottom: 0!important; 223 } 224 225 #recaptcha_table tr:last-child td:first-child { 226 padding-left: 0!important; 227 } 228 #recaptcha_image { 229 cursor: pointer; 230 } 231 #recaptcha_response_field { 232 width: 292px; 233 margin-right: 0px!important; 234 font-size: 10pt!important; 235 } 236 input:-moz-placeholder { color: gray !important; } 237 #recaptcha_image { 238 border: 1px solid #aaa !important; 239 } 240 #recaptcha_table tr > td:last-child { 241 display: none !important; 242 } 243 #captchaContainer { 244 width: 343px; 245 height: 86px; 246 line-height: 102px; 247 overflow: hidden; 248 } 249 #captchaContainer .placeholder { 250 font-style: italic; 251 padding-left: 5px; 252 } 253 } 254 255 #content table { 256 border-collapse: collapse; 257 border-spacing: 0; 258 } 259 260 .jpnFlag { 261 height: 11px; 262 width: 17px; 263 } 264 265 fieldset, img { 266 border: 0; 267 } 268 269 address, caption, cite, code, dfn, em, strong, th, var { 270 font-style: normal; 271 font-weight: normal; 272 } 273 274 li { 275 list-style: none; 276 } 277 278 caption, th { 279 text-align: left; 280 } 281 282 q:before, q:after { 283 content: ''; 284 } 285 286 abbr, acronym { 287 border: 0; 288 font-variant: normal; 289 } 290 291 sup { 292 vertical-align: text-top; 293 } 294 295 sub { 296 vertical-align: text-bottom; 297 } 298 299 input[type="text"], input[type="password"], textarea { 300 -webkit-appearance: none; 301 -webkit-border-radius: 0; 302 } 303 304 legend { 305 color: #000; 306 } 307 308 ins { 309 text-decoration: none; 310 } 311 312 body { 313 background-color: #EEF2FF; 314 color: #000; 315 font-size: 12pt; 316 margin-left: 0; 317 margin-right: 0; 318 margin-top: 5px; 319 padding-left: 5px; 320 padding-right: 5px; 321 } 322 323 strong { 324 font-weight: bold; 325 } 326 327 em { 328 font-style: italic; 329 } 330 331 a, 332 .button { 333 color: #34345C; 334 } 335 336 a:hover, 337 .button:hover { 338 color: #DD0000; 339 } 340 341 code { 342 padding: 1px 5px 1px 5px; 343 background-color: #EEE; 344 color: #000; 345 } 346 347 kbd { 348 background-color: #f7f7f7; 349 border: 1px solid #ccc; 350 border-radius: 3px 3px 3px 3px; 351 box-shadow: 0 1px 0 #ccc, 0 0 0 2px #fff inset; 352 font-family: monospace; 353 font-size: 11px; 354 line-height: 1.4; 355 padding: 0 5px; 356 } 357 358 p { 359 margin-bottom: 15px; 360 } 361 362 #content textarea { 363 font-size: 11px; 364 margin: 0 2px 0 0; 365 padding: 2px 4px 3px; 366 } 367 368 #content input[type="text"], 369 #content input[type="password"] { 370 font-size: 11px; 371 margin: 0px 2px; 372 padding: 1px; 373 } 374 375 #content input[type="checkbox"] { 376 vertical-align: middle; 377 } 378 379 #filters input[type="checkbox"] { 380 display: inline-block; 381 margin: auto; 382 } 383 384 img.topad, .topad > div, .topad a img { 385 width: 728px; 386 height: 90px; 387 max-width: 100%; 388 overflow: hidden; 389 margin: auto; 390 } 391 392 img.middlead, .middlead > div, .middlead a img{ 393 width: 468px; 394 height: 60px; 395 max-width: 100%; 396 overflow: hidden; 397 margin: auto; 398 } 399 400 img.bottomad, .bottomad > div, .bottomad a img { 401 width: 728px; 402 height: 90px; 403 max-width: 100%; 404 overflow: hidden; 405 margin: auto; 406 } 407 408 .button { 409 text-decoration: underline; 410 cursor: pointer; 411 border: none; 412 white-space: nowrap; 413 -moz-user-select: none; 414 -webkit-user-select: none; 415 user-select: none; 416 } 417 418 .btn-wrap:before { 419 content: '['; 420 } 421 422 .btn-wrap:after { 423 content: ']'; 424 } 425 426 .clickbox { 427 margin-right: 3px; 428 width: 16px; 429 height: 16px; 430 line-height: 16px; 431 font-size: 10px; 432 display: block; 433 text-align: center; 434 background-color: #fff; 435 border: 1px solid #aaa; 436 text-decoration: none; 437 color: #000; 438 } 439 440 /* Input box for custom colors */ 441 .custom-rgb { 442 width: 45px; 443 } 444 445 .abovePostForm { 446 width: 90%; 447 } 448 449 /* UI panels */ 450 .hidden { 451 display: none; 452 } 453 454 #backdrop { 455 background-color: rgba(0, 0, 0, 0.25); 456 text-align: center; 457 position: fixed; 458 top: 0px; 459 left: 0px; 460 width: 100%; 461 height: 100%; 462 z-index: 9002; 463 } 464 465 .panel { 466 position: absolute; 467 padding: 2px 5px 5px 5px; 468 z-index: 9003; 469 font-size: 14px; 470 box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); 471 background-color: #D6DAF0; 472 } 473 474 .panel hr { 475 border: none; 476 border-top: 1px solid rgba(0, 0, 0, 0.2); 477 } 478 479 .panel h4 { 480 font-size: 14px; 481 padding: 0; 482 margin: 10px 0px 5px 0px; 483 } 484 485 .panelHeader { 486 border-bottom: 1px solid rgba(0, 0, 0, 0.2); 487 font-size: 16px; 488 font-weight: bold; 489 margin-bottom: 5px; 490 margin-top: 5px; 491 padding-bottom: 5px; 492 text-align: center; 493 line-height: 14px; 494 } 495 496 .icon { 497 width: 18px; 498 height: 18px; 499 display: block; 500 background-size: 100%; 501 cursor: pointer; 502 position: absolute; 503 top: 5px; 504 } 505 506 .closeIcon { 507 background-image: url('//s.4cdn.org/image/buttons/burichan/cross.png'); 508 right: 5px; 509 } 510 511 .helpIcon { 512 background-image: url('//s.4cdn.org/image/buttons/burichan/question.png'); 513 right: 23px; 514 } 515 516 .expandIcon { 517 background-image: url('//s.4cdn.org/image/buttons/burichan/post_expand_plus.png'); 518 right: 23px; 519 } 520 521 .collapseIcon { 522 background-image: url('//s.4cdn.org/image/buttons/burichan/post_expand_minus.png'); 523 right: 23px; 524 } 525 526 .watchIcon, 527 .unwatchIcon { 528 height: 18px; 529 position: absolute; 530 width: 18px; 531 cursor: pointer; 532 visibility: hidden; 533 } 534 535 .watchIcon { 536 background-image: url('//s.4cdn.org/image/buttons/burichan/watch_thread_off.png'); 537 } 538 539 .unwatchIcon { 540 background-image: url('//s.4cdn.org/image/buttons/burichan/watch_thread_on.png'); 541 } 542 543 .thread:hover .watchIcon, 544 .thread:hover .unwatchIcon { 545 visibility: visible; 546 } 547 548 .threadIcons { 549 display: inline; 550 height: 16px; 551 margin: 2px 0 0 -101px; 552 position: absolute; 553 width: 100px; 554 text-align: right; 555 } 556 557 .threadIcon { 558 width: 16px; 559 height: 16px; 560 display: inline-block; 561 } 562 563 .stickyIcon { 564 background-image: url('//s.4cdn.org/image/sticky.gif'); 565 } 566 567 .closedIcon { 568 background-image: url('//s.4cdn.org/image/closed.gif'); 569 } 570 571 .adminIcon { 572 background-image: url('//s.4cdn.org/image/adminicon.gif'); 573 } 574 575 .founderIcon { 576 background-image: url('//s.4cdn.org/image/foundericon.gif'); 577 } 578 579 .modIcon { 580 background-image: url('//s.4cdn.org/image/modicon.gif'); 581 } 582 583 .developerIcon { 584 background-image: url('//s.4cdn.org/image/developericon.gif'); 585 } 586 587 .managerIcon { 588 background-image: url('//s.4cdn.org/image/managericon.gif'); 589 } 590 591 .imgdel { 592 padding: 20px 14px; 593 min-height: 0 !important; 594 width: 127px; 595 height: 13px; 596 } 597 598 .nofile { 599 padding: 20px 36px; 600 min-height: 0 !important; 601 } 602 603 .refreshIcon { 604 background-image: url('//s.4cdn.org/image/buttons/burichan/refresh.png'); 605 } 606 607 .rotateIcon { 608 background-image: url('//s.4cdn.org/image/buttons/burichan/post_expand_rotate.gif'); 609 } 610 611 @media (-webkit-min-device-pixel-ratio: 2.0), 612 (min--moz-device-pixel-ratio: 2), 613 (min-resolution: 2dppx) 614 { 615 .closeIcon { 616 background-image: url('//s.4cdn.org/image/buttons/burichan/cross@2x.png'); 617 } 618 619 .helpIcon { 620 background-image: url('//s.4cdn.org/image/buttons/burichan/question@2x.png'); 621 } 622 623 .expandIcon { 624 background-image: url('//s.4cdn.org/image/buttons/burichan/post_expand_plus@2x.png'); 625 background-size: 100%; 626 } 627 628 .collapseIcon { 629 background-image: url('//s.4cdn.org/image/buttons/burichan/post_expand_minus@2x.png'); 630 background-size: 100%; 631 } 632 633 .stickyIcon { 634 background-image: url('//s.4cdn.org/image/sticky@2x.gif'); 635 background-size: 100%; 636 } 637 638 .closedIcon { 639 background-image: url('//s.4cdn.org/image/closed@2x.gif'); 640 background-size: 100%; 641 } 642 643 .adminIcon { 644 background-image: url('//s.4cdn.org/image/adminicon@2x.gif'); 645 background-size: 100%; 646 } 647 648 .modIcon { 649 background-image: url('//s.4cdn.org/image/modicon@2x.gif'); 650 background-size: 100%; 651 } 652 653 .developerIcon { 654 background-image: url('//s.4cdn.org/image/developericon@2x.gif'); 655 background-size: 100%; 656 } 657 658 .managerIcon { 659 background-image: url('//s.4cdn.org/image/managericon@2x.gif'); 660 background-size: 100%; 661 } 662 663 .refreshIcon { 664 background-image: url('//s.4cdn.org/image/buttons/burichan/refresh@2x.png'); 665 background-size: 100%; 666 } 667 668 .rotateIcon { 669 background-image: url('//s.4cdn.org/image/buttons/burichan/post_expand_rotate@2x.gif'); 670 background-size: 100%; 671 } 672 673 .watchIcon { 674 background-image: url('//s.4cdn.org/image/buttons/burichan/watch_thread_off@2x.png'); 675 background-size: 100%; 676 } 677 678 .unwatchIcon { 679 background-image: url('//s.4cdn.org/image/buttons/burichan/watch_thread_on@2x.png'); 680 background-size: 100%; 681 } 682 683 } 684 685 .clickset { 686 margin-bottom: 8px; 687 } 688 689 .clickset li { 690 clear: both; 691 margin-bottom: 2px; 692 line-height: 20px; 693 } 694 695 .inputset { 696 margin-bottom: 3px; 697 } 698 699 /* Notifications */ 700 .msg-error, 701 .msg-ok { 702 border-radius: 3px; 703 padding: 1px 5px 1px 5px; 704 } 705 706 .msg-ok { 707 background-color: #EEF2FF; 708 color: #000; 709 } 710 711 .msg-error { 712 background-color: #E62020; 713 color: #fff; 714 } 715 716 .error { 717 color: red; 718 font-size: x-large; 719 font-weight: bold 720 } 721 722 /***************************************************************/ 723 /* Info bar: update time, order, etc on the left */ 724 /* Settings bar: buttons on the right */ 725 #info { 726 float: left; 727 } 728 729 #settings { 730 float: right; 731 text-align: right; 732 } 733 734 #filtered-count, 735 #hidden-count, 736 #filtered-count-bottom, 737 #hidden-count-bottom, 738 #search-term, 739 #search-term-bottom, 740 #ordered-by { 741 font-weight: bold; 742 } 743 744 #filtered-label, 745 #hidden-label, 746 #filtered-label-bottom, 747 #hidden-label-bottom, 748 #search-label, 749 #search-label-bottom { 750 display: none; 751 } 752 753 /* Search "Quickfilter" Bar related elements */ 754 #qf-cnt { 755 display: none; 756 } 757 758 #qf-clear { 759 text-decoration: none; 760 } 761 762 #qf-box { 763 width: 75px; 764 margin-right: 5px; 765 } 766 767 /* Top and bottom navigation menus */ 768 div#boardNavDesktopFoot, 769 .boardnav { 770 color: #333; 771 font-size: 11pt; 772 } 773 774 .hasDropDownNav #navtopright { 775 display: none; 776 } 777 778 #boardNavDesktop .pageJump { 779 padding: 0; 780 } 781 782 #boardNavDesktop .pageJump a { 783 padding-right: 5px; 784 } 785 786 #bottomnav { 787 clear: both; 788 } 789 790 .persistentNav, 791 div#boardNavMobile { 792 padding: 2px 4px; 793 background-color: #D6DAF0; 794 overflow: hidden; 795 position: fixed; 796 top: 0; 797 left: 0; 798 right: 0; 799 z-index: 9001; 800 } 801 802 div#boardNavMobile { 803 font-size: 12px; 804 } 805 806 div#boardNavDesktop a { 807 padding: 1px; 808 } 809 810 .autohide-nav { transition: top 0.2s ease-in-out } 811 812 div#boardNavMobile select, div#boardNavMobile option { 813 font-size: 11px; 814 } 815 816 div.boardSelect { 817 float: left; 818 } 819 820 div.boardSelect > strong { 821 padding-right: 5px; 822 } 823 824 div.pageJump { 825 float: right; 826 padding-right: 5px; 827 padding-top: 3px; 828 } 829 830 .pageJump a { 831 text-decoration: none; 832 padding-right: 5px; 833 } 834 835 .navLinks .btn-wrap { 836 display: inline; 837 } 838 839 #navtopright, 840 #navbotright { 841 float: right; 842 } 843 844 .navSmall { 845 font-size: 90%; 846 } 847 848 #styleSwitcher { 849 float: right; 850 } 851 852 #globalMessage { 853 color: red; 854 text-align: center; 855 } 856 857 #toggleMsgBtn { 858 width: 18px; 859 height: 18px; 860 display: block; 861 cursor: pointer; 862 top: 5px; 863 float: left; 864 margin-bottom: 6px; 865 } 866 867 div.boardBanner { 868 color: #AF0A0F; 869 text-align: center; 870 clear: both; 871 } 872 873 #bannerCnt { 874 margin: 5px auto; 875 width: 300px; 876 height: 100px; 877 max-width: 100%; 878 } 879 880 div.boardBanner > div.boardTitle { 881 font-size: 24pt; 882 font-weight: bold; 883 margin-top: 0px; 884 } 885 886 div.boardBanner > div.boardSubtitle { 887 font-size: 10pt; 888 } 889 890 div#boardNavDesktopFoot { 891 clear: both; 892 padding-top: 10px; 893 padding-bottom: 3px; 894 } 895 896 div#boardNavDesktopFoot a { 897 font-weight: normal; 898 } 899 900 div.homelink { 901 float: right 902 } 903 904 div#absbot { 905 text-align: center; 906 font-size: 8pt !important; 907 padding-bottom: 4px; 908 padding-top: 10px; 909 clear: both; 910 } 911 912 /***************************************************************/ 913 914 /* Theme editor panel */ 915 #theme { 916 width: 330px; 917 top: 60px; 918 left: 50%; 919 margin-left: -178px; 920 } 921 922 .settings-field { 923 margin-top: 5px; 924 width: 100%; 925 } 926 927 #theme-css { 928 font-family: 'DejaVu Sans Mono', 'Consolas', 'Andale Mono', 'Lucida Console', monospace; 929 width: 320px; 930 min-width: 320px; 931 } 932 933 #theme-msg { 934 position: absolute; 935 margin-top: 4px; 936 } 937 938 #theme-btns { 939 margin-top: 5px; 940 margin-bottom: 3px; 941 } 942 943 /***************************************************************/ 944 945 /* Filters panel */ 946 #filters { 947 width: 380px; 948 top: 60px; 949 left: 50%; 950 margin-left: -190px; 951 } 952 953 #filters-search { 954 position: absolute; 955 left: 4px; 956 width: 50px; 957 font-size: 11px; 958 padding: 0px 2px; 959 } 960 961 #filters-search:focus { 962 width: 85px; 963 } 964 965 #filters .clickbox { 966 margin: auto; 967 } 968 969 /* Filters help panel */ 970 #filters-protip { 971 width: 570px; 972 top: 50px; 973 left: 50%; 974 margin-left: -295px; 975 padding-left: 10px; 976 padding-right: 10px; 977 } 978 979 #filters-protip h4:before { 980 content: "»"; 981 margin-right: 3px; 982 } 983 984 #filters-protip h4 { 985 font-size: 15px; 986 } 987 988 @media all and (max-width: 605px) { 989 #filters-protip { 990 left: 0; 991 margin-left: 0; 992 } 993 } 994 995 #filters-protip ul { 996 margin-bottom: 10px; 997 } 998 999 #filters-protip li { 1000 margin: 5px 0px; 1001 } 1002 1003 /* Filters color palette */ 1004 #filter-palette { 1005 position: fixed; 1006 width: 100%; 1007 height: 100%; 1008 z-index: 9004; 1009 top: 0; 1010 left: 0; 1011 } 1012 1013 #colorpicker { 1014 position: fixed; 1015 padding: 4px; 1016 } 1017 1018 #colorpicker table td { 1019 padding: 2px; 1020 text-align: center; 1021 } 1022 1023 #filter-rgb-ok { 1024 float: right; 1025 background-color: transparent; 1026 } 1027 1028 #filter-table { 1029 width: 100%; 1030 } 1031 1032 #filter-table th { 1033 font-weight: bold; 1034 font-size: 11px; 1035 min-width: 20px; 1036 } 1037 1038 #filter-table th, 1039 #filter-table td { 1040 text-align: center; 1041 } 1042 1043 #filter-table tbody td { 1044 padding: 8px 0px 0px 0px; 1045 } 1046 1047 #filter-table tfoot td { 1048 padding-top: 20px; 1049 } 1050 1051 #filter-color-table .clickbox { 1052 box-shadow: 0 0 2px rgba(0, 0, 0, 0.2); 1053 margin: auto; 1054 } 1055 1056 .filter-pattern { 1057 width: 140px; 1058 } 1059 1060 .filter-color:hover { 1061 color: #000; 1062 } 1063 1064 .filter-hits { 1065 font-size: 12px; 1066 } 1067 1068 .filter-boards { 1069 width: 30px; 1070 } 1071 1072 #theme-msg, 1073 #filters-msg { 1074 display: none; 1075 } 1076 1077 /***************************************************************/ 1078 1079 /* Threads main container */ 1080 #threads { 1081 padding: 20px 0px; 1082 text-align: center; 1083 } 1084 1085 /* Thread wrapper */ 1086 .thread { 1087 vertical-align: top; 1088 display: inline-block; 1089 word-wrap: break-word; 1090 overflow: hidden; 1091 margin-top: 5px; 1092 padding: 5px 0 3px 0; 1093 position: relative; 1094 } 1095 1096 .thread a { 1097 border: none; 1098 } 1099 1100 .thread img { 1101 display: inline; 1102 } 1103 1104 /* Thread in small mode, teaser off */ 1105 .small .thread { 1106 width: 165px; 1107 } 1108 1109 /* Thread in large mode, teaser off */ 1110 .large .thread { 1111 width: 270px; 1112 } 1113 1114 /* Thread in small mode with teaser displayed */ 1115 .extended-small .thread { 1116 width: 165px; 1117 max-height: 320px; 1118 } 1119 1120 /* Thread in large mode with teaser displayed */ 1121 .extended-large .thread { 1122 width: 270px; 1123 max-height: 410px; 1124 } 1125 1126 /* "On top" (highlighted) thumbnails */ 1127 .hl { 1128 border-style: solid; 1129 border-width: 3px; 1130 } 1131 1132 /* Watched (pinned) thumbnails */ 1133 .pinned { 1134 border: 3px dashed #34345C; 1135 } 1136 1137 .pinned:hover { 1138 border-color: red; 1139 } 1140 1141 /* Thumbnails */ 1142 .thumb { 1143 display: block; 1144 margin: auto; 1145 z-index: 2; 1146 box-shadow: 0 0 5px rgba(0, 0, 0, 0.25); 1147 min-height: 50px; 1148 min-width: 50px; 1149 } 1150 1151 /* Replies / images / page indicators */ 1152 .meta { 1153 cursor: help; 1154 font-size: 10px; 1155 line-height: 8px; 1156 margin-top: 1px; 1157 } 1158 1159 .teaser { 1160 display: none; 1161 } 1162 1163 /* Teaser, displayed */ 1164 .extended-small .teaser, 1165 .extended-large .teaser { 1166 display: block; 1167 } 1168 1169 /* spoilers */ 1170 .teaser s { 1171 background-color: #000; 1172 color: #000; 1173 text-decoration: none; 1174 } 1175 1176 .teaser s:focus, 1177 .teaser s:hover { 1178 color: #fff; 1179 } 1180 1181 /***************************************************************/ 1182 1183 .left { 1184 float: left; 1185 } 1186 1187 .right { 1188 float: right; 1189 } 1190 1191 .clear { 1192 clear: both; 1193 } 1194 1195 .close { 1196 margin-left: 3px; 1197 } 1198 1199 .center { 1200 text-align: center; 1201 margin: auto; 1202 } 1203 1204 .mobile { 1205 display: none; 1206 } 1207 1208 #absbot a { 1209 text-decoration: underline; 1210 } 1211 1212 #absbot a:hover { 1213 color: #DD0000; 1214 } 1215 1216 /***************************************************************/ 1217 1218 /* Thread Watcher */ 1219 #threadWatcher { 1220 max-width: 265px; 1221 display: block; 1222 position: absolute; 1223 padding: 3px; 1224 border: 1px solid rgba(0, 0, 0, 0.20); 1225 background-color: #D6DAF0; 1226 padding: 3px; 1227 } 1228 1229 #twHeader { 1230 font-weight: bold; 1231 text-align: center; 1232 height: 17px; 1233 cursor: move; 1234 line-height: 1; 1235 user-select: none; 1236 -moz-user-select: none; 1237 -webkit-user-select: none; 1238 } 1239 1240 #twPrune { 1241 position: relative; 1242 top: 0; 1243 margin-left: 3px; 1244 margin-top: -1px; 1245 float: right; 1246 } 1247 1248 #watchList { 1249 margin: 0; 1250 padding: 0; 1251 user-select: none; 1252 -moz-user-select: none; 1253 -webkit-user-select: none; 1254 } 1255 1256 #watchList li:first-child { 1257 margin-top: 3px; 1258 padding-top: 2px; 1259 border-top: 1px solid rgba(0, 0, 0, 0.20); 1260 } 1261 1262 #watchList a { 1263 text-decoration: none; 1264 } 1265 1266 #watchList li { 1267 overflow: hidden; 1268 white-space: nowrap; 1269 text-overflow: ellipsis; 1270 } 1271 1272 .hasNewReplies { font-weight: bold; } 1273 .hasYouReplies { font-style: italic; } 1274 .archivelink { opacity: 0.5; } 1275 1276 .deadlink { 1277 text-decoration: line-through; 1278 } 1279 1280 .pointer { 1281 cursor: pointer; 1282 } 1283 1284 /***************************************************************/ 1285 1286 /* The Click Me */ 1287 #first-run { 1288 border-radius: 5px; 1289 margin-top: 5px; 1290 margin-left: -7px; 1291 padding: 2px 5px; 1292 position: absolute; 1293 font-weight: bold; 1294 color: #000; 1295 background-color: #D6DAF0; 1296 border: 2px solid #B7C5D9; 1297 } 1298 1299 #first-run:before { 1300 content: ""; 1301 border-width: 0 6px 6px; 1302 border-style: solid; 1303 left: 50%; 1304 margin-left: -6px; 1305 position: absolute; 1306 width: 0; 1307 height: 0; 1308 top: -6px; 1309 border-color: #B7C5D9 transparent; 1310 } 1311 1312 #first-run:after { 1313 content: ""; 1314 border-width: 0 4px 4px; 1315 top: -4px; 1316 display: block; 1317 left: 50%; 1318 margin-left: -4px; 1319 position: absolute; 1320 width: 0; 1321 height: 0; 1322 border-color: #D6DAF0 transparent; 1323 border-style: solid; 1324 } 1325 1326 /* Tooltips */ 1327 #post-preview { 1328 position: absolute; 1329 background-color: black; 1330 border-radius: 3px; 1331 font-size: 11pt; 1332 padding: 5px 8px 4px 8px; 1333 z-index: 100000; 1334 word-wrap: break-word; 1335 max-width: 400px; 1336 color: white; 1337 font-family: arial, helvetica, sans-serif; 1338 font-size: 10pt; 1339 } 1340 1341 .post-author { 1342 color: #00A550; 1343 font-weight: bold; 1344 } 1345 1346 .post-subject { 1347 font-weight: bold; 1348 } 1349 1350 .post-tripcode { 1351 color: #00A550; 1352 font-weight: normal; 1353 } 1354 1355 .post-teaser { 1356 margin: 3px 0 0 0; 1357 padding: 0; 1358 } 1359 1360 .post-page { 1361 font-size: 90%; 1362 color: #7d807e; 1363 display: inline-block; 1364 white-space: nowrap; 1365 word-wrap: normal; 1366 max-width: 100px; 1367 overflow: hidden; 1368 text-overflow: ellipsis; 1369 vertical-align: text-top; 1370 margin-left: 3px; 1371 } 1372 1373 .post-page:before { 1374 content: '('; 1375 } 1376 1377 .post-page:after { 1378 content: ')'; 1379 } 1380 1381 .post-last { 1382 color: #bbbfbd; 1383 font-size: 90%; 1384 margin-top: 3px; 1385 } 1386 1387 .admin-capcode { 1388 color: #FF0000; 1389 } 1390 1391 .founder-capcode { 1392 color: #117743; 1393 } 1394 1395 .mod-capcode { 1396 color: #800080; 1397 } 1398 1399 .developer-capcode { 1400 color: #0000F0; 1401 } 1402 1403 .manager-capcode { 1404 color: #FF0080; 1405 } 1406 1407 #enable-mobile { 1408 font-size: small !important; 1409 } 1410 1411 #disable-mobile { 1412 font-size: small !important; 1413 display: none !important; 1414 } 1415 1416 /* Post form */ 1417 table { 1418 border-spacing: 1px; 1419 1420 margin-left: auto; 1421 margin-right: auto; 1422 } 1423 1424 table.postForm > tbody > tr > td:first-child { 1425 background-color: #98E; 1426 color: #000; 1427 font-weight: bold; 1428 } 1429 1430 tr.rules td { 1431 border: 0px !important; 1432 background-color: transparent !important; 1433 font-weight: normal !important; 1434 } 1435 1436 table#postForm td { 1437 margin: 0px; 1438 padding: 0px; 1439 } 1440 1441 table.postForm > tbody > tr > td > input[type=text] { 1442 width: 244px; 1443 } 1444 1445 table.postForm > tbody > tr > td > input[name="subject"] { 1446 width: 300px; 1447 } 1448 1449 textarea[name="com"] { 1450 width: 296px; 1451 } 1452 1453 #recaptcha_response_field { 1454 border: 1px solid #aaa !important; 1455 width: 300px !important; 1456 font-size: 10pt !important; 1457 padding: 0px; 1458 } 1459 1460 table.postForm input[type="submit"] { 1461 margin-left: 5px; 1462 } 1463 1464 .postblock { 1465 background-color: #98E; 1466 color: #000; 1467 font-weight: bold; 1468 padding: 0 5px; 1469 } 1470 1471 .passNotice { 1472 font-size: smaller; 1473 padding-left: 6px; 1474 } 1475 1476 .password { 1477 font-size: smaller; 1478 } 1479 1480 input[type="password"] { 1481 width: 70px; 1482 } 1483 1484 .rules { 1485 margin-top: 5px; 1486 } 1487 1488 .rules li { 1489 font-size: 11px; 1490 list-style: none outside none; 1491 } 1492 1493 .rules li:before { 1494 content: "• "; 1495 } 1496 1497 #togglePostForm { 1498 text-align: center; 1499 margin-top: 5px; 1500 font-size: 24px; 1501 font-weight: bold; 1502 } 1503 1504 iframe[src="about:blank"] { 1505 display: none; 1506 } 1507 1508 @media screen and (-webkit-min-device-pixel-ratio:0) { 1509 tbody textarea { 1510 margin-bottom: -3px !important; 1511 } 1512 } 1513 1514 .text_only #threads table { 1515 width: 80%; 1516 border-collapse: separate; 1517 border-spacing: 2px; 1518 } 1519 1520 .text_only #threads th { 1521 font-weight: bold; 1522 padding: 4px 2px; 1523 text-align: center; 1524 } 1525 1526 .text_only #threads td { 1527 padding: 4px 2px; 1528 } 1529 1530 .text_only #threads .txt-sub { 1531 text-align: left; 1532 } 1533 1534 .text_only .hl { 1535 border: none; 1536 } 1537 1538 .text_only .pinned td:first-child { 1539 box-shadow: -1px 0 #000; 1540 } 1541 1542 .txt-ctrl { width: 25px; } 1543 .txt-no { width: 90px; } 1544 .txt-rep { width: 100px; } 1545 .txt-date { width: 200px; } 1546 1547 @media only screen and (max-width: 480px) { 1548 .txt-ctrl, 1549 .txt-date { display: none } 1550 .text_only #threads table { 1551 width: 100%; 1552 } 1553 } 1554 1555 .postMenuBtn { 1556 margin-left: 5px; 1557 text-decoration: none; 1558 line-height: 1em; 1559 display: inline-block; 1560 -webkit-transition: -webkit-transform 0.1s; 1561 -moz-transition: -moz-transform 0.1s; 1562 transition: transform 0.1s; 1563 width: 1em; 1564 height: 1em; 1565 text-align: center; 1566 outline: none; 1567 opacity: 0.5; 1568 } 1569 1570 .postMenuBtn:hover{ 1571 opacity: 1; 1572 } 1573 1574 .postMenuBtn { 1575 color: #000080; 1576 } 1577 1578 .menuOpen { 1579 -webkit-transform: rotate(90deg); 1580 -moz-transform: rotate(90deg); 1581 -ms-transform: rotate(90deg); 1582 transform: rotate(90deg); 1583 } 1584 1585 .dd-menu { 1586 position: absolute; 1587 font-size: 13px; 1588 line-height: 1.3em; 1589 } 1590 .dd-menu a { 1591 text-decoration: none; 1592 color: inherit !important; 1593 display: block; 1594 } 1595 .dd-menu ul { 1596 background-color: #D6DAF0; 1597 border: 1px solid #B7C5D9; 1598 border-bottom: none; 1599 list-style: none; 1600 padding: 0; 1601 margin: 0; 1602 white-space: nowrap; 1603 } 1604 .dd-menu ul ul { 1605 display: none; 1606 position: absolute; 1607 } 1608 .dd-menu li { 1609 cursor: pointer; 1610 position: relative; 1611 padding: 2px 4px; 1612 vertical-align: middle; 1613 border-bottom: 1px solid #B7C5D9; 1614 } 1615 .dd-menu li:hover { 1616 background-color: #EEF2FF; 1617 } 1618 .dd-menu li:hover ul { 1619 display: block; 1620 left: 100%; 1621 margin-top: -3px; 1622 } 1623 .dd-menu.dd-menu-left li:hover ul { 1624 left: auto; 1625 right: 100%; 1626 } 1627 1628 .ad-plea { 1629 margin-top: 2px; 1630 text-align: center; 1631 font-size: smaller; 1632 } 1633 1634 #blotter { 1635 width: 468px; 1636 margin: auto; 1637 } 1638 #blotter td { 1639 vertical-align: top; 1640 font-size: 11px; 1641 } 1642 .blotter-date { 1643 width: 50px; 1644 text-align: center; 1645 } 1646 #blotter tfoot { 1647 text-align: right; 1648 } 1649 .redtxt { 1650 color: red; 1651 } 1652 #blotter-msgs s { 1653 background-color: inherit !important; 1654 color: inherit !important; 1655 text-decoration: line-through; 1656 } 1657 #postForm { 1658 width: 468px; 1659 display: none; 1660 } 1661 1662 #togglePostFormLink { 1663 font-size: 22px; 1664 font-weight: bold; 1665 text-align: center; 1666 } 1667 #postForm textarea { 1668 width: 292px; 1669 }