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