590e062985f98e00d2af7f332783f8fa315b0fd3
[project/luci.git] / themes / fledermaus / htdocs / luci-static / fledermaus / cascade.css
1 * {
2 margin: 0;
3 padding: 0;
4 }
5
6 body {
7 background-color: #e5e6ec;
8 color: #ffffff;
9 font-family: Verdana, Arial, sans-serif;
10 font-size: 100%;
11 line-height: 100%;
12 }
13
14 code {
15 font-family: monospace;
16 white-space: pre;
17 }
18
19 div#maincontent ul {
20 margin-left: 2em;
21 }
22
23 .warning {
24 color: red !important;
25 font-weight: bold;
26 }
27
28 .clear {
29 clear: both;
30 height: 1px;
31 }
32
33 .hidden {
34 display: none;
35 }
36
37 .error {
38 color: #ff0000;
39 }
40
41 #header {
42 min-height: 98px;
43 background-image: url(logo.png);
44 background-repeat: no-repeat;
45 background-position: left center;
46 background-color: #000000;
47 text-align: center;
48 border-bottom: 1px solid #dc0067;
49 }
50
51 #header2 {
52 min-height: 98px;
53 background-image: url(fledermaus.png);
54 background-repeat: no-repeat;
55 background-position: right center;
56 }
57
58 #header3 {
59 font-size: 2.6em;
60 font-family: serif;
61 color: #FFCB05;
62 letter-spacing: 0.35em;
63 font-weight: bold;
64 line-height: 1.4em;
65 }
66
67 #header4 {
68 font-size: 1.25em;
69 line-height: 1.2em;
70 letter-spacing: 0.2em;
71 color: white;
72 }
73
74 .pathbar {
75 display: none;
76 }
77
78 .menubar {
79 width: 100%;
80 min-height: 1.8em;
81 background: #000000;
82 color: #ffffff;
83 }
84
85 .mainmenu {
86 float: left;
87 width: auto;
88 min-height: 1.8em;
89 background: #000000;
90 color: #ffffff;
91 }
92
93 .mainmenu div {
94 float: left;
95 }
96
97 .mainmenu li {
98 white-space: nowrap;
99 }
100
101 .mainmenu div ul {
102 display: none;
103 position: absolute;
104 background: #000000;
105 color: #ffffff;
106 border-width: 0 1px 1px 1px;
107 border-style: solid;
108 border-color: #444444;
109 list-style-type: none;
110 }
111
112 .mainmenu ul li:hover > ul,
113 .mainmenu div:hover > ul {
114 display: block;
115 }
116
117 .mainmenu ul li > ul {
118 left: 100%;
119 margin-top: -1.8em;
120 border-width: 1px;
121 }
122
123 .modemenu a,
124 .mainmenu a {
125 display: block;
126 padding: 0.5em;
127 color: #ffffff;
128 text-decoration: none;
129 font-size: 80%;
130 }
131
132 .mainmenu .active a,
133 .modemenu .active a {
134 color: #ffff00;
135 font-weight: bold;
136 }
137
138 .mainmenu li:hover > span > a,
139 .mainmenu div:hover > a {
140 font-weight: bold;
141 }
142
143 .modemenu a:hover,
144 .modemenu a:focus,
145 .mainmenu a:hover,
146 .mainmenu a:focus {
147 color: #ffff00;
148 font-weight: bold;
149 }
150
151 .mainmenu div.preactive > a {
152 color: #ffff00;
153 font-weight: bold;
154 }
155
156 .modemenu ul {
157 width: auto;
158 background: #000000;
159 color: #ffffff;
160 list-style-type: none;
161 }
162
163 .modemenu li {
164 float: right;
165 }
166
167 #maincontent {
168 clear: both;
169 width: 90%;
170 margin: 0 auto;
171 padding: 0.5em;
172 background: #f8f9fe;
173 color: #000000;
174 font-size: 80%;
175 }
176
177 #maincontent h2 {
178 margin: 0.25em 0 0.5em 0;
179 font-size: 150%;
180 font-weight: normal;
181 }
182
183 #maincontent h3 {
184 margin: 0.5em 0;
185 font-size: 120%;
186 font-weight: normal;
187 text-decoration: underline;
188 }
189
190 #maincontent p {
191 margin-bottom: 1em;
192 }
193
194 .cbi-section {
195 margin-bottom: 0.5em;
196 padding: 0.5em 1em;
197 border: 1px dotted #555555;
198 background-color: #f2f3f9;
199 }
200
201 .cbi-section legend {
202 font-size: 110%;
203 font-weight: bold;
204 height: 1em;
205 padding: 0 0.25em;
206 color: #555555;
207 }
208
209 .cbi-section h2 {
210 margin: 0em 0 0.5em -0.5em !important;
211 }
212
213 .cbi-section h3 {
214 height: 1.5em;
215 font-size: 90%;
216 color: #555555;
217 }
218
219 .cbi-section-descr {
220 margin-bottom: 0.5em;
221 font-size: 95%;
222 }
223
224 .cbi-title-ref {
225 color: inherit;
226 text-decoration: none;
227 padding-right: 18px;
228 background: url('../resources/cbi/link.gif') no-repeat scroll right center;
229 background-color: inherit;
230 }
231
232 input[type=submit],
233 input[type=reset],
234 input[type=image],
235 label {
236 cursor: pointer;
237 }
238
239 select,
240 input,
241 textarea {
242 background: #eeeeee;
243 color: #000000;
244 border-width: 1px;
245 border-color: #000000;
246 }
247
248 input[type=image] {
249 border: none;
250 }
251
252
253 input:focus,
254 input:hover,
255 select:focus,
256 select:hover,
257 textarea:focus,
258 textarea:hover {
259 background-color: #f2f3f9;
260 }
261
262 select,
263 input[type=text],
264 input[type=password] {
265 width: 20em;
266 }
267
268 td select,
269 td input[type=text],
270 td input[type=password] {
271 width: 99%;
272 }
273
274 input.cbi-input-user {
275 background: url('../resources/cbi/user.gif') no-repeat scroll 1px center;
276 background-color: inherit;
277 padding-left: 17px;
278 }
279
280 input.cbi-input-password {
281 background: url('../resources/cbi/key.gif') no-repeat scroll 1px center;
282 background-color: inherit;
283 padding-left: 17px;
284 }
285
286 input.cbi-input-find {
287 background: url('../resources/cbi/find.gif') no-repeat scroll 1px center;
288 background-color: inherit;
289 padding-left: 17px;
290 }
291
292 input.cbi-input-reload {
293 background: url('../resources/cbi/reload.gif') no-repeat scroll 1px center;
294 background-color: inherit;
295 padding-left: 17px;
296 }
297
298 input.cbi-input-add,
299 input.cbi-button-add {
300 background: url('../resources/cbi/add.gif') no-repeat scroll 1px center;
301 background-color: inherit;
302 padding-left: 17px;
303 padding-right: 1px;
304 }
305
306 input.cbi-input-fieldadd,
307 input.cbi-button-fieldadd {
308 background: url(../resources/cbi/fieldadd.gif) no-repeat scroll 1px center;
309 background-color: inherit;
310 padding-left: 17px;
311 padding-right: 1px;
312 }
313
314 input.cbi-input-reset,
315 input.cbi-button-reset {
316 background: url('../resources/cbi/reset.gif') no-repeat scroll 1px center;
317 background-color: inherit;
318 padding-left: 17px;
319 padding-right: 1px;
320 }
321
322 input.cbi-input-save,
323 input.cbi-button-save {
324 background: url('../resources/cbi/save.gif') no-repeat scroll 1px center;
325 background-color: inherit;
326 padding-left: 17px;
327 padding-right: 1px;
328 }
329
330 input.cbi-input-apply,
331 input.cbi-button-apply {
332 background: url('../resources/cbi/apply.gif') no-repeat scroll 1px center;
333 background-color: inherit;
334 padding-left: 17px;
335 padding-right: 1px;
336 }
337
338 input.cbi-input-remove,
339 div.cbi-section-remove input {
340 background: url('../resources/cbi/remove.gif') no-repeat scroll 1px center;
341 background-color: inherit;
342 padding-left: 17px;
343 padding-right: 1px;
344 }
345
346 div.cbi-section-remove input {
347 border-bottom: none;
348 }
349
350 textarea {
351 margin-left: -1px;
352 margin-bottom: 0.5em;
353 }
354
355 form > div > input[type=submit],
356 form > div > input[type=reset] {
357 float: right;
358 margin-left: 0.5em;
359 }
360
361 table.smalltext {
362 background: #f5f5f5;
363 border-top: 1px solid #666666;
364 border-right: 1px solid #666666;
365 border-bottom: 1px solid #666666;
366 font-size: 90%;
367 width: 80%;
368 margin-left: auto;
369 margin-right: auto;
370 border-collapse: collapse;
371 }
372
373 table.smalltext tr:hover td {
374 background-color: #bbddee;
375 }
376
377 table.smalltext tr th {
378 padding: 0 0.25em;
379 border-left: 1px solid #666666;
380 text-align: left;
381 }
382
383 table.smalltext tr td {
384 padding: 0 0.25em;
385 border-top: 1px solid #666666;
386 border-left: 1px solid #666666;
387 }
388
389 .cbi-rowstyle-1 {
390 background-color: #eeeeff;
391 }
392
393 .cbi-rowstyle-2 {
394
395 }
396
397 div.cbi-value {
398 clear: left;
399 vertical-align: middle;
400 padding-left: 0.25em;
401 border-bottom: 1px dotted #bbbbbb;
402 }
403
404 div.cbi-value:hover {
405 background: #f8f8f8;
406 }
407
408 div.cbi-value:last-child {
409 border: none;
410 }
411
412 .cbi-value-title {
413 float: left;
414 width: 40%;
415 }
416
417 div.cbi-value-field {
418 width: 58%;
419 margin: 0.25em 0 0.25em 40%;
420 }
421
422 div.cbi-value-description {
423 font-size: 90%;
424 }
425
426 div.cbi-value-field > div.cbi-value-description {
427 display: none;
428 }
429
430 div.cbi-value:hover div.cbi-value-field > div.cbi-value-description {
431 display: block;
432 }
433
434 div.cbi-section-create {
435 clear: left;
436 white-space: nowrap;
437 }
438
439 div.cbi-map-descr {
440 margin-bottom: 1em;
441 }
442
443 div.cbi-optionals {
444 margin: 0.5em 0;
445 padding: 0 0.25em;
446 }
447
448 div.cbi-section-remove {
449 float: right;
450 }
451
452 .cbi-section-node {
453 clear: both;
454 border: 1px dotted #bbbbbb;
455 padding-bottom: 0;
456 }
457
458 .cbi-section-node div.cbi-section-table-row {
459 margin: 0.25em;
460 }
461
462 table.cbi-section-table {
463 width: 100%;
464 font-size: 95%;
465 }
466
467 table.cbi-section-table th,
468 table.cbi-section-table td {
469 text-align: center;
470 }
471
472 tr.cbi-section-table-descr th {
473 font-weight: normal;
474 font-size: 90%;
475 }
476
477 td.cbi-section-table-optionals {
478 text-align: left !important;
479 padding-top: 1em;
480 }
481
482 .cbi-value-helpicon img {
483 vertical-align: bottom;
484 }
485
486 div.cbi-error {
487 font-size: 95%;
488 font-weight: bold;
489 color: #FF0000;
490 }
491
492 td.cbi-value-error {
493 border-color: red !important;
494 }
495
496 .cbi-value-error input,
497 .cbi-value-error select {
498 color: red !important;
499 background-color: #FFCCCC;
500 }
501
502 .cbi-section-error {
503 color: red;
504 font-size: 95%;
505 border: 1px dotted red;
506 margin: 3px;
507 padding: 3px;
508 }
509
510 ul.cbi-apply {
511 font-size: 90%;
512 }
513
514 .right {
515 text-align: right;
516 }
517
518 .luci {
519 position: fixed;
520 bottom: 0;
521 left: 0;
522 text-align: right;
523 }
524
525 .luci a {
526 color: #666666;
527 text-decoration: none;
528 font-size: 70%;
529 }
530
531 .inline {
532 display: inline;
533 }
534
535 .error500 {
536 white-space: normal;
537 border: 1px dotted #FF0000;
538 background-color: #FFFFFF;
539 padding: 0.5em;
540 }
541
542 #memorybar {
543 width:200px;
544 height:8px;
545 border:1px solid #bbb;
546 background-color:red
547 }
548
549 #memfree, #membuffers, #memcached {
550 float:right;
551 border:1px solid #bbb;
552 height:6px;
553 }
554
555 #memfree {
556 background-color:green;
557 }
558
559 #membuffers {
560 background-color:yellow;
561 }
562
563 #memcached {
564 background-color:orange;
565 }
566
567
568 /* obligatory IE6 Voodoo Code */
569 * html body {
570 padding-left: 50% !important;
571 }
572
573 * html div#header {
574 margin-left: -100% !important;
575 }
576
577 * html div.menubar {
578 margin-left: -100% !important;
579 width: 200% !important;
580 }
581
582 * html div#maincontent {
583 margin-left: -80% !important;
584 width: 160% !important;
585 }
586
587 * html div.mainmenu div.hover ul,
588 * html div.mainmenu div li.hover ul,
589 * html div.mainmenu div li li.hover ul,
590 * html div.mainmenu div li li li.hover ul,
591 * html div.mainmenu div li li li li.hover ul {
592 display: block !important;
593 margin-left: 3em;
594 }
595
596 * html div.mainmenu div.hover ul {
597 margin-left: 0;
598 }
599
600 * html div.mainmenu .hover ul ul,
601 * html div.mainmenu .hover ul ul ul,
602 * html div.mainmenu .hover ul ul ul ul,
603 * html div.mainmenu .hover ul ul ul ul ul {
604 display: none !important;
605 }
606
607 * html div.mainmenu li {
608 height: 1em !important;
609 width: 10em !important;
610 }
611
612 * html .mainmenu {
613 height: 1.8em;
614 }
615
616 * html div.cbi-value-description {
617 margin-left: 40%;
618 }