view theme/common.css @ 0:84057f728815

Initial commit. Already a few changes in here
author Eris Caffee <discordia@eldalin.com>
date Sun, 26 Jan 2014 21:32:19 -0800
parents
children
line source
1 /* General Markup Styles
2 ---------------------------------------- */
4 * {
5 /* Reset browsers default margin, padding and font sizes */
6 margin: 0;
7 padding: 0;
8 }
10 html {
11 font-size: 100%;
12 /* Always show a scrollbar for short pages - stops the jump when the scrollbar appears. non-IE browsers */
13 height: 101%;
14 }
16 body {
17 /* Text-Sizing with ems: http://www.clagnut.com/blog/348/ */
18 font-family: Arial, Helvetica, sans-serif;
19 color: #828282;
20 background-color: #FFFFFF;
21 /*font-size: 62.5%; This sets the default font size to be equivalent to 10px */
22 font-size: 12px;
23 margin: 0;
24 padding: 27px 0;
25 }
27 h1 {
28 /* Forum name */
29 margin-right: 200px;
30 color: #FFFFFF;
31 margin-top: 15px;
32 font-weight: bold;
33 font-size: 2em;
34 }
36 h2 {
37 /* Forum header titles */
38 font-weight: normal;
39 color: #3f3f3f;
40 font-size: 2em;
41 margin: 0.8em 0 0.2em 0;
42 font-family: "ExoDemiBold", Arial, Helvetica, sans-serif;
43 }
45 h2.solo {
46 margin-bottom: 1em;
47 }
49 h3 {
50 /* Sub-headers (also used as post headers, but defined later) */
51 border-bottom: 1px solid #CCCCCC;
52 margin-bottom: 3px;
53 padding-bottom: 2px;
54 font-size: 1.2em;
55 color: #989898;
56 margin-top: 20px;
57 font-family: "ExoDemiBold", Arial, Helvetica, sans-serif;
58 }
60 h4 {
61 /* Forum and topic list titles */
62 font-size: 1.3em;
63 }
65 p {
66 line-height: 1.3em;
67 font-size: 1.1em;
68 margin-bottom: 1.5em;
69 }
71 img {
72 border-width: 0;
73 }
75 hr {
76 /* Also see tweaks.css */
77 border: 0 none #FFFFFF;
78 border-top: 1px solid #CCCCCC;
79 height: 1px;
80 margin: 5px 0;
81 display: block;
82 clear: both;
83 }
85 hr.dashed {
86 border-top: 1px dashed #CCCCCC;
87 margin: 10px 0;
88 }
90 hr.divider {
91 display: none;
92 }
94 p.right {
95 text-align: right;
96 }
98 /* Border
99 ---------------------------------------- */
100 .border-left {
101 background: url("{T_THEME_PATH}/images/border_left.gif") #181818 repeat-y 0 0;
102 }
104 .border-right {
105 background: url("{T_THEME_PATH}/images/border_right.gif") repeat-y 100% 0;
106 }
108 .border-top {
109 background: url("{T_THEME_PATH}/images/border_top.gif") repeat-x 0 0;
110 }
112 .border-top-left {
113 background: url("{T_THEME_PATH}/images/border_top_left.gif") no-repeat 0 0;
114 }
116 .border-top-right {
117 background: url("{T_THEME_PATH}/images/border_top_right.gif") no-repeat 100% 0;
118 }
120 .border-bottom {
121 background: url("{T_THEME_PATH}/images/border_bottom2.gif") repeat-x 0 100%;
122 }
124 .border-left, .border-right, .border-top, .border-top-left, .border-top-right, .border-bottom { width: 100%;}
126 .border-bottom span {
127 background: url("{T_THEME_PATH}/images/border_bottom.gif") no-repeat 0 -104px;
128 display: block;
129 height: 18px;
130 }
132 .border-bottom span span {
133 background-position: 100% -35px;
134 }
136 .inside {
137 padding: 17px 27px 10px 27px;
138 }
140 /* Main blocks
141 ---------------------------------------- */
142 #wrap {
143 padding: 0 20px;
144 min-width: 900px;
145 margin: 0 auto;
146 }
148 #simple-wrap {
149 padding: 6px 10px;
150 }
152 #page-body {
153 margin: 4px 0;
154 clear: both;
155 }
157 #page-footer {
158 clear: both;
159 }
161 #page-footer h3 {
162 margin-top: 20px;
163 }
165 #logo {
166 width: auto;
167 }
169 a#logo:hover {
170 text-decoration: none;
171 }
173 /* Search box
174 --------------------------------------------- */
175 #search-box {
176 color: #FFFFFF;
177 position: relative;
178 margin-top: 30px;
179 margin-right: 5px;
180 display: block;
181 float: right;
182 text-align: right;
183 white-space: nowrap; /* For Opera */
184 }
186 #search-box #keywords {
187 width: 95px;
188 background-color: #FFF;
189 }
191 #search-box input {
192 border: 1px solid #b0b0b0;
193 }
195 /* .button1 style defined later, just a few tweaks for the search button version */
196 #search-box input.button1 {
197 padding: 1px 5px;
198 }
200 #search-box li {
201 text-align: right;
202 margin-top: 4px;
203 }
205 #search-box img {
206 vertical-align: middle;
207 margin-right: 3px;
208 }
210 /* Site description and logo */
211 #site-description {
212 float: left;
213 width: 70%;
214 }
216 #site-description h1 {
217 margin-right: 0;
218 }
220 /* Round cornered boxes and backgrounds
221 ---------------------------------------- */
222 .headerbar {
223 background: #ebebeb none repeat-x 0 0;
224 color: #FFFFFF;
225 padding: 0 5px;
226 height: 185px;
227 box-shadow: inset 0 0 10px rgba(0,0,0,0.5);
228 }
230 .navbar {
231 background-color: #ebebeb;
232 padding: 0 10px;
233 font-family: "ExoDemiBold", Arial, Helvetica, sans-serif;
234 }
236 .forabg {
237 background: #b1b1b1 none repeat-x 0 0;
238 margin-bottom: 20px;
239 padding: 0 5px;
240 clear: both;
241 }
243 .forumbg {
244 background: #ebebeb none repeat-x 0 0;
245 margin-bottom: 4px;
246 padding: 0 5px;
247 clear: both;
248 }
250 .panel {
251 margin-bottom: 4px;
252 padding: 0 10px;
253 background-color: #f3f3f3;
254 color: #3f3f3f;
255 }
257 .post {
258 padding: 0 10px;
259 margin-bottom: 4px;
260 background-repeat: no-repeat;
261 background-position: 100% 0;
262 }
264 .post:target .content {
265 color: #000000;
266 }
268 .post:target h3 a {
269 color: #000000;
270 }
272 .bg1 { background-color: #f7f7f7;}
273 .bg2 { background-color: #f2f2f2; }
274 .bg3 { background-color: #ebebeb; }
276 .rowbg {
277 margin: 5px 5px 2px 5px;
278 }
280 .ucprowbg {
281 background-color: #e2e2e2;
282 }
284 .fieldsbg {
285 /*border: 1px #DBDEE2 solid;*/
286 background-color: #eaeaea;
287 }
289 span.corners-top, span.corners-bottom, span.corners-top span, span.corners-bottom span {
290 font-size: 1px;
291 line-height: 1px;
292 display: block;
293 height: 5px;
294 background-repeat: no-repeat;
295 }
297 span.corners-top {
298 background-image: none;
299 background-position: 0 0;
300 margin: 0 -5px;
301 }
303 span.corners-top span {
304 background-image: none;
305 background-position: 100% 0;
306 }
308 span.corners-bottom {
309 background-image: none;
310 background-position: 0 100%;
311 margin: 0 -5px;
312 clear: both;
313 }
315 span.corners-bottom span {
316 background-image: none;
317 background-position: 100% 100%;
318 }
320 .headbg span.corners-bottom {
321 margin-bottom: -1px;
322 }
324 .post span.corners-top, .post span.corners-bottom, .panel span.corners-top, .panel span.corners-bottom, .navbar span.corners-top, .navbar span.corners-bottom {
325 margin: 0 -10px;
326 }
328 .rules span.corners-top {
329 margin: 0 -10px 5px -10px;
330 }
332 .rules span.corners-bottom {
333 margin: 5px -10px 0 -10px;
334 }
336 /* Horizontal lists
337 ----------------------------------------*/
338 ul.linklist {
339 display: block;
340 margin: 0;
341 }
343 ul.linklist li {
344 display: block;
345 list-style-type: none;
346 float: left;
347 width: auto;
348 margin-right: 8px;
349 font-size: 1.1em;
350 line-height: 2.2em;
351 }
353 ul.linklist li.rightside, p.rightside {
354 float: right;
355 margin-right: 0;
356 margin-left: 5px;
357 text-align: right;
358 }
360 ul.navlinks {
361 padding-bottom: 1px;
362 margin-bottom: 1px;
363 border-bottom: 1px solid #FFFFFF;
364 /* font-weight: bold; */
365 }
367 ul.leftside {
368 float: left;
369 margin-left: 0;
370 margin-right: 5px;
371 text-align: left;
372 }
374 ul.rightside {
375 float: right;
376 margin-left: 5px;
377 margin-right: -5px;
378 text-align: right;
379 }
381 /* Table styles
382 ----------------------------------------*/
383 table.table1 {
384 /* See tweaks.css */
385 }
387 #ucp-main table.table1 {
388 padding: 2px;
389 }
391 table.table1 thead th {
392 font-weight: normal;
393 text-transform: uppercase;
394 color: #FFFFFF;
395 line-height: 1.3em;
396 font-size: 1em;
397 padding: 0 0 4px 3px;
398 }
400 table.table1 thead th span {
401 padding-left: 7px;
402 }
404 table.table1 tbody tr {
405 border: 1px solid #cfcfcf;
406 }
408 table.table1 tbody tr:hover, table.table1 tbody tr.hover {
409 background-color: #f6f6f6;
410 color: #000;
411 }
413 table.table1 td {
414 color: #6a6a6a;
415 font-size: 1.1em;
416 }
418 table.table1 tbody td {
419 padding: 5px;
420 border-top: 1px solid #FAFAFA;
421 }
423 table.table1 tbody th {
424 padding: 5px;
425 border-bottom: 1px solid #000000;
426 text-align: left;
427 color: #333333;
428 background-color: #FFFFFF;
429 }
431 /* Specific column styles */
432 table.table1 .name { text-align: left; }
433 table.table1 .posts { text-align: center !important; width: 7%; }
434 table.table1 .joined { text-align: left; width: 15%; }
435 table.table1 .active { text-align: left; width: 15%; }
436 table.table1 .mark { text-align: center; width: 7%; }
437 table.table1 .info { text-align: left; width: 30%; }
438 table.table1 .info div { width: 100%; white-space: normal; overflow: hidden; }
439 table.table1 .autocol { line-height: 2em; white-space: nowrap; }
440 table.table1 thead .autocol { padding-left: 1em; }
442 table.table1 span.rank-img {
443 float: right;
444 width: auto;
445 }
447 table.info td {
448 padding: 3px;
449 }
451 table.info tbody th {
452 padding: 3px;
453 text-align: right;
454 vertical-align: top;
455 color: #000000;
456 font-weight: normal;
457 }
459 .forumbg table.table1 {
460 margin: 0;
461 }
463 .forumbg-table > .inner {
464 margin: 0 -1px;
465 }
467 .forumbg-table > .inner > span.corners-top {
468 margin: 0 -4px -1px -4px;
469 }
471 .forumbg-table > .inner > span.corners-bottom {
472 margin: -1px -4px 0 -4px;
473 }
475 /* Misc layout styles
476 ---------------------------------------- */
477 /* column[1-2] styles are containers for two column layouts
478 Also see tweaks.css */
479 .column1 {
480 float: left;
481 clear: left;
482 width: 49%;
483 }
485 .column2 {
486 float: right;
487 clear: right;
488 width: 49%;
489 }
491 /* General classes for placing floating blocks */
492 .left-box {
493 float: left;
494 width: auto;
495 text-align: left;
496 }
498 .right-box {
499 float: right;
500 width: auto;
501 text-align: right;
502 }
504 dl.details {
505 font-size: 1.1em;
506 }
508 dl.details dt {
509 float: left;
510 clear: left;
511 width: 30%;
512 text-align: right;
513 color: #000000;
514 display: block;
515 }
517 dl.details dd {
518 margin-left: 0;
519 padding-left: 5px;
520 margin-bottom: 5px;
521 color: #828282;
522 float: left;
523 width: 65%;
524 }
526 /* Pagination
527 ---------------------------------------- */
528 .pagination {
529 height: 1%; /* IE tweak (holly hack) */
530 width: auto;
531 text-align: right;
532 margin-top: 5px;
533 float: right;
534 }
536 .pagination span.page-sep {
537 display: none;
538 }
540 li.pagination {
541 margin-top: 0;
542 }
544 .pagination strong, .pagination b {
545 font-weight: normal;
546 }
548 .pagination span strong {
549 padding: 0 2px;
550 margin: 0 2px;
551 font-weight: normal;
552 color: #FFFFFF;
553 background-color: #bfbfbf;
554 border: 1px solid #bfbfbf;
555 font-size: 0.9em;
556 }
558 .pagination span a, .pagination span a:link, .pagination span a:visited, .pagination span a:active {
559 font-weight: normal;
560 text-decoration: none;
561 color: #747474;
562 margin: 0 2px;
563 padding: 0 2px;
564 background-color: #eeeeee;
565 border: 1px solid #bababa;
566 font-size: 0.9em;
567 line-height: 1.5em;
568 }
570 .pagination span a:hover {
571 border-color: #d2d2d2;
572 background-color: #d2d2d2;
573 color: #FFF;
574 text-decoration: none;
575 }
577 .pagination img {
578 vertical-align: middle;
579 }
581 /* Pagination in viewforum for multipage topics */
582 .row .pagination {
583 display: block;
584 float: right;
585 width: auto;
586 margin-top: 0;
587 padding: 1px 0 1px 15px;
588 font-size: 0.9em;
589 background: none 0 50% no-repeat;
590 }
592 .row .pagination span a, li.pagination span a {
593 background-color: #FFFFFF;
594 }
596 .row .pagination span a:hover, li.pagination span a:hover {
597 background-color: #d2d2d2;
598 }
600 /* Miscellaneous styles
601 ---------------------------------------- */
602 #forum-permissions {
603 float: right;
604 width: auto;
605 padding-left: 5px;
606 margin-left: 5px;
607 margin-top: 10px;
608 text-align: right;
609 }
611 .copyright {
612 padding: 5px;
613 text-align: center;
614 color: #000000;
615 clear: both;
616 font-size: 1.2em;
617 padding-top: 10px;
618 line-height: 18px;
619 text-shadow: 0 0 2px #000000;
620 }
622 .small {
623 font-size: 0.9em !important;
624 }
626 .titlespace {
627 margin-bottom: 15px;
628 }
630 .headerspace {
631 margin-top: 20px;
632 }
634 .error {
635 color: #bcbcbc;
636 font-weight: bold;
637 font-size: 1em;
638 }
640 div.rules {
641 background-color: #ececec;
642 color: #bcbcbc;
643 padding: 0 10px;
644 margin: 10px 0;
645 font-size: 1.1em;
646 }
648 div.rules ul, div.rules ol {
649 margin-left: 20px;
650 }
652 p.rules {
653 background-color: #ececec;
654 background-image: none;
655 padding: 5px;
656 }
658 p.rules img {
659 vertical-align: middle;
660 padding-top: 5px;
661 }
663 p.rules a {
664 vertical-align: middle;
665 clear: both;
666 }
668 #top {
669 position: absolute;
670 top: -20px;
671 }
673 .clear {
674 display: block;
675 clear: both;
676 font-size: 1px;
677 line-height: 1px;
678 background: transparent;
679 }