2020/assets/css/custom.css

   1 /* General */
   2
   3 body {
   4   font-family: sans-serif;
   5   font-size: 15px;
   6   line-height: 1.428571429;
   7   color: #333333;
   8 }
   9
  10 h2 {
  11   margin-bottom: 0px;
  12   margin-top:0px;
  13   padding-top: 5px;
  14 }
  15
  16 h3  {
  17   color: rgb(70, 80, 73);
  18   font-size: 20px;
  19 }
  20
  21 .lp-logo {
  22   margin-bottom: -68px;
  23   margin-top: 10px;
  24 }
  25
  26 #lp-content { position: relative; }
  27
  28 .text-thick {
  29         font-weight: 900;
  30 }
  31
  32 .margin-top {
  33   margin-top: 22px;
  34 }
  35
  36 .word-break {
  37   word-break: break-all;
  38 }
  39
  40 /* LP Program */
  41
  42 .program-session-details-toggle-all {
  43     margin-bottom: 25px;
  44     display: none;
  45 }
  46
  47 .program-session-details-toggle-all button {
  48     font-weight: 700;
  49     position: absolute;
  50     right: 0;
  51     top: 235px;
  52 }
  53
  54 .program-session-details-toggle-all button.fixed {
  55     position: fixed;
  56     top: 50px;
  57     right: 20px;
  58 }
  59
  60 .program-day {
  61     margin-bottom: 10px;
  62 }
  63
  64 .program-day-header h2 {
  65     font-size: 2.1em;
  66     color: #204A87;
  67     padding: 0.3em;
  68     text-align: center;
  69     border-bottom: 3px solid #f5f5f5;
  70     border-radius: 5px;
  71 }
  72
  73 .program-timeslot-break {
  74     margin-bottom: 2px;
  75 }
  76
  77 .program-timeslot-break-header h2 {
  78     font-size: 1.6em;
  79     color: rgb(150, 150, 150);
  80 }
  81
  82 .program-timeslot {
  83     padding: 0.5em;
  84 }
  85
  86 .program-timeslot-header h2 {
  87     font-size: 1.6em;
  88 }
  89
  90 .program-session-header h2 {
  91     font-size: 1.3em;
  92     font-weight: 500;
  93     margin-bottom: 3px;
  94 }
  95
  96 .program-session {
  97     padding: 0.5em;
  98 }
  99
 100 .program-session button {
 101     font-size: 10px;
 102 }
 103
 104 .session-desc {
 105         border: 1px solid #DDD;
 106         padding: 0.5em;
 107         border-radius: 5px;
 108         margin-top: 5px;
 109         background: #f5f5f5;
 110 }
 111
 112 .program-session-speaker {
 113     margin: 0px 7px 0px 0px;
 114     font-style: italic;
 115 }
 116
 117 .speaker-bio {
 118   padding-bottom: 25px;
 119 }
 120
 121 .speakers-block {
 122     border-bottom: 1px solid rgb(200, 200, 200);
 123     margin-bottom: 20px;
 124 }
 125
 126 .speakers-block img {
 127         border-radius: 100%;
 128 }
 129
 130 .keynote-speakers-header {
 131     margin-bottom: 20px;
 132 }
 133
 134 .speaker-block {
 135     padding-bottom: 20px;
 136 }
 137
 138 .keynote-speaker-header h2 {
 139     font-size: 25px;
 140     padding-top: 0px;
 141 }
 142
 143 .speaker-header h2 {
 144     font-size: 20px;
 145     padding-top: 0px;
 146 }
 147
 148 .program-session-shelf {
 149     margin-top: 5px;
 150 }
 151
 152 .program-session-room-details {
 153     margin-top: 4px;
 154     display: inline;
 155 }
 156
 157 .program-session-room-details button {
 158     margin-left: 5px;
 159     font-weight: 700;
 160     display: none;
 161 }
 162
 163 .program-session-ical-bg {
 164     background-color: rgb(245, 245, 245);
 165     padding: 5px;
 166     border-radius: 3px;
 167 }
 168
 169 article.ical-howto header {
 170     margin-bottom: 10px;
 171 }
 172
 173 article.ical-howto h2 {
 174     font-size: 15px;
 175 }
 176
 177 /* Breadcrumb */
 178
 179 .breadcrumb > .active {
 180         color: rgb(38, 208, 61);
 181 }
 182
 183 /* Links */
 184
 185 a:hover,
 186 a:focus {
 187   color: #f57900;
 188   text-decoration: none;
 189 }
 190
 191 a {
 192   color: inherit;
 193   border-bottom: thin solid #f57900;
 194 }
 195
 196 .alt-a {
 197   color: inherit;
 198   text-decoration: none;
 199   -moz-text-decoration-color: #f57900;
 200   text-decoration-color: #f57900;
 201 }
 202
 203 .lp-home a {
 204   text-decoration: none;
 205   border-bottom: none;
 206 }
 207
 208 /* hr */
 209
 210 hr {
 211   margin-top: 20px;
 212   margin-bottom: 20px;
 213   border: 0;
 214   border-top: 1px solid #bababa;
 215 }
 216
 217 /* LP Video */
 218
 219 .lp-video {
 220   width: 100%;
 221 }
 222
 223 /* Forms */
 224
 225 .form-control:-moz-placeholder {
 226   color: #777777;
 227 }
 228
 229 .form-control::-moz-placeholder {
 230   color: #777777;
 231 }
 232
 233 .form-control:-ms-input-placeholder {
 234   color: #777777;
 235 }
 236
 237 .form-control::-webkit-input-placeholder {
 238   color: #777777;
 239 }
 240
 241 .form-control {
 242   display: block;
 243   width: 100%;
 244   height: 34px;
 245   padding: 6px 12px;
 246   font-size: 14px;
 247   line-height: 1.428571429;
 248   color: #555555;
 249   vertical-align: middle;
 250   background-color: #ffffff;
 251   border: 1px solid #cccccc;
 252   border-radius: 4px;
 253   -webkit-box-shadow: none;
 254   box-shadow: none;
 255   -webkit-transition: border-color ease-in-out 0.15s;
 256   transition: border-color ease-in-out 0.15s;
 257 }
 258
 259 .form-control:focus {
 260   border-color: #f57900;
 261   outline: 0;
 262   -webkit-box-shadow: none;
 263   box-shadow: none;
 264 }
 265
 266 .scholarship-input-annotation {
 267   margin-bottom: -0.6em;
 268 }
 269
 270 .lp-signup .form-group {
 271   margin-bottom: 2px;
 272 }
 273
 274 .lp-label-news {
 275   display: inline-block;
 276 }
 277
 278 .checkbox .help-block {
 279   display: inline-block;
 280   margin-top: 0;
 281   margin-left: 0;
 282   margin-bottom: 10px;
 283   color: #737373;
 284 }
 285
 286 .form-group .lp-left-form-checkbox-text {
 287   text-align:right;
 288   font-weight: bold;
 289 }
 290
 291 @media screen and (min-width: 320px) and (max-width: 768px){
 292   .form-group .lp-left-form-checkbox-text {
 293     text-align: left;
 294     font-weight: bold;
 295   }
 296
 297   .lp-label-news {
 298       font-size: 0.9em;
 299   }
 300
 301   .checkbox .help-block {
 302       font-size: 0.9em;
 303   }
 304
 305
 306 }
 307
 308 .field-required {
 309   color: rgba(128, 0, 0, 0.6);
 310 }
 311
 312 .radio-inline,
 313 .checkbox-inline {
 314   display: inline-block;
 315   padding-left: 30px;
 316   margin-bottom: 0;
 317   font-weight: normal;
 318   vertical-align: middle;
 319   cursor: pointer;
 320 }
 321
 322 .radio-clear-link {
 323   display: inline-block;
 324   padding-left: 5px;
 325   margin-bottom: 0;
 326   margin-top: 5px;
 327   font-weight: normal;
 328   vertical-align: middle;
 329   cursor: pointer;
 330 }
 331
 332 /* Buttons */
 333
 334 .btn-default {
 335   color: #ffffff;
 336   background-color: #f57900;
 337   border-color: #f57900;
 338 }
 339
 340 .btn-default:hover,
 341 .btn-default:focus,
 342 .btn-default:active,
 343 .btn-default.active,
 344 .open .dropdown-toggle.btn-default {
 345   color: #ffffff;
 346   background-color:#f57900;
 347   border-color: #f5790036;
 348 }
 349
 350 .btn-default.active.focus,
 351 .btn-default.active:focus,
 352 .btn-default.active:hover,
 353 .btn-default.focus:active,
 354 .btn-default:active:focus,
 355 .btn-default:active:hover,
 356 .open > .dropdown-toggle.btn-default.focus,
 357 .open > .dropdown-toggle.btn-default:focus,
 358 .open > .dropdown-toggle.btn-default:hover {
 359   color: #ffffff;
 360   background-color:#f57900;
 361   border-color: #f5790036;
 362 }
 363
 364
 365 @media (min-width:1280px) {
 366   .btn-block {
 367     display: block;
 368     margin-right:auto;
 369     margin-left:auto;
 370     width: 85%;
 371     padding-right: 0;
 372     padding-left: 0;
 373   }
 374 }
 375
 376 .fsf-donate-button {
 377   margin-left: 24%;
 378   margin-top: 5px;
 379   margin-bottom: 10px;
 380   width:56%;
 381 }
 382
 383 @media (max-width:768px) {
 384   .fsf-donate-button {
 385     margin-left: 38%;
 386     margin-top: 5px;
 387     margin-bottom: 10px;
 388     width:22%;
 389   }
 390 }
 391
 392 @media (min-width:320px) and (max-width:360px) {
 393   .fsf-donate-button {
 394     margin-left: 28%;
 395     margin-top: 5px;
 396     margin-bottom: 10px;
 397     width:46%;
 398   }
 399 }
 400
 401 .btn-register {
 402   margin-top: 0.5em;
 403   margin-bottom: 0.3em;
 404   color: #ffffff;
 405   text-shadow: 0px 0px 0px #ffffff;
 406   background-color: #f57900;
 407   text-decoration: none;
 408   box-shadow: 0px 3px 2px #BBBBBB;
 409 }
 410
 411 .btn-register:hover,
 412 .btn-register:focus,
 413 .btn-register:active,
 414 .btn-register.active,
 415 .open .dropdown-toggle.btn-register {
 416   color: #ffffff;
 417   background-color:#f57900;
 418   border-color:#f57900;;
 419 }
 420
 421 .btn-register:active,
 422 .btn-register.active,
 423 .open .dropdown-toggle.btn-register {
 424   background-image: none;
 425 }
 426
 427 /* Carousel */
 428
 429 .btn-carousel {
 430   font-size: 1.15em;
 431   font-weight: 100;
 432 }
 433
 434 .carousel-control .icon-prev,
 435 .carousel-control .icon-next,
 436 .carousel-control .glyphicon-chevron-left,
 437 .carousel-control .glyphicon-chevron-right {
 438   position: absolute;
 439   top: 50%;
 440   left: 50%;
 441   z-index: 5;
 442   display: none;
 443 }
 444
 445 @media (min-width: 375px) and (max-width: 767px) {
 446     .carousel-control .icon-prev,
 447     .carousel-control .icon-next,
 448     .carousel-control .glyphicon-chevron-left,
 449     .carousel-control .glyphicon-chevron-right {
 450         top: 60%;
 451     }
 452 }
 453
 454 @media (max-width: 374px) {
 455     .carousel-control .icon-prev,
 456     .carousel-control .icon-next,
 457     .carousel-control .glyphicon-chevron-left,
 458     .carousel-control .glyphicon-chevron-right {
 459         top: 70%;
 460     }
 461 }
 462
 463 .carousel-caption-tr {
 464   position: absolute;
 465   font-size: 1.1em;
 466   top: 5%;
 467   bottom: auto;
 468   right: 1.5%;
 469   left: 38%;
 470   z-index: 10;
 471   padding-top: 10px;
 472   padding-bottom: 10px;
 473   color: #ffffff;
 474   text-align: center;
 475   background-color: rgba(0, 0, 0,0.6);
 476   border-radius: 8px;
 477 }
 478
 479 .carousel-caption-bl {
 480   position: absolute;
 481   font-size: 1.1em;
 482   top: auto;
 483   bottom: 5%;
 484   right: 45%;
 485   left: 2%;
 486   z-index: 10;
 487   padding-top: 10px;
 488   padding-bottom: 10px;
 489   padding-left: 10px;
 490   padding-right: 10px;
 491   color: #ffffff;
 492   text-align: center;
 493   background-color: rgba(0, 0, 0,0.6);
 494   border-radius: 8px;
 495 }
 496
 497 .carousel-caption-tl {
 498   position: absolute;
 499   font-size: 1.1em;
 500   top: 5%;
 501   bottom: auto;
 502   right: 34%;
 503   left: 2%;
 504   z-index: 10;
 505   padding-top: 10px;
 506   padding-bottom: 10px;
 507   color: #ffffff;
 508   text-align: center;
 509   background-color: rgba(0, 0, 0,0.6);
 510   border-radius: 8px;
 511 }
 512
 513 .carousel-caption-center {
 514   position: absolute;
 515   font-size: 1.1em;
 516   top: 50%;
 517   bottom: auto;
 518   right: auto;
 519   left: 35%;
 520   z-index: 10;
 521   padding-right: 10px;
 522   padding-left: 10px;
 523   padding-top: 10px;
 524   padding-bottom: 10px;
 525   color: #ffffff;
 526   text-align: center;
 527   background-color: rgba(0, 0, 0,0.6);
 528   border-radius: 8px;
 529 }
 530
 531 .carousel-caption-bottom {
 532   color: rgb(51, 51, 51);
 533   position: static;
 534   z-index: 10;
 535   height: auto;
 536   padding-top: 1px;
 537   padding-bottom: 9px;
 538   font-size: larger;
 539   text-align: center;
 540   background-color: rgba(240, 240, 240, .8);
 541   border-radius: 0px 0px 8px 8px;
 542 }
 543
 544 @media screen and (min-width: 1280px) {
 545   .carousel-caption-tr {
 546     padding-bottom: 10px;
 547     margin-left: 65px;
 548     margin-right: auto;
 549   }
 550
 551   .carousel-caption-bl {
 552     padding-bottom: 10px;
 553     margin-left: auto;
 554     margin-right: 65px;
 555   }
 556
 557 }
 558
 559 @media screen and (min-width: 600px) and (max-width: 980px){
 560   .btn-carousel {
 561     font-size: 0.9em;
 562     font-weight: 200;
 563   }
 564 }
 565
 566 @media screen and (min-width: 320px) and (max-width: 480px){
 567   .carousel-caption-tl {
 568     right: 2%;
 569   }
 570
 571   .btn-carousel {
 572     font-size: 0.85em;
 573     font-weight: 200;
 574   }
 575   .carousel-caption-tr {
 576     left: 1%;
 577   }
 578 }
 579
 580 .carousel-control.left {
 581     background-image: none;
 582     background-repeat: repeat-x;
 583     border-bottom: none;
 584 }
 585
 586 .carousel-control.right {
 587     background-image: none;
 588     background-repeat: repeat-x;
 589     left: auto;
 590     right: 0;
 591     border-bottom: none;
 592 }
 593
 594 /* Header */
 595
 596 .lp-archived {
 597     background-color: #f57900;
 598     color: rgb(255, 255, 255);
 599     text-align: center;
 600     padding: 2.5px 0;
 601 }
 602
 603 .lp-archived p {
 604     margin: 0 0 0;
 605 }
 606
 607 .lp-archived a {
 608     border-bottom: 0.1px dotted rgb(200, 220, 200);
 609 }
 610
 611 .lp-archived a:hover, a:active, a:focus{
 612     color: #204A87;
 613 }
 614
 615 .lp-banner {
 616   box-shadow: 0px 1px 5px rgba(255, 255, 255, 0.7);
 617   margin-bottom: 20px;
 618   padding-bottom: 5px;
 619   border-bottom: 3px solid #f57900;
 620   background-color: #204A87;
 621   color: #FFFFFF;
 622 }
 623 .lp-banner a,
 624 .lp-banner .text-muted,
 625 #footer .text-muted {
 626         color: #FFFFFF;
 627 }
 628 .lp-signup {
 629   margin-right: 10px;
 630   margin-left: 10px;
 631 }
 632
 633 .lp-banner .container {
 634   padding-right: 5px;
 635   padding-left: 5px;
 636   margin-right: auto;
 637   margin-left: auto;
 638 }
 639
 640 @media (min-width: 991px) and (max-width:1200px) {
 641   .register-block p {
 642       margin-left: 0.5em;
 643   }
 644 }
 645
 646 @media (min-width:1200px) {
 647   .register-block p {
 648       margin: 0;
 649   }
 650 }
 651
 652 .page-header {
 653   padding-bottom: 9px;
 654   margin: 40px 0 20px;
 655   border-bottom: none;
 656 }
 657
 658 /* Thumbnail */
 659
 660 .lp-thumbnail {
 661   float: right;
 662   margin-left: 0.5em;
 663 }
 664
 665 @media (max-width: 635px) {
 666   .lp-thumbnail {
 667     float: none;
 668     margin-left: 0;
 669   }
 670 }
 671
 672 /* Sponsor Logo */
 673
 674 .spnsr-logo {
 675   display: inline-block;
 676   max-width: 40%;
 677   margin: 0px 40px 40px 0px;
 678 }
 679
 680 /* Panel */
 681
 682 #lp-panel {
 683   max-width: 32%;
 684   margin-left: 0.3em;
 685   float: right;
 686 }
 687
 688 #lp-panel-fixed {
 689   max-width: 32%;
 690   margin-left: 0.3em;
 691   position: fixed;
 692   right: 1%;
 693   top: 20%;
 694 }
 695
 696 #lp-panel-fixed ul {
 697   list-style: square;
 698   padding-left: 0.4em;
 699 }
 700
 701 #lp-panel-fixed li {
 702   margin-bottom: 0.5em;
 703 }
 704
 705 @media (max-width:551px) {
 706   #lp-panel-fixed {
 707     max-width: 100%;
 708     margin-left: 0;
 709         position: static;
 710   }
 711 }
 712
 713 @media (min-width: 552px) and (max-width:767px) {
 714   #lp-panel-fixed {
 715     max-width: 100%;
 716     margin-left: 0;
 717         position: static;
 718   }
 719 }
 720
 721 /* Navs */
 722
 723 @media (min-width:768px) {
 724   .nav {
 725     padding-left: 0;
 726     margin-bottom: 0;
 727     list-style: none;
 728     padding-top: 0em;
 729   }
 730   .lp-home {
 731     padding-top: 2.0em;
 732     padding-bottom: 1.0em;
 733   }
 734   .nav-padding-top {
 735     margin-top: 4.12em;
 736   }
 737 }
 738
 739 .nav > li {
 740   position: relative;
 741   display: block;
 742   color: inherit;
 743   text-shadow: 0px 0px 0px #dadada;
 744   text-align: center;
 745   margin-bottom: 0.4em;
 746   border: none;
 747   border-bottom: 2px solid #FFF;
 748   border-radius: 5px;
 749 }
 750
 751 .nav > li > a {
 752   position: relative;
 753   display: block;
 754   padding: 10px 15px;
 755   text-decoration: none;
 756   background-color: #f57900;
 757   transition: background-color 0.1s;
 758   border-bottom: none;
 759 }
 760
 761 .nav > li.fsf-donate > a {
 762   background-color: #204a87;
 763   margin-top: 8px;
 764   color: white;
 765 }
 766
 767 .nav > li.btn-register > a {
 768   background-color: #f57900;
 769   color: #ffffff;
 770   text-shadow: 0px 0px 0px #ffffff;
 771   text-decoration: none;
 772 }
 773
 774 .navbar-default .navbar-nav > li.btn-register > a:focus,
 775 .navbar-default .navbar-nav > li.btn-register > a:hover {
 776   background-color: transparent;
 777   color: #ffffff;
 778 }
 779
 780 .nav > li > a:hover,
 781 .nav > li > a:focus {
 782   background-color:#f57900;
 783   color: #ffffff;
 784 }
 785
 786 .nav-pills > li > a {
 787   border-radius: 5px;
 788   color: inherit;
 789   border-bottom: none;
 790 }
 791
 792 .nav-pills > li.active > a,
 793 .nav-pills > li.active > a:hover,
 794 .nav-pills > li.active > a:focus {
 795   color: #ffffff;
 796   background-color:#f57900;
 797 }
 798
 799 #lp-mini-nav {
 800   position: fixed;
 801   bottom: 0%;
 802   right: 1%;
 803 }
 804
 805 .navbar-default {
 806     background-color: #204A87;
 807     border-color: #204A87;
 808     border-bottom: 3px solid #f57900;
 809 }
 810
 811 .navbar-default .navbar-text { color: #DDD; }
 812
 813 .navbar-brand {
 814     float: left;
 815     font-size: 18px;
 816     height: 60px;
 817     line-height: 20px;
 818     margin-bottom: 9px;
 819     padding: 15px;
 820     border-bottom: none;
 821 }
 822
 823 .navbar-toggle {
 824     background-color: transparent;
 825     background-image: none;
 826     border: 1px solid transparent;
 827     border-radius: 4px;
 828     float: right;
 829     margin-bottom: 8px;
 830     margin-right: 15px;
 831     margin-top: 13px;
 832     padding: 9px 10px;
 833     position: relative;
 834 }
 835
 836 .navbar-default .navbar-toggle {
 837     border-color: rgb(250, 250, 250);
 838 }
 839
 840 .navbar-default .navbar-toggle:focus,
 841 .navbar-default .navbar-toggle:hover {
 842     background-color: rgb(245, 245, 245);
 843 }
 844
 845 .navbar-default .navbar-toggle .icon-bar {
 846     background-color: rgb(180, 180, 180);
 847 }
 848
 849 .navbar-collapse {
 850     background-color: rgb(240, 240, 240);
 851     border-top: 1px solid transparent;
 852     box-shadow: 0 1px 0 rgba(255, 255, 255, 0.1) inset;
 853     overflow-x: visible;
 854     padding-left: 15px;
 855     padding-right: 15px;
 856 }
 857
 858 #lp-nav { margin-top: 66px; }
 859
 860 #lp-nav .list-group-item ul {
 861     padding: 1.3em;
 862 }
 863
 864 #lp-nav .list-group-item li {
 865     margin-bottom: 1em;
 866 }
 867
 868
 869 /* Footer - adapted from <http://getbootstrap.com/examples/sticky-footer/>
 870 -------------------------------------------------- */
 871
 872 html,
 873 body {
 874   height: 100%;
 875 }
 876
 877 #wrapper {
 878   min-height: 100%;
 879   height: auto !important;
 880   height: 100%;
 881   margin: 0 auto -60px;
 882   padding: 0 0 60px;
 883 }
 884
 885 #footer {
 886   height: auto;
 887   border-top: 2px solid #dadada;
 888   box-shadow: 0px 1px 9px rgba(255, 255, 255, 0.7);
 889   background-color: #204A87;
 890   margin-top: 1.5em;
 891 }
 892
 893 #footer .container p {
 894   margin: 1.4em 0;
 895 }
 896
 897 /* KiwiIRC iframe */
 898 .irc-client {
 899     border:0;
 900     width:100%;
 901     height:450px;
 902 }