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