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