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 }
  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 .carousel-caption-bottom {
 397   color: rgb(51, 51, 51);
 398   position: static;
 399   z-index: 10;
 400   height: 2em;
 401   padding-top: 1px;
 402   padding-bottom: 1px;
 403   font-size: larger;
 404   text-align: center;
 405   background-color: rgba(240, 240, 240, .8);
 406   border-radius: 0px 0px 8px 8px;
 407 }
 408
 409 @media screen and (min-width: 1280px) {
 410   .carousel-caption-tr {
 411     padding-bottom: 10px;
 412     margin-left: 65px;
 413     margin-right: auto;
 414   }
 415
 416   .carousel-caption-bl {
 417     padding-bottom: 10px;
 418     margin-left: auto;
 419     margin-right: 65px;
 420   }
 421
 422 }
 423
 424 @media screen and (min-width: 600px) and (max-width: 980px){
 425   .btn-carousel {
 426     font-size: 0.9em;
 427     font-weight: 200;
 428   }
 429 }
 430
 431 @media screen and (min-width: 320px) and (max-width: 480px){
 432   .carousel-caption-tl {
 433     right: 2%;
 434   }
 435
 436   .btn-carousel {
 437     font-size: 0.85em;
 438     font-weight: 200;
 439   }
 440   .carousel-caption-tr {
 441     left: 1%;
 442   }
 443 }
 444
 445 .carousel-control.left {
 446     background-image: none;
 447     background-repeat: repeat-x;
 448 }
 449
 450 .carousel-control.right {
 451     background-image: none;
 452     background-repeat: repeat-x;
 453     left: auto;
 454     right: 0;
 455 }
 456
 457 /* Header */
 458
 459 .lp-banner {
 460   box-shadow: 0px 1px 5px rgba(255, 255, 255, 0.7);
 461   margin-bottom: 20px;
 462   border-bottom: 3px solid rgba(88, 208, 121, 0.8);
 463   text-shadow: 0px 1px 0px #ffffff;
 464   background-color: rgb(250, 250, 250);
 465 }
 466
 467 .lp-head img {
 468   margin: 0.5em 0 0.001em -1.5em;
 469 }
 470
 471 .lp-head p {
 472   margin: -0.54em 0 0.001em -4em;
 473 }
 474
 475 .lp-signup {
 476   margin-right: 10px;
 477   margin-left: 10px;
 478 }
 479
 480 .lp-banner .container {
 481   padding-right: 5px;
 482   padding-left: 5px;
 483   margin-right: auto;
 484   margin-left: auto;
 485 }
 486
 487 @media (max-width:551px) {
 488   .lp-head p {
 489     margin: 0 0 0.2em 0;
 490     text-align: center;
 491   }
 492   .lp-head img {
 493     margin: 1.5em auto 0.5em auto;
 494   }
 495 }
 496
 497 @media (min-width: 552px) and (max-width:767px) {
 498
 499   .lp-head img {
 500     margin: 1.5em auto 0.5em auto;
 501   }
 502   .lp-head p {
 503     margin: 0.37em 0 0.001em -3.6em;
 504   }
 505 }
 506
 507 @media (min-width: 768px) and (max-width:991px) {
 508   .lp-head img {
 509     margin-top: 1.0em;
 510   }
 511   .lp-head p {
 512     margin: -0.35em 0 0.001em -3.6em;
 513   }
 514 }
 515
 516 @media (min-width:1200px) {
 517   .lp-head p {
 518     margin: -0.54em 0 0.001em -7em;
 519   }
 520 }
 521
 522 .page-header {
 523   padding-bottom: 9px;
 524   margin: 40px 0 20px;
 525   border-bottom: none;
 526 }
 527
 528 /* Thumbnail */
 529
 530 .lp-thumbnail {
 531   float: right;
 532   margin-left: 0.5em;
 533 }
 534
 535
 536 @media (max-width: 635px) {
 537   .lp-thumbnail {
 538     float: none;
 539     margin-left: 0;
 540   }
 541 }
 542
 543 /* Sponsor Logo */
 544
 545 .sponsor-logo {
 546   display: inline-block;
 547   max-width: 40%;
 548   margin: 0px 40px 40px 0px;
 549 }
 550
 551 /* Panel */
 552
 553 #lp-panel {
 554   max-width: 32%;
 555   margin-left: 0.3em;
 556   float: right;
 557 }
 558
 559 #lp-panel-fixed {
 560   max-width: 32%;
 561   margin-left: 0.3em;
 562   position: fixed;
 563   right: 1%;
 564   top: 20%;
 565 }
 566
 567 #lp-panel-fixed ul {
 568   list-style: square;
 569   padding-left: 0.4em;
 570 }
 571
 572 #lp-panel-fixed li {
 573   margin-bottom: 0.5em;
 574 }
 575
 576 @media (max-width:551px) {
 577   #lp-panel-fixed {
 578     max-width: 100%;
 579     margin-left: 0;
 580         position: static;
 581   }
 582 }
 583
 584 @media (min-width: 552px) and (max-width:767px) {
 585   #lp-panel-fixed {
 586     max-width: 100%;
 587     margin-left: 0;
 588         position: static;
 589   }
 590 }
 591
 592
 593 /* Navs */
 594
 595 @media (min-width:768px) {
 596   .nav {
 597     padding-left: 0;
 598     margin-bottom: 0;
 599     list-style: none;
 600     padding-top: 1.0em;
 601   }
 602   .lp-home {
 603     padding-top: 2.0em;
 604     padding-bottom: 1.0em;
 605   }
 606   .nav-padding-top {
 607     margin-top: 4.12em;
 608   }
 609 }
 610
 611 .nav > li {
 612   position: relative;
 613   display: block;
 614   color: inherit;
 615   text-shadow: 0px 0px 0px #dadada;
 616   text-align: center;
 617   margin-bottom: 0.4em;
 618   border: none;
 619   border-radius: 5px;
 620 }
 621
 622 .nav > li > a {
 623   position: relative;
 624   display: block;
 625   padding: 10px 15px;
 626   text-decoration: none;
 627   background-color: rgba(240, 240, 240, 0.8);
 628   transition: background-color 0.1s;
 629 }
 630
 631 .nav > li.fsf-donate > a {
 632   background-color: rgba(58, 208, 61, 0.6);
 633   margin-top: 20px;
 634   color: white;
 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 }