1. main {
2.     padding: 0;
3. }
4. main:not(.board-index) {
5.     margin: 3em 0 0 0;
6. }
7.  
8. /* Boardlist */
9. header nav.boardlist {
10.     overflow: hidden;
11.     height: 16px;
12.     display: block;
13.     position: fixed;
14.     width: 100%;
15.     top: 0;
16.     z-index: 999;
17.     border-bottom: 1px solid rgba(52, 52, 92, 0.20);
18.     padding: 0 5px;
19. }
20.     nav.boardlist .boardlist-row {
21.         margin: 0;
22.         display: inline;
23.     }
24.     nav.boardlist .boardlist-row li.boardlist-category:nth-of-type(2) {
25.         display: none;
26.     }
27.     nav.boardlist .boardlist-item::after {
28.         margin: 0 .1em;
29.     }
30.     .boardlist-item a[href$="infinitydev.org"],
31.     .boardlist-item a[href$="/boards.html"],
32.     .boardlist-item a[href$="/cp"],
33.     .boardlist-item a[href$="/cp/boards/create"],
34.     .boardlist-item a[href$="/cp/donate"],
35.     .boardlist-item a[href$="/cp/adventure"],
36.     .boardlist-item a[href$="/overboard.html"],
37.     .boardlist-item a[href$="/contribute"] {
38.         font-size: 0;
39.     }
40.     .boardlist-item a::before {
41.         font: 9pt FontAwesome;
42.     }
43.         .boardlist-item a[href$="infinitydev.org"]::before {
44.             content: "\f015";
45.         }
46.         .boardlist-item a[href$="/overboard.html"]::before {
47.             content: "\f021";
48.         }
49.         .boardlist-item a[href$="/boards.html"]::before {
50.             content: "\f02c";
51.         }
52.         .boardlist-item a[href$="/cp"]::before {
53.             content: "\f013";
54.         }
55.         .boardlist-item a[href$="/cp/boards/create"]::before {
56.             content: "\f067";
57.         }
58.         .boardlist-item a[href$="/contribute"]::before {
59.             content: "\f113";
60.         }
61.         .boardlist-item a[href$="/cp/donate"]::before {
62.             content: "\f155";
63.         }
64.         .boardlist-item a[href$="/cp/adventure"]::before {
65.             content: "\f135";
66.         }
67.     .boardlist-item a:hover {
68.         color: red !important;
69.     }
70.  
71. nav.gnav {
72.     display: none;
73. }
74. /**/
75.  
76. /* Header */
77. figure.page-head {
78.     margin: 3em auto 1em auto;
79.     max-width: 480px;
80. }
81.     .view-board figcaption.page-details {
82.         border-bottom: 1px solid #B7C5D9;
83.         padding-bottom: 1em;
84.     }
85.         h1.page-title {
86.             font-family: Tahoma, sans-serif;
87.             font-size: 20pt;
88.             color: #AF0A0F;
89.             font-weight: bold;
90.             letter-spacing: -2px;
91.         }
92.         h2.page-desc {
93.             color: #AF0A0F;
94.             font-size: 11px;
95.             margin-top: -2px;
96.         }
97. /**/
98.                
99. /* Navigation Buttons */
100. main.board-index nav.pagination {
101.     margin: 0 15px;
102.     border-bottom: 1px solid #B7C5D9;
103. }
104.     main.board-index .pagination-buttons {
105.         float: left;
106.         margin: 0;
107.     }
108.         div.pagination-buttons .pagination-button {
109.             line-height: 1.5;
110.             margin: 0;
111.             padding: 2px 10px;
112.         }
113. main.mode-reply nav.pagination {
114.     border-top: 1px solid #B7C5D9;
115.     border-bottom: 1px solid #B7C5D9;
116. }
117.     ul.pagination-pages {
118.         float: left;
119.         margin: 0;
120.     }
121.         a.pagination-link {
122.             padding: 4px;
123.         }
124. /**/
125.  
126. /* Post form */
127. .mode-index section.index-form, .index-catalog section.index-form {
128.     margin: 0 15px;
129.     border-bottom: 1px solid #B7C5D9;
130. }
131.     html.js body.responsive form.form-post {
132.         border: none;
133.         background: none;
134.         position: fixed;
135.         z-index: 1000;
136.         top: 30px;
137.         right: 10px;
138.         max-width: none;
139.         margin: 0;
140.     }
141.     html.js body.responsive .mode-index section.index-form form.form-post, html.js body.responsive .index-catalog section.index-form form.form-post {
142.         position: static;
143.         margin: 0 auto;
144.         padding: 0;
145.         width: 100%;
146.     }
147.     .mode-index form.form-post, .index-catalog form.form-post {
148.         padding: .75em;
149.         margin: 0 1em 2em;
150.         max-width: 100%;
151.         box-sizing: border-box;
152.         background: transparent;
153.         border: none;
154.     }
155.         html.js body.responsive form.form-post .form-fields {
156.             padding: 0;
157.         }
158.         html.js body.responsive .mode-index form.form-post fieldset.form-fields, html.js body.responsive .index-catalog form.form-post fieldset.form-fields {
159.             border: none;
160.             width: 428px;
161.             padding: 0 0 1.5em;
162.             margin-left: auto;
163.             margin-right: auto;
164.             border-bottom: none;
165.         }
166.             html.js body.responsive form.form-post .field {
167.                 margin: 1px 0;
168.             }
169.             .mode-index form.form-post .field, .index-catalog form.form-post .field {
170.                 margin-right: auto;
171.                 margin-left: auto;
172.             }
173.                 html.js body.responsive form.form-post .field-control {
174.                     padding: 2px 4px;
175.                     border: 1px solid #AAAAAA;
176.                 }
177.                 .mode-index .row-subject .field-control, .mode-index .row-author .field-control, .mode-index .row-email .field-control, .index-catalog .row-subject .field-control, .index-catalog .row-author .field-control, .index-catalog .row-email .field-control {
178.                     width: calc(100% - 90px);
179.                 }
180.                 html.js body.responsive .mode-reply form.form-post .row-author .field-control, html.js body.responsive .mode-reply form.form-post .row-subject .field-control, html.js body.responsive .mode-reply form.form-post .row-email .field-control {
181.                     padding-left: 92px;
182.                     height: 26px;
183.                 }
184.                 html.js body.responsive .mode-index form.form-post .row-author .field-control, html.js body.responsive .mode-index form.form-post .row-subject .field-control, html.js body.responsive .mode-index form.form-post .row-email .field-control, html.js body.responsive .index-catalog form.form-post .row-author .field-control, html.js body.responsive .index-catalog form.form-post .row-subject .field-control, html.js body.responsive .index-catalog form.form-post .row-email .field-control {
185.                     margin-left: 90px;
186.                     height: 26px;
187.                 }
188.             form.form-post .row-post {
189.                 border: none;
190.             }
191.             .mode-index form.form-post .row-post, .index-catalog form.form-post .row-post {
192.                 background: none;
193.                 border: none;
194.             }
195.             .mode-reply form.form-post .row-post {
196.                 background: none;
197.             }
198.                 .mode-index .row-post::before, .index-catalog .row-post::before {
199.                     content: 'Comment *';
200.                     background: #98E;
201.                     padding: 2px 5px;
202.                     color: #333 ;
203.                     line-height: 5.2em;
204.                     border: 1px solid #34345C;
205.                     font-size: 10pt;
206.                     font-weight: 700;
207.                     position: absolute;
208.                     box-sizing: border-box;
209.                     width: 89px;
210.                     height: 78px;
211.                 }
212.                 form.form-post .row-post #body {
213.                     min-height: 78px !important;
214.                     width: 100% !important;
215.                     border: 1px solid #AAAAAA;
216.                     resize: vertical !important;
217.                 }
218.                 .mode-index form.form-post .row-post #body, .index-catalog form.form-post .row-post #body {
219.                     width: calc(100% - 90px) !important;
220.                     padding: 4px;
221.                     font-size: 100%;
222.                     margin: 0 0 0 90px !important;
223.                 }
224.                 .mode-reply form.form-post .row-post #body {
225.                     min-height: 108px!important;
226.                 }
227.             form.form-post div.row-file {
228.                 box-sizing: border-box;
229.                 padding: 0;
230.                 margin: 0;
231.                 width: auto;
232.                 overflow: hidden;
233.             }
234.                 form.form-post .row-file .dz-container, form.form-post button.field-submit {
235.                     border-bottom: 1px solid #AAAAAA;
236.                 }
237.             .board-index .row-email::before, .row-author::before, .row-subject::before {
238.                 background: #98E;
239.                 padding: 2px 5px;
240.                 color: #333;
241.                 line-height: 1.5em;
242.                 border: 1px solid #34345C;
243.                 font-size: 10pt;
244.                 font-weight: 700;
245.                 position: absolute;
246.                 box-sizing: border-box;
247.                 width: 89px;
248.                 height: 26px;
249.             }
250.                 .board-index .row-email::before {
251.                     content: 'Email';
252.                 }
253.                 .board-index .row-author::before {
254.                     content: 'Author';
255.                 }
256.                 .board-index .row-subject::before {
257.                     content: 'Subject';
258.                 }
259.             form.form-post .row-captcha {
260.                 border: 1px solid #AAA !important;
261.                 background: #FFF;
262.                 width: auto;
263.             }
264.                 .board-index .row-captcha img.captcha {
265.                     width: 50%;
266.                     float: left;
267.                     height: 59px;
268.                     border-right: 1px solid #CCC;
269.                 }
270.                 .board-index form.form-post .row-captcha .captcha-loading {
271.                     background: none;
272.                     padding: 0;
273.                 }
274.                 .board-index form.form-post .row-captcha input#captcha {
275.                     border: none;
276.                     height: 59px;
277.                     text-align: center;
278.                     width: calc(50% - 2px);
279.                     font-size: 30px;
280.                     margin: 0;
281.                 }
282.                 .board-index .mode-reply form.form-post .row-captcha input#captcha {
283.                     font-size: 22px;
284.                 }
285.  
286. html.js form.form-post .form-legend, html.js form.form-post .post-menu {
287.     display: none;
288. }
289.                                  
290. html.js body.responsive form.form-post .field-control.field-capcode {
291.     margin: 0;
292.     height: 26px;
293. }
294.  
295. .ui-wrapper {
296.     overflow: auto !important;
297.     background: none !important;
298.     border: none !important;
299.     position: initial !important;
300.     width: auto !important;
301.     height: auto !important;
302.     top: auto !important;
303.     left: auto !important;
304.     margin: 0 !important;
305.     padding-bottom: 0 !important;
306. }
307.     form.form-post .ui-resizable-handle {
308.         display: none !important;
309.     }
310.                          
311. input#email::-webkit-input-placeholder,
312. input#subject::-webkit-input-placeholder,
313. input#author::-webkit-input-placeholder {
314.     font-size: 0;
315. }
316. input#email:-moz-placeholder,
317. input#author:-moz-placeholder,
318. input#subject:-moz-placeholder {
319.     font-size: 0;
320. }
321. input#email::-moz-placeholder,
322. input#author::-moz-placeholder,
323. input#subject::-moz-placeholder {
324.     font-size: 0;
325. }
326.  
327. input:focus, textarea:focus {
328.     outline: none;
329. }
330.  
331. button, a.button {
332.     background: #E4E4E4;
333.     border: 1px solid #CCCCCC;
334.     border-bottom: 1px solid #AAAAAA;
335.     color: #222222;
336. }
337.     button:hover, a.button:hover {
338.         background: #F1EFEF;
339.         color: #222222;
340.     }
341. /**/
342.  
343. /* Page Layout */
344. body.responsive .index-threaded {
345.     margin: 0;
346. }
347.     body.responsive main.index-catalog .index-threads {
348.         padding-right: 0 !important;
349.     }
350.         section.index-threads {
351.             margin: 0;
352.             min-height: initial;
353.         }
354.             ul.thread-list {
355.                 padding: 0;
356.                 margin: 0 15px;
357.             }
358.                 body.responsive .index-threaded .thread-item:not(:first-of-type) {
359.                     border-top: 1px solid #B7C5D9;
360.                 }
361.                 body.responsive .thread-item {
362.                     clear: both;
363.                 }
364.                     body.responsive .index-threaded.mode-reply section.index-threads .thread {
365.                         padding: 7px 0 7px 0;
366.                     }
367.                     body.responsive .index-threaded.mode-index section.index-threads .thread {
368.                         padding: 7px 0;
369.                         clear: both;
370.                     }
371.                         ul.thread-replies {
372.                             display: inline;
373.                         }
374.  
375. aside.index-sidebar {
376.     display: none;
377. }
378.  
379. #autoupdater {
380.     clear: both;
381. }
382. /**/
383.  
384. /* Post Layout */
385. .post-content {
386.     padding: 7px 7px 0 7px;
387. }
388.     .post-content::after {
389.         display: inline;
390.     }
391.     main.index-threaded .post-container.op-container {
392.         background: none;
393.         border: none;
394.         width: 100%;
395.     }
396.         .op-container {
397.             display: inline;
398.         }
399.             .op-container .post-content {
400.                 padding: 0;
401.             }
402.                 .op-container .post {
403.                     margin: 8px 0 8px 5px;
404.                 }
405.     .reply {
406.         overflow: hidden;
407.         padding-left: 0;
408.     }
409.         .reply::before {
410.             display: none;
411.         }
412.         .reply .attachment-container {
413.             margin: 2px 1em 1em 5px;
414.         }
415.  
416.  
417. ul.attachments-single li.post-attachment {
418.     padding: 0 1em 5px 0;
419. }
420.     .reply-container ul.post-attachments.attachments-multi {
421.         background: none;
422.         margin: 0;
423.         padding: 0;
424.     }
425.         .reply-container ul.post-attachments.attachments-multi .post-attachment {
426.             padding: 0;
427.         }
428. ul.attachments-single li.post-attachment.attachment-expanded {
429.     padding: 0;
430. }
431.     li.post-attachment.attachment-expanded div.attachment-container {
432.         background-color: transparent;
433.     }
434.         div.attachment-container {
435.             margin: 3px 5px 0 0;
436.             display: inline-block;
437.         }
438.             div.attachment-wrapper {
439.                 width: 150px;
440.                 height: 150px;
441.                 line-height: inherit !important;
442.                 display: inline;
443.             }
444.                 figure.attachment-type-audio {
445.                     margin-right: 0;
446.                 }      
447.                 .post-content div.attachment-wrapper.thumbnail-content.attachment-type-audio::after {
448.                     display: none;
449.                 }
450.                 figcaption.attachment-details {
451.                     margin-top: 3px;
452.                 }
453.                     p.attachment-detail {
454.                         height: 1.2em;
455.                         line-height: 1.2em;
456.                     }
457.                     .detail-filename {
458.                         overflow: hidden;
459.                         line-height: 1.2em;
460.                     }
461.                     a.attachment-download {
462.                         margin-top: 4px;
463.                     }
464.             a.attachment-link.attachment-canplay {
465.                 margin: 0;
466.             }
467.  
468. body.responsive .index-threaded section.index-threads .reply .post {
469.     margin: 0.8em 1.8em 1em 1.8em;
470. }
471. body.responsive .index-threaded section.index-threads .post {
472.     max-width: none;
473.     word-wrap: break-word;
474. }
475.  
476. blockquote.ugc blockquote {
477.     margin: 0;
478. }
479.     blockquote.ugc p {
480.         margin-top: 0;
481.     }
482.  
483. .post-details {
484.     margin: 0 9em 5px 0;
485.     line-height: 1.4em;
486.     font-size: 13px;
487. }
488.     .post-detail.post-logged {
489.         display: none;
490.     }
491.     .post-detail-item.capcode {
492.         color: #F00;
493.         font-weight: normal;
494.     }
495.     li.post-country {
496.         margin-top: -3px;
497.     }
498.  
499. div.post-action-tab.action-tab-reply {
500.     top: 0;
501.     right: 0;
502.     border: 1px solid #B7C5D9;
503. }
504. .multiboard-index div.post-action-tab.action-tab-reply {
505.     top: .75em;
506.     right: .75em;
507. }
508. .reply div.post-action-tab.action-tab-reply {
509.     top: 8px;
510.     right: 8px;
511. }
512. div.post-action-tab.action-tab-actions {
513.     border: 1px solid #B7C5D9;
514.     box-sizing: border-box;
515.     height: 18px;
516.     padding: 1px 4px;
517.     vertical-align: top;
518.     cursor: pointer;
519. }
520.     .post-action-label.post-action-open {
521.         color: #34345C;
522.         font-size: 11px;
523.         line-height: 1.3em;
524.     }
525.         ul.post-actions {
526.         display: block;
527.         }
528.                 ul.post-action-groups {
529.             font-size: 11px;
530.                 }
531.             li.post-action-group {
532.                 border: 1px solid #B7C5D9;
533.             }
534.                 li.post-action {
535.                     border-bottom: 1px solid #B7C5D9;
536.                 }
537.                     a.post-action-link {
538.                         padding: 1px 5px;
539.                     }
540.     ul.post-metas {
541.         border: none;
542.         margin: 0;
543.     }
544. /**/
545.  
546. /* Footer */
547. footer {
548.     margin: 10px 15px;
549.     padding: 5px 0 0 0;
550. }
551.     footer nav.pagination, nav.pagination-automatic {
552.         display: inline-block;
553.         background-color: #D6DAF0;
554.         border-bottom: 1px solid #B7C5D9;
555.         border-right: 1px solid #B7C5D9;
556.         border-top: 1px solid transparent;
557.     }
558.     footer .pagination-buttons {
559.         float: left;
560.         margin: 0 10px;
561.     }
562.         footer .pagination-buttons .pagination-first, footer .pagination-buttons .pagination-last {
563.             display: none;
564.         }
565.         footer .pagination-buttons.buttons-pages {
566.             float: right;
567.         }
568.     footer nav.boardlist {
569.         background: none;
570.         color: #34345C;
571.         padding: 5px 0;
572.     }
573.         footer nav.boardlist .boardlist-link {
574.             color: #34345C;
575.         }
576.     #footnotes {
577.         background: none;
578.         color: black;
579.         font-size: 11px;
580.         padding: 0;
581.     }
582.         #footnotes .agpl-compliance {
583.             color: #34345C;
584.             text-decoration: none;
585.         }
586.         #footnotes .agpl-compliance:hover {
587.             color: #FF0000;
588.         }
589. /**/
590.  
591. @media (min-height: 480px) and (min-width: 1028px) {
592.     html.js body.responsive form.form-post {
593.         top: 30px;
594.         padding: 0;
595.         border-right: none;
596.     }
597. }
598.  
599. @media (max-width: 480px) {
600.     form.form-post fieldset.form-fields {
601.         width: 100% !important;
602.     }
603.     html.js body.responsive form.form-post .field-control {
604.         margin: 0;
605.     }
606.     html.js body.responsive form.form-post .field {
607.         margin: 1px 0;
608.     }
609.     form.form-post div.row-file {
610.         margin: 0;
611.     }
612.     .post-details {
613.         margin: 0 3em 5px 0;
614.     }
615.     .reply {
616.         width: 100%;
617.     }
618.     ul.thread-list {
619.         margin: 0 10px;
620.     }
621.     .mode-index section.index-form, .index-catalog section.index-form {
622.         margin: 0 10px;
623.     }
624. }
625.  
626. nav.cp-side a.linkitem-name-createboard {
627.     text-align: center;
628.     border-radius: 5px;
629.     border: 1px solid #E0E0E0;
630. }
631. a.linkitem-name.linkitem-name-createboard:hover {
632.     background: #333;
633.     color: #FFF;
634.     border: 1px solid #333;
635. }
636. li.post-attachment.attachment-expanded, li.post-attachment.attachment-expanded figure.attachment, li.post-attachment.attachment-expanded div.attachment-wrapper, li.post-attachment.attachment-expanded img.attachment-img {
637.     max-width: 100%;
638. }
639.  
640. #instantclick-bar {
641.         background: #34345C;
642.     margin-top: 16px;
643.     height: 1px !important;
644. }