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