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 }
  16
  17 h1 {
  18     border-bottom:1px solid #DDDDDD;
  19     padding:0 0 0 0;
  20     margin:15px 0 15px 0;
  21     font-size:14pt;
  22 }
  23 h1 img {
  24     vertical-align:middle;
  25     margin-bottom:4px;
  26     margin-right:10px;
  27 }
  28 h2 {
  29     font-size:14pt;
  30     color:#333333;
  31 }
  32 h3 {
  33     font-size:13pt;
  34     color:#201E62;
  35 }
  36 input[type=text], input[type=password], input[type=email],input[type=number], select, option {
  37     min-width:260px;
  38     padding:6px;
  39     border:1pt solid #22606D;
  40     vertical-align:bottom;
  41     border-radius:0;
  42 }
  43
  44 textarea {
  45     padding:6px;
  46     border:1pt solid #22606D !important;
  47     border-radius:0 !important;
  48 }
  49
  50 span.label {
  51     font-size:11pt;
  52     color:gray;
  53     font-weight:normal;
  54     padding:0;
  55 }
  56 div.el {
  57     padding-bottom:15px;
  58 }
  59 div.breadcrumbs {
  60     margin:15px 0;
  61     color:gray;
  62     font-size:10pt;
  63 }
  64 /* buttons */
  65 button.btn, input.btn {
  66     padding:6px 10px;
  67     border-radius:5px;
  68     font-size:10pt;
  69     font-weight:normal;
  70 }
  71 button.btn span.glyphicon {
  72     margin-right:6px;
  73 }
  74 button.btn-default {
  75     border-bottom:3px solid #cccccc;
  76 }
  77 button.btn-default:hover {
  78     background-color:white;
  79     border:1px solid #ADADAD;
  80     border-bottom:3px solid #ADADAD;
  81 }
  82 button.btn-default:active {
  83     background-color:white;
  84     border:1px solid #ADADAD;
  85     border-bottom:1px solid #ADADAD;
  86     margin-top:2px;
  87     box-shadow:none;
  88 }
  89 button.btn-primary {
  90     border-bottom:3px solid #3071A9;
  91 }
  92 button.btn-primary:hover {
  93     box-shadow:none;
  94     background-color:#428bca;
  95     border:1px solid #357ebd;
  96     border-bottom:3px solid #3071A9;
  97 }
  98 button.btn-primary:active {
  99     box-shadow:none;
 100     border-bottom:1px solid #3071A9;
 101     margin-top:2px;
 102 }
 103 button.btn-danger {
 104     border-bottom:3px solid #A13F3A;
 105 }
 106 button.btn-danger:hover {
 107     box-shadow:none;
 108     background-color:#d9534f;
 109     border:1px solid #d43f3a;
 110     border-bottom:3px solid #A13F3A;
 111 }
 112 button.btn-danger:active {
 113     border:1px solid #d43f3a;
 114     box-shadow:none;
 115     margin-top:2px;
 116 }
 117 button.btn-onelab, input.btn-onelab {
 118     border:0;
 119     border-bottom:3px solid #760073;
 120     background-color:#302562;
 121     color:white;
 122 }
 123 button.btn-onelab:hover, input.btn-onelab:hover {
 124     border:0;
 125     border-bottom:3px solid #760073;
 126     background-color:#302562;
 127     color:white;
 128 }
 129 button.btn-onelab:active, input.btn-onelab:active {
 130     box-shadow:none;
 131     border-bottom:1px solid #760073;
 132     margin-top:2px;
 133 }
 134 /***** Notifications *****/
 135 .warning {
 136     border: 1px solid red;
 137     margin: 20px 60px;
 138     padding: 10px 20px;
 139     color: red;
 140     background-color: #f2dbdb;
 141     text-align: center;
 142 }
 143
 144 /* HOME DASHBOARD */
 145 div#home-dashboard {
 146     color:black;
 147     margin:0 auto 25px auto;
 148 }
 149 div#home-dashboard table {
 150     margin:25px;
 151     width:100%;
 152 }
 153 div#home-dashboard table td {
 154     text-align:center;
 155     padding:15px 0;
 156     width:33%;
 157 }
 158 div#home-dashboard table tr:first-child td {
 159     font-size:12pt;
 160     font-weight:bold;
 161     color:#270A5A;
 162 }
 163 div#home-dashboard table tr:last-child td {
 164     vertical-align:top;
 165     padding:25px 0;
 166 }
 167 div#home-dashboard table tr:last-child td.logged-in {
 168     border-right:1px solid #DDDDDD;
 169     padding:25px;
 170 }
 171 div#home-dashboard table tr:last-child td.support {
 172     border-left:1px solid #DDDDDD;
 173     padding:25px;
 174 }
 175 div#home-dashboard table tr:last-child td:first-child {
 176 }
 177 div#home-dashboard table tr:last-child td:last-child {
 178     border-right:0;
 179 }
 180 div#home-dashboard table tr:last-child td.logged-in div {
 181     text-align:left;
 182     padding:25px 0;
 183 }
 184 div#home-dashboard table tr:last-child td.support div {
 185     text-align:left;
 186     padding:25px 0;
 187 }
 188 div#home-dashboard div.login-widget {
 189     padding:20px;
 190 }
 191 div#home-dashboard table td.support {
 192 }
 193 div#home-dashboard table td.support a {
 194 }
 195 div#home-dashboard table td.support a:hover {
 196     text-decoration:none;
 197 }
 198
 199 div#home-dashboard div#manager {
 200     display:none;
 201 }
 202
 203 div#home-dashboard div#home-slice-list {
 204     margin:25px 0;
 205     padding:0 25px;
 206     text-align:left;
 207 }
 208 div#home-dashboard div#home-slice-list ul {
 209     list-style: none;
 210     padding:0;
 211     margin:0;
 212 }
 213 div#home-dashboard div#home-slice-list li {
 214
 215 }
 216
 217 /**/
 218
 219 /**/
 220 /* WELL */
 221 div.well {
 222 }
 223 /**/
 224 /* TABLE */
 225 table.table {
 226     margin:0;
 227 }
 228 table.table thead {
 229     padding:0;
 230 }
 231 table.table tbody {
 232     padding:0;
 233 }
 234 table.table tr {
 235     padding:0;
 236 }
 237 table.table td {
 238     padding:0;
 239 }
 240 /* INSTITUTION */
 241 div#institution {
 242     color:black;
 243 }
 244 .form-hint {
 245     font-size:11pt;
 246     font-style:italic;
 247     color:gray;
 248 }
 249
 250
 251 .form-hint {
 252     font-size:11pt;
 253     font-style:italic;
 254     color:gray;
 255 }
 256
 257
 258
 259 /* TICKET REQUEST */
 260 div#ticket-request {
 261     color:black;
 262 }
 263 .form-hint {
 264     font-size:11pt;
 265     font-style:italic;
 266     color:gray;
 267 }
 268 div#ticket-request p {
 269     margin:20px 0;
 270 }
 271
 272 ul.nav-tabs {
 273     margin:0 0 15px 0;
 274 }
 275 ul.nav-tabs ul {}
 276 ul.nav-tabs li {}
 277
 278 ul.nav-section li a {
 279     color:black;
 280     border-bottom:0;
 281 }
 282 ul.nav-section li:first-child {
 283     padding:0;
 284 }
 285 ul.nav-section li:first-child a {
 286 }
 287 ul.nav-section li:first-child.active a {
 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 }