themes/bootstrap/htdocs/luci-static/bootstrap/cascade.css

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