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