2016/assets/css/custom.css

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