luci-0.11: merge outstanding trunk changes
[project/luci.git] / themes / openwrt / htdocs / luci-static / openwrt.org / cascade.css
1 @charset "utf-8";
2
3 .lang_he {
4 direction: RTL;
5 unicode-bidi: embed;
6 }
7
8 @media all {
9
10 html {
11 min-height: 100%;
12 height: auto;
13 position:relative;
14 }
15
16 body {
17 color: #ffffff;
18 background-color: #4a6b7c;
19 background-position: bottom center;
20 background-repeat: repeat-x;
21 font-family: Verdana, Arial, sans-serif;
22 font-size: 11pt;
23 line-height: 100%;
24 padding-bottom: 1.5em;
25 }
26
27 * {
28 margin: 0;
29 padding: 0;
30 }
31
32 a img {
33 border: none;
34 text-decoration: none;
35 }
36
37 ul.tabmenu {
38 margin: 0;
39 clear: both;
40 display: block;
41 vertical-align: bottom;
42 font-size: 10pt;
43 padding: 5px 0 0 5px;
44 }
45
46 div.tabmenu2 {
47 background-color: #AAAAAA;
48 background-image: url(tabbg.png);
49 background-repeat: repeat-x;
50 margin-top: -1px;
51 border: 1px solid #444444;
52 border-bottom: none;
53 }
54
55 div.tabmenu3,
56 div.tabmenu4,
57 div.tabmenu5 {
58 background-color: #AAAAAA;
59 background-image: url(tabbg.png);
60 background-repeat: repeat-x;
61 border: none;
62 }
63
64 ul.tabmenu li {
65 float: left;
66 display: block;
67 overflow: hidden;
68 }
69
70 .lang_he ul.tabmenu li {
71 float: right;
72 }
73
74 ul.tabmenu li a {
75 text-decoration: none;
76 color: #444444;
77 display: block;
78 padding: 3px 8px;
79 margin: 0 2px;
80 line-height: 1.3em;
81 border: 1px solid transparent;
82 border-bottom: none;
83 font-size: 85%;
84 }
85
86 ul.tabmenu li.active a {
87 font-weight: bold;
88 color: #000000;
89 background: #f5f5f5;
90 border: 1px solid #AAAAAA;
91 border-bottom: none;
92 }
93
94 ul.tabmenu li a:hover {
95 color: #444444;
96 border-color: #444444;
97 }
98
99 ul.l1 li a {
100 background-color: #AAAAAA;
101 background-image: url(tabbg.png);
102 background-repeat: repeat-x;
103 border-color: #444444;
104 }
105
106 ul.l1 li.tabmenu-item-logout a {
107 margin-left: 30px;
108 }
109
110 .lang_he ul.l1 li.tabmenu-item-logout a {
111 margin-right: 30px;
112 }
113
114 abbr,
115 acronym {
116 font-style: normal;
117 font-variant: normal;
118 }
119
120 abbr[title],
121 acronym[title] {
122 border-bottom: 1px dotted;
123 cursor: help;
124 }
125
126 a:link abbr[title],
127 a:visited abbr[title],
128 a:link acronym[title],
129 a:visited acronym[title] {
130 cursor: pointer;
131 }
132
133 code {
134 font-family: monospace;
135 white-space: pre;
136 }
137
138 #maincontent ul {
139 margin-left: 2em;
140 }
141
142 .warning {
143 color: red;
144 background-color: white;
145 font-weight: bold;
146 }
147
148 .clear {
149 clear: both;
150 }
151
152 .skiplink,
153 .navigation,
154 .hidden {
155 position: absolute;
156 left: -1000px;
157 top: -1000px;
158 width: 0px;
159 height: 0px;
160 overflow: hidden;
161 display: inline;
162 }
163
164 .error {
165 color: #ff0000;
166 background-color: white;
167 }
168
169 div.hostinfo {
170 float: left;
171 margin: 0;
172 padding: 0;
173 width: auto;
174 font-size: 80%;
175 padding: 0.5em;
176 }
177
178 .lang_he div.hostinfo {
179 float: right;
180 }
181
182 #xhr_poll_status {
183 cursor: pointer;
184 }
185
186 #xhr_poll_status #xhr_poll_status_off {
187 font-weight: bold;
188 color: #FF0000;
189 }
190
191 #xhr_poll_status #xhr_poll_status_on {
192 font-weight: bold;
193 color: #00FF00;
194 }
195
196 #menubar {
197 position: relative;
198 width: 100%;
199 background: #000000;
200 color: #ffffff;
201 }
202
203 #menubar .warning {
204 color: red;
205 background-color: #557788;
206 }
207
208 html #menubar a:link,
209 html #menubar a:visited {
210 position: relative;
211 display: block;
212 padding: 0.5em;
213 background: #000000;
214 color: #ffffff;
215 text-decoration: none;
216 font-size: 80%;
217 font-weight: normal;
218 }
219
220
221 html #menubar a:link:hover,
222 html #menubar a:visited:hover,
223 html #menubar a:link:active,
224 html #menubar a:visited:active,
225 #menubar a:link:focus,
226 #menubar a:visited:focus {
227 background: #000000;
228 color: #ffff00;
229 font-weight: bold;
230 }
231
232 html #menubar a:link.active,
233 html #menubar a:visited.active,
234 html #menubar a:link.preactive,
235 html #menubar a:visited.preactive {
236 background: #000000;
237 color: #ffff00;
238 font-weight: bold;
239 }
240
241 html #menubar a:link.warning,
242 html #menubar a:visited.warning {
243 background: #000000;
244 color: red;
245 font-weight: bold;
246 }
247
248 #modemenu {
249 width: auto;
250 background: #000000;
251 color: #ffffff;
252 list-style: none;
253 margin-right: 1px;
254 margin-left: 2em;
255 float: right;
256 }
257
258 #modemenu li {
259 float: right;
260 list-style: none;
261 }
262
263 #savemenu {
264 float: right;
265 }
266
267 .lang_he #savemenu {
268 float: left;
269 }
270
271 .lang_de #submenu_admin_uci {
272 width: 12em;
273 }
274
275 .lang_ru #submenu_admin_uci {
276 width: 11.5em;
277 }
278
279 textarea#syslog {
280 width: 98%;
281 min-height: 500px;
282 border: 3px solid #cccccc;
283 padding: 5px;
284 font-family: monospace;
285 }
286
287 #maincontainer {
288 clear: both;
289 width: 96%;
290 margin: 0 auto;
291 height:100%;
292 }
293
294 #maincontent {
295 padding: 0.5em;
296 background: #f5f5f5;
297 color: #000000;
298 font-size: 80%;
299 border-width: 0 1px 1px 1px;
300 border-style: solid;
301 border-color: #444444;
302 }
303
304 .lang_he #maincontent {
305 direction: rtl;
306 }
307
308 #maincontent h2 {
309 font-size: 150%;
310 font-family: Trebuchet MS, Verdana, sans-serif;
311 font-weight: bold;
312 margin: 0.25em 0 0.7em 0;
313 border-bottom: 1px solid;
314 padding-top: 10px;
315 padding-bottom: 4px;
316 }
317
318 #maincontent h3 {
319 margin: 0.5em 0 1.1em 0;
320 font-size: 125%;
321 font-weight: bold;
322 font-style: italic;
323 font-family: Trebuchet MS, Verdana, sans-serif;
324 color: #27408B;
325 }
326
327 #maincontent p {
328 margin-bottom: 1em;
329 }
330
331 .cbi-section {
332 margin-bottom: 0.5em;
333 padding: 0.5em 1em;
334 border: 1px dotted #555555;
335 background-color: #ffffff;
336 color: #000000;
337 }
338
339 .cbi-section legend {
340 font-size: 110%;
341 font-weight: bold;
342 height: 1em;
343 padding: 0 0.25em;
344 background-color: transparent;
345 color: #555555;
346 }
347
348 .cbi-section h2 {
349 margin: 0em 0 0.5em -0.5em !important;
350 }
351
352 .cbi-section h3 {
353 text-decoration: none !important;
354 font-weight: bold !important;
355 color: #555555 !important;
356 margin: 0.25em !important;
357 font-size: 100% !important;
358 }
359
360 .cbi-section-descr {
361 margin-bottom: 0.5em;
362 font-size: 95%;
363 }
364
365 .cbi-title-ref {
366 color: inherit;
367 text-decoration: none;
368 padding-right: 18px;
369 background: url('../resources/cbi/link.gif') no-repeat scroll right center;
370 background-color: inherit;
371 }
372
373 ul.cbi-apply {
374 font-size: 90%;
375 }
376
377 input:-webkit-input-placeholder {
378 color: #AAAAAA;
379 }
380
381 input:-moz-placeholder {
382 color: #AAAAAA;
383 }
384
385 input:-ms-input-placeholder {
386 color: #AAAAAA;
387 }
388
389 input[type=submit],
390 input[type=reset],
391 input[type=image],
392 input[type=button] {
393 cursor: pointer;
394 }
395
396 select,
397 input,
398 textarea {
399 background: #eeeeee;
400 color: #000000;
401 border-width: 1px;
402 border-color: #000000;
403 }
404
405 input[type=image] {
406 border: none;
407 }
408
409 input:focus,
410 input:hover,
411 select:focus,
412 select:hover {
413 background-color: #ffffff;
414 color: #000000;
415 }
416
417 select,
418 input[type=text],
419 input[type=password] {
420 width: 20em;
421 }
422
423 td select,
424 td input[type=text],
425 td input[type=password] {
426 width: 99%;
427 }
428
429 img.cbi-image-button {
430 cursor: pointer;
431 margin: 0 2px;
432 vertical-align: middle;
433 }
434
435 input.cbi-button {
436 background-color: #EEEEEE;
437 background-repeat: no-repeat;
438 background-position: 1px center;
439 border: 1px solid #CCCCCC;
440 border-radius: 3px;
441 }
442
443 input.cbi-button:hover {
444 border-color: #4A6B7C;
445 background-color: #FFFFFF;
446 }
447
448 input.cbi-button[disabled] {
449 color: #CCCCCC;
450 border-color: #CCCCCC;
451 background-color: #EEEEEE;
452 cursor: default;
453 }
454
455 input.cbi-input-user {
456 background-image: url('../resources/cbi/user.gif');
457 background-repeat: no-repeat;
458 background-position: 1px center;
459 color: #000000;
460 text-indent: 17px;
461 }
462
463 input.cbi-input-password {
464 background-image: url('../resources/cbi/key.gif');
465 background-repeat: no-repeat;
466 background-position: 1px center;
467 color: #000000;
468 text-indent: 17px;
469 }
470
471 input.cbi-input-find,
472 input.cbi-button-find {
473 background-image: url('../resources/cbi/find.gif');
474 color: #000000;
475 padding-left: 17px;
476 }
477
478 input.cbi-input-reload {
479 background-image: url('../resources/cbi/reload.gif');
480 color: #000000;
481 padding-left: 17px;
482 }
483
484 input.cbi-input-add,
485 input.cbi-button-add {
486 background-image: url('../resources/cbi/add.gif');
487 color: #000000;
488 padding-left: 17px;
489 padding-right: 1px;
490 }
491
492 input.cbi-input-fieldadd,
493 input.cbi-button-fieldadd {
494 background-image: url(../resources/cbi/fieldadd.gif);
495 color: #000000;
496 padding-left: 17px;
497 padding-right: 1px;
498 }
499
500 input.cbi-input-reset,
501 input.cbi-button-reset {
502 background-image: url('../resources/cbi/reset.gif');
503 color: #000000;
504 padding-left: 17px;
505 padding-right: 1px;
506 }
507
508 input.cbi-input-save,
509 input.cbi-button-save {
510 background-image: url('../resources/cbi/save.gif');
511 color: #000000;
512 padding-left: 17px;
513 padding-right: 1px;
514 }
515
516 input.cbi-input-apply,
517 input.cbi-button-apply {
518 background-image: url('../resources/cbi/apply.gif');
519 color: #000000;
520 padding-left: 17px;
521 padding-right: 1px;
522 }
523
524 input.cbi-input-link,
525 input.cbi-button-link {
526 background-image: url('../resources/cbi/link.gif');
527 color: #000000;
528 padding-left: 17px;
529 padding-right: 1px;
530 }
531
532 input.cbi-input-download,
533 input.cbi-button-download {
534 background-image: url('../resources/cbi/download.gif');
535 color: #000000;
536 padding-left: 17px;
537 padding-right: 1px;
538 }
539
540 input.cbi-input-remove,
541 div.cbi-section-remove input {
542 background-image: url('../resources/cbi/remove.gif');
543 color: #000000;
544 padding-left: 17px;
545 padding-right: 1px;
546 }
547
548 input.cbi-button-up {
549 background-image: url('../resources/cbi/up.gif');
550 padding-left: 11px;
551 padding-right: 1px;
552 }
553
554 input.cbi-button-down {
555 background-image: url('../resources/cbi/down.gif');
556 padding-left: 11px;
557 padding-right: 1px;
558 }
559
560 input.cbi-button-edit {
561 background-image: url('../resources/cbi/edit.gif');
562 color: #000000;
563 padding-left: 17px;
564 padding-right: 1px;
565 }
566
567 input.cbi-button-reload {
568 background-image: url('../resources/cbi/reload.gif');
569 color: #000000;
570 padding-left: 17px;
571 padding-right: 1px;
572 }
573
574 input.cbi-button-reset {
575 background-image: url('../resources/cbi/reset.gif');
576 color: #000000;
577 padding-left: 17px;
578 padding-right: 1px;
579 }
580
581 input.cbi-button-remove {
582 background-image: url('../resources/cbi/remove.gif');
583 color: #000000;
584 padding-left: 17px;
585 padding-right: 1px;
586 }
587
588 .cbi-input-invalid {
589 background-image: url('../resources/cbi/reset.gif');
590 background-repeat: no-repeat;
591 background-position: right;
592 color: #FF0000 !important;
593 border-color: #FF0000;
594 }
595
596 div.cbi-section-remove input {
597 border-bottom: none;
598 }
599
600 textarea {
601 margin-left: -1px;
602 margin-bottom: 0.5em;
603 }
604
605 form > div > input[type=submit],
606 form > div > input[type=reset] {
607 float: right;
608 margin-left: 0.5em;
609 }
610
611 table td,
612 table th {
613 color: #000000;
614 }
615
616 table.smalltext {
617 background: #f5f5f5;
618 color: #000000;
619 border-top: 1px solid #666666;
620 border-right: 1px solid #666666;
621 border-bottom: 1px solid #666666;
622 font-size: 90%;
623 width: 80%;
624 margin-left: auto;
625 margin-right: auto;
626 border-collapse: collapse;
627 }
628
629 table.smalltext tr:hover td {
630 background-color: #bbddee;
631 color: #000000;
632 }
633
634 table.smalltext tr th {
635 padding: 0 0.25em;
636 border-left: 1px solid #666666;
637 text-align: left;
638 }
639
640 table.smalltext tr td {
641 padding: 0 0.25em;
642 border-top: 1px solid #666666;
643 border-left: 1px solid #666666;
644 }
645
646 table.cbi-section-table .cbi-rowstyle-1 {
647 background-color: #eeeeff;
648 color: #000000;
649 }
650
651 table.cbi-section-table .cbi-rowstyle-1:hover,
652 table.cbi-section-table .cbi-rowstyle-2:hover {
653 background-color: #b2c8d4;
654 color: #000000;
655 }
656
657 table.cbi-section-table .cbi-section-table-cell {
658 padding: 3px;
659 white-space: nowrap;
660 }
661
662 .cbi-section .cbi-rowstyle-1 h3 {
663 background-color: #eeeeff;
664 color: #555555;
665 }
666
667 .cbi-rowstyle-2 {
668 color: #000000;
669 }
670
671 div.cbi-value {
672 clear: left;
673 vertical-align: middle;
674 padding: 0.25em 0.6em;
675 border-bottom: 1px dotted #bbbbbb;
676 }
677
678 div.cbi-value:hover {
679 background: #f8f8f8;
680 color: #000000;
681 }
682
683 .cbi-value-title {
684 float: left;
685 width: 40%;
686 line-height: 1.8em;
687 }
688
689 div.cbi-value-field {
690 width: 58%;
691 margin-left: 40%;
692 padding: 0.25em 0;
693 }
694
695 div.cbi-value-description {
696 font-size: 90%;
697 display: inline;
698 }
699
700 div.cbi-section-create {
701 clear: left;
702 white-space: nowrap;
703 vertical-align: top;
704 }
705
706 div.cbi-section-create .cbi-button {
707 margin: 0.25em;
708 }
709
710 input.cbi-section-create-name {
711 margin-right: -0.25em;
712 }
713
714 div.cbi-map-descr {
715 margin-bottom: 1em;
716 }
717
718 div.cbi-optionals {
719 padding: 0.25em;
720 border-bottom: 1px dotted #bbbbbb;
721 }
722
723 div.cbi-section-remove {
724 float: right;
725 }
726
727 .cbi-section-node {
728 clear: both;
729 border: 1px solid #BBBBBB;
730 border-radius: 3px;
731 padding-bottom: 0;
732 position: relative;
733 }
734
735 .cbi-section-node-tabbed {
736 border-top-left-radius: 0;
737 }
738
739 .cbi-section-node .cbi-value-last {
740 border-bottom: none;
741 }
742
743 .cbi-section-node table div {
744 padding-bottom: 0;
745 border-bottom: none;
746 }
747
748 .cbi-section-node div.cbi-section-table-row {
749 margin: 0.25em;
750 }
751
752 table.cbi-section-table {
753 width: 100%;
754 font-size: 95%;
755 }
756
757 table.cbi-section-table th,
758 table.cbi-section-table td {
759 text-align: center;
760 }
761
762 tr.cbi-section-table-descr th {
763 font-weight: normal;
764 font-size: 90%;
765 vertical-align: top;
766 }
767
768 td.cbi-section-table-optionals {
769 text-align: left !important;
770 padding-top: 1em;
771 }
772
773 .cbi-value-helpicon img {
774 vertical-align: bottom;
775 }
776
777 div.cbi-error {
778 font-size: 95%;
779 font-weight: bold;
780 color: #ff0000;
781 background-color: #ffffff;
782 }
783
784 td.cbi-value-error {
785 border-color: red;
786 }
787
788 .cbi-value-error input,
789 .cbi-value-error select {
790 color: red;
791 background-color: #ffcccc;
792 }
793
794 .cbi-section-error {
795 color: red;
796 background-color: white;
797 font-size: 95%;
798 border: 1px dotted red;
799 margin: 3px;
800 padding: 3px;
801 }
802
803 .cbi-value-field var {
804 color: #2222FF;
805 }
806
807 ul.cbi-tabmenu {
808 padding: 3px 0;
809 margin-left: 0 !important;
810 list-style-type: none;
811 position: relative;
812 z-index: 10;
813 top: 4px;
814 line-height: 20px;
815 }
816
817 ul.cbi-tabmenu li.cbi-tab,
818 ul.cbi-tabmenu li.cbi-tab-disabled {
819 display: inline;
820 margin: 0;
821 }
822
823 ul.cbi-tabmenu li.cbi-tab a,
824 ul.cbi-tabmenu li.cbi-tab-disabled a {
825 text-decoration: none;
826 padding: 3px 7px;
827 margin-right: 3px;
828 border: 1px solid #BBBBBB;
829 border-bottom: none;
830 border-radius: 3px 3px 0 0;
831 background-color: #EEEEEE;
832 color: #BBBBBB;
833 }
834
835 ul.cbi-tabmenu li.cbi-tab-highlighted a {
836 color: #000000;
837 background-color: #FFEEAA;
838 }
839
840 ul.cbi-tabmenu li a:hover {
841 color: #000000;
842 }
843
844 ul.cbi-tabmenu li.cbi-tab a {
845 padding-top: 4px;
846 color: #000000;
847 background-color: #FFFFFF;
848 }
849
850 div.cbi-tab-descr {
851 background-image: url(/luci-static/resources/cbi/help.gif);
852 background-position: 0.25em 50%;
853 background-repeat: no-repeat;
854 border-bottom: 1px solid #CCCCCC;
855 margin: 0.25em 0.25em 2em;
856 padding: 0.5em 0.5em 0.5em 2em;
857 }
858
859 .left {
860 text-align: left !important;
861 }
862
863 .right {
864 text-align: right !important;
865 }
866
867 .luci {
868 position: absolute;
869 bottom: 0;
870 left: 1em;
871 height: 1.5em;
872 font-size: 80%;
873 }
874
875 .luci a:link,
876 .luci a:visited {
877 background-color: transparent;
878 color: #666666;
879 text-decoration: none;
880 font-size: 70%;
881 }
882
883 .inline {
884 display: inline;
885 }
886
887 .error500 {
888 white-space: normal;
889 border: 1px dotted #ff0000;
890 background-color: #ffffff;
891 color: #000000;
892 padding: 0.5em;
893 }
894
895 .errorbox {
896 border: 1px solid #FF0000;
897 background-color: #FFCCCC;
898 padding: 5px;
899 margin-bottom: 5px;
900 }
901
902 .errorbox a {
903 color: #000000 !important;
904 }
905
906
907 .ifacebox {
908 background-color: #FFFFFF;
909 border: 1px solid #CCCCCC;
910 margin: 0 10px;
911 text-align: center;
912 white-space: nowrap;
913 }
914
915 .ifacebox .ifacebox-head {
916 border-bottom: 1px solid #CCCCCC;
917 padding: 2px;
918 }
919
920 .ifacebox .ifacebox-body {
921 padding: 2px;
922 }
923
924
925 .ifacebadge {
926 background-color: #FFFFFF;
927 border: 1px solid #CCCCCC;
928 padding: 2px;
929 margin-left: 2px;
930 display: inline-block;
931 }
932
933 .ifacebadge-active {
934 border-color: #000000;
935 font-weight: bold;
936 }
937
938
939 .zonebadge {
940 padding: 2px;
941 display: inline-block;
942 white-space: nowrap;
943 cursor: pointer;
944 }
945
946 .zonebadge em,
947 .zonebadge strong {
948 margin: 3px;
949 display: inline-block;
950 }
951
952 .zonebadge input {
953 width: 6em;
954 height: 1.5em;
955 }
956
957 .zonebadge-empty {
958 border: 1px dashed #AAAAAA;
959 color: #AAAAAA;
960 font-style: italic;
961 font-size: smaller;
962 }
963
964
965 .uci-change-list {
966 font-family: monospace;
967 }
968
969 .uci-change-list ins,
970 .uci-change-legend-label ins {
971 text-decoration: none;
972 border: 1px solid #00FF00;
973 background-color: #CCFFCC;
974 display: block;
975 padding: 2px;
976 }
977
978 .uci-change-list del,
979 .uci-change-legend-label del {
980 text-decoration: none;
981 border: 1px solid #FF0000;
982 background-color: #FFCCCC;
983 display: block;
984 font-style: normal;
985 padding: 2px;
986 }
987
988 .uci-change-list var,
989 .uci-change-legend-label var {
990 text-decoration: none;
991 border: 1px solid #CCCCCC;
992 background-color: #EEEEEE;
993 display: block;
994 font-style: normal;
995 padding: 2px;
996 }
997
998 .uci-change-list var ins,
999 .uci-change-list var del {
1000 /*display: inline;*/
1001 border: none;
1002 white-space: pre;
1003 font-style: normal;
1004 padding: 0px;
1005 }
1006
1007 .uci-change-legend {
1008 padding: 5px;
1009 }
1010
1011 .uci-change-legend-label {
1012 width: 150px;
1013 float: left;
1014 font-size: 80%;
1015 }
1016
1017 .uci-change-legend-label>ins,
1018 .uci-change-legend-label>del,
1019 .uci-change-legend-label>var {
1020 float: left;
1021 margin-right: 4px;
1022 width: 10px;
1023 height: 10px;
1024 display: block;
1025 }
1026
1027 .uci-change-legend-label var ins,
1028 .uci-change-legend-label var del {
1029 line-height: 6px;
1030 border: none;
1031 }
1032
1033
1034 }