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