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