79bac6bf181a548ed04dd6f2f6773fdc0bc95a66
[project/luci.git] / themes / openwrt.org / htdocs / luci-static / openwrt.org / cascade.css
1 @charset "utf-8";
2
3 @media all {
4
5 html,
6 body {
7         background-color: #4a6b7c;
8         background-image: url(bg.jpg);
9         background-position: bottom center;
10         background-attachment: fixed;
11         background-repeat: repeat-x;
12         color: #ffffff;
13 }
14
15 body {
16         font-family: Verdana, Arial, sans-serif;
17         font-size: 101%;
18         line-height: 100%;
19 }
20
21 * {
22         margin: 0;
23         padding: 0;
24 }
25
26 abbr,
27 acronym {
28         font-style: normal;
29         font-variant: normal;
30 }
31
32 abbr[title],
33 acronym[title] {
34         border-bottom: 1px dotted;
35         cursor: help;
36 }
37
38 a:link abbr[title],
39 a:visited abbr[title],
40 a:link acronym[title],
41 a:visited acronym[title] {
42         cursor: pointer;
43 }
44
45 code {
46         font-family: monospace;
47         white-space: pre;
48 }
49
50 #maincontent ul {
51         margin-left: 2em;
52 }
53
54 .warning {
55         color: red;
56         background-color: white;
57         font-weight: bold;
58 }
59
60 .clear {
61         clear: both;
62 }
63
64 .skiplink,
65 .navigation,
66 .hidden {
67         position: absolute;
68         left: -1000px;
69         top: -1000px;
70         width: 0px;
71         height: 0px;
72         overflow: hidden;
73         display: inline;
74 }
75
76 .error {
77         color: #ff0000;
78         background-color: white;
79 }
80
81 #header {
82         min-height: 98px;
83         background-image: url(header.png);
84         background-repeat: no-repeat;
85         background-position: left center;
86         background-color: #557788;
87         color: #ffffff;
88         text-align: right;
89 }
90
91 #header h1 {
92         padding: 1em 1em 0 1em;
93 }
94
95 #header p {
96         padding: 0 1em 1em 1em;
97 }
98
99 #header h1,
100 #header p {
101         font-size: 70%;
102         font-weight: normal;
103         line-height: 160%;
104         text-align: right;
105 }
106
107 ul.dropdowns {
108         float: left;
109         margin: 0;
110         padding: 0;
111         width: auto;
112         list-style: none;
113 }
114
115 html>body ul.dropdowns {
116         position: relative;
117 }
118
119 ul.dropdowns li,
120 ul.dropdowns ul {
121         margin: 0;
122         padding: 0;
123         list-style: none;
124 }
125
126 ul.dropdowns li {
127         float: left;
128         position: relative;
129         white-space: nowrap;
130 }
131
132 ul.dropdowns li ul {
133         position: absolute;
134         z-index: 1000;
135         top: auto;
136         min-width: 10em;
137 }
138
139 * html ul.dropdowns li ul {
140         width: 10em;
141 }
142
143 ul.dropdowns li li {
144         float: none;
145         position: relative;
146 }
147
148 * html ul.dropdowns li li {
149         clear: both;
150         float: left;
151 }
152
153 * html ul.dropdowns li li {
154         width: 100%;
155 }
156
157 ul.dropdowns li a {
158         display: block;
159 }
160
161 * html ul.dropdowns li li a {
162         height: 1%;
163 }
164
165 ul.dropdowns ul li ul {
166         top: 0;
167 }
168
169 ul.dropdowns li ul,
170 ul.dropdowns li.over ul ul,
171 ul.dropdowns li.focus ul ul,
172 ul.dropdowns li:hover ul ul,
173 ul.dropdowns li.over ul ul ul,
174 ul.dropdowns li.focus ul ul ul,
175 ul.dropdowns li:hover ul ul ul,
176 ul.dropdowns li.over ul ul ul ul,
177 ul.dropdowns li.focus ul ul ul ul,
178 ul.dropdowns li:hover ul ul ul ul {
179         left: -3000px;
180 }
181
182 ul.dropdowns li.over ul,
183 ul.dropdowns li.focus ul,
184 ul.dropdowns li:hover ul {
185         left: 0;
186 }
187
188 ul.dropdowns ul li.over ul,
189 ul.dropdowns ul li.focus ul,
190 ul.dropdowns ul li:hover ul,
191 ul.dropdowns ul ul li.over ul,
192 ul.dropdowns ul ul li.focus ul,
193 ul.dropdowns ul ul li:hover ul,
194 ul.dropdowns ul ul ul li.over ul,
195 ul.dropdowns ul ul ul li.focus ul,
196 ul.dropdowns ul ul ul li:hover ul {
197         left: 100%;
198 }
199
200 #menubar {
201         position: relative;
202         width: 100%;
203         background: #000000;
204         color: #ffffff;
205 }
206
207 #menubar .warning {
208         color: red;
209         background-color: #557788;
210 }
211
212 #menubar ul.dropdowns {
213         min-height: 1.8em;
214         background: #000000;
215         color: #ffffff;
216 }
217
218 #menubar ul.dropdowns li ul {
219         background: #000000;
220         color: #ffffff;
221         border-width: 0 1px 1px 1px;
222         border-style: solid;
223         border-color: #444444;
224 }
225
226 #menubar ul.dropdowns ul li ul {
227         border-width: 1px;
228 }
229
230 html #menubar a:link,
231 html #menubar a:visited {
232         position: relative;
233         display: block;
234         padding: 0.5em;
235         background: #000000;
236         color: #ffffff;
237         text-decoration: none;
238         font-size: 80%;
239         font-weight: normal;
240 }
241
242
243 html #menubar a:link:hover,
244 html #menubar a:visited:hover,
245 html #menubar a:link:active,
246 html #menubar a:visited:active,
247 #menubar a:link:focus,
248 #menubar a:visited:focus {
249         background: #000000;
250         color: #ffff00;
251         font-weight: bold;
252 }
253
254 html #menubar a:link.active,
255 html #menubar a:visited.active,
256 html #menubar a:link.preactive,
257 html #menubar a:visited.preactive {
258         background: #000000;
259         color: #ffff00;
260         font-weight: bold;
261 }
262
263 html #menubar a:link.warning,
264 html #menubar a:visited.warning {
265         background: #000000;
266         color: red;
267         font-weight: bold;
268 }
269
270 #menubar ul.dropdowns li.over>a,
271 #menubar ul.dropdowns li.focus>a,
272 #menubar ul.dropdowns li:hover>a {
273         font-weight: bold;
274 }
275
276 .lang_de #submenu_mini_system { min-width: 13.3em; }
277 * html .lang_de #submenu_mini_system { width: 13.3em; }
278
279 .lang_pt-br #submenu_mini_network { min-width: 14em; }
280 * html .lang_pt-br #submenu_mini_network { width: 14em; }
281
282 .lang_pt-br #submenu_mini_system { min-width: 11.5em; }
283 * html .lang_pt-br #submenu_mini_system { width: 11.5em; }
284
285 .lang_ru #submenu_mini_system { min-width: 18em; }
286 * html .lang_ru #submenu_mini_system { width: 18em; }
287
288 .lang_pt-br #submenu_admin_index { min-width: 11em; }
289 * html .lang_pt-br #submenu_admin_index { width: 11em; }
290
291 .lang_ru #submenu_admin_index { min-width: 15.5em; }
292 * html .lang_ru #submenu_admin_index { width: 15.5em; }
293
294 .lang_ru #submenu_admin_status { min-width: 10.5em; }
295 * html .lang_ru #submenu_admin_status { width: 10.5em; }
296
297 .lang_de #submenu_admin_system { min-width: 13.3em; }
298 * html .lang_de #submenu_admin_system { width: 13.3em; }
299
300 .lang_fr #submenu_admin_system { min-width: 14.5em; }
301 * html .lang_fr #submenu_admin_system { width: 14.5em; }
302
303 .lang_pt-br #submenu_admin_system { min-width: 11.5em; }
304 * html .lang_pt-br #submenu_admin_system { width: 11.5em; }
305
306 .lang_ru #submenu_admin_system { min-width: 18em; }
307 * html .lang_ru #submenu_admin_system { width: 18em; }
308
309 #submenu_admin_services_chillispot { min-width: 15.5em; }
310 * html #submenu_admin_services_chillispot { width: 15.5em; }
311
312 #submenu_admin_services_coovachilli { min-width: 15em; }
313 * html #submenu_admin_services_coovachilli { width: 15em; }
314
315 .lang_ru #submenu_admin_network_routes { min-width: 15.3em; }
316 * html .lang_ru #submenu_admin_network_routes { width: 15.3em; }
317
318 #submenu_admin_network_firewall { min-width: 14em; }
319 * html #submenu_admin_network_firewall { width: 14em; }
320
321 .lang_de #submenu_admin_network_firewall { min-width: 16.5em; }
322 * html .lang_de #submenu_admin_network_firewall { width: 16.5em; }
323
324 .lang_pt-br #submenu_admin_network_firewall { min-width: 15em; }
325 * html .lang_pt-br #submenu_admin_network_firewall { width: 15em; }
326
327 #modemenu {
328         width: auto;
329         background: #000000;
330         color: #ffffff;
331         list-style: none;
332         margin-right: 1px;
333 }
334
335 #modemenu li {
336         float: right;
337         list-style: none;
338 }
339
340 #savemenu {
341         float: right;
342         margin-right: 2em;
343 }
344
345 .lang_de #submenu_admin_uci {
346         width: 12em;
347 }
348
349 .lang_ru #submenu_admin_uci {
350         width: 11.5em;
351 }
352
353 #maincontent {
354         clear: both;
355         width: 80%;
356         margin: 0 auto;
357         padding: 0.5em;
358         background: #f5f5f5;
359         color: #000000;
360         border-width: 0 1px 1px 1px;
361         border-style: solid;
362         border-color: #444444;
363         font-size: 80%;
364 }
365
366 #maincontent h2 {
367         margin: 0.25em 0 0.5em 0;
368         font-size: 150%;
369         font-weight: normal;
370 }
371
372 #maincontent h3 {
373         margin: 0.5em 0;
374         font-size: 120%;
375         font-weight: normal;
376         text-decoration: underline;
377 }
378
379 #maincontent p {
380         margin-bottom: 1em;
381 }
382
383 .cbi-section {
384         margin-bottom: 0.5em;
385         padding: 0.5em 1em;
386         border: 1px dotted #555555;
387         background-color: #ffffff;
388         color: #000000;
389 }
390
391 .cbi-section legend {
392         font-size: 110%;
393         font-weight: bold;
394         height: 1em;
395         padding: 0 0.25em;
396         background-color: transparent;
397         color: #555555;
398 }
399
400 *+html .cbi-section legend {
401         background-color: #ffffff;
402         color: #555555;
403 }
404
405 * html .cbi-section legend {
406         background-color: #ffffff;
407         color: #555555;
408 }
409
410 .cbi-section h2 {
411         margin: 0em 0 0.5em -0.5em !important;
412 }
413
414 .cbi-section h3 {
415         height: 1.5em;
416         font-size: 90%;
417         background-color: #ffffff;
418         color: #555555;
419 }
420
421 .cbi-section-descr {
422         margin-bottom: 0.5em;
423         font-size: 95%;
424 }
425
426 .cbi-title-ref {
427         color: inherit;
428         text-decoration: none;
429         padding-right: 18px;
430         background: url('../resources/cbi/link.gif') no-repeat scroll right center;
431         background-color: inherit;
432 }
433
434 ul.cbi-apply {
435         font-size: 90%;
436 }
437
438 input[type=submit],
439 input[type=reset],
440 input[type=image] {
441         cursor: pointer;
442 }
443
444
445 select,
446 input,
447 textarea {
448         background: #eeeeee;
449         color: #000000;
450         border-width: 1px;
451         border-color: #000000;
452 }
453
454 input[type=image] {
455         border: none;
456 }
457
458 input:focus,
459 input:hover,
460 select:focus,
461 select:hover,
462 textarea:focus,
463 textarea:hover {
464         background-color: #ffffff;
465         color: #000000;
466 }
467
468 select,
469 input[type=text],
470 input[type=password] {
471         width: 20em;
472 }
473
474 td select,
475 td input[type=text],
476 td input[type=password] {
477         width: 99%;
478 }
479
480 input.cbi-input-user {
481         background: url('../resources/cbi/user.gif') no-repeat scroll 1px center;
482         background-color: inherit;
483         color: #000000;
484         padding-left: 17px;
485 }
486
487 input.cbi-input-password {
488         background: url('../resources/cbi/key.gif') no-repeat scroll 1px center;
489         background-color: inherit;
490         color: #000000;
491         padding-left: 17px;
492 }
493
494 input.cbi-input-find {
495         background: url('../resources/cbi/find.gif') no-repeat scroll 1px center;
496         background-color: inherit;
497         color: #000000;
498         padding-left: 17px;
499 }
500
501 input.cbi-input-reload {
502         background: url('../resources/cbi/reload.gif') no-repeat scroll 1px center;
503         background-color: inherit;
504         color: #000000;
505         padding-left: 17px;
506 }
507
508 input.cbi-input-add,
509 input.cbi-button-add {
510         background: url('../resources/cbi/add.gif') no-repeat scroll 1px center;
511         background-color: inherit;
512         color: #000000;
513         padding-left: 17px;
514         padding-right: 1px;
515 }
516
517 input.cbi-input-fieldadd,
518 input.cbi-button-fieldadd {
519         background: url(../resources/cbi/fieldadd.gif) no-repeat scroll 1px center;
520         background-color: inherit;
521         color: #000000;
522         padding-left: 17px;
523         padding-right: 1px;
524 }
525
526 input.cbi-input-reset,
527 input.cbi-button-reset {
528         background: url('../resources/cbi/reset.gif') no-repeat scroll 1px center;
529         background-color: inherit;
530         color: #000000;
531         padding-left: 17px;
532         padding-right: 1px;
533 }
534
535 input.cbi-input-save,
536 input.cbi-button-save {
537         background: url('../resources/cbi/save.gif') no-repeat scroll 1px center;
538         background-color: inherit;
539         color: #000000;
540         padding-left: 17px;
541         padding-right: 1px;
542 }
543
544 input.cbi-input-apply,
545 input.cbi-button-apply {
546         background: url('../resources/cbi/apply.gif') no-repeat scroll 1px center;
547         background-color: inherit;
548         color: #000000;
549         padding-left: 17px;
550         padding-right: 1px;
551 }
552
553 input.cbi-input-remove,
554 div.cbi-section-remove input {
555         background: url('../resources/cbi/remove.gif') no-repeat scroll 1px center;
556         background-color: inherit;
557         color: #000000;
558         padding-left: 17px;
559         padding-right: 1px;
560 }
561
562 div.cbi-section-remove input {
563         border-bottom: none;
564 }
565
566 textarea {
567         margin-left: -1px;
568         margin-bottom: 0.5em;
569 }
570
571 form > div > input[type=submit],
572 form > div > input[type=reset] {
573         float: right;
574         margin-left: 0.5em;
575 }
576
577 table td,
578 table th {
579         color: #000000;
580 }
581
582 table.smalltext {
583         background: #f5f5f5;
584         color: #000000;
585         border-top: 1px solid #666666;
586         border-right: 1px solid #666666;
587         border-bottom: 1px solid #666666;
588         font-size: 90%;
589         width: 80%;
590         margin-left: auto;
591         margin-right: auto;
592         border-collapse: collapse;
593 }
594
595 table.smalltext tr:hover td {
596         background-color: #bbddee;
597         color: #000000;
598 }
599
600 table.smalltext tr th {
601         padding: 0 0.25em;
602         border-left: 1px solid #666666;
603         text-align: left;
604 }
605
606 table.smalltext tr td {
607         padding: 0 0.25em;
608         border-top: 1px solid #666666;
609         border-left: 1px solid #666666;
610 }
611
612 table.cbi-section-table .cbi-rowstyle-1,
613 table.cbi-section-table .cbi-rowstyle-1 * {
614         background-color: #eeeeff;
615         color: #000000;
616 }
617
618 .cbi-section .cbi-rowstyle-1 h3 {
619         background-color: #eeeeff;
620         color: #555555;
621 }
622
623 .cbi-rowstyle-2 {
624         color: #000000;
625 }
626
627 div.cbi-value {
628         clear: left;
629         vertical-align: middle;
630         padding-left: 0.25em;
631         border-bottom: 1px dotted #bbbbbb;
632 }
633
634 div.cbi-value:hover {
635         background: #f8f8f8;
636         color: #000000;
637 }
638
639 .cbi-value-title {
640         float: left;
641         width: 40%;
642 }
643
644 div.cbi-value-field {
645         width: 58%;
646         margin-left: 40%;
647         padding: 0.25em 0;
648 }
649
650 div.cbi-value-description {
651         font-size: 90%;
652         display: inline;
653 }
654
655 div.cbi-section-create {
656         clear: left;
657         white-space: nowrap;
658 }
659
660 div.cbi-map-descr {
661         margin-bottom: 1em;
662 }
663
664 div.cbi-optionals {
665         padding: 0.25em;
666         border-bottom: 1px dotted #bbbbbb;
667 }
668
669 div.cbi-section-remove {
670         float: right;
671 }
672
673 .cbi-section-node {
674         clear: both;
675         border-top: 1px dotted #bbbbbb;
676         border-left: 1px dotted #bbbbbb;
677         border-right: 1px dotted #bbbbbb;
678         border-bottom: none;
679         padding-bottom: 0;
680 }
681
682 .cbi-section-node table div {
683         padding-bottom: 0;
684         border-bottom: none;
685 }
686
687 .cbi-section-node div.cbi-section-table-row {
688         margin: 0.25em;
689 }
690
691 table.cbi-section-table {
692         width: 100%;
693         font-size: 95%;
694 }
695
696 table.cbi-section-table th,
697 table.cbi-section-table td {
698         text-align: center;
699 }
700
701 tr.cbi-section-table-descr th {
702         font-weight: normal;
703         font-size: 90%;
704 }
705
706 td.cbi-section-table-optionals {
707         text-align: left !important;
708         padding-top: 1em;
709 }
710
711 .cbi-value-helpicon img {
712         vertical-align: bottom;
713 }
714
715 div.cbi-error {
716         font-size: 95%;
717         font-weight: bold;
718         color: #ff0000;
719         background-color: #ffffff;
720 }
721
722 td.cbi-value-error {
723         border-color: red;
724 }
725
726 .cbi-value-error input,
727 .cbi-value-error select {
728         color: red;
729         background-color: #ffcccc;
730 }
731
732 .cbi-section-error {
733         color: red;
734         background-color: white;
735         font-size: 95%;
736         border: 1px dotted red;
737         margin: 3px;
738         padding: 3px;
739 }
740
741 .right {
742         text-align: right;
743 }
744
745 .luci {
746         position: fixed;
747         bottom: 0;
748         left: 0;
749         text-align: right;
750 }
751
752 .luci a:link,
753 .luci a:visited {
754         background-color: transparent;
755         color: #666666;
756         text-decoration: none;
757         font-size: 70%;
758 }
759
760 .inline {
761         display: inline;
762 }
763
764 .error500 {
765         white-space: normal;
766         border: 1px dotted #ff0000;
767         background-color: #ffffff;
768         color: #000000;
769         padding: 0.5em;
770 }
771
772 #memorybar {
773         width: 200px;
774         height: 8px;
775         border: 1px solid #bbb;
776         color: black;
777         background-color: red;
778 }
779
780 #memfree, #membuffers, #memcached {
781         float: right;
782         border: 1px solid #bbb;
783         height: 6px;
784 }
785
786 #memfree {
787         background-color: green;
788         color: black;
789 }
790
791 #membuffers {
792         background-color: yellow;
793         color: black;
794 }
795
796 #memcached {
797         background-color: #ffa500;
798         color: black;
799 }
800
801
802 /* obligatory IE6 Voodoo Code */
803
804 * html body {
805         padding-left: 50% !important;
806 }
807
808 * html div#header {
809         margin-left: -100% !important;
810 }
811
812 * html div#menubar {
813         margin-left: -100% !important;
814         width: 200% !important;
815 }
816
817 * html div#maincontent {
818         margin-left: -80% !important;
819         width: 160% !important;
820 }
821
822 * html div.cbi-value-description {
823         width: auto !important;
824 }
825
826 * html div.cbi-value-field {
827         margin-left: 0 !important;
828         width: 100% !important;
829 }
830
831 * html .cbi-input-text,
832 * html .cbi-input-user,
833 * html .cbi-input-select,
834 * html .cbi-input-password {
835         width: 50% !important;
836 }
837
838 * html div.cbi-page-actions {
839         text-align: right !important;
840 }
841
842 * html div.cbi-section-create {
843         border-bottom: 1px dotted #bbbbbb !important;
844 }
845
846 * html div.cbi-section-create .cbi-button {
847         margin: 0.5em !important;
848 }
849
850 }