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