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