* luci-0.8: merge r3791
[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 min-height: 500px;
339 border: 3px solid #cccccc;
340 padding: 5px;
341 font-family: monospace;
342 }
343
344 #maincontent {
345 clear: both;
346 width: 80%;
347 margin: 0 auto;
348 padding: 0.5em;
349 background: #f5f5f5;
350 color: #000000;
351 border-width: 0 1px 1px 1px;
352 border-style: solid;
353 border-color: #444444;
354 font-size: 80%;
355 }
356
357 #maincontent h2 {
358 font-size: 150%;
359 font-family: Trebuchet MS, Verdana, sans-serif;
360 font-weight: bold;
361 margin: 0.25em 0 0.7em 0;
362 border-bottom: 1px solid;
363 padding-top: 10px;
364 padding-bottom: 4px;
365 }
366
367 #maincontent h3 {
368 margin: 0.5em 0 1.1em 0;
369 font-size: 125%;
370 font-weight: bold;
371 font-style: italic;
372 font-family: Trebuchet MS, Verdana, sans-serif;
373 color: #27408B;
374 background: url('../resources/cbi/arrow.gif') left no-repeat;
375 padding-left: 17px;
376 }
377
378 #maincontent p {
379 margin-bottom: 1em;
380 }
381
382 #auth_buttons {
383 float: right;
384 padding-top: 0.5em;
385 }
386
387 .cbi-section {
388 margin-bottom: 0.5em;
389 padding: 0.5em 1em;
390 border: 1px dotted #555555;
391 background-color: #ffffff;
392 color: #000000;
393 }
394
395 .cbi-section legend {
396 font-size: 110%;
397 font-weight: bold;
398 height: 1em;
399 padding: 0 0.25em;
400 background-color: transparent;
401 color: #555555;
402 }
403
404 .cbi-section h2 {
405 margin: 0em 0 0.5em -0.5em !important;
406 }
407
408 .cbi-section h3 {
409 text-decoration: none !important;
410 font-weight: bold !important;
411 color: #555555 !important;
412 margin: 0.25em !important;
413 font-size: 100% !important;
414 }
415
416 .cbi-section-descr {
417 margin-bottom: 0.5em;
418 font-size: 95%;
419 }
420
421 .cbi-title-ref {
422 color: inherit;
423 text-decoration: none;
424 padding-right: 18px;
425 background: url('../resources/cbi/link.gif') no-repeat scroll right center;
426 background-color: inherit;
427 }
428
429 ul.cbi-apply {
430 font-size: 90%;
431 }
432
433 input[type=submit],
434 input[type=reset],
435 input[type=image] {
436 cursor: pointer;
437 }
438
439
440 select,
441 input,
442 textarea {
443 background: #eeeeee;
444 color: #000000;
445 border-width: 1px;
446 border-color: #000000;
447 }
448
449 input[type=image] {
450 border: none;
451 }
452
453 input:focus,
454 input:hover,
455 select:focus,
456 select:hover,
457 textarea:focus,
458 textarea:hover {
459 background-color: #ffffff;
460 color: #000000;
461 }
462
463 select,
464 input[type=text],
465 input[type=password] {
466 width: 20em;
467 }
468
469 td select,
470 td input[type=text],
471 td input[type=password] {
472 width: 99%;
473 }
474
475 input.cbi-input-user {
476 background: url('../resources/cbi/user.gif') no-repeat scroll 1px center;
477 background-color: inherit;
478 color: #000000;
479 text-indent: 17px;
480 }
481
482 input.cbi-input-password {
483 background: url('../resources/cbi/key.gif') no-repeat scroll 1px center;
484 background-color: inherit;
485 color: #000000;
486 text-indent: 17px;
487 }
488
489 input.cbi-input-find {
490 background: url('../resources/cbi/find.gif') no-repeat scroll 1px center;
491 background-color: inherit;
492 color: #000000;
493 padding-left: 17px;
494 }
495
496 input.cbi-input-reload {
497 background: url('../resources/cbi/reload.gif') no-repeat scroll 1px center;
498 background-color: inherit;
499 color: #000000;
500 padding-left: 17px;
501 }
502
503 input.cbi-input-add,
504 input.cbi-button-add {
505 background: url('../resources/cbi/add.gif') no-repeat scroll 1px center;
506 background-color: inherit;
507 color: #000000;
508 padding-left: 17px;
509 padding-right: 1px;
510 }
511
512 input.cbi-input-fieldadd,
513 input.cbi-button-fieldadd {
514 background: url(../resources/cbi/fieldadd.gif) no-repeat scroll 1px center;
515 background-color: inherit;
516 color: #000000;
517 padding-left: 17px;
518 padding-right: 1px;
519 }
520
521 input.cbi-input-reset,
522 input.cbi-button-reset {
523 background: url('../resources/cbi/reset.gif') no-repeat scroll 1px center;
524 background-color: inherit;
525 color: #000000;
526 padding-left: 17px;
527 padding-right: 1px;
528 }
529
530 input.cbi-input-save,
531 input.cbi-button-save {
532 background: url('../resources/cbi/save.gif') no-repeat scroll 1px center;
533 background-color: inherit;
534 color: #000000;
535 padding-left: 17px;
536 padding-right: 1px;
537 }
538
539 input.cbi-input-apply,
540 input.cbi-button-apply {
541 background: url('../resources/cbi/apply.gif') no-repeat scroll 1px center;
542 background-color: inherit;
543 color: #000000;
544 padding-left: 17px;
545 padding-right: 1px;
546 }
547
548 input.cbi-input-remove,
549 div.cbi-section-remove input {
550 background: url('../resources/cbi/remove.gif') no-repeat scroll 1px center;
551 background-color: inherit;
552 color: #000000;
553 padding-left: 17px;
554 padding-right: 1px;
555 }
556
557 div.cbi-section-remove input {
558 border-bottom: none;
559 }
560
561 textarea {
562 margin-left: -1px;
563 margin-bottom: 0.5em;
564 }
565
566 form > div > input[type=submit],
567 form > div > input[type=reset] {
568 float: right;
569 margin-left: 0.5em;
570 }
571
572 table td,
573 table th {
574 color: #000000;
575 }
576
577 table.smalltext {
578 background: #f5f5f5;
579 color: #000000;
580 border-top: 1px solid #666666;
581 border-right: 1px solid #666666;
582 border-bottom: 1px solid #666666;
583 font-size: 90%;
584 width: 80%;
585 margin-left: auto;
586 margin-right: auto;
587 border-collapse: collapse;
588 }
589
590 table.smalltext tr:hover td {
591 background-color: #bbddee;
592 color: #000000;
593 }
594
595 table.smalltext tr th {
596 padding: 0 0.25em;
597 border-left: 1px solid #666666;
598 text-align: left;
599 }
600
601 table.smalltext tr td {
602 padding: 0 0.25em;
603 border-top: 1px solid #666666;
604 border-left: 1px solid #666666;
605 }
606
607 table.cbi-section-table .cbi-rowstyle-1,
608 table.cbi-section-table .cbi-rowstyle-1 * {
609 background-color: #eeeeff;
610 color: #000000;
611 }
612
613 .cbi-section .cbi-rowstyle-1 h3 {
614 background-color: #eeeeff;
615 color: #555555;
616 }
617
618 .cbi-rowstyle-2 {
619 color: #000000;
620 }
621
622 div.cbi-value {
623 clear: left;
624 vertical-align: middle;
625 padding-left: 0.25em;
626 border-bottom: 1px dotted #bbbbbb;
627 }
628
629 div.cbi-value:hover {
630 background: #f8f8f8;
631 color: #000000;
632 }
633
634 .cbi-value-title {
635 float: left;
636 width: 40%;
637 line-height: 1.8em;
638 }
639
640 div.cbi-value-field {
641 width: 58%;
642 margin-left: 40%;
643 padding: 0.25em 0;
644 }
645
646 div.cbi-value-description {
647 font-size: 90%;
648 display: inline;
649 }
650
651 div.cbi-section-create {
652 clear: left;
653 white-space: nowrap;
654 vertical-align: top;
655 }
656
657 div.cbi-tblsection-create {
658 border-bottom: 1px dotted #bbbbbb;
659 }
660
661 div.cbi-section-create .cbi-button {
662 margin: 0.25em;
663 }
664
665 input.cbi-section-create-name {
666 margin-right: -0.25em;
667 }
668
669 div.cbi-map-descr {
670 margin-bottom: 1em;
671 }
672
673 div.cbi-optionals {
674 padding: 0.25em;
675 border-bottom: 1px dotted #bbbbbb;
676 }
677
678 div.cbi-section-remove {
679 float: right;
680 }
681
682 .cbi-section-node {
683 clear: both;
684 border-top: 1px dotted #bbbbbb;
685 border-left: 1px dotted #bbbbbb;
686 border-right: 1px dotted #bbbbbb;
687 border-bottom: none;
688 padding-bottom: 0;
689 }
690
691 .cbi-section-node table div {
692 padding-bottom: 0;
693 border-bottom: none;
694 }
695
696 .cbi-section-node div.cbi-section-table-row {
697 margin: 0.25em;
698 }
699
700 table.cbi-section-table {
701 width: 100%;
702 font-size: 95%;
703 }
704
705 table.cbi-section-table th,
706 table.cbi-section-table td {
707 text-align: center;
708 }
709
710 tr.cbi-section-table-descr th {
711 font-weight: normal;
712 font-size: 90%;
713 }
714
715 td.cbi-section-table-optionals {
716 text-align: left !important;
717 padding-top: 1em;
718 }
719
720 .cbi-value-helpicon img {
721 vertical-align: bottom;
722 }
723
724 div.cbi-error {
725 font-size: 95%;
726 font-weight: bold;
727 color: #ff0000;
728 background-color: #ffffff;
729 }
730
731 td.cbi-value-error {
732 border-color: red;
733 }
734
735 .cbi-value-error input,
736 .cbi-value-error select {
737 color: red;
738 background-color: #ffcccc;
739 }
740
741 .cbi-section-error {
742 color: red;
743 background-color: white;
744 font-size: 95%;
745 border: 1px dotted red;
746 margin: 3px;
747 padding: 3px;
748 }
749
750 .right {
751 text-align: right;
752 }
753
754 .luci {
755 position: fixed;
756 bottom: 0;
757 left: 0;
758 text-align: right;
759 }
760
761 .luci a:link,
762 .luci a:visited {
763 background-color: transparent;
764 color: #666666;
765 text-decoration: none;
766 font-size: 70%;
767 }
768
769 .inline {
770 display: inline;
771 }
772
773 .error500 {
774 white-space: normal;
775 border: 1px dotted #ff0000;
776 background-color: #ffffff;
777 color: #000000;
778 padding: 0.5em;
779 }
780
781 #memorybar {
782 width: 200px;
783 height: 8px;
784 border: 1px solid #bbb;
785 color: black;
786 background-color: red;
787 }
788
789 #memfree, #membuffers, #memcached {
790 float: right;
791 border: 1px solid #bbb;
792 height: 6px;
793 }
794
795 #memfree {
796 background-color: green;
797 color: black;
798 }
799
800 #membuffers {
801 background-color: yellow;
802 color: black;
803 }
804
805 #memcached {
806 background-color: #ffa500;
807 color: black;
808 }
809
810 }