Fix toc margin in modern skin per DieBuche on r90743
[lhc/web/wiklou.git] / skins / modern / main.css
1 body {
2 margin: 0;
3 padding: 0;
4 /*font-size: 10pt;*/
5 font-size: x-small;
6
7
8 font-family: sans-serif;
9 color: black;
10 background-color: #f0f0f0;
11
12 direction: ltr;
13 unicode-bidi: embed;
14 }
15
16 #mw_main,
17 #p-personal,
18 #mw_header,
19 .os-suggest {
20 font-size: 130%;
21 }
22
23 #mw_header {
24 position: absolute;
25 top: 0;
26 left: 0;
27 margin: 0;
28 padding: 0;
29 border: none;
30 height: 2em;
31 width: 100%;
32
33 background-color: #036;
34 color: white;
35 }
36
37 #mw_header h1 {
38 margin: 0 0 0 .5em;
39 padding: 0;
40 text-decoration: none;
41 font-size: 150%;
42 }
43
44 #p-personal {
45 position: absolute;
46 top: 2em;
47 left: 0;
48 height: 1.5em;
49 margin: 0;
50 padding: 0;
51 width: 100%;
52
53 }
54
55 #p-personal div.pBody {
56 margin: 0;
57 padding: 0;
58 height: 1.5em;
59 font-variant: small-caps;
60 }
61
62 #p-personal h5 {
63 display: none;
64 }
65
66 #p-personal ul {
67 margin: 0;
68 padding: 0;
69 display: block;
70 height: 1.5em;
71 background-color: #3c78b5;
72 }
73
74 #p-personal li {
75 display: block;
76 float: left;
77 height: 1.5em;
78 margin: 0;
79 vertical-align: middle;
80
81 font-weight: bold;
82 text-transform: lowercase;
83 }
84
85 #p-personal li a {
86 text-decoration: none;
87 color: white;
88 padding: 0 1em;
89 }
90
91 #p-personal li a:hover {
92 text-decoration: none;
93 color: white;
94 }
95
96 #p-personal li:hover {
97 background-color: #036;
98 }
99
100 #jump-to-nav {
101 display: none;
102 }
103
104 #mw_contentwrapper {
105 width: 100%;
106 margin: 0 0 0 -15em;
107 float: right;
108 }
109
110 #mw_content {
111 margin: 0 0 0 14em;
112
113 background-color: white;
114 border-top: solid 1px #bbb;
115 border-left: solid 1px #bbb;
116 border-bottom: solid 1px #bbb;
117
118 line-height: 1.5em;
119 padding: 0 1em 1em;
120 }
121
122 #mw_portlets {
123 width: 14em;
124
125 border-right: solid 1px #bbb;
126 background-color: #f0f0f0;
127 }
128
129 #mw_main {
130 padding: 0;
131 margin: 0;
132 margin-top: 3.5em;
133 }
134
135 div.mw_clear {
136 margin: 0;
137 padding: 0;
138 clear: both;
139 }
140
141 .portlet {
142 padding: 0;
143 margin: 0;
144 }
145
146 .portlet div.pBody {
147 padding: 0 0 .5em;
148 }
149
150 textarea {
151 width: 100%;
152 padding: .1em;
153 }
154
155 #searchBody {
156 text-align: center;
157 }
158
159 #searchInput {
160 width: 85%;
161 margin-left: auto;
162 margin-right: auto;
163 }
164
165 #p-search #searchform div div {
166 margin-top: .4em;
167 }
168
169 .portlet h5 {
170 padding: .1em 0 .3em 1em;
171 margin: 0;
172 background-color: #ddd;
173 font-weight: bold;
174 border-bottom: solid 1px #3c78b5;
175 height: 1.1em;
176 }
177
178 .portlet ul {
179 margin: 0 0 0 1.5em;
180 padding: 0;
181 }
182
183 #mw_portlets .portlet ul {
184 line-height: 1.4em;
185 }
186
187 ul {
188 /* @embed */
189 list-style-image: url(bullet.gif);
190 }
191
192 #p-cactions {
193 height: 1.5em;
194 padding: 0;
195 margin: 0 0 0 14em;
196 }
197
198 #p-cactions div.pBody {
199 margin: 0;
200 padding: 0;
201 }
202
203 #p-cactions a,
204 #p-cactions a:hover {
205 color: black;
206 text-decoration: none;
207 }
208
209 #p-cactions ul {
210 display: inline;
211 margin: 0;
212 padding: 0;
213 }
214
215 #p-cactions li {
216 margin: 0 .5em;
217 padding: 0 .2em;
218 display: block;
219 float: left;
220 height: 1.5em;
221 text-transform: lowercase;
222 }
223
224 #p-cactions li.selected {
225 background-color: #bbb;
226 }
227
228 #p-cactions li a,
229 #p-cactions li a:hover,
230 #p-cactions li a:visited {
231 text-decoration: underline;
232 color: #036;
233 }
234
235 #p-cactions li.selected a,
236 #p-cactions li.selected a:hover,
237 #p-cactions li.selected a:visited {
238 text-decoration: none;
239 color: white;
240 }
241
242 #p-cactions h5 {
243 display: none;
244 }
245
246 #siteSub {
247 display: none;
248 }
249
250 #footer {
251 background-color: #f0f0f0;
252 /* @embed */
253 background: url(footer-grad.png) repeat-x 0 0;
254 padding: 10px 1em 1em;
255 clear:both;
256 color: #444;
257 }
258
259 #footer a,
260 #footer a:hover,
261 #footer a:visited {
262 color: #444;
263 text-decoration: underline;
264 }
265
266 img {
267 border: none;
268 }
269
270 #footer li {
271 display: inline;
272 list-style-type: none;
273 padding: 0;
274 margin: 0;
275 }
276
277 #footer ul {
278 padding: 0;
279 margin: 0;
280 }
281
282 div.printfooter {
283 display: none;
284 }
285
286 p {
287 margin: 1em 0;
288 }
289
290 hr {
291 height: 1px;
292 color: #aaa;
293 background-color: #aaa;
294 border: 0;
295 margin: .2em 0;
296 }
297
298 #contentSub {
299 color: #888;
300 font-size: small;
301 padding-left: 2em;
302 }
303
304 #mw_portlets form {
305 margin: 0;
306 padding: 0;
307 }
308
309 a {
310 text-decoration: none;
311 color: #036;
312 background: none;
313 }
314 a:visited {
315 color: #5a3696;
316 }
317 a:active {
318 color: #faa700;
319 }
320 a:hover {
321 text-decoration: underline;
322 }
323 a.stub {
324 color: #772233;
325 }
326 a.new {
327 color: #ba0000;
328 }
329 a.new:visited {
330 color: #a55858;
331 }
332
333 span.editsection {
334 font-size: small;
335 }
336
337 h1, h2 {
338 border-bottom: solid 1px #036;
339 }
340
341 h1, h2, h3, h4, h5, h6 {
342 overflow: hidden;
343 }
344
345 #preftoc {
346 width: 100%;
347 margin: 0;
348 padding: 0;
349 height: 1.5em;
350 clear: right;
351 }
352
353 #preftoc li {
354 margin: 0 .5em;
355 padding: 0 .2em;
356 display: block;
357 float: left;
358 height: 1.5em;
359 text-transform: lowercase;
360 }
361
362 #preferences {
363 margin: 0;
364 padding: 0 1em 1em;
365 border: solid 1px #bbb;
366 clear: left; /* Multi-line toc should not push data to horizontally */
367 }
368
369 #preferences fieldset {
370 margin-top: 0;
371 border: none;
372 }
373
374 #preferences h2 {
375 }
376
377 .mainLegend {
378 display: none;
379 }
380
381 .htmlform-tip {
382 font-size: x-small;
383 padding: .2em 2em;
384 color: #666;
385 }
386
387 .prefsection legend {
388 font-weight: bold;
389 }
390
391 #preftoc li.selected {
392 background-color: #bbb;
393 }
394
395 #preftoc li a,
396 #preftoc li a:hover,
397 #preftoc li a:visited {
398 text-decoration: underline;
399 color: #036;
400 }
401
402 #preftoc li.selected a,
403 #preftoc li.selected a:hover,
404 #preftoc li.selected a:visited {
405 text-decoration: none;
406 color: white;
407 }
408
409 #mw-pref-clear {
410 clear: both;
411 }
412
413 #mw_content a.external,
414 #mw_content a[href ^="gopher://"] {
415 /* @embed */
416 background: url(external.png) center right no-repeat;
417 padding-right: 13px;
418 }
419 #mw_content a[href ^="https://"],
420 .link-https {
421 /* @embed */
422 background: url(lock_icon.gif) center right no-repeat;
423 padding-right: 16px;
424 }
425 #mw_content a[href ^="mailto:"],
426 .link-mailto {
427 /* @embed */
428 background: url(mail_icon.gif) center right no-repeat;
429 padding-right: 18px;
430 }
431 #mw_content a[href ^="news://"] {
432 /* @embed */
433 background: url(news_icon.png) center right no-repeat;
434 padding-right: 18px;
435 }
436 #mw_content a[href ^="ftp://"],
437 .link-ftp {
438 /* @embed */
439 background: url(file_icon.gif) center right no-repeat;
440 padding-right: 18px;
441 }
442 #mw_content a[href ^="irc://"],
443 #mw_content a.extiw[href ^="irc://"],
444 #mw_content a[href ^="ircs://"],
445 #mw_content a.extiw[href ^="ircs://"],
446 .link-irc {
447 /* @embed */
448 background: url(discussionitem_icon.gif) center right no-repeat;
449 padding-right: 18px;
450 }
451
452 #mw_content a.external[href $=".ogg"], #mw_content a.external[href $=".OGG"],
453 #mw_content a.external[href $=".mid"], #mw_content a.external[href $=".MID"],
454 #mw_content a.external[href $=".midi"], #mw_content a.external[href $=".MIDI"],
455 #mw_content a.external[href $=".mp3"], #mw_content a.external[href $=".MP3"],
456 #mw_content a.external[href $=".wav"], #mw_content a.external[href $=".WAV"],
457 #mw_content a.external[href $=".wma"], #mw_content a.external[href $=".WMA"],
458 .link-audio {
459 /* @embed */
460 background: url("audio.png") center right no-repeat;
461 padding-right: 13px;
462 }
463 #mw_content a.external[href $=".ogm"], #mw_content a.external[href $=".OGM"],
464 #mw_content a.external[href $=".avi"], #mw_content a.external[href $=".AVI"],
465 #mw_content a.external[href $=".mpeg"], #mw_content a.external[href $=".MPEG"],
466 #mw_content a.external[href $=".mpg"], #mw_content a.external[href $=".MPG"],
467 .link-video {
468 /* @embed */
469 background: url("video.png") center right no-repeat;
470 padding-right: 13px;
471 }
472 #mw_content a.external[href $=".pdf"], #mw_content a.external[href $=".PDF"],
473 #mw_content a.external[href *=".pdf#"], #mw_content a.external[href *=".PDF#"],
474 #mw_content a.external[href *=".pdf?"], #mw_content a.external[href *=".PDF?"],
475 .link-document {
476 /* @embed */
477 background: url("document.png") center right no-repeat;
478 padding-right: 12px;
479 }
480
481 /* images */
482 /* @noflip */div.floatright, table.floatright {
483 margin: 0 0 .5em .5em;
484 border: 0;
485 /*
486 border: .5em solid white;
487 border-width: .5em 0 .8em 1.4em;
488 */
489 }
490 div.floatright p { font-style: italic; }
491 /* @noflip */div.floatleft, table.floatleft {
492 margin: 0 .5em .5em 0;
493 border: 0;
494 /*
495 margin: .3em .5em .5em 0;
496 border: .5em solid white;
497 border-width: .5em 1.4em .8em 0;
498 */
499 }
500 div.floatleft p { font-style: italic; }
501 /* thumbnails */
502 div.thumb {
503 margin-bottom: .5em;
504 width: auto;
505 }
506 div.thumbinner {
507 border: 1px solid #ccc;
508 padding: 3px !important;
509 background-color: #f9f9f9;
510 font-size: 94%;
511 text-align: center;
512 overflow: hidden;
513 }
514 html .thumbimage {
515 border: 1px solid #ccc;
516 }
517 html .thumbcaption {
518 border: none;
519 text-align: left;
520 line-height: 1.4em;
521 padding: 3px !important;
522 font-size: 94%;
523 }
524 div.magnify {
525 float: right;
526 border: none !important;
527 background: none !important;
528 }
529 div.magnify a, div.magnify img {
530 display: block;
531 border: none !important;
532 background: none !important;
533 }
534 /* @noflip */div.tright {
535 margin: .5em 0 .8em 1.4em;
536 }
537 /* @noflip */div.tleft {
538 margin: .5em 1.4em .8em 0;
539 }
540 img.thumbborder {
541 border: 1px solid #ddd;
542 }
543 .mw-warning {
544 border: 1px solid #aaa;
545 background-color: #f9f9f9;
546 padding: 5px;
547 font-size: 95%;
548 }
549
550 #toc,
551 .toc {
552 margin: 0;
553 padding: 0;
554 border-spacing: 0;
555 background-color: #f0f0f0;
556 border: solid 1px #bbb;
557 }
558
559 #toctitle {
560 border-bottom: solid 1px #3c78b5;
561 background-color: #ddd;
562 margin: 0;
563 }
564
565 #toc h2,
566 .toc h2 {
567 display: inline;
568 border: none;
569 padding: 0;
570 font-size: 100%;
571 font-weight: bold;
572 }
573 #toc #toctitle,
574 .toc #toctitle,
575 #toc .toctitle,
576 .toc .toctitle {
577 text-align: center;
578 }
579
580 #toc ul,
581 .toc ul {
582 list-style-type: none;
583 list-style-image: none;
584 margin: 0 1em;
585 padding: 0;
586 text-align: left;
587 }
588
589 .mw-content-ltr .toc ul,
590 .mw-content-rtl .toc ul,
591 .mw-content-ltr #toc ul,
592 .mw-content-rtl #toc ul {
593 margin: 0 1em;
594 }
595
596 #toc ul ul,
597 .toc ul ul {
598 margin: 0 0 0 2em;
599 }
600
601 #toc .toctoggle,
602 .toc .toctoggle {
603 font-size: 94%;
604 }
605
606 .mw-warning {
607 margin-left: 50px;
608 margin-right: 50px;
609 text-align: center;
610 }
611
612 .catlinks {
613 border: solid 1px #bbb;
614 background-color: #f0f0f0;
615 padding: .1em .3em;
616 margin: 0;
617 }
618
619 #mw_header h1,
620 #p-personal,
621 #p-cactions {
622 overflow: hidden;
623 }
624
625 /* disable interwiki styling */
626 #mw_content a.extiw,
627 #mw_content a.extiw:active {
628 color: #36b;
629 background: none;
630 padding: 0;
631 }
632 #mw_content a.external {
633 color: #36b;
634 }
635
636
637 .redirectText {
638 font-size: 150%;
639 margin: 5px;
640 }
641
642 .printfooter {
643 display: none;
644 }
645
646 .sharedUploadNotice {
647 font-style: italic;
648 }
649
650 span.updatedmarker {
651 color: black;
652 background-color: #0f0;
653 }
654
655 .previewnote {
656 text-indent: 3em;
657 color: #c00;
658 border-bottom: 1px solid #aaa;
659 padding-bottom: 1em;
660 margin-bottom: 1em;
661 }
662
663 .previewnote p {
664 margin: 0;
665 padding: 0;
666 }
667
668 .editExternally {
669 border: 1px solid gray;
670 background-color: #FFF;
671 padding: 3px;
672 margin-top: .5em;
673 float: left;
674 font-size: small;
675 text-align: center;
676 }
677 .editExternallyHelp {
678 font-style: italic;
679 color: gray;
680 }
681
682 .toggle {
683 margin-left: 2em;
684 text-indent: -2em;
685 }
686
687 table.collapsed tr.collapsable {
688 display: none;
689 }
690
691 input#wpSummary {
692 width: 80%;
693 }
694
695 /* @bug 1714 */
696 input#wpSave, input#wpDiff {
697 margin-right: .33em;
698 }
699
700 #wpSave {
701 font-weight: bold;
702 }
703
704 /* noarticletext */
705 div.noarticletext {
706 border: 1px solid #ccc;
707 background: #fff;
708 padding: .2em 1em;
709 color: #000;
710 }
711
712 div#searchTargetContainer {
713 left: 10px;
714 top: 10px;
715 width: 90%;
716 background: white;
717 }
718
719 div#searchTarget {
720 padding: 3px;
721 margin: 5px;
722 background: #F0F0F0;
723 border: solid 1px blue;
724 }
725
726 div#searchTarget ul li {
727 list-style: none;
728 }
729
730 div#searchTarget ul li:before {
731 color: orange;
732 content: "\00BB \0020";
733 }
734
735 div#searchTargetHide {
736 float: right;
737 border: solid 1px black;
738 background: #DCDCDC;
739 padding: 2px;
740 }
741
742 div.multipageimagenavbox {
743 border: solid 1px silver;
744 padding: 4px;
745 margin: 1em;
746 background: #f0f0f0;
747 }
748
749 div.multipageimagenavbox div.thumb {
750 border: none;
751 margin-left: 2em;
752 margin-right: 2em;
753 }
754
755 div.multipageimagenavbox hr {
756 margin: 6px;
757 }
758
759 table.multipageimage td {
760 text-align: center;
761 }
762
763 .templatesUsed { margin-top: 1.5em; }
764
765 .mw-summary-preview {
766 margin: .1em 0;
767 }
768
769 /* Friendlier slave lag warnings */
770 div.mw-lag-warn-normal,
771 div.mw-lag-warn-high {
772 padding: 3px;
773 text-align: center;
774 margin: 3px auto;
775 }
776 div.mw-lag-warn-normal {
777 border: 1px solid #FC6;
778 background-color: #FFC;
779 }
780 div.mw-lag-warn-high {
781 font-weight: bold;
782 border: 2px solid #F03;
783 background-color: #FCC;
784 }
785
786 .MediaTransformError {
787 background-color: #ccc;
788 padding: .1em;
789 }
790 .MediaTransformError td {
791 text-align: center;
792 vertical-align: middle;
793 font-size: 90%;
794 }
795 ul {
796 line-height: 1.5em;
797 list-style-type: square;
798 margin: .3em 0 0 1.5em;
799 padding: 0;
800 /* @embed */
801 list-style-image: url(bullet.gif);
802 }
803 ol {
804 line-height: 1.5em;
805 margin: .3em 0 0 3.2em;
806 padding: 0;
807 list-style-image: none;
808 }
809 li {
810 margin-bottom: .1em;
811 }
812 dt {
813 font-weight: bold;
814 margin-bottom: .1em;
815 }
816 dl {
817 margin-top: .2em;
818 margin-bottom: .5em;
819 }
820
821 #p-cactions li.new a {
822 color: #c20;
823 }
824
825 span.subpages {
826 font-size: 80%;
827 display: block;
828 }
829
830 pre {
831 border: solid 1px #3c78b5;
832 padding: .4em;
833 background-color: #f0f0f0;
834 }
835
836 .usermessage {
837 background-color: #dadaff;
838 }
839
840 .mw-topboxes {
841 border-collapse: collapse;
842 margin: 0 -1em 1em;
843 padding: 0 0 8px;
844 /* @embed */
845 background: url(footer-grad.png) repeat-x bottom left;
846 }
847
848 .mw-topbox p {
849 padding: 0;
850 margin: 0;
851 }
852
853 .mw-topbox {
854 color: black;
855 font-weight: bold;
856 margin: 0;
857 padding: 0 1em;
858 vertical-align: middle;
859 border-collapse: collapse;
860 border-bottom: solid 1px #bbb;
861 }
862
863 #siteSub {
864 background-color: #ddd;
865 }
866
867 /* emulate center */
868 .center {
869 width: 100%;
870 text-align: center;
871 }
872 *.center * {
873 margin-left: auto;
874 margin-right: auto;
875 }
876
877 /* table standards */
878 .toccolours {
879 border: 1px solid #bbb;
880 background-color: #f0f0f0;
881 border-spacing: 0;
882 margin: 0;
883 padding: 0;
884 }
885
886 /* Tooltips are outside of the normal body code, so this helps make the size of the text sensible */
887 .tipsy {
888 font-size: 130%;
889 }
890
891 /**
892 * Lists:
893 * The following lines don't have a visible effect on non-Gecko browsers
894 * They fix a problem ith Gecko browsers rendering lists to the right of
895 * left-floated objects in an RTL layout.
896 */
897 /* @noflip */
898 html > body.rtl div#mw_contentholder ul {
899 display: table;
900 }
901
902 /* @noflip */
903 html > body.rtl div#mw_contentholder ul#filetoc {
904 display: block;
905 }