portal/static/css/smartfire.css

   1 @import url("../fonts/opensans_bold_macroman/stylesheet.css");
   2
   3 html { height: 100% }
   4
   5 body {
   6     background-color:white;
   7     color:black;
   8     margin:0;
   9     padding:0;
  10     height: 100%;
  11     letter-spacing:0.3px;
  12 }
  13 a, a:active, a:focus {
  14     outline: 0;
  15     text-decoration:none;
  16     color:#FF4400;
  17 }
  18 a:hover {
  19     color:#0D0049;
  20 }
  21
  22 a.current {
  23     text-decoration:underline;
  24     color:#333333;
  25 }
  26 p.command {
  27     padding:15px;
  28     margin:15px 0;
  29     color:#890000;
  30     background-color:#E0E0E0;
  31     font-family:Courier, monospace;
  32 }
  33 h1 {
  34     border-bottom:1px solid #DDDDDD;
  35     padding:0 0 0 0;
  36     margin:15px 0 15px 0;
  37     font-size:14pt;
  38 }
  39 h1 img {
  40     vertical-align:middle;
  41     margin-bottom:4px;
  42     margin-right:10px;
  43 }
  44 h2 {
  45     margin:0 0 15px 0;
  46     font-size:14pt;
  47     color:#333333;
  48 }
  49 h3 {
  50     margin:0 0 5px 0;
  51     font-size:13pt;
  52     color:#201E62;
  53 }
  54 h4 {
  55     margin:0 0 5px 0;
  56     font-size:12pt;
  57     color:#333333;
  58 }
  59 span.subtitle {
  60     color:#454545;
  61     font-size:9pt;
  62     font-weight:normal;
  63     text-transform:uppercase;
  64 }
  65 span.small {
  66     font-size:9pt;
  67 }
  68 span.gray {
  69     color:gray;
  70 }
  71 span.type {
  72     color:#201E62;
  73     font-weight:bold;
  74     font-size:9pt;
  75 }
  76 span.htitle {
  77     color:#454545;
  78     font-size:9pt;
  79     font-weight:normal;
  80 }
  81 span.version {
  82     font-size:8pt;
  83     color:#888888;
  84 }
  85 input[type=text], input[type=password], input[type=email], input[type=tel], input[type=number], select, option {
  86     min-width:260px;
  87     padding:6px;
  88     border:1pt solid #22606D;
  89     vertical-align:bottom;
  90     border-radius:0;
  91 }
  92
  93 textarea {
  94     padding:6px;
  95     border:1pt solid #22606D !important;
  96     border-radius:0 !important;
  97 }
  98
  99 span.label {
 100     font-size:11pt;
 101     color:gray;
 102     font-weight:normal;
 103     padding:0;
 104 }
 105 div.el {
 106     padding-bottom:15px;
 107 }
 108 div.breadcrumbs {
 109     margin:15px 0;
 110     color:gray;
 111     font-size:10pt;
 112 }
 113 div.breadcrumbs a {
 114     color:gray;
 115 }
 116 div.breadcrumbs a:hover {
 117     text-decoration:underline;
 118 }
 119 .tab-pane {
 120     padding-top:15px;
 121 }
 122 /* buttons */
 123 button.btn, input.btn {
 124     padding:6px 10px;
 125     border-radius:5px;
 126     font-size:10pt;
 127     font-weight:normal;
 128 }
 129 button.btn span.glyphicon {
 130     margin-right:6px;
 131 }
 132 button.btn-default {
 133     border-bottom:3px solid #cccccc;
 134 }
 135 button.btn-default:hover {
 136     background-color:white;
 137     border:1px solid #ADADAD;
 138     border-bottom:3px solid #ADADAD;
 139 }
 140 button.btn-default:active {
 141     background-color:white;
 142     border:1px solid #ADADAD;
 143     border-bottom:1px solid #ADADAD;
 144     margin-top:2px;
 145     box-shadow:none;
 146 }
 147 button.btn-primary {
 148     border-bottom:3px solid #3071A9;
 149 }
 150 button.btn-primary:hover {
 151     box-shadow:none;
 152     background-color:#428bca;
 153     border:1px solid #357ebd;
 154     border-bottom:3px solid #3071A9;
 155 }
 156 button.btn-primary:active {
 157     box-shadow:none;
 158     border-bottom:1px solid #3071A9;
 159     margin-top:2px;
 160 }
 161 button.btn-danger {
 162     border-bottom:3px solid #A13F3A;
 163 }
 164 button.btn-danger:hover {
 165     box-shadow:none;
 166     background-color:#d9534f;
 167     border:1px solid #d43f3a;
 168     border-bottom:3px solid #A13F3A;
 169 }
 170 button.btn-danger:active {
 171     border:1px solid #d43f3a;
 172     box-shadow:none;
 173     margin-top:2px;
 174 }
 175 button.btn-onelab, input.btn-onelab {
 176     border:0;
 177     border-bottom:3px solid #FFA315;
 178     background-color:#FFA315;
 179     color:white;
 180 }
 181 button.btn-onelab:hover, input.btn-onelab:hover {
 182     border:0;
 183     border-bottom:3px solid #FF7E00;
 184     background-color:#FF7E00;
 185     color:white;
 186 }
 187 button.btn-onelab:active, input.btn-onelab:active {
 188     box-shadow:none;
 189     border-bottom:1px solid #760073;
 190     margin-top:2px;
 191 }
 192
 193 .container-resource button {
 194     padding:2px 4px;
 195     border-radius:3px;
 196     font-size:9pt;
 197     font-weight:normal;
 198 }
 199 .container-resource select,.container-resource option, .container-resource input {
 200     padding:2px 4px;
 201     font-size:9pt;
 202 }
 203 .badge {
 204     font-size:9pt;
 205     margin-left:4px;
 206 }
 207 /***** Notifications *****/
 208 .warning {
 209     border: 1px solid red;
 210     margin: 20px 60px;
 211     padding: 10px 20px;
 212     color: red;
 213     background-color: #f2dbdb;
 214     text-align: center;
 215 }
 216
 217 /* HOME DASHBOARD */
 218 div#home-dashboard {
 219     color:black;
 220     margin:0 auto 25px auto;
 221 }
 222 div#home-dashboard table {
 223     margin:25px;
 224     width:100%;
 225 }
 226 div#home-dashboard table td {
 227     text-align:center;
 228     padding:15px 0;
 229     width:33%;
 230 }
 231 div#home-dashboard table tr:first-child td {
 232     font-size:12pt;
 233     font-weight:bold;
 234     color:#270A5A;
 235 }
 236 div#home-dashboard table tr:last-child td {
 237     vertical-align:top;
 238     padding:25px 0;
 239 }
 240 div#home-dashboard table tr:last-child td.logged-in {
 241     border-right:1px solid #DDDDDD;
 242     padding:25px;
 243 }
 244 div#home-dashboard table tr:last-child td.support {
 245     border-left:1px solid #DDDDDD;
 246     padding:25px;
 247 }
 248 div#home-dashboard table tr:last-child td:first-child {
 249 }
 250 div#home-dashboard table tr:last-child td:last-child {
 251     border-right:0;
 252 }
 253 div#home-dashboard table tr:last-child td.logged-in div {
 254     text-align:left;
 255     padding:25px 0;
 256 }
 257 div#home-dashboard table tr:last-child td.support div {
 258     text-align:left;
 259     padding:25px 0;
 260 }
 261 div#home-dashboard div.login-widget {
 262     padding:20px;
 263 }
 264 div#home-dashboard table td.support {
 265 }
 266 div#home-dashboard table td.support a {
 267 }
 268 div#home-dashboard table td.support a:hover {
 269     text-decoration:none;
 270 }
 271
 272 div#home-dashboard div#manager {
 273     display:none;
 274 }
 275
 276 div#home-dashboard div#home-slice-list {
 277     margin:25px 0;
 278     padding:0 25px;
 279     text-align:left;
 280 }
 281 div#home-dashboard div#home-slice-list ul {
 282     list-style: none;
 283     padding:0;
 284     margin:0;
 285 }
 286 div#home-dashboard div#home-slice-list li {
 287
 288 }
 289
 290 /**/
 291
 292 /**/
 293 /* WELL */
 294 div.well {
 295 }
 296 /**/
 297 /* TABLE */
 298 table.table {
 299     margin:0;
 300 }
 301 table.table thead {
 302     padding:0;
 303 }
 304 table.table tbody {
 305     padding:0;
 306 }
 307 table.table tr {
 308     padding:0;
 309 }
 310 table.table td {
 311     padding:0;
 312 }
 313 /* INSTITUTION */
 314 div#institution {
 315     color:black;
 316 }
 317 .form-hint {
 318     font-size:11pt;
 319     font-style:italic;
 320     color:gray;
 321 }
 322
 323
 324 .form-hint {
 325     font-size:11pt;
 326     font-style:italic;
 327     color:gray;
 328 }
 329
 330
 331
 332 /* TICKET REQUEST */
 333 div#ticket-request {
 334     color:black;
 335 }
 336 .form-hint {
 337     font-size:11pt;
 338     font-style:italic;
 339     color:gray;
 340 }
 341 div#ticket-request p {
 342     margin:20px 0;
 343 }
 344
 345 ul.nav-tabs {
 346     margin:0 0 15px 0;
 347 }
 348 ul.nav-tabs ul {}
 349 ul.nav-tabs li {}
 350
 351 ul.nav-section li a {
 352     color:black;
 353     border-bottom:0;
 354 }
 355 ul.nav-section li:first-child {
 356     padding:0;
 357 }
 358 ul.nav-section li:first-child a {
 359 }
 360 ul.nav-section li:first-child.active a {
 361 }
 362
 363 ul.nav-resources {
 364     margin:15px 0;
 365 }
 366 ul.nav-resources a {
 367     padding: 4px 10px 5px 10px;
 368 }
 369
 370 /* SLICE VIEW */
 371 div.container-resource, div.container-slice {
 372     padding-right:15px;
 373     padding-left:15px;
 374 }
 375 .table th {
 376     border-top:0 !important;
 377 }
 378 div#slice-view {
 379     margin:0;
 380 }
 381 div.list-group-item {
 382     border:0;
 383     -moz-border-radius: 0;
 384     border-radius: 0;
 385     background-color:white;
 386     font-weight:bold;
 387     padding-left:0;
 388 }
 389 a.list-group-item {
 390     -moz-border-radius: 0;
 391     border-radius: 0;
 392     border:0;
 393     background-color:white;
 394     padding:3px 2px 3px 10px;
 395     border-left:2pt white solid;
 396 }
 397 a.list-group-item.active, a.list-group-item.active:hover, a.list-group-item.active:focus {
 398     -moz-border-radius: 0;
 399     border-radius: 0;
 400     font-weight: bold;
 401     color:black;
 402     background-color:#F5F5F5;
 403     border-left:2pt blue solid;
 404 }
 405
 406 a.list-group-item:hover {
 407     -moz-border-radius: 0;
 408     border-radius: 0;
 409     border-left:2pt blue solid;
 410 }
 411 a.list-group-item p.list-group-item-text {
 412     -moz-border-radius: 0;
 413     border-radius: 0;
 414     font-size:9pt;
 415     font-style:italic;
 416     font-weight: normal;
 417     color: black !important;
 418 }
 419
 420 span.sl-resources {
 421     font-size:9pt;
 422     color:gray;
 423 }
 424 a.sl-resources, a.sl-resources:hover {
 425     font-size:9pt;
 426     border:0;
 427     padding:2px 4px;
 428     -moz-border-radius: 4px;
 429     border-radius: 4px;
 430     width:105px;
 431     margin-left:4px;
 432     margin-bottom:8px;
 433     text-align: center;
 434 }
 435 a.sl-resources.active, a.sl-resources.active:hover, a.sl-resources.active:focus {
 436     border:0;
 437     -moz-border-radius: 4px;
 438     border-radius: 4px;
 439 }
 440 a.sl-resources:first-child {
 441     margin-left:12px;
 442 }
 443 button.btn-apply {
 444     font-size:13px;
 445     padding:2px 8px;
 446 }
 447 div#slice-info {
 448     margin-top:25px;
 449 }
 450 div#slice-info table {
 451     width:100%;
 452     margin:0 auto;
 453 }
 454 div#slice-info table td:first-child {
 455     text-align:right;
 456     font-weight:bold;
 457     padding-right:15px;
 458 }
 459 div#slice-info td {
 460     padding:5px;
 461 }
 462
 463 /* SLICE VIEW sections */
 464 .slice-sections, .slice-pending {
 465     margin:0;
 466     padding:0;
 467 }
 468 .slice-sections ul, .slice-pending ul {
 469     margin:0;
 470     padding:0;
 471 }
 472 .slice-pending ul {
 473     width:400px;
 474     margin:0 auto 15px auto;
 475 }
 476 .slice-sections li {
 477     text-align:left;
 478     margin:0;
 479     padding:0;
 480 }
 481 .slice-pending li {
 482     padding-right:15px;
 483 }
 484 .slice-sections li a, .slice-pending li a {
 485     font-size:14px;
 486     color:black;
 487     padding:0;
 488 }
 489 .slice-sections li.active a, .slice-pending li.active a  {
 490     color:#201E62;
 491     background-color:#EFEFEF;
 492     text-decoration:underline;
 493     padding:0;
 494 }
 495 .slice-sections ul.nav-pills li a:hover, .slice-pending ul.nav-pills li a:hover {
 496     text-decoration:underline;
 497     background-color:#EFEFEF;
 498     color:black;
 499 }
 500 .slice-sections ul.nav-pills li.active, .slice-pending ul.nav-pills li.active {
 501
 502 }
 503 .slice-sections li:first-child, .slice-sections li:first-child a {
 504     color:#201E62;
 505     font-weight:bold;
 506 }
 507 .slice-experiment {
 508     text-align:right;
 509     padding:0;
 510 }
 511 .slice-experiment button {
 512     margin:3px 0 0 0;
 513     background-color:#CC4125;
 514     color:white;
 515 }
 516
 517 .slice-pending {
 518 }
 519 .slice-pending button {
 520     font-size:9pt;
 521     margin:-2px 0 0 0;
 522     padding:3px 5px;
 523 }
 524 .slice-pending button.apply {
 525     font-size:14px;
 526     padding:2px 5px;
 527 }
 528 .slice-pending button.clear {
 529 }
 530 tr.active, tr.active td {
 531     background-color:#FFFFCC !important;
 532 }
 533 div.dataTables_filter label{
 534     float:left;
 535     width:400px;
 536 }
 537
 538 /* HEADER */
 539
 540
 541 .header {
 542   -moz-box-shadow:    0 0 1px rgba(82,82,82,0.6);
 543   -webkit-box-shadow: 0 0 1px rgba(82,82,82,0.6);
 544   box-shadow:         0 0 1px rgba(82,82,82,0.6);
 545   height:61px;
 546   background-color:white;
 547 }
 548
 549 div.navigation {
 550
 551 }
 552 div.navigation ul {
 553     margin:26px 0 0 0;
 554     padding:0;
 555     display: inline-block;
 556     list-style-type: none;
 557     white-space: nowrap;
 558 }
 559
 560 div.navigation li {
 561     color:#0C0047;
 562     font-family:open_sansbold, sans-serif;
 563     font-size:9pt;
 564     font-weight:normal;
 565     line-height:0.8em;
 566     letter-spacing:0.4pt;
 567     list-style:none;
 568     float:left;
 569     padding:0 15px;
 570     margin:0;
 571     text-transform:uppercase;
 572 }
 573 div.navigation li:hover {
 574 }
 575 div.navigation li a {
 576     color:#0C0047;
 577 }
 578 div.navigation li a:hover, div.navigation li a.current {
 579     color:#FF4400;
 580     text-decoration:none;
 581 }
 582
 583 div.navigation li:last-child {
 584     margin-right:0;
 585 }
 586
 587
 588 div.navigation .dropdown-menu {
 589     color:black;
 590     -moz-box-shadow:    1px 1px 0px 0 rgba(58, 48, 100,0.8);
 591     -webkit-box-shadow: 1px 1px 0px 0 rgba(58, 48, 100,0.8);
 592     box-shadow:         1px 1px 0px 0 rgba(58, 48, 100,0.8);
 593     border-radius:2px;
 594     padding:0 5px 5px 5px;
 595     margin-top:5px;
 596     margin-left:20px;
 597 }
 598 div.navigation .dropdown-menu ul {
 599     margin:0;
 600     padding:15px 5px 5px 5px;
 601     display:list-item;
 602 }
 603 div.navigation .dropdown-menu li {
 604     margin:0 10px 0 0;
 605     padding:0 0 8px 0;
 606     display:list-item;
 607     float:none;
 608     text-transform: none;
 609 }
 610
 611 div.navigation .dropdown-menu a {
 612     font-family:Helvetica,sans-serif;
 613     font-size:10pt;
 614     color:black;
 615 }
 616 div.navigation .dropdown-menu li.title {
 617     margin-bottom:10px;
 618 }
 619 div.navigation .dropdown-menu li.title a {
 620     font-family:open_sansbold, sans-serif;
 621 }
 622
 623
 624 div.navigation .dropdown-menu li:first-child {
 625     border-bottom:1px solid white;
 626     padding-bottom:5px;
 627
 628 }
 629
 630 div.secondary {
 631     text-align:right;
 632 }
 633
 634 div.secondary ul {
 635    margin:6px 0 0 0;
 636    padding:0;
 637 }
 638
 639 div.secondary li {
 640     font-size:9pt;
 641     display:inline;
 642     list-style:none;
 643     margin:0px;
 644     padding:0;
 645     margin-right:15px;
 646     color:#747474;
 647     letter-spacing:0.4px;
 648 }
 649 div.secondary li:last-child {
 650     margin-right:0;
 651 }
 652 div.secondary li a {
 653     color:#747474;
 654 }
 655 div.secondary li a:hover {
 656     text-decoration:underline;
 657 }
 658 div.secondary .button {
 659     width:300px;
 660     margin-top:15px;
 661 }
 662 div.secondary .account {
 663     margin-top:10px;
 664     padding:0;
 665     font-size:9pt;
 666     color:gray;
 667     text-align:right;
 668 }
 669 div.secondary .account span {
 670     font-size:8pt;
 671 }
 672 div.secondary .account a {
 673     color:black;
 674 }
 675
 676
 677 div.footer {
 678     padding-top:15px;
 679 }
 680 div.footer div.bottom {
 681     position:absolute;
 682     bottom:0;
 683 }
 684 div.footer ul {
 685    margin:6px 0 0 0;
 686    padding:0;
 687 }
 688
 689 div.footer li {
 690     font-size:9pt;
 691     display:inline;
 692     list-style:none;
 693     margin:0px;
 694     padding:0;
 695     margin-right:15px;
 696     color:#747474;
 697     letter-spacing:0.4px;
 698 }
 699
 700 div.footer li a {
 701     color:#747474;
 702 }
 703 div.footer li a:hover {
 704     text-decoration:underline;
 705 }
 706 div.copy {
 707     font-size:8pt;
 708     color:gray;
 709     padding-top:15px;
 710     padding-bottom:15px;
 711 }
 712
 713 div.home {
 714     font-size:11pt;
 715     line-height:1.2em;
 716     letter-spacing:0.3pt;
 717     min-height:500px;
 718     background-image: url('../img/bg-smartfire.png');
 719     background-repeat:no-repeat;
 720     background-size:cover;
 721     background-position:center top;
 722     background-color:#4FABA3;
 723     padding:100px 0;
 724 }
 725 div.home h2 {
 726     color:white;
 727     line-height:1.2em;
 728     font-size:18pt;
 729 }
 730 div.home h3 {
 731     color:white;
 732     line-height:1.4em;
 733 }
 734 div.dashboard {
 735     text-align:center;
 736 }
 737 div.dashboard div {
 738     margin:25px 0;
 739 }
 740 div.dashboard ul {
 741     text-align:left;
 742     margin-left:24px;
 743     list-style:none;
 744 }
 745 div.registration-form {
 746     padding-top:150px;
 747     text-align:center;
 748 }
 749
 750 .login-form input {
 751     width:320px;
 752 }
 753 .login-form input[type=submit] {
 754     width:108px;
 755 }
 756
 757 .login-submit {
 758     vertical-align:middle;
 759     padding:0;
 760 }
 761 .lost-password {
 762     font-size:10pt;
 763     color:black;
 764     text-align:right;
 765     padding:0px;
 766 }
 767 .lost-password a {
 768     color:white;
 769     text-shadow:0.5px 0.5px black;
 770 }
 771 .login-signup {
 772     font-size:12pt;
 773     color:white;
 774     text-shadow:0.5px 0.5px black;
 775     margin-top:45px;
 776     padding:5px 0 0 4px;
 777
 778 }
 779 .login-signup a {
 780     color:white;
 781     text-shadow:0.5px 0.5px black;
 782     padding-bottom:2px;
 783     border-bottom:2pt solid white;
 784 }
 785 .login-signup a:hover {
 786     text-decoration:none;
 787 }
 788 .login-signup button {
 789     padding:8px;
 790     border:0;
 791     border-bottom:2px solid #540086;
 792     background-color:#302562;
 793     color:white;
 794     width:100px;
 795     border-radius:5px;
 796     font-size:12pt;
 797 }
 798 div.slogan {
 799     text-align:center;
 800     color:white;
 801     text-shadow: 1px 1px #013540;
 802 }
 803
 804 th {
 805     border:0 !important;
 806 }
 807
 808 div.monitor {
 809     padding:40px 0 25px 0;
 810 }
 811 div.monitor h1 {
 812     margin-bottom:25px;
 813 }
 814 div.s-monitor {
 815     padding-bottom:25px;
 816 }
 817 span#stats-period-txt {
 818     text-transform:lowercase;
 819 }