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