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