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