26f2bbb2e1d1a00116ccffc8b241d38a426c11c1
[project/luci.git] / themes / bootstrap / htdocs / luci-static / bootstrap / cascade.css
1 /*!
2 * LuCI Bootstrap Theme
3 * Copyright 2012 Nut & Bolt
4 * By David Menting <david@nut-bolt.nl>
5 * Based on Bootstrap v1.4.0
6 *
7 * Copyright 2011 Twitter, Inc
8 * Licensed under the Apache License v2.0
9 * http://www.apache.org/licenses/LICENSE-2.0
10 *
11 * Designed and built with all the love in the world @twitter by @mdo and @fat.
12 */
13 /* Reset.less
14 * Props to Eric Meyer (meyerweb.com) for his CSS reset file. We're using an adapted version here that cuts out some of the reset HTML elements we will never need here (i.e., dfn, samp, etc).
15 * ------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------- */
16 html {
17 margin: 0;
18 padding: 0;
19 }
20
21 body {
22 margin: 0;
23 padding: 5px;
24 }
25
26 h1, h2, h3, h4, h5, h6, p, pre, a, abbr, acronym, code, del, em, img, q, s,
27 small, strike, strong, sub, sup, tt, var, dd, dl, dt, li, ol, ul, fieldset,
28 form, label, legend, button, table, caption, tbody, tfoot, thead, tr, th, td {
29 margin: 0;
30 padding: 0;
31 border: 0;
32 font-weight: normal;
33 font-style: normal;
34 font-size: 100%;
35 line-height: 1;
36 font-family: inherit;
37 }
38
39 abbr[title], acronym[title] {
40 border-bottom: 1px dotted;
41 cursor: help;
42 }
43
44 table {
45 border-collapse: collapse;
46 border-spacing: 0;
47 }
48
49 ol, ul {
50 list-style: none;
51 }
52
53 q:before,
54 q:after,
55 blockquote:before,
56 blockquote:after {
57 content: "";
58 }
59
60 html {
61 overflow-y: scroll;
62 font-size: 100%;
63 -webkit-text-size-adjust: 100%;
64 -ms-text-size-adjust: 100%;
65 }
66
67 a:focus {
68 outline: thin dotted;
69 }
70
71 a:hover, a:active {
72 outline: 0;
73 }
74
75 article,
76 aside,
77 details,
78 figcaption,
79 figure,
80 footer,
81 header,
82 hgroup,
83 nav,
84 section {
85 display: block;
86 }
87
88 sub, sup {
89 font-size: 75%;
90 line-height: 0;
91 position: relative;
92 vertical-align: baseline;
93 }
94
95 sup {
96 top: -0.5em;
97 }
98
99 sub {
100 bottom: -0.25em;
101 }
102
103 img {
104 border: 0;
105 -ms-interpolation-mode: bicubic;
106 }
107
108 button,
109 input,
110 select,
111 textarea {
112 font-size: 100%;
113 margin: 0;
114 vertical-align: baseline;
115 *vertical-align: middle;
116 }
117
118 button, input {
119 line-height: normal;
120 *overflow: visible;
121 }
122
123 button::-moz-focus-inner, input::-moz-focus-inner {
124 border: 0;
125 padding: 0;
126 }
127
128 button,
129 input[type="button"],
130 input[type="reset"],
131 input[type="submit"] {
132 cursor: pointer;
133 -webkit-appearance: button;
134 }
135
136 input[type="search"] {
137 -webkit-appearance: textfield;
138 -webkit-box-sizing: content-box;
139 -moz-box-sizing: content-box;
140 box-sizing: content-box;
141 }
142
143 input[type="search"]::-webkit-search-decoration {
144 -webkit-appearance: none;
145 }
146
147 textarea {
148 overflow: auto;
149 vertical-align: top;
150 }
151
152 /*
153 * Scaffolding
154 * Basic and global styles for generating a grid system, structural layout, and page templates
155 * ------------------------------------------------------------------------------------------- */
156 body {
157 background-color: #ffffff;
158 margin: 0;
159 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
160 font-size: 13px;
161 font-weight: normal;
162 line-height: 18px;
163 color: #404040;
164 padding-top: 58px;
165 }
166
167 .container {
168 width: 100%;
169 max-width: 940px;
170 margin-left: auto;
171 margin-right: auto;
172 zoom: 1;
173 }
174
175 .container:before, .container:after {
176 display: table;
177 content: "";
178 zoom: 1;
179 }
180
181 .container:after {
182 clear: both;
183 }
184
185 a {
186 color: #0069d6;
187 text-decoration: none;
188 line-height: inherit;
189 font-weight: inherit;
190 }
191
192 a:hover {
193 color: #00438a;
194 text-decoration: underline;
195 }
196
197 .pull-right {
198 float: right;
199 }
200
201 .pull-left {
202 float: left;
203 }
204
205 /* Typography.less
206 * Headings, body text, lists, code, and more for a versatile and durable typography system
207 * ---------------------------------------------------------------------------------------- */
208 p,
209 .cbi-map-descr,
210 .cbi-section-descr {
211 font-size: 13px;
212 font-weight: normal;
213 line-height: 18px;
214 margin-bottom: 9px;
215 }
216
217 p small {
218 font-size: 11px;
219 color: #bfbfbf;
220 }
221
222 h1,
223 h2,
224 h3,
225 h4,
226 h5,
227 h6 {
228 font-weight: bold;
229 color: #404040;
230 }
231
232 h1 small,
233 h2 small,
234 h3 small,
235 h4 small,
236 h5 small,
237 h6 small {
238 color: #bfbfbf;
239 }
240
241 h1 {
242 margin-bottom: 18px;
243 font-size: 30px;
244 line-height: 36px;
245 }
246
247 h1 small {
248 font-size: 18px;
249 }
250
251 h2 {
252 font-size: 24px;
253 line-height: 36px;
254 }
255
256 h2 small {
257 font-size: 14px;
258 }
259
260 h3,
261 h4,
262 h5,
263 h6 {
264 line-height: 36px;
265 }
266
267 h3 {
268 font-size: 18px;
269 }
270
271 h3 small {
272 font-size: 14px;
273 }
274
275 h4 {
276 font-size: 16px;
277 }
278
279 h4 small {
280 font-size: 12px;
281 }
282
283 h5 {
284 font-size: 14px;
285 }
286
287 h6 {
288 font-size: 13px;
289 color: #bfbfbf;
290 text-transform: uppercase;
291 }
292
293 ul, ol {
294 margin: 0 0 18px 25px;
295 }
296
297 ul ul,
298 ul ol,
299 ol ol,
300 ol ul {
301 margin-bottom: 0;
302 }
303
304 ul {
305 list-style: disc;
306 }
307
308 ol {
309 list-style: decimal;
310 }
311
312 li {
313 line-height: 18px;
314 color: #808080;
315 }
316
317 ul.unstyled {
318 list-style: none;
319 margin-left: 0;
320 }
321
322 dl {
323 margin-bottom: 18px;
324 }
325
326 dl dt, dl dd {
327 line-height: 18px;
328 }
329
330 dl dt {
331 font-weight: bold;
332 }
333
334 dl dd {
335 margin-left: 9px;
336 }
337
338 hr {
339 margin: 20px 0 19px;
340 border: 0;
341 border-bottom: 1px solid #eee;
342 }
343
344 strong {
345 font-style: inherit;
346 font-weight: bold;
347 }
348
349 em {
350 font-style: italic;
351 font-weight: inherit;
352 line-height: inherit;
353 }
354
355 small { font-size: 0.9em }
356
357 address {
358 display: block;
359 line-height: 18px;
360 margin-bottom: 18px;
361 }
362
363 code, pre {
364 padding: 0 3px 2px;
365 font-family: Monaco, Andale Mono, Courier New, monospace;
366 font-size: 12px;
367 -webkit-border-radius: 3px;
368 -moz-border-radius: 3px;
369 border-radius: 3px;
370 }
371
372 code {
373 background-color: #fee9cc;
374 color: rgba(0, 0, 0, 0.75);
375 padding: 1px 3px;
376 }
377
378 pre {
379 background-color: #f5f5f5;
380 display: block;
381 padding: 8.5px;
382 margin: 0 0 18px;
383 line-height: 18px;
384 font-size: 12px;
385 border: 1px solid #ccc;
386 border: 1px solid rgba(0, 0, 0, 0.15);
387 -webkit-border-radius: 3px;
388 -moz-border-radius: 3px;
389 border-radius: 3px;
390 white-space: pre;
391 white-space: pre-wrap;
392 word-wrap: break-word;
393 }
394
395 /* Forms.less
396 * Base styles for various input types, form layouts, and states
397 * ------------------------------------------------------------- */
398 form {
399 margin-bottom: 18px;
400 }
401
402 fieldset {
403 margin-bottom: 9px;
404 padding-top: 9px;
405 }
406
407 fieldset legend {
408 display: block;
409 font-size: 19.5px;
410 line-height: 1;
411 color: #404040;
412 padding-top: 20px;
413 *padding: 0 0 5px 0px;
414 /* IE6-7 */
415
416 *line-height: 1.5;
417 /* IE6-7 */
418
419 }
420
421 form .clearfix,
422 form .cbi-value {
423 margin-bottom: 18px;
424 zoom: 1;
425 overflow: hidden;
426 }
427
428 form .clearfix:before, form .clearfix:after,
429 form .cbi-value:before, form .cbi-value:after {
430 display: table;
431 content: "";
432 zoom: 1;
433 }
434
435 form .clearfix:after
436 form .cbi-value:after {
437 clear: both;
438 }
439
440 label,
441 input,
442 select,
443 textarea {
444 font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
445 font-size: 13px;
446 font-weight: normal;
447 line-height: normal;
448 }
449
450 form .input,
451 form .cbi-value-field {
452 margin-left: 150px;
453 }
454
455 form .cbi-value label.cbi-value-title {
456 padding-top: 6px;
457 font-size: 13px;
458 line-height: 18px;
459 float: left;
460 width: 130px;
461 text-align: right;
462 color: #404040;
463 }
464
465 input[type=checkbox], input[type=radio] {
466 cursor: pointer;
467 }
468
469 input,
470 textarea,
471 select,
472 .uneditable-input {
473 display: inline-block;
474 width: 210px;
475 height: 18px;
476 padding: 4px;
477 font-size: 13px;
478 line-height: 18px;
479 color: #808080;
480 border: 1px solid #ccc;
481 -webkit-border-radius: 3px;
482 -moz-border-radius: 3px;
483 border-radius: 3px;
484 }
485
486 select {
487 padding: initial;
488 }
489
490 input[type=checkbox], input[type=radio] {
491 width: auto;
492 height: auto;
493 padding: 0;
494 margin: 3px 0;
495 *margin-top: 0;
496 /* IE6-7 */
497
498 line-height: normal;
499 border: none;
500 }
501
502 input[type=file] {
503 background-color: #ffffff;
504 padding: initial;
505 border: initial;
506 line-height: initial;
507 -webkit-box-shadow: none;
508 -moz-box-shadow: none;
509 box-shadow: none;
510 }
511
512 input[type=button], input[type=reset], input[type=submit] {
513 width: auto;
514 height: auto;
515 }
516
517 select, input[type=file] {
518 height: 27px;
519 *height: auto;
520 line-height: 27px;
521 *margin-top: 4px;
522 /* For IE7, add top margin to align select with labels */
523 }
524
525 select[multiple] {
526 height: inherit;
527 background-color: #ffffff;
528 }
529
530 textarea {
531 height: auto;
532 }
533
534 .uneditable-input {
535 background-color: #ffffff;
536 display: block;
537 border-color: #eee;
538 -webkit-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
539 -moz-box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
540 box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.025);
541 cursor: not-allowed;
542 }
543
544 :-moz-placeholder {
545 color: #bfbfbf;
546 }
547
548 ::-webkit-input-placeholder {
549 color: #bfbfbf;
550 }
551
552 input, textarea {
553 -webkit-transition: border linear 0.2s, box-shadow linear 0.2s;
554 -moz-transition: border linear 0.2s, box-shadow linear 0.2s;
555 -ms-transition: border linear 0.2s, box-shadow linear 0.2s;
556 -o-transition: border linear 0.2s, box-shadow linear 0.2s;
557 transition: border linear 0.2s, box-shadow linear 0.2s;
558 -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
559 -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
560 box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1);
561 }
562
563 input:focus, textarea:focus {
564 outline: 0;
565 border-color: rgba(82, 168, 236, 0.8);
566 -webkit-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
567 -moz-box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
568 box-shadow: inset 0 1px 3px rgba(0, 0, 0, 0.1), 0 0 8px rgba(82, 168, 236, 0.6);
569 }
570
571 input[type=file]:focus, input[type=checkbox]:focus, select:focus {
572 -webkit-box-shadow: none;
573 -moz-box-shadow: none;
574 box-shadow: none;
575 outline: 1px dotted #666;
576 }
577
578 form .clearfix.error > label, form .clearfix.error .help-block, form .clearfix.error .help-inline {
579 color: #b94a48;
580 }
581
582 form .clearfix.error input, form .clearfix.error textarea {
583 color: #b94a48;
584 border-color: #ee5f5b;
585 }
586
587 form .clearfix.error input:focus, form .clearfix.error textarea:focus {
588 border-color: #e9322d;
589 -webkit-box-shadow: 0 0 6px #f8b9b7;
590 -moz-box-shadow: 0 0 6px #f8b9b7;
591 box-shadow: 0 0 6px #f8b9b7;
592 }
593
594 form .clearfix.error .input-prepend .add-on, form .clearfix.error .input-append .add-on {
595 color: #b94a48;
596 background-color: #fce6e6;
597 border-color: #b94a48;
598 }
599
600 form .clearfix.warning > label, form .clearfix.warning .help-block, form .clearfix.warning .help-inline {
601 color: #c09853;
602 }
603
604 form .clearfix.warning input, form .clearfix.warning textarea {
605 color: #c09853;
606 border-color: #ccae64;
607 }
608
609 form .clearfix.warning input:focus, form .clearfix.warning textarea:focus {
610 border-color: #be9a3f;
611 -webkit-box-shadow: 0 0 6px #e5d6b1;
612 -moz-box-shadow: 0 0 6px #e5d6b1;
613 box-shadow: 0 0 6px #e5d6b1;
614 }
615
616 form .clearfix.warning .input-prepend .add-on, form .clearfix.warning .input-append .add-on {
617 color: #c09853;
618 background-color: #d2b877;
619 border-color: #c09853;
620 }
621
622 form .clearfix.success > label, form .clearfix.success .help-block, form .clearfix.success .help-inline {
623 color: #468847;
624 }
625
626 form .clearfix.success input, form .clearfix.success textarea {
627 color: #468847;
628 border-color: #57a957;
629 }
630
631 form .clearfix.success input:focus, form .clearfix.success textarea:focus {
632 border-color: #458845;
633 -webkit-box-shadow: 0 0 6px #9acc9a;
634 -moz-box-shadow: 0 0 6px #9acc9a;
635 box-shadow: 0 0 6px #9acc9a;
636 }
637
638 form .clearfix.success .input-prepend .add-on, form .clearfix.success .input-append .add-on {
639 color: #468847;
640 background-color: #bcddbc;
641 border-color: #468847;
642 }
643
644 input[disabled],
645 select[disabled],
646 textarea[disabled],
647 input[readonly],
648 select[readonly],
649 textarea[readonly] {
650 background-color: #f5f5f5;
651 border-color: #ddd;
652 }
653
654 .actions,
655 .cbi-page-actions {
656 background: #f5f5f5;
657 margin-bottom: 18px;
658 padding: 17px 20px 18px 150px;
659 border-top: 1px solid #ddd;
660 -webkit-border-radius: 0 0 3px 3px;
661 -moz-border-radius: 0 0 3px 3px;
662 border-radius: 0 0 3px 3px;
663 text-align: right;
664 }
665
666 .actions .secondary-action,
667 .cbi-page-actions .secondary-action{
668 float: right;
669 }
670
671 .actions .secondary-action a,
672 .cbi-page-actions .secondary-action a {
673 line-height: 30px;
674 }
675
676 .actions .secondary-action a:hover,
677 .cbi-page-actions .secondary-action a:hover {
678 text-decoration: underline;
679 }
680
681 .help-inline, .help-block {
682 font-size: 13px;
683 line-height: 18px;
684 color: #bfbfbf;
685 }
686
687 .help-inline {
688 padding-left: 5px;
689 *position: relative;
690 /* IE6-7 */
691
692 *top: -5px;
693 /* IE6-7 */
694
695 }
696
697 .help-block {
698 display: block;
699 max-width: 600px;
700 }
701
702 /*
703 * Tables.less
704 * Tables for, you guessed it, tabular data
705 * ---------------------------------------- */
706 table {
707 width: 100%;
708 margin-bottom: 18px;
709 padding: 0;
710 font-size: 13px;
711 border-collapse: collapse;
712 }
713
714 table th, table td {
715 padding: 10px 10px 9px;
716 line-height: 18px;
717 text-align: left;
718 }
719
720 table th {
721 padding-top: 9px;
722 font-weight: bold;
723 vertical-align: middle;
724 }
725
726 table td {
727 vertical-align: top;
728 border-top: 1px solid #ddd;
729 }
730
731 table tbody th {
732 border-top: 1px solid #ddd;
733 vertical-align: top;
734 }
735
736 /* Patterns.less
737 * Repeatable UI elements outside the base styles provided from the scaffolding
738 * ---------------------------------------------------------------------------- */
739 header {
740 height: 40px;
741 position: fixed;
742 top: 0;
743 left: 0;
744 right: 0;
745 z-index: 10000;
746 overflow: visible;
747 color: #BFBFBF
748 }
749
750 header a {
751 color: #bfbfbf;
752 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
753 }
754
755 header h3 a:hover, header .brand:hover, header ul .active > a {
756 background-color: #333;
757 background-color: rgba(255, 255, 255, 0.05);
758 color: #ffffff;
759 text-decoration: none;
760 }
761
762 header h3 {
763 position: relative;
764 }
765
766 header h3 a, header .brand {
767 float: left;
768 display: block;
769 padding: 8px 20px 12px;
770 margin-left: -20px;
771 color: #ffffff;
772 font-size: 20px;
773 font-weight: 200;
774 line-height: 1;
775 }
776
777 header p {
778 margin: 0;
779 line-height: 40px;
780 }
781
782 header .fill {
783 background-color: #222;
784 background-color: #222222;
785 background-repeat: repeat-x;
786 background-image: -khtml-gradient(linear, left top, left bottom, from(#333333), to(#222222));
787 background-image: -moz-linear-gradient(top, #333333, #222222);
788 background-image: -ms-linear-gradient(top, #333333, #222222);
789 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #333333), color-stop(100%, #222222));
790 background-image: -webkit-linear-gradient(top, #333333, #222222);
791 background-image: -o-linear-gradient(top, #333333, #222222);
792 background-image: linear-gradient(top, #333333, #222222);
793 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#333333', endColorstr='#222222', GradientType=0);
794 -webkit-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
795 -moz-box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
796 box-shadow: 0 1px 3px rgba(0, 0, 0, 0.25), inset 0 -1px 0 rgba(0, 0, 0, 0.1);
797 padding: 0 5px;
798 }
799
800 header div > ul, .nav {
801 display: block;
802 float: left;
803 margin: 0 10px 0 0;
804 position: relative;
805 left: 0;
806 }
807
808 header div > ul > li, .nav > li {
809 display: block;
810 float: left;
811 }
812
813 header div > ul a, .nav a {
814 display: block;
815 float: none;
816 padding: 10px 10px 11px;
817 line-height: 19px;
818 text-decoration: none;
819 }
820
821 header div > ul a:hover, .nav a:hover {
822 color: #ffffff;
823 text-decoration: none;
824 }
825
826 header div > ul .active > a, .nav .active > a {
827 background-color: #222;
828 background-color: rgba(0, 0, 0, 0.5);
829 }
830
831 header div > ul.secondary-nav, .nav.secondary-nav {
832 float: right;
833 margin-left: 10px;
834 margin-right: 0;
835 }
836
837 header div > ul.secondary-nav .menu-dropdown,
838 .nav.secondary-nav .menu-dropdown,
839 header div > ul.secondary-nav .dropdown-menu,
840 .nav.secondary-nav .dropdown-menu {
841 right: 0;
842 border: 0;
843 }
844
845 header div > ul a.menu:hover,
846 .nav a.menu:hover,
847 header div > ul li.open .menu,
848 .nav li.open .menu,
849 header div > ul .dropdown-toggle:hover,
850 .nav .dropdown-toggle:hover,
851 header div > ul .dropdown.open .dropdown-toggle,
852 .nav .dropdown.open .dropdown-toggle {
853 background: #444;
854 background: rgba(255, 255, 255, 0.05);
855 }
856
857 header div > ul .menu-dropdown,
858 .nav .menu-dropdown,
859 header div > ul .dropdown-menu,
860 .nav .dropdown-menu {
861 background-color: #333;
862 }
863
864 header div > ul .menu-dropdown a.menu,
865 .nav .menu-dropdown a.menu,
866 header div > ul .dropdown-menu a.menu,
867 .nav .dropdown-menu a.menu,
868 header div > ul .menu-dropdown .dropdown-toggle,
869 .nav .menu-dropdown .dropdown-toggle,
870 header div > ul .dropdown-menu .dropdown-toggle,
871 .nav .dropdown-menu .dropdown-toggle {
872 color: #ffffff;
873 }
874
875 header div > ul .menu-dropdown a.menu.open,
876 .nav .menu-dropdown a.menu.open,
877 header div > ul .dropdown-menu a.menu.open,
878 .nav .dropdown-menu a.menu.open,
879 header div > ul .menu-dropdown .dropdown-toggle.open,
880 .nav .menu-dropdown .dropdown-toggle.open,
881 header div > ul .dropdown-menu .dropdown-toggle.open,
882 .nav .dropdown-menu .dropdown-toggle.open {
883 background: #444;
884 background: rgba(255, 255, 255, 0.05);
885 }
886
887 header div > ul .menu-dropdown li a,
888 .nav .menu-dropdown li a,
889 header div > ul .dropdown-menu li a,
890 .nav .dropdown-menu li a {
891 color: #999;
892 text-shadow: 0 1px 0 rgba(0, 0, 0, 0.5);
893 }
894
895 header div > ul .menu-dropdown li a:hover,
896 .nav .menu-dropdown li a:hover,
897 header div > ul .dropdown-menu li a:hover,
898 .nav .dropdown-menu li a:hover {
899 background-color: #191919;
900 background-repeat: repeat-x;
901 background-image: -khtml-gradient(linear, left top, left bottom, from(#292929), to(#191919));
902 background-image: -moz-linear-gradient(top, #292929, #191919);
903 background-image: -ms-linear-gradient(top, #292929, #191919);
904 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #292929), color-stop(100%, #191919));
905 background-image: -webkit-linear-gradient(top, #292929, #191919);
906 background-image: -o-linear-gradient(top, #292929, #191919);
907 background-image: linear-gradient(top, #292929, #191919);
908 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#292929', endColorstr='#191919', GradientType=0);
909 color: #ffffff;
910 }
911
912 header div > ul .menu-dropdown .active a,
913 .nav .menu-dropdown .active a,
914 header div > ul .dropdown-menu .active a,
915 .nav .dropdown-menu .active a {
916 color: #ffffff;
917 }
918
919 header div > ul .menu-dropdown .divider,
920 .nav .menu-dropdown .divider,
921 header div > ul .dropdown-menu .divider,
922 .nav .dropdown-menu .divider {
923 background-color: #222;
924 border-color: #444;
925 }
926
927 header ul .menu-dropdown li a, header ul .dropdown-menu li a {
928 padding: 4px 15px;
929 }
930
931 li.menu, .dropdown {
932 position: relative;
933 }
934
935 a.menu:after, .dropdown-toggle:after {
936 width: 0;
937 height: 0;
938 display: inline-block;
939 content: "&darr;";
940 text-indent: -99999px;
941 vertical-align: top;
942 margin-top: 8px;
943 margin-left: 4px;
944 border-left: 4px solid transparent;
945 border-right: 4px solid transparent;
946 border-top: 4px solid #ffffff;
947 filter: alpha(opacity=50);
948 -khtml-opacity: 0.5;
949 -moz-opacity: 0.5;
950 opacity: 0.5;
951 }
952
953 .menu-dropdown, .dropdown-menu {
954 background-color: #ffffff;
955 float: left;
956 display: none;
957 position: absolute;
958 top: 40px;
959 z-index: 900;
960 min-width: 160px;
961 max-width: 220px;
962 _width: 160px;
963 margin-left: 0;
964 margin-right: 0;
965 padding: 6px 0;
966 zoom: 1;
967 border-color: #999;
968 border-color: rgba(0, 0, 0, 0.2);
969 border-style: solid;
970 border-width: 0 1px 1px;
971 -webkit-border-radius: 0 0 6px 6px;
972 -moz-border-radius: 0 0 6px 6px;
973 border-radius: 0 0 6px 6px;
974 -webkit-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
975 -moz-box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
976 box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
977 -webkit-background-clip: padding-box;
978 -moz-background-clip: padding-box;
979 background-clip: padding-box;
980 }
981
982 .menu-dropdown li, .dropdown-menu li {
983 float: none;
984 display: block;
985 background-color: none;
986 }
987
988 .menu-dropdown .divider, .dropdown-menu .divider {
989 height: 1px;
990 margin: 5px 0;
991 overflow: hidden;
992 background-color: #eee;
993 border-bottom: 1px solid #ffffff;
994 }
995
996 header .dropdown-menu a, .dropdown-menu a {
997 display: block;
998 padding: 4px 15px;
999 clear: both;
1000 font-weight: normal;
1001 line-height: 18px;
1002 color: #808080;
1003 text-shadow: 0 1px 0 #ffffff;
1004 }
1005
1006 header .dropdown-menu a:hover,
1007 .dropdown-menu a:hover,
1008 header .dropdown-menu a.hover,
1009 .dropdown-menu a.hover {
1010 background-color: #dddddd;
1011 background-repeat: repeat-x;
1012 background-image: -khtml-gradient(linear, left top, left bottom, from(#eeeeee), to(#dddddd));
1013 background-image: -moz-linear-gradient(top, #eeeeee, #dddddd);
1014 background-image: -ms-linear-gradient(top, #eeeeee, #dddddd);
1015 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #eeeeee), color-stop(100%, #dddddd));
1016 background-image: -webkit-linear-gradient(top, #eeeeee, #dddddd);
1017 background-image: -o-linear-gradient(top, #eeeeee, #dddddd);
1018 background-image: linear-gradient(top, #eeeeee, #dddddd);
1019 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#eeeeee', endColorstr='#dddddd', GradientType=0);
1020 color: #404040;
1021 text-decoration: none;
1022 -webkit-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
1023 -moz-box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
1024 box-shadow: inset 0 1px 0 rgba(0, 0, 0, 0.025), inset 0 -1px rgba(0, 0, 0, 0.025);
1025 }
1026
1027 .open .menu,
1028 .dropdown.open .menu,
1029 .open .dropdown-toggle,
1030 .dropdown.open .dropdown-toggle {
1031 color: #ffffff;
1032 background: #ccc;
1033 background: rgba(0, 0, 0, 0.3);
1034 }
1035
1036 .open .menu-dropdown,
1037 .dropdown.open .menu-dropdown,
1038 .open .dropdown-menu,
1039 .dropdown.open .dropdown-menu {
1040 display: block;
1041 }
1042
1043 .dropdown:hover ul.dropdown-menu {
1044 display: block;
1045 }
1046
1047 .dropdown-menu .dropdown-menu {
1048 position: absolute;
1049 left: 159px;
1050 }
1051
1052 .dropdown-menu li {
1053 position: relative;
1054 }
1055
1056 .tabs, .cbi-tabmenu {
1057 margin: 0 0 18px;
1058 padding: 0;
1059 list-style: none;
1060 zoom: 1;
1061 }
1062
1063 .tabs:before,
1064 .cbi-tabmenu:before,
1065 .tabs:after,
1066 .cbi-tabmenu:after {
1067 display: table;
1068 content: "";
1069 zoom: 1;
1070 }
1071
1072 .tabs:after, .cbi-tabmenu:after {
1073 clear: both;
1074 }
1075
1076 .tabs > li, .cbi-tabmenu > li {
1077 float: left;
1078 }
1079
1080 .tabs > li > a, .cbi-tabmenu > li > a {
1081 display: block;
1082 }
1083
1084 .tabs,
1085 .cbi-tabmenu {
1086 border-color: #ddd;
1087 border-style: solid;
1088 border-width: 0 0 1px;
1089 }
1090
1091 .tabs > li,
1092 .cbi-tabmenu > li {
1093 position: relative;
1094 margin-bottom: -1px;
1095 }
1096
1097 .tabs > li > a,
1098 .cbi-tabmenu > li > a {
1099 padding: 0 15px;
1100 margin-right: 2px;
1101 line-height: 34px;
1102 border: 1px solid transparent;
1103 -webkit-border-radius: 4px 4px 0 0;
1104 -moz-border-radius: 4px 4px 0 0;
1105 border-radius: 4px 4px 0 0;
1106 }
1107
1108 .tabs > li > a:hover,
1109 .cbi-tabmenu > li > a:hover {
1110 text-decoration: none;
1111 background-color: #eee;
1112 border-color: #eee #eee #ddd;
1113 }
1114
1115 .tabs .active > a, .tabs .active > a:hover,
1116 .cbi-tabmenu .active > a, .cbi-tabmenu .active > a:hover,
1117 .cbi-tab > a:link, .cbi-tab > a:hover {
1118 color: #808080;
1119 background-color: #ffffff;
1120 border: 1px solid #ddd;
1121 border-bottom-color: transparent;
1122 cursor: default;
1123 }
1124
1125 .tabs .menu-dropdown, .tabs .dropdown-menu,
1126 .cbi-tabmenu .menu-dropdown, .cbi-tabmenu .dropdown-menu {
1127 top: 35px;
1128 border-width: 1px;
1129 -webkit-border-radius: 0 6px 6px 6px;
1130 -moz-border-radius: 0 6px 6px 6px;
1131 border-radius: 0 6px 6px 6px;
1132 }
1133
1134 .tabs a.menu:after, .tabs .dropdown-toggle:after,
1135 .cbi-tabmenu a.menu:after, .cbi-tabmenu .dropdown-toggle:after {
1136 border-top-color: #999;
1137 margin-top: 15px;
1138 margin-left: 5px;
1139 }
1140
1141 .tabs li.open.menu .menu, .tabs .open.dropdown .dropdown-toggle,
1142 .cbi-tabmenu li.open.menu .menu, .cbi-tabmenu .open.dropdown .dropdown-toggle {
1143 border-color: #999;
1144 }
1145
1146 .tabs li.open a.menu:after, .tabs .dropdown.open .dropdown-toggle:after,
1147 .cbi-tabmenu li.open a.menu:after, .cbi-tabmenu .dropdown.open .dropdown-toggle:after {
1148 border-top-color: #555;
1149 }
1150
1151 .tab-content > .tab-pane,
1152 .tab-content > div {
1153 display: none;
1154 }
1155
1156 .tab-content > .active {
1157 display: block;
1158 }
1159
1160 .breadcrumb {
1161 padding: 7px 14px;
1162 margin: 0 0 18px;
1163 background-color: #f5f5f5;
1164 background-repeat: repeat-x;
1165 background-image: -khtml-gradient(linear, left top, left bottom, from(#ffffff), to(#f5f5f5));
1166 background-image: -moz-linear-gradient(top, #ffffff, #f5f5f5);
1167 background-image: -ms-linear-gradient(top, #ffffff, #f5f5f5);
1168 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ffffff), color-stop(100%, #f5f5f5));
1169 background-image: -webkit-linear-gradient(top, #ffffff, #f5f5f5);
1170 background-image: -o-linear-gradient(top, #ffffff, #f5f5f5);
1171 background-image: linear-gradient(top, #ffffff, #f5f5f5);
1172 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#f5f5f5', GradientType=0);
1173 border: 1px solid #ddd;
1174 -webkit-border-radius: 3px;
1175 -moz-border-radius: 3px;
1176 border-radius: 3px;
1177 -webkit-box-shadow: inset 0 1px 0 #ffffff;
1178 -moz-box-shadow: inset 0 1px 0 #ffffff;
1179 box-shadow: inset 0 1px 0 #ffffff;
1180 }
1181
1182 .breadcrumb li {
1183 display: inline;
1184 text-shadow: 0 1px 0 #ffffff;
1185 }
1186
1187 .breadcrumb .divider {
1188 padding: 0 5px;
1189 color: #bfbfbf;
1190 }
1191
1192 .breadcrumb .active a {
1193 color: #404040;
1194 }
1195
1196 footer {
1197 margin-top: 17px;
1198 padding-top: 17px;
1199 border-top: 1px solid #eee;
1200 }
1201
1202 .btn.danger,
1203 .alert-message.danger,
1204 .btn.danger:hover,
1205 .alert-message.danger:hover,
1206 .btn.error,
1207 .alert-message.error,
1208 .btn.error:hover,
1209 .alert-message.error:hover,
1210 .btn.success,
1211 .alert-message.success,
1212 .btn.success:hover,
1213 .alert-message.success:hover,
1214 .btn.info,
1215 .alert-message.info,
1216 .btn.info:hover,
1217 .alert-message.info:hover {
1218 color: #ffffff;
1219 }
1220
1221 .btn .close, .alert-message .close {
1222 font-family: Arial, sans-serif;
1223 line-height: 18px;
1224 }
1225
1226 .btn.danger,
1227 .alert-message.danger,
1228 .btn.error,
1229 .alert-message.error {
1230 background-color: #c43c35;
1231 background-repeat: repeat-x;
1232 background-image: -khtml-gradient(linear, left top, left bottom, from(#ee5f5b), to(#c43c35));
1233 background-image: -moz-linear-gradient(top, #ee5f5b, #c43c35);
1234 background-image: -ms-linear-gradient(top, #ee5f5b, #c43c35);
1235 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #ee5f5b), color-stop(100%, #c43c35));
1236 background-image: -webkit-linear-gradient(top, #ee5f5b, #c43c35);
1237 background-image: -o-linear-gradient(top, #ee5f5b, #c43c35);
1238 background-image: linear-gradient(top, #ee5f5b, #c43c35);
1239 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ee5f5b', endColorstr='#c43c35', GradientType=0);
1240 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
1241 border-color: #c43c35 #c43c35 #882a25;
1242 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
1243 }
1244
1245 .btn.success, .alert-message.success {
1246 background-color: #57a957;
1247 background-repeat: repeat-x;
1248 background-image: -khtml-gradient(linear, left top, left bottom, from(#62c462), to(#57a957));
1249 background-image: -moz-linear-gradient(top, #62c462, #57a957);
1250 background-image: -ms-linear-gradient(top, #62c462, #57a957);
1251 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #62c462), color-stop(100%, #57a957));
1252 background-image: -webkit-linear-gradient(top, #62c462, #57a957);
1253 background-image: -o-linear-gradient(top, #62c462, #57a957);
1254 background-image: linear-gradient(top, #62c462, #57a957);
1255 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#62c462', endColorstr='#57a957', GradientType=0);
1256 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
1257 border-color: #57a957 #57a957 #3d773d;
1258 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
1259 }
1260
1261 .btn.info, .alert-message.info {
1262 background-color: #339bb9;
1263 background-repeat: repeat-x;
1264 background-image: -khtml-gradient(linear, left top, left bottom, from(#5bc0de), to(#339bb9));
1265 background-image: -moz-linear-gradient(top, #5bc0de, #339bb9);
1266 background-image: -ms-linear-gradient(top, #5bc0de, #339bb9);
1267 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #5bc0de), color-stop(100%, #339bb9));
1268 background-image: -webkit-linear-gradient(top, #5bc0de, #339bb9);
1269 background-image: -o-linear-gradient(top, #5bc0de, #339bb9);
1270 background-image: linear-gradient(top, #5bc0de, #339bb9);
1271 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#5bc0de', endColorstr='#339bb9', GradientType=0);
1272 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
1273 border-color: #339bb9 #339bb9 #22697d;
1274 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
1275 }
1276
1277 .btn,
1278 .cbi-button {
1279 cursor: pointer;
1280 display: inline-block;
1281 background-color: #e6e6e6;
1282 background-repeat: no-repeat;
1283 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1284 background-image: -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1285 background-image: -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1286 background-image: -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1287 background-image: -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1288 background-image: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1289 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
1290 padding: 5px 14px 6px;
1291 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
1292 color: #333;
1293 font-size: 13px;
1294 line-height: normal;
1295 border: 1px solid #ccc;
1296 border-bottom-color: #bbb;
1297 -webkit-border-radius: 4px;
1298 -moz-border-radius: 4px;
1299 border-radius: 4px;
1300 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1301 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1302 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1303 }
1304
1305 .btn:hover,
1306 .cbi-button:hover {
1307 color: #333;
1308 text-decoration: none;
1309 }
1310
1311 .btn:focus,
1312 .cbi-button:focus {
1313 outline: 1px dotted #666;
1314 }
1315
1316 .btn.primary,
1317 .cbi-page-actions .cbi-button-apply,
1318 .cbi-page-actions .cbi-button-save,
1319 .cbi-page-actions .cbi-button-reset {
1320 color: #ffffff;
1321 padding: 5px 14px 6px;
1322 background-color: #0064cd;
1323 background-repeat: repeat-x;
1324 background-image: -khtml-gradient(linear, left top, left bottom, from(#049cdb), to(#0064cd));
1325 background-image: -moz-linear-gradient(top, #049cdb, #0064cd);
1326 background-image: -ms-linear-gradient(top, #049cdb, #0064cd);
1327 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #049cdb), color-stop(100%, #0064cd));
1328 background-image: -webkit-linear-gradient(top, #049cdb, #0064cd);
1329 background-image: -o-linear-gradient(top, #049cdb, #0064cd);
1330 background-image: linear-gradient(top, #049cdb, #0064cd);
1331 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#049cdb', endColorstr='#0064cd', GradientType=0);
1332 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
1333 border-color: #0064cd #0064cd #003f81;
1334 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
1335 }
1336
1337 .cbi-input-invalid {
1338 color: #FF0000;
1339 border-color: #FF0000;
1340 }
1341
1342 .cbi-button-up,
1343 .cbi-input-up {
1344 background-position: center center;
1345 background-image: url('../resources/cbi/up.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1346 background-image: url('../resources/cbi/up.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1347 background-image: url('../resources/cbi/up.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1348 background-image: url('../resources/cbi/up.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1349 background-image: url('../resources/cbi/up.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1350 background-image: url('../resources/cbi/up.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1351 }
1352
1353 .cbi-button-down,
1354 .cbi-input-down {
1355 background-position: center center;
1356 background-image: url('../resources/cbi/down.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1357 background-image: url('../resources/cbi/down.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1358 background-image: url('../resources/cbi/down.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1359 background-image: url('../resources/cbi/down.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1360 background-image: url('../resources/cbi/down.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1361 background-image: url('../resources/cbi/down.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1362 }
1363
1364 .cbi-button-find,
1365 .cbi-input-find {
1366 background-position: 6px center, left top;
1367 padding-left: 28px;
1368 background-image: url('../resources/cbi/find.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1369 background-image: url('../resources/cbi/find.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1370 background-image: url('../resources/cbi/find.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1371 background-image: url('../resources/cbi/find.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1372 background-image: url('../resources/cbi/find.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1373 background-image: url('../resources/cbi/find.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1374 }
1375
1376 .cbi-button-add,
1377 .cbi-input-add {
1378 background-position: 6px center, left top;
1379 padding-left: 28px;
1380 background-image: url('../resources/cbi/add.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1381 background-image: url('../resources/cbi/add.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1382 background-image: url('../resources/cbi/add.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1383 background-image: url('../resources/cbi/add.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1384 background-image: url('../resources/cbi/add.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1385 background-image: url('../resources/cbi/add.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1386 }
1387
1388 .cbi-button-apply,
1389 .cbi-input-apply {
1390 background-position: 6px center, left top;
1391 padding-left: 28px;
1392 background-image: url('../resources/cbi/apply.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1393 background-image: url('../resources/cbi/apply.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1394 background-image: url('../resources/cbi/apply.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1395 background-image: url('../resources/cbi/apply.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1396 background-image: url('../resources/cbi/apply.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1397 background-image: url('../resources/cbi/apply.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1398 }
1399
1400 .cbi-button-reset,
1401 .cbi-input-reset {
1402 background-position: 6px center, left top;
1403 padding-left: 28px;
1404 background-image: url('../resources/cbi/reset.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1405 background-image: url('../resources/cbi/reset.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1406 background-image: url('../resources/cbi/reset.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1407 background-image: url('../resources/cbi/reset.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1408 background-image: url('../resources/cbi/reset.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1409 background-image: url('../resources/cbi/reset.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1410 }
1411
1412 .cbi-button-edit,
1413 .cbi-input-edit {
1414 background-position: 6px center, left top;
1415 padding-left: 28px;
1416 background-image: url('../resources/cbi/edit.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1417 background-image: url('../resources/cbi/edit.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1418 background-image: url('../resources/cbi/edit.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1419 background-image: url('../resources/cbi/edit.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1420 background-image: url('../resources/cbi/edit.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1421 background-image: url('../resources/cbi/edit.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1422 }
1423
1424 .cbi-button-remove,
1425 .cbi-input-remove {
1426 background-position: 6px center, left top;
1427 padding-left: 28px;
1428 background-image: url('../resources/cbi/remove.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1429 background-image: url('../resources/cbi/remove.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1430 background-image: url('../resources/cbi/remove.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1431 background-image: url('../resources/cbi/remove.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1432 background-image: url('../resources/cbi/remove.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1433 background-image: url('../resources/cbi/remove.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1434 }
1435
1436 .cbi-button-reload,
1437 .cbi-input-reload {
1438 background-position: 6px center, left top;
1439 padding-left: 28px;
1440 background-image: url('../resources/cbi/reload.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1441 background-image: url('../resources/cbi/reload.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1442 background-image: url('../resources/cbi/reload.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1443 background-image: url('../resources/cbi/reload.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1444 background-image: url('../resources/cbi/reload.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1445 background-image: url('../resources/cbi/reload.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1446 }
1447
1448 .cbi-button-link,
1449 .cbi-input-link {
1450 background-position: 6px center, left top;
1451 padding-left: 28px;
1452 background-image: url('../resources/cbi/link.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1453 background-image: url('../resources/cbi/link.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1454 background-image: url('../resources/cbi/link.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1455 background-image: url('../resources/cbi/link.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1456 background-image: url('../resources/cbi/link.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1457 background-image: url('../resources/cbi/link.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1458 }
1459
1460 .cbi-button-download,
1461 .cbi-input-download {
1462 background-position: 6px center, left top;
1463 padding-left: 28px;
1464 background-image: url('../resources/cbi/download.gif'), -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1465 background-image: url('../resources/cbi/download.gif'), -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1466 background-image: url('../resources/cbi/download.gif'), -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1467 background-image: url('../resources/cbi/download.gif'), -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1468 background-image: url('../resources/cbi/download.gif'), -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1469 background-image: url('../resources/cbi/download.gif'), linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1470 }
1471
1472 .btn.active, .btn:active {
1473 -webkit-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
1474 -moz-box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
1475 box-shadow: inset 0 2px 4px rgba(0, 0, 0, 0.25), 0 1px 2px rgba(0, 0, 0, 0.05);
1476 }
1477
1478 .btn.disabled {
1479 cursor: default;
1480 background-image: none;
1481 filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
1482 filter: alpha(opacity=65);
1483 -khtml-opacity: 0.65;
1484 -moz-opacity: 0.65;
1485 opacity: 0.65;
1486 -webkit-box-shadow: none;
1487 -moz-box-shadow: none;
1488 box-shadow: none;
1489 }
1490
1491 .btn[disabled] {
1492 cursor: default;
1493 background-image: none;
1494 filter: progid:DXImageTransform.Microsoft.gradient(enabled = false);
1495 filter: alpha(opacity=65);
1496 -khtml-opacity: 0.65;
1497 -moz-opacity: 0.65;
1498 opacity: 0.65;
1499 -webkit-box-shadow: none;
1500 -moz-box-shadow: none;
1501 box-shadow: none;
1502 }
1503
1504 .btn.large {
1505 font-size: 15px;
1506 line-height: normal;
1507 padding: 9px 14px 9px;
1508 -webkit-border-radius: 6px;
1509 -moz-border-radius: 6px;
1510 border-radius: 6px;
1511 }
1512
1513 .btn.small {
1514 padding: 7px 9px 7px;
1515 font-size: 11px;
1516 }
1517
1518 /* Button icons for specific pages */
1519 .Startup .cbi-section-table input.cbi-input-apply,
1520 .Startup .cbi-section-table input.cbi-button-apply {
1521 background-image: url("../resources/cbi/apply.gif");
1522 background-position: 7px 4px;
1523 padding: 3px 9px 3px 27px;
1524 }
1525
1526 .Processes .cbi-section-table input.cbi-input-reload,
1527 .Startup .cbi-section-table input.cbi-input-reload {
1528 background-image: url("../resources/cbi/reload.gif");
1529 background-position: 7px 4px;
1530 padding: 3px 9px 3px 27px;
1531 }
1532
1533 .Processes .cbi-section-table input.cbi-input-remove,
1534 .Processes .cbi-section-table div.cbi-section-remove input,
1535 .Startup .cbi-section-table input.cbi-input-remove,
1536 .Startup .cbi-section-table div.cbi-section-remove input {
1537 background-image: url("../resources/cbi/remove.gif");
1538 background-position: 7px 4px;
1539 padding: 3px 9px 3px 27px;
1540 }
1541
1542 .Processes .cbi-section-table input.cbi-input-reset,
1543 .Processes .cbi-section-table input.cbi-button-reset,
1544 .Startup .cbi-section-table input.cbi-input-reset,
1545 .Startup .cbi-section-table input.cbi-button-reset {
1546 background-image: url("../resources/cbi/reset.gif");
1547 background-position: 7px 4px;
1548 padding: 3px 9px 3px 27px;
1549 }
1550
1551 .Startup .cbi-section-table input.cbi-input-save,
1552 .Startup .cbi-section-table input.cbi-button-save {
1553 background-image: url("../resources/cbi/save.gif");
1554 background-position: 7px 4px;
1555 padding: 3px 9px 3px 27px;
1556 }
1557
1558 :root .alert-message, :root .btn {
1559 border-radius: 0 \0;
1560 }
1561
1562 button.btn::-moz-focus-inner, input[type=submit].btn::-moz-focus-inner {
1563 padding: 0;
1564 border: 0;
1565 }
1566
1567 .close {
1568 float: right;
1569 color: #000000;
1570 font-size: 20px;
1571 font-weight: bold;
1572 line-height: 13.5px;
1573 text-shadow: 0 1px 0 #ffffff;
1574 filter: alpha(opacity=25);
1575 -khtml-opacity: 0.25;
1576 -moz-opacity: 0.25;
1577 opacity: 0.25;
1578 }
1579
1580 .close:hover {
1581 color: #000000;
1582 text-decoration: none;
1583 filter: alpha(opacity=40);
1584 -khtml-opacity: 0.4;
1585 -moz-opacity: 0.4;
1586 opacity: 0.4;
1587 }
1588
1589 .alert-message {
1590 position: relative;
1591 padding: 7px 15px;
1592 margin-bottom: 18px;
1593 color: #404040;
1594 background-color: #eedc94;
1595 background-repeat: repeat-x;
1596 background-image: -khtml-gradient(linear, left top, left bottom, from(#fceec1), to(#eedc94));
1597 background-image: -moz-linear-gradient(top, #fceec1, #eedc94);
1598 background-image: -ms-linear-gradient(top, #fceec1, #eedc94);
1599 background-image: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #fceec1), color-stop(100%, #eedc94));
1600 background-image: -webkit-linear-gradient(top, #fceec1, #eedc94);
1601 background-image: -o-linear-gradient(top, #fceec1, #eedc94);
1602 background-image: linear-gradient(top, #fceec1, #eedc94);
1603 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#fceec1', endColorstr='#eedc94', GradientType=0);
1604 text-shadow: 0 -1px 0 rgba(0, 0, 0, 0.25);
1605 border-color: #eedc94 #eedc94 #e4c652;
1606 border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
1607 text-shadow: 0 1px 0 rgba(255, 255, 255, 0.5);
1608 border-width: 1px;
1609 border-style: solid;
1610 -webkit-border-radius: 4px;
1611 -moz-border-radius: 4px;
1612 border-radius: 4px;
1613 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
1614 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
1615 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.25);
1616 }
1617
1618 .alert-message .close {
1619 margin-top: 1px;
1620 *margin-top: 0;
1621 }
1622
1623 .alert-message a {
1624 font-weight: bold;
1625 color: #404040;
1626 }
1627
1628 .alert-message.danger p a,
1629 .alert-message.error p a,
1630 .alert-message.success p a,
1631 .alert-message.info p a {
1632 color: #ffffff;
1633 }
1634
1635 .alert-message h5 {
1636 line-height: 18px;
1637 }
1638
1639 .alert-message p {
1640 margin-bottom: 0;
1641 }
1642
1643 .alert-message div {
1644 margin-top: 5px;
1645 margin-bottom: 2px;
1646 line-height: 28px;
1647 }
1648
1649 .alert-message .btn {
1650 -webkit-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
1651 -moz-box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
1652 box-shadow: 0 1px 0 rgba(255, 255, 255, 0.25);
1653 }
1654
1655 .label {
1656 padding: 1px 3px 2px;
1657 font-size: 9.75px;
1658 font-weight: bold;
1659 color: #ffffff !important;
1660 text-transform: uppercase;
1661 white-space: nowrap;
1662 background-color: #bfbfbf;
1663 -webkit-border-radius: 3px;
1664 -moz-border-radius: 3px;
1665 border-radius: 3px;
1666 text-shadow: none;
1667 }
1668
1669 a.label:link,
1670 a.label:visited {
1671 color: #ffffff;
1672 }
1673
1674 a.label:hover {
1675 text-decoration: none;
1676 }
1677
1678 .label.important {
1679 background-color: #c43c35;
1680 }
1681
1682 .label.warning {
1683 background-color: #f89406;
1684 }
1685
1686 .label.success {
1687 background-color: #46a546;
1688 }
1689
1690 .label.notice {
1691 background-color: #62cffc;
1692 }
1693
1694 /* LuCI specific items */
1695 .hidden { display: none }
1696
1697 #memtotal > div,
1698 #memfree > div,
1699 #memcache > div,
1700 #membuff > div,
1701 #conns > div {
1702 border: 1px solid #CCCCCC;
1703 border-radius: 3px 3px 3px 3px;
1704 color: #808080;
1705 display: inline-block;
1706 font-size: 13px;
1707 height: 22 dpx;
1708 line-height: 18px;
1709 }
1710
1711 #xhr_poll_status {
1712 cursor: pointer;
1713 }
1714
1715 form.inline { display: inline }
1716
1717 header .pull-right { padding-top: 8px; }
1718
1719 #modemenu li:last-child span.divider { display: none }
1720
1721 #syslog { width: 100%; }
1722
1723 .cbi-section-table tbody tr:nth-child(odd) td, .cbi-section-table tbody tr:nth-child(odd) th {
1724 background-color: #f9f9f9;
1725 }
1726
1727 .cbi-section-table tbody tr:hover td, .cbi-section-table tbody tr:hover th {
1728 background-color: #f5f5f5;
1729 }
1730
1731 .cbi-section-table tr.cbi-section-table-descr th {
1732 font-weight: normal;
1733 }
1734
1735 .left { text-align: left !important; }
1736
1737 .right { text-align: right !important; }
1738
1739 .cbi-value-field { line-height: 1.5em; }
1740
1741 .cbi-value-field input[type=checkbox],
1742 .cbi-value-field input[type=radio] {
1743 margin-top: 8px;
1744 margin-right: 6px;
1745 }
1746
1747 table table td,
1748 .cbi-value-field table td {
1749 border: none;
1750 }
1751
1752 table.cbi-section-table input,
1753 table.cbi-section-table textarea,
1754 table.cbi-section-table select {
1755 width: auto;
1756 }
1757
1758 table.cbi-section-table td.cbi-section-table-cell {
1759 white-space: nowrap;
1760 text-align: right;
1761 }
1762
1763 .cbi-value-description { display: inline; }
1764
1765 .cbi-value-description img { vertical-align: middle; }
1766
1767 .ifacebox {
1768 background-color: #FFFFFF;
1769 border: 1px solid #CCCCCC;
1770 margin: 0 10px;
1771 text-align: center;
1772 white-space: nowrap;
1773 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1774 background-image: -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1775 background-image: -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1776 background-image: -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1777 background-image: -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1778 background-image: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1779 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
1780 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
1781 -webkit-border-radius: 4px;
1782 -moz-border-radius: 4px;
1783 border-radius: 4px;
1784 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1785 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1786 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1787 }
1788
1789 .ifacebox .ifacebox-head {
1790 border-bottom: 1px solid #CCCCCC;
1791 padding: 2px;
1792 }
1793
1794 .ifacebox .ifacebox-body {
1795 padding: 6px;
1796 }
1797
1798 .ifacebadge {
1799 display: inline-block;
1800 white-space: nowrap;
1801 background-color: #FFFFFF;
1802 border: 1px solid #CCCCCC;
1803 padding: 2px;
1804 margin-left: 2px;
1805 background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#ffffff), color-stop(25%, #ffffff), to(#e6e6e6));
1806 background-image: -webkit-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1807 background-image: -moz-linear-gradient(top, #ffffff, #ffffff 25%, #e6e6e6);
1808 background-image: -ms-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1809 background-image: -o-linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1810 background-image: linear-gradient(#ffffff, #ffffff 25%, #e6e6e6);
1811 filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#e6e6e6', GradientType=0);
1812 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
1813 -webkit-border-radius: 4px;
1814 -moz-border-radius: 4px;
1815 border-radius: 4px;
1816 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1817 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1818 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
1819 }
1820
1821 .ifacebadge-active {
1822 border-color: #000000;
1823 font-weight: bold;
1824 }
1825
1826 .zonebadge {
1827 padding: 2px;
1828 border-radius: 4px;
1829 display: inline-block;
1830 white-space: nowrap;
1831 color: #666666;
1832 text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
1833 cursor: pointer;
1834 }
1835
1836 .zonebadge em,
1837 .zonebadge strong {
1838 margin: 5px;
1839 display: inline-block;
1840 }
1841
1842 .zonebadge input {
1843 width: 6em;
1844 height: 1em;
1845 }
1846
1847 .zonebadge-empty {
1848 border: 1px dashed #AAAAAA;
1849 color: #AAAAAA;
1850 font-style: italic;
1851 font-size: smaller;
1852 }
1853
1854 div.cbi-value var,
1855 td.cbi-value-field var {
1856 font-style: italic;
1857 color: #0069D6;
1858 }
1859
1860 .uci-change-list {
1861 font-family: monospace;
1862 }
1863
1864 .uci-change-list ins,
1865 .uci-change-legend-label ins {
1866 text-decoration: none;
1867 border: 1px solid #00FF00;
1868 background-color: #CCFFCC;
1869 display: block;
1870 padding: 2px;
1871 }
1872
1873 .uci-change-list del,
1874 .uci-change-legend-label del {
1875 text-decoration: none;
1876 border: 1px solid #FF0000;
1877 background-color: #FFCCCC;
1878 display: block;
1879 font-style: normal;
1880 padding: 2px;
1881 }
1882
1883 .uci-change-list var,
1884 .uci-change-legend-label var {
1885 text-decoration: none;
1886 border: 1px solid #CCCCCC;
1887 background-color: #EEEEEE;
1888 display: block;
1889 font-style: normal;
1890 padding: 2px;
1891 }
1892
1893 .uci-change-list var ins,
1894 .uci-change-list var del {
1895 /*display: inline;*/
1896 border: none;
1897 white-space: pre;
1898 font-style: normal;
1899 padding: 0px;
1900 }
1901
1902 .uci-change-legend {
1903 padding: 5px;
1904 }
1905
1906 .uci-change-legend-label {
1907 width: 150px;
1908 float: left;
1909 }
1910
1911 .uci-change-legend-label>ins,
1912 .uci-change-legend-label>del,
1913 .uci-change-legend-label>var {
1914 float: left;
1915 margin-right: 4px;
1916 width: 10px;
1917 height: 10px;
1918 display: block;
1919 }
1920
1921 .uci-change-legend-label var ins,
1922 .uci-change-legend-label var del {
1923 line-height: 6px;
1924 border: none;
1925 }