The version of vichan running on lainchan.org
You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

1536 lines
23KB

  1. /**
  2. * volafile.css fuck you
  3. color change by kalyx
  4. */
  5. @import url("/stylesheets/dark.css");
  6. @font-face
  7. {
  8. font-family: "DejaVuSansMono";
  9. src: url("/stylesheets/fonts/DejaVuSansMono.ttf") format("truetype");
  10. }
  11. @font-face
  12. {
  13. font-family: 'lain';
  14. src: url('./fonts/nrdyyh.woff') format('woff'),
  15. url('./fonts/tojcxo.TTF') format('truetype');
  16. }
  17. /**
  18. * volafile.css fuck you
  19. color change by kalyx
  20. */
  21. @import url("/stylesheets/dark.css");
  22. @font-face
  23. {
  24. font-family: "DejaVuSansMono";
  25. src: url("/stylesheets/fonts/DejaVuSansMono.ttf") format("truetype");
  26. }
  27. @font-face
  28. {
  29. font-family: 'lain';
  30. src: url('./fonts/nrdyyh.woff') format('woff'),
  31. url('./fonts/tojcxo.TTF') format('truetype');
  32. }
  33. @font-face {
  34. font-family: "Normal";
  35. src: url(./fonts/PixelOperator.ttf);
  36. }
  37. .hidden {
  38. display:none;
  39. }
  40. a,a:visited {
  41. text-decoration: underline;
  42. color: #34345C;
  43. }
  44. a:hover,.intro a.post_no:hover {
  45. color: #ff0000;
  46. }
  47. a.post_no {
  48. text-decoration: none;
  49. margin: 0;
  50. padding: 0;
  51. }
  52. .intro a.post_no {
  53. color: inherit;
  54. }
  55. .intro a.post_no,p.intro a.email,p.intro a.post_anchor {
  56. margin: 0;
  57. }
  58. .intro a.email span.name {
  59. color: #34345C;
  60. }
  61. .intro a.email:hover span.name {
  62. color: #ff0000;
  63. }
  64. .intro label {
  65. display: inline;
  66. }
  67. .intro time,p.intro a.ip-link,p.intro a.capcode {
  68. direction: ltr;
  69. unicode-bidi: embed;
  70. }
  71. h2 {
  72. color: #AF0A0F;
  73. font-size: 11pt;
  74. margin: 0;
  75. padding: 0;
  76. }
  77. header {
  78. margin: 1em 0;
  79. }
  80. h1 {
  81. font-family: tahoma;
  82. letter-spacing: -2px;
  83. font-size: 20pt;
  84. margin: 0;
  85. }
  86. header div.subtitle,h1 {
  87. color: #888;
  88. text-align: center;
  89. }
  90. header div.subtitle {
  91. font-size: 16px;
  92. }
  93. form {
  94. margin-bottom: 4em;
  95. }
  96. form table {
  97. margin: auto;
  98. }
  99. form table input {
  100. height: auto;
  101. }
  102. input[type="text"],input[type="password"],textarea {
  103. border: 1px solid #a9a9a9;
  104. text-indent: 0;
  105. text-shadow: none;
  106. text-transform: none;
  107. word-spacing: normal;
  108. max-width: 100%;
  109. }
  110. #quick-reply input[type="text"], input[type="password"], #quick-reply textarea {
  111. max-width: 100%;
  112. }
  113. textarea {
  114. width: 100%;
  115. }
  116. form table tr td {
  117. text-align: left;
  118. margin: 0;
  119. padding: 0;
  120. }
  121. form table.mod tr td {
  122. padding: 2px;
  123. }
  124. form table tr th {
  125. text-align: left;
  126. padding: 4px;
  127. }
  128. form table tr th {
  129. background: #98E;
  130. }
  131. form table tr td div.center {
  132. text-align: center;
  133. float: left;
  134. padding-left: 3px;
  135. }
  136. form table tr td div input {
  137. display: block;
  138. margin: 2px auto 0 auto;
  139. }
  140. form table tr td div label {
  141. font-size: 16px;
  142. }
  143. .unimportant,.unimportant * {
  144. font-size: 16px;
  145. }
  146. .file {
  147. float: left;
  148. margin-right: 2px;
  149. }
  150. .file:not(.multifile) .post-image {
  151. float: left;
  152. }
  153. .file:not(.multifile) {
  154. float: none;
  155. }
  156. p.fileinfo {
  157. display: block;
  158. margin: 0 0 0 20px;
  159. }
  160. div.post p.fileinfo {
  161. padding-left: 5px;
  162. }
  163. div.banner {
  164. background-color: #E04000;
  165. font-size: 16pt;
  166. font-weight: bold;
  167. text-align: center;
  168. margin: 1em 0;
  169. }
  170. div.banner,div.banner a {
  171. color: white;
  172. }
  173. div.banner a:hover {
  174. color: #EEF2FF;
  175. text-decoration: none;
  176. }
  177. img.banner,img.board_image {
  178. display: block;
  179. border: 1px solid #a9a9a9;
  180. margin: 12px auto 0 auto;
  181. }
  182. .post-image {
  183. display: block;
  184. float: left;
  185. margin: 5px 20px 10px 20px;
  186. border: none;
  187. }
  188. .full-image {
  189. max-width: 98%;
  190. }
  191. div.post .post-image {
  192. padding: 5px;
  193. margin: 0 20px 0 0;
  194. }
  195. div.post img.icon {
  196. display: inline;
  197. margin: 0 5px;
  198. padding: 0;
  199. }
  200. div.post i.fa {
  201. margin: 0 4px;
  202. font-size: 16px;
  203. }
  204. div.post.op {
  205. margin-right: 20px;
  206. margin-bottom: 5px;
  207. }
  208. div.post.op hr {
  209. border-color: #D9BFB7;
  210. }
  211. .intro {
  212. margin: 0.5em 0;
  213. padding: 0;
  214. padding-bottom: 0.2em;
  215. }
  216. input.delete {
  217. float: left;
  218. margin: 1px 6px 0 0;
  219. }
  220. .intro span.subject {
  221. color: #0F0C5D;
  222. font-weight: bold;
  223. }
  224. .intro span.name {
  225. color: #117743;
  226. font-weight: bold;
  227. }
  228. .intro span.capcode,p.intro a.capcode,p.intro a.nametag {
  229. color: #F00000;
  230. margin-left: 0;
  231. }
  232. .intro a {
  233. margin-left: 8px;
  234. }
  235. div.delete {
  236. float: right;
  237. }
  238. div.post.reply p {
  239. margin: 0.3em 0 0 0;
  240. }
  241. div.post.reply div.body {
  242. margin-left: 1.8em;
  243. margin-top: 0.8em;
  244. padding-right: 3em;
  245. padding-bottom: 0.3em;
  246. }
  247. div.post.reply.highlighted {
  248. background: #D6BAD0;
  249. }
  250. div.post.reply div.body a {
  251. color: #D00;
  252. }
  253. div.post {
  254. padding-left: 20px;
  255. }
  256. div.post div.body {
  257. word-wrap: break-word;
  258. white-space: pre-wrap;
  259. }
  260. div.post.reply {
  261. background: #D6DAF0;
  262. margin: 0.2em 4px;
  263. padding: 0.2em 0.3em 0.5em 0.6em;
  264. border-width: 1px;
  265. border-style: none solid solid none;
  266. border-color: #B7C5D9;
  267. display: inline-block;
  268. max-width: 94%!important;
  269. }
  270. span.trip {
  271. color: #228854;
  272. }
  273. span.quote {
  274. color: #789922;
  275. }
  276. span.omitted {
  277. display: block;
  278. margin-top: 1em;
  279. }
  280. br.clear {
  281. clear: left;
  282. display: block;
  283. }
  284. span.controls {
  285. float: right;
  286. margin: 0;
  287. padding: 0;
  288. font-size: 80%;
  289. }
  290. span.controls.op {
  291. float: none;
  292. margin-left: 10px;
  293. }
  294. span.controls a {
  295. margin: 0;
  296. }
  297. div#wrap {
  298. width: 900px;
  299. margin: 0 auto;
  300. }
  301. div.ban {
  302. background: white;
  303. border: 1px solid #98E;
  304. max-width: 700px;
  305. margin: 30px auto;
  306. }
  307. div.ban p,div.ban h2 {
  308. padding: 3px 7px;
  309. }
  310. div.ban h2 {
  311. background: #98E;
  312. color: black;
  313. font-size: 16pt;
  314. }
  315. div.ban p {
  316. font-size: 16px;
  317. margin-bottom: 12px;
  318. }
  319. div.ban p.reason {
  320. font-weight: bold;
  321. }
  322. span.heading {
  323. color: #AF0A0F;
  324. font-size: 11pt;
  325. font-weight: bold;
  326. }
  327. span.spoiler {
  328. background: black;
  329. color: black;
  330. padding: 0 1px;
  331. }
  332. div.post.reply div.body span.spoiler a {
  333. color: black;
  334. }
  335. span.spoiler:hover,div.post.reply div.body span.spoiler:hover a {
  336. color: white;
  337. }
  338. div.styles {
  339. float: right;
  340. padding-bottom: 20px;
  341. }
  342. div.styles a {
  343. margin: 0 10px;
  344. }
  345. div.styles a.selected {
  346. text-decoration: none;
  347. }
  348. table.test {
  349. width: 100%;
  350. }
  351. table.test td,table.test th {
  352. text-align: left;
  353. padding: 5px;
  354. }
  355. table.test tr.h th {
  356. background: #98E;
  357. }
  358. table.test td img {
  359. margin: 0;
  360. }
  361. fieldset label {
  362. display: block;
  363. }
  364. div.pages {
  365. color: #89A;
  366. background: #D6DAF0;
  367. display: inline-block;
  368. padding: 8px;
  369. margin: 8px 0 4px 0;
  370. /*border-right: 1px solid #B7C5D9;
  371. border-bottom: 1px solid #B7C5D9;*/
  372. }
  373. div.pages.top {
  374. display: block;
  375. padding: 5px 8px;
  376. margin-bottom: 5px;
  377. position: fixed;
  378. top: 0;
  379. right: 0;
  380. opacity: 0.9;
  381. }
  382. @media screen and (max-width: 800px) {
  383. div.pages.top {
  384. display: none!important;
  385. }
  386. }
  387. div.pages a.selected {
  388. color: black;
  389. font-weight: bolder;
  390. }
  391. div.pages a {
  392. text-decoration: none;
  393. }
  394. div.pages form {
  395. margin: 0;
  396. padding: 0;
  397. display: inline;
  398. }
  399. div.pages form input {
  400. margin: 0 5px;
  401. display: inline;
  402. }
  403. hr {
  404. border: none;
  405. border-top: 1px solid #B7C5D9;
  406. height: 0;
  407. clear: left;
  408. }
  409. div.report {
  410. color: #333;
  411. }
  412. table.modlog {
  413. margin: auto;
  414. width: 100%;
  415. }
  416. table.modlog tr td {
  417. text-align: left;
  418. margin: 0;
  419. padding: 4px 15px 0 0;
  420. }
  421. table.modlog tr th {
  422. text-align: left;
  423. padding: 4px 15px 5px 5px;
  424. white-space: nowrap;
  425. }
  426. table.modlog tr th {
  427. background: #98E;
  428. }
  429. td.minimal,th.minimal {
  430. width: 1%;
  431. white-space: nowrap;
  432. }
  433. div.top_notice {
  434. text-align: center;
  435. margin: 5px auto;
  436. }
  437. span.public_ban {
  438. display: block;
  439. color: red;
  440. font-weight: bold;
  441. margin-top: 15px;
  442. }
  443. span.toolong {
  444. display: block;
  445. margin-top: 15px;
  446. }
  447. div.blotter {
  448. color: red;
  449. font-weight: bold;
  450. text-align: center;
  451. }
  452. table.mod.config-editor {
  453. font-size: 9pt;
  454. width: 100%;
  455. }
  456. table.mod.config-editor td {
  457. text-align: left;
  458. padding: 5px;
  459. border-bottom: 1px solid #98e;
  460. }
  461. table.mod.config-editor input[type="text"] {
  462. width: 98%;
  463. }
  464. .desktop-style div.boardlist:nth-child(1) {
  465. position: fixed;
  466. top: 0;
  467. left: 0;
  468. right: 0;
  469. margin-top: 0;
  470. z-index: 30;
  471. box-shadow: 0 1px 2px rgba(0, 0, 0, .15);
  472. border-bottom: 1px solid;
  473. background-color: #D6DAF0;
  474. }
  475. .desktop-style body {
  476. padding-top: 20px;
  477. }
  478. .desktop-style .sub {
  479. background: inherit;
  480. }
  481. .desktop-style .sub .sub {
  482. display: inline-block;
  483. text-indent: -9000px;
  484. width: 7px;
  485. }
  486. .desktop-style .sub .sub:hover,.desktop-style .sub .sub.hover {
  487. display: inline;
  488. text-indent: 0;
  489. background: inherit;
  490. }
  491. #attention_bar {
  492. height: 1.5em;
  493. max-height: 1.5em;
  494. width: 100%;
  495. max-width: 100%;
  496. text-align: center;
  497. overflow: hidden;
  498. }
  499. #attention_bar_form {
  500. display: none;
  501. padding: 0;
  502. margin: 0;
  503. }
  504. #attention_bar_input {
  505. width: 100%;
  506. padding: 0;
  507. margin: 0;
  508. text-align: center;
  509. }
  510. #attention_bar:hover {
  511. background-color: rgba(100%,100%,100%,0.2);
  512. }
  513. .intro.thread-hidden {
  514. margin: 0;
  515. padding: 0;
  516. }
  517. form.ban-appeal {
  518. margin: 9px 20px;
  519. }
  520. form.ban-appeal textarea {
  521. display: block;
  522. }
  523. .MathJax_Display {
  524. display: inline!important;
  525. }
  526. pre {
  527. margin: 0;
  528. }
  529. .theme-catalog div.thread img {
  530. float: none!important;
  531. margin: auto;
  532. max-height: 150px;
  533. max-width: 200px;
  534. box-shadow: 0 0 4px rgba(0,0,0,0.55);
  535. border: 2px solid rgba(153,153,153,0);
  536. }
  537. .theme-catalog div.thread {
  538. display: inline-block;
  539. vertical-align: top;
  540. text-align: center;
  541. font-weight: normal;
  542. margin-top: 2px;
  543. margin-bottom: 2px;
  544. padding: 2px;
  545. height: 300px;
  546. width: 205px;
  547. overflow: hidden;
  548. position: relative;
  549. font-size: 11px;
  550. max-height: 300px;
  551. background: rgba(182,182,182,0.12);
  552. border: 2px solid rgba(111,111,111,0.34);
  553. }
  554. .theme-catalog div.thread strong {
  555. display: block;
  556. }
  557. .theme-catalog div.threads {
  558. text-align: center;
  559. margin-left: -20px;
  560. }
  561. .theme-catalog div.thread:hover {
  562. background: #D6DAF0;
  563. border-color: #B7C5D9;
  564. }
  565. .theme-catalog div.grid-size-vsmall img {
  566. max-height: 33%;
  567. max-width: 95%
  568. }
  569. .theme-catalog div.grid-size-vsmall {
  570. min-width:90px; max-width: 90px;
  571. max-height: 148px;
  572. }
  573. .theme-catalog div.grid-size-small img {
  574. max-height: 33%;
  575. max-width: 95%
  576. }
  577. .theme-catalog div.grid-size-small {
  578. min-width:140px; max-width: 140px;
  579. max-height: 192px;
  580. }
  581. .theme-catalog div.grid-size-large img {
  582. max-height: 40%;
  583. max-width: 95%
  584. }
  585. .theme-catalog div.grid-size-large {
  586. min-width: 256px; max-width: 256px;
  587. max-height: 384px;
  588. }
  589. .theme-catalog img.thread-image {
  590. height: auto;
  591. max-width: 100%;
  592. }
  593. @media (max-width: 420px) {
  594. .theme-catalog ul#Grid {
  595. padding-left: 18px;
  596. }
  597. .theme-catalog div.thread {
  598. width: auto;
  599. margin-left: 0;
  600. margin-right: 0;
  601. }
  602. .theme-catalog div.threads {
  603. overflow: hidden;
  604. }
  605. }
  606. .compact-boardlist {
  607. padding: 3px;
  608. padding-bottom: 0;
  609. }
  610. .compact-boardlist .cb-item {
  611. display: inline-block;
  612. vertical-align: middle;
  613. }
  614. .compact-boardlist .cb-icon {
  615. padding-bottom: 1px;
  616. }
  617. .compact-boardlist .cb-fa {
  618. font-size: 21px;
  619. padding: 2px;
  620. padding-top: 0;
  621. }
  622. .compact-boardlist .cb-cat {
  623. padding: 5px 6px 8px 6px;
  624. }
  625. .cb-menuitem {
  626. display: table-row;
  627. }
  628. .cb-menuitem span {
  629. padding: 5px;
  630. display: table-cell;
  631. text-align: left;
  632. border-top: 1px solid rgba(0,0,0,0.5);
  633. }
  634. .cb-menuitem span.cb-uri {
  635. text-align: right;
  636. }
  637. .boardlist:not(.compact-boardlist) #watch-pinned::before {
  638. content: " [ ";
  639. }
  640. .boardlist:not(.compact-boardlist) #watch-pinned::after {
  641. content: " ] ";
  642. }
  643. .boardlist:not(.compact-boardlist) #watch-pinned {
  644. display: inline;
  645. }
  646. .boardlist:not(.compact-boardlist) #watch-pinned a {
  647. margin-left: 3pt;
  648. }
  649. .boardlist:not(.compact-boardlist) #watch-pinned a:first-child {
  650. margin-left: 0pt;
  651. }
  652. .compact-boardlist #watch-pinned {
  653. display: inline-block;
  654. vertical-align: middle;
  655. }
  656. .new-posts {
  657. opacity: 0.6;
  658. margin-top: 1em;
  659. }
  660. .new-threads {
  661. text-align: center;
  662. }
  663. #options_handler, #alert_handler {
  664. position: fixed;
  665. top: 0px;
  666. left: 0px;
  667. right: 0px;
  668. bottom: 0px;
  669. width: 100%;
  670. height: 100%;
  671. text-align: center;
  672. z-index: 9900;
  673. }
  674. #options_background, #alert_background {
  675. background: black;
  676. opacity: 0.5;
  677. position: absolute;
  678. top: 0px;
  679. left: 0px;
  680. right: 0px;
  681. bottom: 0px;
  682. width: 100%;
  683. height: 100%;
  684. z-index: -1;
  685. }
  686. #options_div, #alert_div {
  687. background-color: #d6daf0;
  688. border: 1px solid black;
  689. display: inline-block;
  690. position: relative;
  691. margin-top: 20px;
  692. }
  693. #options_div {
  694. width: 620px;
  695. height: 400px;
  696. resize: both;
  697. overflow: auto;
  698. }
  699. #alert_div {
  700. width: 500px;
  701. }
  702. #alert_message {
  703. text-align: center;
  704. margin: 13px;
  705. font-size: 110%;
  706. }
  707. .alert_button {
  708. margin-bottom: 13px;
  709. }
  710. #options_div textarea {
  711. max-width: 100%;
  712. }
  713. #options_close, #alert_close {
  714. top: 0px;
  715. right: 0px;
  716. position: absolute;
  717. margin-right: 3px;
  718. font-size: 20px;
  719. z-index: 100;
  720. }
  721. #options_tablist {
  722. padding: 0px 5px;
  723. left: 0px;
  724. width: 90px;
  725. top: 0px;
  726. bottom: 0px;
  727. height: 100%;
  728. border-right: 1px solid black;
  729. }
  730. .options_tab_icon {
  731. padding: 5px;
  732. color: black;
  733. cursor: pointer;
  734. }
  735. .options_tab_icon.active {
  736. color: red;
  737. }
  738. .options_tab_icon i {
  739. font-size: 20px;
  740. }
  741. .options_tab_icon div {
  742. font-size: 11px;
  743. }
  744. .options_tab {
  745. padding: 10px;
  746. position: absolute;
  747. top: 0px;
  748. bottom: 10px;
  749. left: 101px;
  750. right: 0px;
  751. text-align: left;
  752. font-size: 16px;
  753. overflow-y: auto;
  754. }
  755. .options_tab h2 {
  756. text-align: center;
  757. margin-bottom: 5px;
  758. }
  759. .mobile-style #options_div, .mobile-style #alert_div {
  760. display: block;
  761. width: 100%;
  762. height: 100%;
  763. margin-top: 0px;
  764. }
  765. .mentioned {
  766. word-wrap: break-word;
  767. }
  768. .poster_id {
  769. cursor: pointer;
  770. display: inline-block;
  771. -webkit-user-select: none;
  772. -moz-user-select: none;
  773. -ms-user-select: none;
  774. -o-user-select: none;
  775. user-select: none;
  776. }
  777. .poster_id:hover {
  778. color: #800000!important;
  779. }
  780. .poster_id::before {
  781. content: " ID: ";
  782. }
  783. pre {
  784. /* Better code tags */
  785. max-width:inherit;
  786. word-wrap:normal;
  787. overflow:auto;
  788. display: block!important;
  789. font-size:9pt;
  790. font-family:monospace;
  791. }
  792. span.pln {
  793. color:grey;
  794. }
  795. @media screen and (min-width: 768px) {
  796. .intro {
  797. clear: none;
  798. }
  799. div.post div.body {
  800. clear: none;
  801. }
  802. }
  803. .clearfix {
  804. display: block;
  805. clear: both;
  806. visibility: hidden;
  807. overflow: hidden;
  808. font-size: 0px;
  809. line-height: 0px;
  810. box-sizing: border-box;
  811. border: none;
  812. height: 0;
  813. margin: 0;
  814. padding: 0;
  815. width: 100%;
  816. zoom: 1;
  817. }
  818. /* === SPECIFIC PAGES & FEATURES === */
  819. /* Board List */
  820. div.boardlist {
  821. margin-top: 3px;
  822. color: #89A;
  823. font-size: 16px;
  824. }
  825. div.boardlist.bottom {
  826. margin-top: 16px;
  827. clear: both;
  828. }
  829. div.boardlist a {
  830. text-decoration: none;
  831. }
  832. /* Threads */
  833. /* Thread Footer */
  834. #thread-interactions {
  835. margin: 8px 0;
  836. clear: both;
  837. }
  838. #thread-links {
  839. float: left;
  840. }
  841. #thread-links > a {
  842. padding-left: none;
  843. padding-right: 10px;
  844. }
  845. #thread-quick-reply {
  846. display: none;
  847. position: absolute;
  848. left: 50%;
  849. right: 50%;
  850. text-align: center;
  851. width: 100px;
  852. margin-left: -50px;
  853. }
  854. #thread_stats {
  855. float: right;
  856. }
  857. #post-moderation-fields {
  858. float: right;
  859. text-align: right;
  860. }
  861. #delete-fields {
  862. }
  863. #report-fields {
  864. }
  865. /* threadwatcher */
  866. #watchlist {
  867. display: none;
  868. max-height: 250px;
  869. overflow: auto;
  870. border: 1px solid;
  871. border-style: none solid solid none;
  872. width: 50%;
  873. margin: 0 auto;
  874. margin-bottom: 10px;
  875. }
  876. .watchlist-inner, .watchlist-controls {
  877. margin: 0 auto;
  878. margin-top: 10px;
  879. margin-bottom: 10px;
  880. text-align: center;
  881. }
  882. #watchlist-toggle, .watchThread, .watchlist-remove, #clearList, #clearGhosts {
  883. cursor: pointer;
  884. }
  885. #youtube-size input {
  886. width: 50px;
  887. }
  888. /* File selector */
  889. .dropzone {
  890. color: #000;
  891. cursor: default;
  892. margin: auto;
  893. padding: 0px 4px;
  894. text-align: center;
  895. min-height: 50px;
  896. max-height: 140px;
  897. transition: 0.2s;
  898. background-color: rgba(200, 200, 200, 0.5);
  899. overflow-y: auto;
  900. }
  901. .dropzone-wrap {
  902. width: 100%;
  903. }
  904. .dropzone .file-hint {
  905. color: rgba(0, 0, 0, 0.5);
  906. cursor: pointer;
  907. position: relative;
  908. margin-bottom: 5px;
  909. padding: 10px 0px;
  910. top: 5px;
  911. transition: 0.2s;
  912. border: 2px dashed rgba(125, 125, 125, 0.4);
  913. }
  914. .file-hint:hover, .dropzone.dragover .file-hint {
  915. color: rgba(0, 0, 0, 1);
  916. border-color: rgba(125, 125, 125, 0.8);
  917. }
  918. .dropzone.dragover {
  919. background-color: rgba(200, 200, 200, 1);
  920. }
  921. .dropzone .file-thumbs {
  922. text-align: left;
  923. width: 100%;
  924. }
  925. .dropzone .tmb-container {
  926. padding: 3px;
  927. overflow-x: hidden;
  928. white-space: nowrap;
  929. }
  930. .dropzone .file-tmb {
  931. height: 40px;
  932. width: 70px;
  933. cursor: pointer;
  934. display: inline-block;
  935. text-align: center;
  936. background-color: rgba(187, 187, 187, 0.5);
  937. background-size: cover;
  938. background-position: center;
  939. }
  940. .dropzone .file-tmb span {
  941. font-weight: 600;
  942. position: relative;
  943. top: 13px;
  944. }
  945. .dropzone .tmb-filename {
  946. display: inline-block;
  947. vertical-align: bottom;
  948. bottom: 16px;
  949. position: relative;
  950. margin-left: 5px;
  951. }
  952. .dropzone .remove-btn {
  953. cursor: pointer;
  954. color: rgba(125, 125, 125, 0.5);
  955. display: inline-block;
  956. vertical-align: bottom;
  957. bottom: 10px;
  958. position: relative;
  959. margin-right: 5px;
  960. font-size: 20px
  961. }
  962. .dropzone .remove-btn:hover {
  963. color: rgba(125, 125, 125, 1);
  964. }
  965. #thread_stats {
  966. display: inline;
  967. margin-left: 10px;
  968. margin-right: 10px;
  969. }
  970. /* Fileboard */
  971. table.fileboard th, table.fileboard td {
  972. padding: 2px;
  973. text-align: center;
  974. }
  975. table.fileboard .intro a {
  976. margin-left: 0px;
  977. }
  978. /* Gallery view */
  979. #gallery_images {
  980. position: absolute;
  981. right: 0px;
  982. bottom: 0px;
  983. top: 0px;
  984. width: 12%;
  985. background-color: rgba(0, 0, 0, 0.4);
  986. overflow: auto;
  987. }
  988. #gallery_toolbar {
  989. position: absolute;
  990. right: 12%;
  991. left: 0px;
  992. bottom: 0px;
  993. height: 32px;
  994. background-color: rgba(0, 0, 0, 0.4);
  995. text-align: right;
  996. }
  997. #gallery_images img {
  998. width: 100%;
  999. }
  1000. #gallery_toolbar a {
  1001. font-size: 28px;
  1002. padding-right: 5px;
  1003. }
  1004. #gallery_main {
  1005. position: absolute;
  1006. left: 0px;
  1007. right: 12%;
  1008. bottom: 32px;
  1009. top: 0px;
  1010. padding: 10px;
  1011. }
  1012. #gallery_images img {
  1013. opacity: 0.6;
  1014. -webkit-transition: all 0.5s;
  1015. transition: all 0.5s;
  1016. }
  1017. #gallery_images img:hover, #gallery_images img.active {
  1018. opacity: 1;
  1019. }
  1020. #gallery_images img.active {
  1021. -webkit-box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
  1022. -moz-box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
  1023. box-shadow: 0px 0px 29px 2px rgba(255,255,255,1);
  1024. z-index: 1;
  1025. }
  1026. #gallery_main img, #gallery_main video {
  1027. max-width: 100%;
  1028. max-height: 100%;
  1029. position: absolute;
  1030. }
  1031. .own_post {
  1032. font-style: italic;
  1033. font-weight: normal;
  1034. opacity: .666;
  1035. }
  1036. div.mix {
  1037. display: inline-block;
  1038. }
  1039. body {
  1040. background: #0A0C11 !important;
  1041. }
  1042. fieldset {
  1043. margin: 10px 0 !important;
  1044. }
  1045. legend {
  1046. background:#222 !important;
  1047. border:1px solid #888 !important;
  1048. color:#FFF !important;
  1049. }
  1050. h1 {
  1051. color: #FFF !important;
  1052. font-family: Heading !important;
  1053. }
  1054. fieldset ul li a {
  1055. color: #FFF !important;
  1056. }
  1057. p.unimportant {
  1058. color: #888 !important;
  1059. }
  1060. .ban {
  1061. background-color: #111 !important;
  1062. color: #AAA;
  1063. }
  1064. .boardlinks {
  1065. text-align: center !important;
  1066. }
  1067. #overlay {
  1068. position: fixed;
  1069. left: 0;
  1070. top: 0;
  1071. width: 100%;
  1072. height: 100%;
  1073. pointer-events: none;
  1074. z-index: 1000;
  1075. background-repeat: all;
  1076. background-position: 0px 0px;
  1077. animation-name: Static;
  1078. animation-duration: 0.5s;
  1079. animation-iteration-count: infinite;
  1080. animation-timing-function: steps(32);
  1081. box-shadow: inset 0px 0px 10em rgba(0,0,0,0.4);
  1082. }
  1083. @keyframes Static {
  1084. 0% { background-position: 0px 0px; }
  1085. 100% { background-position: 0px 32px; }
  1086. }
  1087. #overlay2 {
  1088. position: fixed;
  1089. left: 0;
  1090. top: 0;
  1091. width: 100%;
  1092. height: 100%;
  1093. pointer-events: none;
  1094. z-index: 1000;
  1095. background-repeat: all;
  1096. background-position: 0px 0px;
  1097. animation-name: Static;
  1098. animation-duration: 0.2s;
  1099. animation-iteration-count: infinite;
  1100. animation-timing-function: steps(32);
  1101. }
  1102. body {
  1103. background: #080808;
  1104. color: #FFF;
  1105. font-family: Normal,sans-serif;
  1106. font-size: 16px;
  1107. }
  1108. span.quote {
  1109. color:#B8D962;
  1110. }
  1111. h1 {
  1112. font-size: 20pt;
  1113. text-align: center;
  1114. letter-spacing: 0px;
  1115. }
  1116. div.title, h1 {
  1117. color: #32DD72;
  1118. font-family: "Heading", Arial, Helvetica, sans-serif;
  1119. }
  1120. div.title p {
  1121. font-size: 10px;
  1122. }
  1123. a:link, a:visited, .intro a.email span.name {
  1124. color: #CCCCCC;
  1125. text-decoration: none;
  1126. font-family: Normal, sans-serif;
  1127. }
  1128. a:link:hover, a:visited:hover {
  1129. color: #fff;
  1130. font-family: Normal, sans-serif;
  1131. text-decoration: none;
  1132. }
  1133. a.post_no {
  1134. color: #AAAAAA;
  1135. text-decoration: none;
  1136. }
  1137. a.post_no:hover {
  1138. color: #32DD72 !important;
  1139. text-decoration: underline overline;
  1140. }
  1141. div.post.reply {
  1142. background: #111;
  1143. border: #555555 1px solid;
  1144. box-shadow: 4px 4px #555;
  1145. }
  1146. div.post.reply.highlighted {
  1147. background: #555;
  1148. border: transparent 1px solid;
  1149. }
  1150. div.post.reply div.body a:link, div.post.reply div.body a:visited {
  1151. color: #CCCCCC;
  1152. }
  1153. div.post.reply div.body a:link:hover, div.post.reply div.body a:visited:hover {
  1154. color: #32DD72;
  1155. }
  1156. .intro span.subject {
  1157. font-size: 16px;
  1158. font-family: Heading, sans-serif;
  1159. color: #4974F4;
  1160. font-weight: 500;
  1161. }
  1162. .intro span.name {
  1163. color: #3954C4;
  1164. font-weight: 800;
  1165. }
  1166. .intro a.capcode, p.intro a.nametag {
  1167. color: magenta;
  1168. margin-left: 0;
  1169. }
  1170. .intro a.email, p.intro a.email span.name, p.intro a.email:hover, p.intro a.email:hover span.name {
  1171. color: #32ddaf;
  1172. }
  1173. input[type="text"], textarea, select {
  1174. background: #333333;
  1175. color: #CCCCCC;
  1176. border: #666666 1px solid;
  1177. padding-left: 5px;
  1178. padding-right: -5px;
  1179. font-family: Normal, sans-serif;
  1180. font-size: 16px;
  1181. }
  1182. input[type="password"] {
  1183. background: #333333;
  1184. color: #CCCCCC;
  1185. border: #666666 1px solid;
  1186. }
  1187. form table tr th {
  1188. background: linear-gradient(to right, #010c0a 0%,#2a3247 95%,#4974f4 100%);
  1189. color: #AAAAAA;
  1190. font-weight: 800;
  1191. text-align: left;
  1192. padding: 0;
  1193. }
  1194. div.banner {
  1195. background: #32DD72;
  1196. box-shadow: 0px 0px 5px 5px rgba(50, 221, 114, 0.3);
  1197. color: #000;
  1198. text-align: center;
  1199. width: 250px;
  1200. padding: 4px;
  1201. padding-left: 12px;
  1202. padding-right: 12px;
  1203. margin-left: auto;
  1204. margin-right: auto;
  1205. font-size: 16px;
  1206. }
  1207. div.banner a {
  1208. color:#000;
  1209. }
  1210. input[type="submit"] {
  1211. background: #333333;
  1212. border: #888888 1px solid;
  1213. color: #CCCCCC;
  1214. }
  1215. input[type="submit"]:hover {
  1216. background: #555555;
  1217. border: #888888 1px solid;
  1218. color: #32DD72;
  1219. }
  1220. input[type="text"]:focus {
  1221. border:#aaa 1px solid;
  1222. }
  1223. p.fileinfo a:hover {
  1224. text-decoration: underline;
  1225. }
  1226. span.trip {
  1227. color: #AAAAAA;
  1228. }
  1229. .bar.bottom {
  1230. bottom: 0px;
  1231. border-top: 1px solid #333333;
  1232. background-color: #666666;
  1233. }
  1234. div.pages {
  1235. color: #AAAAAA;
  1236. background: #666666;
  1237. /*border: #666666 1px solid;*/
  1238. font-family: Normal, sans-serif;
  1239. font-size: 16px;
  1240. }
  1241. div.pages a.selected {
  1242. color: #CCCCCC;
  1243. }
  1244. hr {
  1245. height: 1px;
  1246. border: #333333 1px solid;
  1247. }
  1248. div.boardlist {
  1249. color: #999999;
  1250. background-color: rgba(12%, 12%, 12%, 0.10);
  1251. }
  1252. div.ban {
  1253. background-color: transparent;
  1254. border: transparent 0px solid;
  1255. }
  1256. div.ban h2 {
  1257. background: transparent;
  1258. color: lime;
  1259. font-size: 16px;
  1260. }
  1261. table.modlog tr th {
  1262. background: #333333;
  1263. color: #AAAAAA;
  1264. }
  1265. .desktop-style div.boardlist:not(.bottom) {
  1266. text-shadow: black 1px 1px 1px, black -1px -1px 1px, black -1px 1px 1px, black 1px -1px 1px;
  1267. background-color: #666666;
  1268. }
  1269. .desktop-style div.boardlist:not(.bottom):hover, .desktop-style div.boardlist:not(.bottom).cb-menu {
  1270. background-color: rgba(30%, 30%, 30%, 0.65);
  1271. }
  1272. div.report {
  1273. color: #666666;
  1274. }
  1275. /* options.js */
  1276. #options_div, #alert_div {
  1277. background: #333333;
  1278. }
  1279. .options_tab_icon {
  1280. color: #AAAAAA;
  1281. }
  1282. .options_tab_icon.active {
  1283. color: #FFFFFF;
  1284. }
  1285. #quick-reply table {
  1286. background: none repeat scroll 0% 0% #333 !important;
  1287. }
  1288. .box {
  1289. background: #111 !important;
  1290. }
  1291. .box.right {
  1292. color: #FFF !important;
  1293. }
  1294. .boardlist {
  1295. text-align: center;
  1296. }
  1297. #quick-reply * {
  1298. font-size: 16px !important;
  1299. font-family: "Normal", sans-serif !important;
  1300. }
  1301. #quick-reply th {
  1302. background: linear-gradient(to bottom, #010c0a 0%,#2a3247 95%,#4974f4 100%);
  1303. }