2016/assets/css/custom.css

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