* luci-0.8: merge template changes from trunk
[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 ul.dropdowns li li {
140         float: none;
141         position: relative;
142 }
143
144 ul.dropdowns li a {
145         display: block;
146 }
147
148 ul.dropdowns ul li ul {
149         top: 0;
150 }
151
152 ul.dropdowns li ul,
153 ul.dropdowns li.over ul ul,
154 ul.dropdowns li.focus ul ul,
155 ul.dropdowns li:hover ul ul,
156 ul.dropdowns li.over ul ul ul,
157 ul.dropdowns li.focus ul ul ul,
158 ul.dropdowns li:hover ul ul ul,
159 ul.dropdowns li.over ul ul ul ul,
160 ul.dropdowns li.focus ul ul ul ul,
161 ul.dropdowns li:hover ul ul ul ul {
162         left: -3000px;
163 }
164
165 ul.dropdowns li.over ul,
166 ul.dropdowns li.focus ul,
167 ul.dropdowns li:hover ul {
168         left: 0;
169 }
170
171 ul.dropdowns ul li.over ul,
172 ul.dropdowns ul li.focus ul,
173 ul.dropdowns ul li:hover ul,
174 ul.dropdowns ul ul li.over ul,
175 ul.dropdowns ul ul li.focus ul,
176 ul.dropdowns ul ul li:hover ul,
177 ul.dropdowns ul ul ul li.over ul,
178 ul.dropdowns ul ul ul li.focus ul,
179 ul.dropdowns ul ul ul li:hover ul {
180         left: 100%;
181 }
182
183 #menubar {
184         position: relative;
185         width: 100%;
186         background: #000000;
187         color: #ffffff;
188 }
189
190 #menubar .warning {
191         color: red;
192         background-color: #557788;
193 }
194
195 #menubar ul.dropdowns {
196         min-height: 1.8em;
197         background: #000000;
198         color: #ffffff;
199 }
200
201 #menubar ul.dropdowns li ul {
202         background: #000000;
203         color: #ffffff;
204         border-width: 0 1px 1px 1px;
205         border-style: solid;
206         border-color: #444444;
207 }
208
209 #menubar ul.dropdowns ul li ul {
210         border-width: 1px;
211 }
212
213 html #menubar a:link,
214 html #menubar a:visited {
215         position: relative;
216         display: block;
217         padding: 0.5em;
218         background: #000000;
219         color: #ffffff;
220         text-decoration: none;
221         font-size: 80%;
222         font-weight: normal;
223 }
224
225
226 html #menubar a:link:hover,
227 html #menubar a:visited:hover,
228 html #menubar a:link:active,
229 html #menubar a:visited:active,
230 #menubar a:link:focus,
231 #menubar a:visited:focus {
232         background: #000000;
233         color: #ffff00;
234         font-weight: bold;
235 }
236
237 html #menubar a:link.active,
238 html #menubar a:visited.active,
239 html #menubar a:link.preactive,
240 html #menubar a:visited.preactive {
241         background: #000000;
242         color: #ffff00;
243         font-weight: bold;
244 }
245
246 html #menubar a:link.warning,
247 html #menubar a:visited.warning {
248         background: #000000;
249         color: red;
250         font-weight: bold;
251 }
252
253 #menubar ul.dropdowns li.over>a,
254 #menubar ul.dropdowns li.focus>a,
255 #menubar ul.dropdowns li:hover>a {
256         font-weight: bold;
257 }
258
259 .lang_de #submenu_mini_system { min-width: 13.3em; }
260 * html .lang_de #submenu_mini_system { width: 13.3em; }
261
262 .lang_pt-br #submenu_mini_network { min-width: 14em; }
263 * html .lang_pt-br #submenu_mini_network { width: 14em; }
264
265 .lang_pt-br #submenu_mini_system { min-width: 11.5em; }
266 * html .lang_pt-br #submenu_mini_system { width: 11.5em; }
267
268 .lang_ru #submenu_mini_system { min-width: 18em; }
269 * html .lang_ru #submenu_mini_system { width: 18em; }
270
271 .lang_pt-br #submenu_admin_index { min-width: 11em; }
272 * html .lang_pt-br #submenu_admin_index { width: 11em; }
273
274 .lang_ru #submenu_admin_index { min-width: 15.5em; }
275 * html .lang_ru #submenu_admin_index { width: 15.5em; }
276
277 .lang_ru #submenu_admin_status { min-width: 10.5em; }
278 * html .lang_ru #submenu_admin_status { width: 10.5em; }
279
280 .lang_de #submenu_admin_system { min-width: 13.3em; }
281 * html .lang_de #submenu_admin_system { width: 13.3em; }
282
283 .lang_fr #submenu_admin_system { min-width: 14.5em; }
284 * html .lang_fr #submenu_admin_system { width: 14.5em; }
285
286 .lang_pt-br #submenu_admin_system { min-width: 11.5em; }
287 * html .lang_pt-br #submenu_admin_system { width: 11.5em; }
288
289 .lang_ru #submenu_admin_system { min-width: 18em; }
290 * html .lang_ru #submenu_admin_system { width: 18em; }
291
292 #submenu_admin_services_chillispot { min-width: 15.5em; }
293 * html #submenu_admin_services_chillispot { width: 15.5em; }
294
295 #submenu_admin_services_coovachilli { min-width: 15em; }
296 * html #submenu_admin_services_coovachilli { width: 15em; }
297
298 .lang_ru #submenu_admin_network_routes { min-width: 15.3em; }
299 * html .lang_ru #submenu_admin_network_routes { width: 15.3em; }
300
301 #submenu_admin_network_firewall { min-width: 14em; }
302 * html #submenu_admin_network_firewall { width: 14em; }
303
304 .lang_de #submenu_admin_network_firewall { min-width: 16.5em; }
305 * html .lang_de #submenu_admin_network_firewall { width: 16.5em; }
306
307 .lang_pt-br #submenu_admin_network_firewall { min-width: 15em; }
308 * html .lang_pt-br #submenu_admin_network_firewall { width: 15em; }
309
310 #modemenu {
311         width: auto;
312         background: #000000;
313         color: #ffffff;
314         list-style: none;
315         margin-right: 1px;
316 }
317
318 #modemenu li {
319         float: right;
320         list-style: none;
321 }
322
323 #savemenu {
324         float: right;
325         margin-right: 2em;
326 }
327
328 .lang_de #submenu_admin_uci {
329         width: 12em;
330 }
331
332 .lang_ru #submenu_admin_uci {
333         width: 11.5em;
334 }
335
336 textarea#syslog {
337         width: 98%;
338         height: 450px;
339         border: 3px solid #cccccc;
340         padding: 5px;
341         font-family: monospace;
342         overflow: auto;
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         background: url('../resources/cbi/arrow.gif') left no-repeat;
376     padding-left: 17px;
377 }
378
379 #maincontent p {
380         margin-bottom: 1em;
381 }
382
383 #auth_buttons {
384         float: right;
385         padding-top: 0.5em;
386 }
387
388 .cbi-section {
389         margin-bottom: 0.5em;
390         padding: 0.5em 1em;
391         border: 1px dotted #555555;
392         background-color: #ffffff;
393         color: #000000;
394 }
395
396 .cbi-section legend {
397         font-size: 110%;
398         font-weight: bold;
399         height: 1em;
400         padding: 0 0.25em;
401         background-color: transparent;
402         color: #555555;
403 }
404
405 .cbi-section h2 {
406         margin: 0em 0 0.5em -0.5em !important;
407 }
408
409 .cbi-section h3 {
410         text-decoration: none !important;
411         font-weight: bold !important;
412         color: #555555 !important;
413         margin: 0.25em !important;
414         font-size: 100% !important;
415 }
416
417 .cbi-section-descr {
418         margin-bottom: 0.5em;
419         font-size: 95%;
420 }
421
422 .cbi-title-ref {
423         color: inherit;
424         text-decoration: none;
425         padding-right: 18px;
426         background: url('../resources/cbi/link.gif') no-repeat scroll right center;
427         background-color: inherit;
428 }
429
430 ul.cbi-apply {
431         font-size: 90%;
432 }
433
434 input[type=submit],
435 input[type=reset],
436 input[type=image] {
437         cursor: pointer;
438 }
439
440
441 select,
442 input,
443 textarea {
444         background: #eeeeee;
445         color: #000000;
446         border-width: 1px;
447         border-color: #000000;
448 }
449
450 input[type=image] {
451         border: none;
452 }
453
454 input:focus,
455 input:hover,
456 select:focus,
457 select:hover,
458 textarea:focus,
459 textarea:hover {
460         background-color: #ffffff;
461         color: #000000;
462 }
463
464 select,
465 input[type=text],
466 input[type=password] {
467         width: 20em;
468 }
469
470 td select,
471 td input[type=text],
472 td input[type=password] {
473         width: 99%;
474 }
475
476 input.cbi-input-user {
477         background: url('../resources/cbi/user.gif') no-repeat scroll 1px center;
478         background-color: inherit;
479         color: #000000;
480         text-indent: 17px;
481 }
482
483 input.cbi-input-password {
484         background: url('../resources/cbi/key.gif') no-repeat scroll 1px center;
485         background-color: inherit;
486         color: #000000;
487         text-indent: 17px;
488 }
489
490 input.cbi-input-find {
491         background: url('../resources/cbi/find.gif') no-repeat scroll 1px center;
492         background-color: inherit;
493         color: #000000;
494         padding-left: 17px;
495 }
496
497 input.cbi-input-reload {
498         background: url('../resources/cbi/reload.gif') no-repeat scroll 1px center;
499         background-color: inherit;
500         color: #000000;
501         padding-left: 17px;
502 }
503
504 input.cbi-input-add,
505 input.cbi-button-add {
506         background: url('../resources/cbi/add.gif') no-repeat scroll 1px center;
507         background-color: inherit;
508         color: #000000;
509         padding-left: 17px;
510         padding-right: 1px;
511 }
512
513 input.cbi-input-fieldadd,
514 input.cbi-button-fieldadd {
515         background: url(../resources/cbi/fieldadd.gif) no-repeat scroll 1px center;
516         background-color: inherit;
517         color: #000000;
518         padding-left: 17px;
519         padding-right: 1px;
520 }
521
522 input.cbi-input-reset,
523 input.cbi-button-reset {
524         background: url('../resources/cbi/reset.gif') no-repeat scroll 1px center;
525         background-color: inherit;
526         color: #000000;
527         padding-left: 17px;
528         padding-right: 1px;
529 }
530
531 input.cbi-input-save,
532 input.cbi-button-save {
533         background: url('../resources/cbi/save.gif') no-repeat scroll 1px center;
534         background-color: inherit;
535         color: #000000;
536         padding-left: 17px;
537         padding-right: 1px;
538 }
539
540 input.cbi-input-apply,
541 input.cbi-button-apply {
542         background: url('../resources/cbi/apply.gif') no-repeat scroll 1px center;
543         background-color: inherit;
544         color: #000000;
545         padding-left: 17px;
546         padding-right: 1px;
547 }
548
549 input.cbi-input-remove,
550 div.cbi-section-remove input {
551         background: url('../resources/cbi/remove.gif') no-repeat scroll 1px center;
552         background-color: inherit;
553         color: #000000;
554         padding-left: 17px;
555         padding-right: 1px;
556 }
557
558 div.cbi-section-remove input {
559         border-bottom: none;
560 }
561
562 textarea {
563         margin-left: -1px;
564         margin-bottom: 0.5em;
565 }
566
567 form > div > input[type=submit],
568 form > div > input[type=reset] {
569         float: right;
570         margin-left: 0.5em;
571 }
572
573 table td,
574 table th {
575         color: #000000;
576 }
577
578 table.smalltext {
579         background: #f5f5f5;
580         color: #000000;
581         border-top: 1px solid #666666;
582         border-right: 1px solid #666666;
583         border-bottom: 1px solid #666666;
584         font-size: 90%;
585         width: 80%;
586         margin-left: auto;
587         margin-right: auto;
588         border-collapse: collapse;
589 }
590
591 table.smalltext tr:hover td {
592         background-color: #bbddee;
593         color: #000000;
594 }
595
596 table.smalltext tr th {
597         padding: 0 0.25em;
598         border-left: 1px solid #666666;
599         text-align: left;
600 }
601
602 table.smalltext tr td {
603         padding: 0 0.25em;
604         border-top: 1px solid #666666;
605         border-left: 1px solid #666666;
606 }
607
608 table.cbi-section-table .cbi-rowstyle-1,
609 table.cbi-section-table .cbi-rowstyle-1 * {
610         background-color: #eeeeff;
611         color: #000000;
612 }
613
614 .cbi-section .cbi-rowstyle-1 h3 {
615         background-color: #eeeeff;
616         color: #555555;
617 }
618
619 .cbi-rowstyle-2 {
620         color: #000000;
621 }
622
623 div.cbi-value {
624         clear: left;
625         vertical-align: middle;
626         padding-left: 0.25em;
627         border-bottom: 1px dotted #bbbbbb;
628 }
629
630 div.cbi-value:hover {
631         background: #f8f8f8;
632         color: #000000;
633 }
634
635 .cbi-value-title {
636         float: left;
637         width: 40%;
638         line-height: 1.8em;
639 }
640
641 div.cbi-value-field {
642         width: 58%;
643         margin-left: 40%;
644         padding: 0.25em 0;
645 }
646
647 div.cbi-value-description {
648         font-size: 90%;
649         display: inline;
650 }
651
652 div.cbi-section-create {
653         clear: left;
654         white-space: nowrap;
655         vertical-align: top;
656 }
657
658 div.cbi-tblsection-create {
659         border-bottom: 1px dotted #bbbbbb;
660 }
661
662 div.cbi-section-create .cbi-button {
663         margin: 0.25em;
664 }
665
666 input.cbi-section-create-name {
667         margin-right: -0.25em;
668 }
669
670 div.cbi-map-descr {
671         margin-bottom: 1em;
672 }
673
674 div.cbi-optionals {
675         padding: 0.25em;
676         border-bottom: 1px dotted #bbbbbb;
677 }
678
679 div.cbi-section-remove {
680         float: right;
681 }
682
683 .cbi-section-node {
684         clear: both;
685         border-top: 1px dotted #bbbbbb;
686         border-left: 1px dotted #bbbbbb;
687         border-right: 1px dotted #bbbbbb;
688         border-bottom: none;
689         padding-bottom: 0;
690 }
691
692 .cbi-section-node table div {
693         padding-bottom: 0;
694         border-bottom: none;
695 }
696
697 .cbi-section-node div.cbi-section-table-row {
698         margin: 0.25em;
699 }
700
701 table.cbi-section-table {
702         width: 100%;
703         font-size: 95%;
704 }
705
706 table.cbi-section-table th,
707 table.cbi-section-table td {
708         text-align: center;
709 }
710
711 tr.cbi-section-table-descr th {
712         font-weight: normal;
713         font-size: 90%;
714 }
715
716 td.cbi-section-table-optionals {
717         text-align: left !important;
718         padding-top: 1em;
719 }
720
721 .cbi-value-helpicon img {
722         vertical-align: bottom;
723 }
724
725 div.cbi-error {
726         font-size: 95%;
727         font-weight: bold;
728         color: #ff0000;
729         background-color: #ffffff;
730 }
731
732 td.cbi-value-error {
733         border-color: red;
734 }
735
736 .cbi-value-error input,
737 .cbi-value-error select {
738         color: red;
739         background-color: #ffcccc;
740 }
741
742 .cbi-section-error {
743         color: red;
744         background-color: white;
745         font-size: 95%;
746         border: 1px dotted red;
747         margin: 3px;
748         padding: 3px;
749 }
750
751 .right {
752         text-align: right;
753 }
754
755 .luci {
756         position: fixed;
757         bottom: 0;
758         left: 0;
759         text-align: right;
760 }
761
762 .luci a:link,
763 .luci a:visited {
764         background-color: transparent;
765         color: #666666;
766         text-decoration: none;
767         font-size: 70%;
768 }
769
770 .inline {
771         display: inline;
772 }
773
774 .error500 {
775         white-space: normal;
776         border: 1px dotted #ff0000;
777         background-color: #ffffff;
778         color: #000000;
779         padding: 0.5em;
780 }
781
782 #memorybar {
783         width: 200px;
784         height: 8px;
785         border: 1px solid #bbb;
786         color: black;
787         background-color: red;
788 }
789
790 #memfree, #membuffers, #memcached {
791         float: right;
792         border: 1px solid #bbb;
793         height: 6px;
794 }
795
796 #memfree {
797         background-color: green;
798         color: black;
799 }
800
801 #membuffers {
802         background-color: yellow;
803         color: black;
804 }
805
806 #memcached {
807         background-color: #ffa500;
808         color: black;
809 }
810
811 }