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