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

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