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