git.sur5r.net Git - bacula/bacula/blob - gui/baculum/themes/Baculum-v1/style.css

   1 body {
   2         background-color: #b5c9d3;
   3         background-image: url('background.png');
   4         background-repeat: repeat-x;
   5         font-family: Arial, Helvetica, sans-serif;
   6         color: white;
   7 }
   8
   9 body.api {
  10         background-image: none;
  11         background-color: #444445;
  12         color: white;
  13 }
  14
  15 #message-body {
  16         background-color: #832933;
  17         background-image: none;
  18         background-repeat: repeat-x;
  19         font-family: Arial, Helvetica, sans-serif;
  20         color: black;
  21 }
  22
  23 input.invalidate, select.invalidate {
  24         border: 1px solid red;
  25 }
  26
  27 input[type=text], input[type=password], select, textarea {
  28                 -webkit-border-radius: 4px;
  29                 -moz-border-radius: 4px;
  30                 border-radius: 4px;
  31                 padding: 5px;
  32 }
  33
  34 input[type=checkbox] {
  35                 height: 16px;
  36                 width: 16px;
  37 }
  38
  39 input.textbox, select.textbox, textarea.textbox {
  40         width: 260px;
  41         border: 1px solid black;
  42         font-size: 11pt;
  43         display: table-cell;
  44 }
  45
  46 input.textbox-short, select.textbox-short {
  47         width: 80px;
  48         border: 1px solid black;
  49         font-size: 11pt;
  50         display: table-cell;
  51 }
  52
  53 input.textbox-auto, select.textbox-auto, textarea.textbox-auto {
  54         border: 1px solid black;
  55         font-size: 14px;
  56         display: table-cell;
  57 }
  58
  59 textarea.textbox-auto {
  60         resize: vertical;
  61         width: 100%;
  62         font-size: 11px;
  63 }
  64
  65 a, a.big {
  66         font-size: 12px;
  67         color: white;
  68         padding: 3px 4px;
  69         text-decoration: none;
  70 }
  71
  72 a:hover, a.big {
  73         text-decoration: underline;
  74 }
  75
  76 a.big {
  77         font-size: 17px;
  78         font-weight: bold;
  79 }
  80
  81 #container {
  82         margin: 0 auto;
  83         min-width: 987px;
  84         max-width: 100%;
  85         border-right: 1px solid black;
  86         background-color: #585758;
  87 }
  88
  89 #top {
  90         margin: 0 auto;
  91         min-width: 987px;
  92         max-width: 100%;
  93         height: 51px;
  94         background-image: url('bls_top.png');
  95         background-repeat: repeat-x;
  96         border-left: 1px solid black;
  97         border-right: 1px solid black;
  98         border-top-left-radius: 7px;
  99         border-top-right-radius: 7px;
 100         clear: both;
 101 }
 102
 103 #top img {
 104         padding: 11px 0 11px 5px;
 105         float: left;
 106 }
 107
 108 #topbar {
 109         background: transparent url('logo.png') no-repeat 10px center;
 110         width: 100%;
 111         height: 51px;
 112 }
 113
 114 #logo {
 115         margin-left: 20px;
 116 }
 117
 118 #workspace-menu-left {
 119         position: absolute;
 120         width: 74px;
 121         height: 600px;
 122         background-color: #546e83;
 123         border-left: 1px solid black;
 124         z-index: 200;
 125         /* Workaround for FF and switch Graphs and Workspace areas */
 126         bottom: auto !important;
 127 }
 128
 129 #content {
 130         position: relative;
 131         top: 0;
 132         left: 75px;
 133         width: 100%;
 134         height: 600px;
 135         z-index: 100;
 136 }
 137
 138 #directors, #panel_switcher, #tray_bar {
 139         float: right;
 140         font-size: 12px;
 141 }
 142
 143 #directors select {
 144         margin: 15px 20px 0 0;
 145         padding: 0;
 146         font-size: 12px
 147 }
 148
 149 #panel_switcher {
 150         margin: 2px 6px 0 0;
 151         font-weight: bold;
 152 }
 153
 154 #panel_switcher img {
 155         margin: 0;
 156         padding-left: 12px;
 157         float: none;
 158         cursor: pointer;
 159 }
 160
 161 #tray_bar {
 162         margin: 2px 0;
 163 }
 164
 165 #tray_bar img {
 166         float: none;
 167         margin: 0;
 168         padding: auto 7px;
 169 }
 170
 171 #tray_bar span{
 172         font-size: 14px;
 173 }
 174
 175 div.configuration {
 176         width: 45%;
 177         height: 100%;
 178         margin: 12px;
 179         float: right;
 180         background-color: #898889;
 181         -webkit-border-radius: 10px;
 182         -moz-border-radius: 10px;
 183         border-radius: 10px;
 184         display: none;
 185 }
 186
 187 #configuration {
 188         position: absolute;
 189         width: 100%;
 190         height: 99%;
 191 }
 192
 193 #configuration div.field select {
 194         width: 178px;
 195 }
 196
 197 #configuration div.field input[type=text] {
 198         width: 166px;
 199 }
 200
 201 div.configuration-progress {
 202         background: rgba(182,182,182,0.7) url('progress.gif') no-repeat center center;
 203         width: 45%;
 204         height: 100%;
 205         z-index: 10;
 206         position: absolute;
 207         top: 12px;
 208         right: 12px;
 209         display: none;
 210         border-radius: 10px;
 211 }
 212
 213 div.slide-window-progress {
 214         background: rgba(182,182,182,0.7) url('progress.gif') no-repeat center center;
 215         width: 100%;
 216         height: 100%;
 217         z-index: 10;
 218         position: absolute;
 219         top: 0;
 220         left: 0;
 221         display: none;
 222 }
 223
 224 .wheel-loader {
 225         background: #ffffff url('wheel.gif') no-repeat center center;
 226 }
 227 div.actions_btn {
 228         position: absolute;
 229         width: 35px;
 230         height: 35px;
 231         right: 22px;
 232         top: 0px;
 233         margin: 3px 0;
 234         text-align: right;
 235 }
 236
 237 #console {
 238         clear: left;
 239         min-width: 973px;
 240         max-width: 100%;
 241         min-height: 20px;
 242         margin: 0 auto;
 243         padding: 5px 0;
 244         text-align: right;
 245         background-color: #686a6c;
 246         border-left: 1px solid black;
 247         border-right: 1px solid black;
 248 }
 249
 250 #console a.left {
 251         float: left;
 252         padding: 0 5px;
 253         font-weight: bold;
 254 }
 255
 256 #console input[type="text"], #console select {
 257         width: 255px;
 258 }
 259
 260 #console select {
 261         width: 267px;
 262         padding-bottom: 4px;
 263 }
 264
 265 #console input[type="submit"] {
 266         margin: 6px 0;
 267 }
 268
 269 #console div.button {
 270         text-align: right;
 271         margin: 3px 9px 5px 0;
 272 }
 273
 274 #bottom {
 275         max-width: 100%;
 276         min-width: 987px;
 277         height: 11px;
 278         margin: 0 auto;
 279         background: transparent url('bls_bottom.png') repeat-x top left;
 280         border-left: 1px solid black;
 281         border-right: 1px solid black;
 282         border-bottom-left-radius: 7px;
 283         border-bottom-right-radius: 7px;
 284 }
 285
 286 #message-box {
 287         border: 2px solid #a6ac00;
 288         width: 90%;
 289         padding: 8px;
 290         min-height: 200px;
 291         margin: 80px auto;
 292         -webkit-border-radius: 8px;
 293         -moz-border-radius: 8px;
 294         border-radius: 8px;
 295         background-color: #faff74;
 296 }
 297
 298 #message-box h3, #message-box h2 {
 299         margin: 20px 10px;
 300 }
 301
 302 #message-box li {
 303         margin: 10px;
 304 }
 305
 306 #message-box a {
 307         font-size: 16px;
 308         color: red;
 309         font-weight: bold;
 310         text-decoration: underline;
 311 }
 312
 313 .storage-btn, .client-btn, .media-btn, .pool-btn, .setting-btn, .job-btn, .jobrun-btn, .restore-btn {
 314         width: 74px;
 315         height: 74px;
 316         display: block;
 317         cursor: pointer;
 318         border: 0;
 319 }
 320
 321 .storage-btn {
 322         background: transparent url('storage_icon_inactive.png') no-repeat top left;
 323 }
 324
 325 .storage-btn:hover {
 326         background: transparent url('storage_icon.png') no-repeat top left;
 327 }
 328
 329 .client-btn {
 330         background: transparent url('client_icon_inactive.png') no-repeat top left;
 331 }
 332
 333 .client-btn:hover {
 334         background: transparent url('client_icon.png') no-repeat top left;
 335 }
 336
 337 .media-btn {
 338         background: transparent url('media_icon_inactive.png') no-repeat top left;
 339 }
 340
 341 .media-btn:hover {
 342         background: transparent url('media_icon.png') no-repeat top left;
 343 }
 344
 345 .pool-btn {
 346         background: transparent url('pool_icon_inactive.png') no-repeat top left;
 347 }
 348
 349 .pool-btn:hover {
 350         background: transparent url('pool_icon.png') no-repeat top left;
 351 }
 352
 353 .job-btn {
 354         background: transparent url('job_icon_inactive.png') no-repeat top left;
 355 }
 356
 357 .job-btn:hover {
 358         background: transparent url('job_icon.png') no-repeat top left;
 359 }
 360
 361 .jobrun-btn {
 362         background: transparent url('jobrun_icon_inactive.png') no-repeat top left;
 363 }
 364
 365 .jobrun-btn:hover {
 366         background: transparent url('jobrun_icon.png') no-repeat top left;
 367 }
 368
 369 .restore-btn {
 370         background: transparent url('restore_icon_inactive.png') no-repeat top left;
 371 }
 372
 373 .restore-btn:hover {
 374         background: transparent url('restore_icon.png') no-repeat top left;
 375 }
 376
 377 .setting-btn {
 378         background: transparent url('setting_icon_inactive.png') no-repeat top left;
 379 }
 380
 381 .setting-btn:hover {
 382         background: transparent url('setting_icon.png') no-repeat top left;
 383 }
 384
 385 .line {
 386         min-height: 35px;
 387         clear: both;
 388 }
 389
 390 .text {
 391         width: 240px;
 392         display: table-cell;
 393         vertical-align: middle;
 394         font-size: 14px;
 395 }
 396
 397 .field {
 398         display: table-cell;
 399 }
 400
 401 .field-full {
 402         display: block;
 403         min-height: 200px;
 404         width: 98%;
 405 }
 406
 407 .validator, .validate, .validator-block, .validator-info {
 408         color: #e3454b !important;
 409         font-size: 10pt;
 410         /*margin-left: 5px;*/
 411 }
 412
 413 .validator-info {
 414         color: white !important;
 415 }
 416
 417 .validator-block {
 418         display: block;
 419 }
 420
 421 .block {
 422         display: block !important;
 423 }
 424
 425 .validate {
 426         color: #96c600 !important;
 427 }
 428
 429 input.bbutton {
 430         font-size: 12px;
 431         vertical-align: baseline;
 432         -webkit-appearance: none;
 433         text-shadow: 0 1px 1px #7b2121;
 434         font-family: "times, serif";
 435         font-weight: 600;
 436         color: white;
 437         height: 28px;
 438         line-height: 26px;
 439         cursor: pointer;
 440         display: inline-block;
 441         width: auto;
 442         margin: 5px 8px;
 443         padding: 0 16px;
 444         min-width: 65px;
 445         border-radius: 4px;
 446         border: 1px solid #8f2626;
 447         background: #ca3838;
 448         background-image: linear-gradient(#df8989, #d03232);
 449 }
 450
 451 input.bbutton:hover {
 452         padding: 0 16px;
 453         box-shadow: inset 0 0 3px #faeded;
 454         background: #ff7474;
 455         border: 1px solid #8f2626;
 456 }
 457
 458 div.slide-window-container {
 459         width: 400px;
 460         height: 200px;
 461         font-size: 11px;
 462         font-weight: bold;
 463         background-color: rgba(255,255,255,0.3);
 464         z-index: 10;
 465         position: absolute;
 466 }
 467
 468 div.slide-window-content {
 469         height: 100%;
 470         width: 100%;
 471         border-right: 1px solid black;
 472         overflow: auto;
 473         overflow-y: auto;
 474 }
 475
 476 div.slide-window-element, div.slide-window-element:hover {
 477         float: left;
 478         width: 224px;
 479         color: white;
 480 }
 481
 482 div.slide-window-element:hover {
 483         text-decoration: underline;
 484 }
 485
 486 div.slide-window-element:hover, div.slide-window-element-detail:hover {
 487         float: left;
 488         width: 224px;
 489         background-color: #686A6C;
 490         cursor: pointer;
 491 }
 492
 493 tr.slide-window-element {
 494         background-color: #7a7a7a;
 495 }
 496
 497 tr.slide-window-element-alternating {
 498         background-color: #686A6C;
 499 }
 500
 501 tr.slide-window-element td, tr.slide-window-element-alternating td {
 502         font-style: italic;
 503         word-break: break-all;
 504         line-height: 30px;
 505 }
 506
 507 tr.slide-window-element:hover, tr.slide-window-element-alternating:hover {
 508         float: none;
 509         cursor: pointer;
 510 }
 511
 512 tr.slide-window-element:hover td, tr.slide-window-element-alternating:hover td {
 513         background-color: #aeb2b6;
 514 }
 515
 516 tr.slide-window-element img, tr.slide-window-element-alternating img {
 517         float: right;
 518 }
 519
 520 table.window-section-detail, table.window-section-detail-smallrow, table.file-browser-detail {
 521         background-color: rgba(0,0,0,0.5);
 522         width: 100%;
 523         font-size: 10px;
 524         font-weight: normal;
 525 }
 526
 527 table.window-section-detail th, table.window-section-detail-smallrow th, table.file-browser-detail th {
 528         background-color: black;
 529         color: white;
 530 }
 531 table.window-section-detail-smallrow td {
 532         line-height: 15px;
 533 }
 534
 535 table.file-browser-detail {
 536         border-spacing: 0;
 537 }
 538
 539 tr.file-browser-element {
 540         background-color: white;
 541         color: black;
 542 }
 543
 544 tr.file-browser-element td {
 545         font-style: italic;
 546         min-height: 36px;
 547         vertical-align: middle;
 548 }
 549
 550 tr.file-browser-element td:hover {
 551         cursor: move;
 552 }
 553
 554 tr.file-browser-element td:hover {
 555         background-color: #aeb2b6;
 556 }
 557
 558 .draggable {
 559         cursor: move;
 560         min-height: 30px;
 561 }
 562
 563 div.slide-window-bar {
 564         background: transparent url('panel-border-btns.png') no-repeat top right;
 565         text-align: center;
 566         font-size: 10px;
 567         height: 14px;
 568         width: 100%;
 569         padding-right: 1px;
 570         clear: both;
 571 }
 572
 573 div.slide-window-bar-title {
 574         background: transparent url('panel-border-bg.png') repeat-x top left;
 575         height: 14px;
 576         margin-right: 51px;
 577         padding-top: 3px;
 578         -webkit-touch-callout: none;
 579         -webkit-user-select: none;
 580         -khtml-user-select: none;
 581         -moz-user-select: none;
 582         -ms-user-select: none;
 583         user-select: none;
 584         cursor: default;
 585 }
 586
 587 div.slide-window-close, div.slide-window-fullsize, div.slide-window-sort {
 588         width: 12px;
 589         height: 14px;
 590         position: relative;
 591         top: -14px;
 592         float: right;
 593         cursor: pointer;
 594 }
 595
 596 div.slide-window-close {
 597         right: 9px;
 598 }
 599
 600 div.slide-window-fullsize {
 601         right: 10px;
 602 }
 603
 604 div.slide-window-sort {
 605         right: 14px;
 606 }
 607
 608 div.slide-window-toolbar, div.slide-window-actions {
 609         height: 90px;
 610         width: 240px;
 611         z-index: 25;
 612         position: absolute;
 613         margin: 0;
 614         padding: 0;
 615         bottom: 0;
 616         right: 0;
 617         border-top-left-radius: 5px;
 618         border-left: 1px solid black;
 619         border-top: 1px solid black;
 620         background-color: rgba(0,0,0,0.7);
 621 }
 622
 623 div.slide-window-toolbar table {
 624         width: 220px;
 625         border-spacing: 6px;
 626         font-size: 11px;
 627 }
 628
 629 div.slide-window-toolbar table td input[type="radio"] {
 630         vertical-align: text-bottom;
 631 }
 632
 633 div.slide-window-toolbar table select,div.slide-window-toolbar table input {
 634         font-size: 11px;
 635         padding: 0;
 636 }
 637
 638 div.slide-window-toolbar table input[type="text"] {
 639         width: 123px;
 640 }
 641 div.slide-window-actions {
 642         width: 220px;
 643         height: 110px;
 644 }
 645
 646 div.slide-window-actions table {
 647         width: 100%;
 648         font-size: 12px;
 649         padding: 10px;
 650 }
 651
 652 div.configuration-window-content {
 653         padding: 10px 12px;
 654         width: 96%;
 655 }
 656
 657 div.slide-window-options {
 658         height: 36px;
 659         width: 36px;
 660         z-index: 20;
 661         position: absolute;
 662         margin: 0;
 663         padding: 0;
 664         bottom: 0;
 665         right: 0;
 666         border: 0;
 667         background: transparent url('gear-icon-alpha.png') no-repeat left 0;
 668 }
 669
 670 div.slide-window-options:hover {
 671         cursor: pointer;
 672         background: transparent url('gear-icon.png') no-repeat left 0;
 673 }
 674 div.status-bar-append, div.status-bar-full, div.status-bar-used, div.status-bar-error, div.status-bar-purged, div.status-bar-recycle, div.status-bar-busy, div.status-bar-disabled, div.status-bar-archive, div.status-bar-cleaning, div.status-bar-read-only, div.status-bar-detail-append, div.status-bar-detail-full, div.status-bar-detail-used, div.status-bar-detail-error, div.status-bar-detail-purged, div.status-bar-detail-recycle, div.status-bar-detail-busy, div.status-bar-detail-disabled, div.status-bar-detail-archive, div.status-bar-detail-cleaning, div.status-bar-detail-read-only {
 675         position: relative;
 676         border: 1px solid black;
 677         min-width: 40px;
 678         height: 20px;
 679         line-height: 20px;
 680         float: right;
 681         font-size: 7px;
 682         font-weight: bold;
 683         margin: 4px 6px 4px 0;
 684         -webkit-border-radius: 4px;
 685         -moz-border-radius: 4px;
 686         border-radius: 4px;
 687         text-align: center;
 688 }
 689
 690 div.status-bar-append, div.status-bar-detail-append {
 691         background-color: green;
 692 }
 693
 694 div.status-bar-full, div.status-bar-used, div.status-bar-detail-full, div.status-bar-detail-used {
 695         background-color: orange;
 696 }
 697
 698 div.status-bar-purged, div.status-bar-recycle, div.status-bar-detail-purged, div.status-bar-detail-recycle {
 699         background-color: yellow;
 700         color: black;
 701 }
 702
 703 div.status-bar-error, div.status-bar-detail-error {
 704         background-color: red;
 705 }
 706
 707 div.status-bar-busy, div.status-bar-detail-busy {
 708         background-color: pink;
 709 }
 710
 711 div.status-bar-archive, div.status-bar-disabled, div.status-bar-detail-archive, div.status-bar-detail-disabled {
 712         background-color: gray;
 713         color: black;
 714 }
 715
 716 div.status-bar-cleaning, div.status-bar-detail-cleaning {
 717         background-color: blue;
 718 }
 719
 720 div.status-bar-read-only, div.status-bar-detail-read-only {
 721         background-color: white;
 722         color: black;
 723 }
 724
 725 div.status-bar-detail-append, div.status-bar-detail-full, div.status-bar-detail-used, div.status-bar-detail-error, div.status-bar-detail-purged, div.status-bar-detail-recycle, div.status-bar-detail-busy, div.status-bar-detail-disabled, div.status-bar-detail-archive, div.status-bar-detail-cleaning, div.status-bar-detail-read-only {
 726         float: none;
 727         margin: 0 auto;
 728 }
 729
 730 /* JOB STATES */
 731
 732 div.job-status-C, div.job-status-R, div.job-status-B, div.job-status-T, div.job-status-W, div.job-status-E, div.job-status-e, div.job-status-f, div.job-status-D, div.job-status-A, div.job-status-I, div.job-status-F, div.job-status-S, div.job-status-m, div.job-status-M, div.job-status-s, div.job-status-j, div.job-status-c, div.job-status-d, div.job-status-t, div.job-status-p, div.job-status-i, div.job-status-a, div.job-status-l, div.job-status-L {
 733         border: 1px solid black;
 734         min-width: 52px;
 735         height: 20px;
 736         line-height: 20px;
 737         font-size: 9px;
 738         font-weight: bold;
 739         margin: 4px auto;
 740         -webkit-border-radius: 4px;
 741         -moz-border-radius: 4px;
 742         border-radius: 4px;
 743         text-align: center;
 744         background-color: black;
 745         color: white;
 746 }
 747
 748 div.job-status-C {
 749         background-color: #7A5DC7;
 750 }
 751
 752 div.job-status-A {
 753         background-color: yellow;
 754         color: black;
 755 }
 756
 757 div.job-status-R {
 758         background-color: #E9AB17;
 759         color: black;
 760 }
 761
 762 div.job-status-B, div.job-status-E, div.job-status-e, div.job-status-f, div.job-status-I {
 763         background-color: red;
 764 }
 765
 766 div.job-status-T {
 767         background-color: #347235;
 768 }
 769
 770 div.job-status-W {
 771         background-color: #C68E17;
 772 }
 773
 774 div.job-status-D {
 775         background-color: #CB4A2C;
 776 }
 777
 778 /*
 779 div.job-status-F, div.job-status-S, div.job-status-m, div.job-status-M, div.job-status-s, div.job-status-j, div.job-status-c, div.job-status-d, div.job-status-t, div.job-status-p {
 780         background-color: #657383;
 781 }
 782
 783 div.job-status-i, div.job-status-a, div.job-status-l, div.job-status-L {
 784         background-color: #151B54;
 785 }*/
 786
 787
 788 /* END JOB STATES */
 789
 790 div.window-section {
 791         border-bottom: 1px solid white;
 792         border-top: 1px solid white;
 793         background-color: rgba(0,0,0,0.5);
 794         width: 100%;
 795         height: 25px;
 796         clear: both;
 797         padding-top: 6px;
 798         font-size: 13px;
 799 }
 800
 801 div.window-section span {
 802         padding-left: 12px;
 803 }
 804
 805 div.button, div.button_line {
 806         text-align: right;
 807         margin: 3px 2px 5px 0;
 808 }
 809
 810 div.button_line {
 811         display: inline;
 812 }
 813
 814 div.button-center {
 815         text-align: center;
 816         margin: 5px 0;
 817 }
 818
 819 .txt-noshadow {
 820         text-shadow: none;
 821 }
 822
 823 .box-noshadow {
 824         box-shadow: none;
 825 }
 826
 827 input.validation-error {
 828         border-color: red !important;
 829 }
 830
 831 span.validation-error-summary {
 832         font-size: 12px;
 833         line-height: 12px;
 834         color: rgb(255, 187, 187) !important;
 835 }
 836
 837 textarea.console {
 838         width: 98%;
 839         height: 200px;
 840         display: block;
 841         margin: 5px auto;
 842         font-size: 10px;
 843 }
 844
 845 .bold {
 846         font-weight: bold;
 847 }
 848
 849 .italic {
 850         font-style: italic;
 851 }
 852
 853 .center {
 854         text-align: center !important;
 855 }
 856
 857 .left {
 858         text-align: left !important;
 859 }
 860
 861 .right {
 862         text-align: right;
 863 }
 864
 865 #console_launcher, #volumes_tools_launcher, #logging, #clear_bvfs_cache {
 866         padding: 0 5px;
 867 }
 868
 869 #console_launcher span, #volumes_tools_launcher span, #logging label, #clear_bvfs_cache label {
 870         padding: 0 5px;
 871         font-family: monospace;
 872         font-size: 11px;
 873 }
 874
 875 #logging input[type="checkbox"], #logging label, #clear_bvfs_cache label{
 876         cursor: pointer;
 877 }
 878
 879 #logging input[type="checkbox"], #clear_bvfs_cache input[type="image"] {
 880         vertical-align: middle;
 881         border: 0;
 882 }
 883
 884 .description {
 885         display: inline-block;
 886         font-style: italic;
 887         font-size: 12px;
 888         padding: 4px 0;
 889 }
 890
 891 fieldset {
 892         margin-bottom: 15px;
 893         font-size: 14px;
 894 }
 895
 896 fieldset .line {
 897         min-height: initial;
 898         height: 25px;
 899 }
 900
 901 fieldset .text {
 902         width: 250px;
 903 }
 904
 905 legend {
 906         font-size: 12px;
 907         font-weight: bold;
 908         color: white;
 909 }
 910
 911 img {
 912         vertical-align: middle;
 913         border: none;
 914 }
 915
 916 h4 {
 917         margin: 6px 0;
 918 }
 919
 920 hr.tabs {
 921         margin-top: 0;
 922         background-color: black; /* Firefox and Opera */
 923         border-color: black; /* Chrome and Safari */
 924         color: black; /* IE 7+ */
 925         clear: both;
 926 }
 927
 928 span.tab, span.tab_active {
 929         font-size: 13px;
 930         font-weight: bold;
 931         text-align: center;
 932         width: 130px;
 933         background-color: rgb(115, 143, 172);
 934         border-top-left-radius: 5px;
 935         border-top-right-radius: 5px;
 936         border-left: 1px solid black;
 937         border-right: 1px solid black;
 938         border-top: 1px solid black;
 939         padding: 4px;
 940         cursor: pointer;
 941 }
 942
 943 span.tab_active {
 944         background-color: rgb(163, 180, 197);
 945 }
 946
 947 #graphs, #dashboard, #config, #users {
 948         min-width: 954px;
 949         max-width: 100%;
 950         padding: 10px;
 951         margin: 0 auto;
 952         font-size: 11px;
 953         background-color: #585758;
 954         border-right: 1px solid black;
 955         overflow: auto;
 956 }
 957
 958 #users input {
 959         height: 9px;
 960         margin: 0 4px;
 961         font-size: 10px;
 962         vertical-align: super;
 963 }
 964
 965 #graphs span {
 966         margin: 0 3px;
 967 }
 968
 969 #config {
 970         padding: 0;
 971         height: auto !important;
 972         min-height: 600px;
 973 }
 974
 975 #legend {
 976         border: 1px solid white;
 977         margin: 7px;
 978         padding: 8px;
 979 }
 980
 981 #legend table td {
 982         color: white;
 983 }
 984
 985 #graphs_content {
 986         margin: 0 auto;
 987         width: 98%;
 988         height: 425px;
 989 }
 990
 991 .dashboard_graph {
 992         height: 450px;
 993         text-align: center;
 994         font-size: 12px;
 995         color: white;
 996         font-weight: bold;
 997         float: right;
 998 }
 999
1000 #dashboard_icons  {
1001         min-width: 500px;
1002         min-height: 600px;
1003 }
1004
1005 .dashboard_field {
1006         max-width: 450px;
1007         min-width: 320px;
1008         height: 86px;
1009         margin: 4px;
1010         border-radius: 5px;
1011         float: left;
1012 }
1013
1014 .dashboard_field img {
1015         float: left;
1016 }
1017
1018 .dashboard_field p {
1019         font-size: 10px;
1020         margin-top: 5px;
1021 }
1022
1023 .dashboard_field p span:nth-of-type(1) {
1024         display: inline-block;
1025         width: 122px;
1026 }
1027
1028 .dashboard_field p span:nth-of-type(2) {
1029         font-size: 12px;
1030         padding-left: 5px;
1031         font-weight: bold;
1032 }
1033
1034 .dashboard_field a {
1035         text-decoration: underline;
1036 }
1037
1038 #config_submenu {
1039         min-width: 300px;
1040         height: 22px;
1041         position: absolute;
1042         top: 59px;
1043         right: 8px;
1044         border-bottom-left-radius: 5px;
1045         border-left: 1px solid black;
1046         border-bottom: 1px solid black;
1047         background-color: rgba(0, 0, 0, 0.7);
1048 }
1049
1050 #config_submenu span {
1051         display: inline-block;
1052         margin: 0 5px;
1053         padding: 5px 0;
1054 }
1055
1056 #config_submenu span:nth-of-type(1) {
1057         font-weight: bold;
1058 }
1059
1060 .config_lines {
1061         width: 590px;
1062         float: left;
1063 }
1064
1065
1066 .config_lines div.field {
1067         width: 280px !important;
1068 }
1069
1070 #config_fields {
1071         width: 732px;
1072         margin: 0 auto;
1073         padding-top: 7px;
1074 }
1075
1076 #config_fields div.button {
1077         padding-left: 247px;
1078 }
1079
1080 fieldset.config_field {
1081         width: 667px;
1082 }
1083
1084 fieldset.config_field .line {
1085         height: auto;
1086         min-height: 35px !important;
1087         padding-top: 2px;
1088         padding-bottom: 2px;
1089 }
1090
1091 span.config_test_loader, span.config_test_result {
1092         line-height: 75px;
1093 }
1094
1095 #jobs_summary_graph {
1096         width: 380px;
1097         height: 380px;
1098 }
1099
1100 #jobs_to_view {
1101         width: 240px;
1102         margin: 0 2px 0 5px;
1103 }
1104
1105 #users_list {
1106         width: 890px;
1107         font-size: 13px;
1108 }
1109
1110 #users_list td {
1111         font-style: normal;
1112         padding: 3px 5px;
1113 }
1114
1115 #users_list td:nth-of-type(1) {
1116         font-weight: bold;
1117 }
1118
1119 #users_list tr {
1120         cursor: initial;
1121 }
1122
1123 #users_list td:nth-of-type(1) {
1124         width: 200px;
1125         text-align: center;
1126 }
1127
1128 #users_list td:nth-of-type(3) {
1129         text-align: center;
1130 }
1131
1132 #users_list td:nth-of-type(4) {
1133         width: 340px;
1134 }
1135
1136 #users_list img {
1137         float: none;
1138 }
1139
1140 /* Overwrite date picker classes */
1141 .TDatePicker_default {
1142         z-index: 20;
1143 }
1144 .TDatePicker_default .date {
1145         color: blue;
1146 }
1147 .TDatePicker_default .selected {
1148         color: white;
1149 }
1150
1151 th.weekDayHead {
1152         color: black;
1153         border: 1px solid #919EA9;
1154 }
1155
1156 label.normal {
1157         font-size: 15px;
1158 }
1159
1160 /* END - Overwrite date picker classes */
1161
1162 /* API server OAuth2 progress bar */
1163
1164 #progress_label {
1165         position: absolute;
1166         top: 116px;
1167         transform: translate(-50%, -50%);
1168         font-weight: bold;
1169 }
1170
1171 #api_command {
1172         border-radius: 5px;
1173         height: 26px;
1174         width: 617px;
1175         font-size: 25px;
1176         color: #444444;
1177         padding: 9px 10px 2px 9px;
1178 }
1179
1180 #api_output {
1181         margin-top: 20px;
1182         border-radius: 6px;
1183         border: 1px solid white;
1184         width: 75%;
1185 }
1186
1187 #api_result {
1188         margin: 0 auto;
1189         white-space: pre-wrap;
1190         word-wrap: break-word;
1191         font-size: 13px;
1192 }
1193
1194 .api_button, .api_select {
1195         font-weight: bold;
1196         border: 1px solid #212121;
1197         border-radius: 4px;
1198         height: 37px;
1199         display: inline-block;
1200         vertical-align: super;
1201 }
1202
1203 .api_button {
1204         color: #1a1b1d;
1205         background-color: #ffeb3b;
1206 }
1207
1208 .api_button:hover {
1209         color: black;
1210         background-color: white;
1211         cursor: pointer;
1212         transition: all 0.3s linear;
1213 }
1214
1215 #api_refresh {
1216         margin-left: 10px;
1217         cursor: pointer;
1218 }
1219
1220 /**
1221  * Override jQuery-UI theming.
1222  */
1223
1224 .ui-widget-content td a, .ui-widget-content div a {
1225         color: white !important;
1226         text-decoration: underline;
1227 }
1228
1229 .ui-tabs .ui-tabs-panel {
1230         background-color: #444445;
1231         color: white;
1232         font-size: 15px;
1233 }
1234
1235 .tab-grid {
1236         border-spacing: 0;
1237 }
1238
1239 .tab-grid td  {
1240         border-top: 1px solid white;
1241         padding: 8px;
1242 }
1243
1244 .error {
1245         color: red;
1246 }
1247
1248 /* START Overwrite opentip styles */
1249 .ot-header h1 {
1250         font-size: 16px;
1251         word-wrap: break-word;
1252 }
1253 /* END Overwrite opentip styles */
1254
1255 .auth_setting {
1256         width: 660px;
1257         margin: 0 auto;
1258 }
1259
1260 #config .auth_setting {
1261         margin: 0 !important;
1262 }