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