2015/assets/css/custom.css

   1 body {
   2   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
   3   font-size: 14px;
   4   line-height: 1.428571429;
   5   color: #333333;
   6 }
   7
   8
   9 h2, h3  {
  10         color: rgb(88, 208, 121);
  11 }
  12
  13 h2 small, h2 .small,
  14 h3 small, h3 .small  {
  15         color: rgba(88, 208, 121, 0.6);
  16 }
  17
  18
  19 h3 {
  20   font-size: 20px;
  21 }
  22
  23 .lp-banner {
  24   box-shadow: 0px 1px 5px rgba(255, 255, 255, 0.7);
  25   margin-bottom: 20px;
  26   text-shadow: 0px 1px 0px #ffffff;
  27   background-image: url(/2014/assets/img/l-noise.png);
  28 }
  29
  30 .lp-head img {
  31   margin: 0.5em 0 0.001em -1.5em;
  32 }
  33
  34 .lp-head p {
  35    margin: 0.9em 0 0.001em -3.21em;
  36 }
  37
  38 #lp-panel {
  39         max-width: 32%;
  40         margin-left: 0.3em;
  41         float: right;
  42 }
  43
  44 #lp-panel ul {
  45         list-style: square;
  46         padding-left: 0.4em;
  47 }
  48
  49 #lp-panel li {
  50         margin-bottom: 0.5em;
  51 }
  52
  53 #lp-updates {
  54         max-width: 35%;
  55         margin-left: 0.3em;
  56 }
  57
  58 @media (max-width:767px) {
  59         .lp-head img {
  60                 margin: 1.5em auto 0.001em auto;
  61         }
  62         .lp-head p {
  63                 margin: 0.5em 0 0 0;
  64                 text-align: center;
  65         }
  66         #lp-panel {
  67                 max-width: 100%;
  68                 margin-left: 0;
  69                 float: none;
  70         }
  71         #lp-updates {
  72                 max-width: 100%;
  73                 margin-left: 0;
  74         }
  75 }
  76
  77 .lp-thumbnail {
  78         float: right;
  79         margin-left: 0.5em;
  80 }
  81
  82
  83 @media (max-width: 635px) {
  84         .lp-thumbnail {
  85                 float: none;
  86                 margin-left: 0;
  87         }
  88 }
  89
  90
  91 @media (min-width: 768px) and (max-width:991px) {
  92         .lp-head img {
  93                 margin-top: 1.0em;
  94         }
  95         .lp-head p {
  96                 margin: 0.9em 0 0 -2.3em;
  97         }
  98 }
  99
 100 @media (min-width:1200px) {
 101         .lp-head p {
 102                 margin: 0.9em 0 0.001em -6.21em;
 103         }
 104 }
 105
 106 .lp-signup {
 107   margin-right: 10px;
 108   margin-left: 10px;
 109 }
 110
 111 .lp-banner .container {
 112         padding-right: 5px;
 113         padding-left: 5px;
 114         margin-right: auto;
 115         margin-left: auto;
 116 }
 117
 118
 119 .btn-register-lp14 {
 120         margin-top: 0.5em;
 121         margin-bottom: 0.3em;
 122         color: #ffffff;
 123         text-shadow: 0px 0px 0px #ffffff;
 124         background-color: rgba(58, 208, 61, 0.6);
 125         background-color: rgba(58, 208, 61, 0.6);
 126 }
 127
 128 .btn-register-lp14:hover,
 129 .btn-register-lp14:focus,
 130 .btn-register-lp14:active,
 131 .btn-register-lp14.active,
 132 .open .dropdown-toggle.btn-register-lp14 {
 133   color: #ffffff;
 134   background-color: rgba(74, 161, 74, 0.9);
 135   border-color: rgba(57, 132, 57, 0.2);
 136 }
 137
 138 .btn-register-lp14:active,
 139 .btn-register-lp14.active,
 140 .open .dropdown-toggle.btn-register-lp14 {
 141   background-image: none;
 142 }
 143
 144
 145 @media (min-width:1280px) {
 146         .btn-block {
 147                 display: block;
 148                 margin-right:auto;
 149                 margin-left:auto;
 150                 width: 85%;
 151                 padding-right: 0;
 152                 padding-left: 0;
 153         }
 154 }
 155
 156
 157 .fsf-donate-button {
 158   margin-left: 24%;
 159   margin-top: 5px;
 160   margin-bottom: 10px;
 161   width:56%;
 162 }
 163
 164 @media (max-width:768px) {
 165         .fsf-donate-button {
 166           margin-left: 38%;
 167           margin-top: 5px;
 168           margin-bottom: 10px;
 169           width:22%;
 170         }
 171 }
 172
 173 @media (min-width:320px) and (max-width:360px) {
 174   .fsf-donate-button {
 175         margin-left: 28%;
 176         margin-top: 5px;
 177         margin-bottom: 10px;
 178         width:46%;
 179   }
 180 }
 181
 182 .page-header {
 183   padding-bottom: 9px;
 184   margin: 40px 0 20px;
 185   border-bottom: none;
 186 }
 187
 188
 189 .form-control:-moz-placeholder {
 190   color: #777777;
 191 }
 192
 193 .form-control::-moz-placeholder {
 194   color: #777777;
 195 }
 196
 197 .form-control:-ms-input-placeholder {
 198   color: #777777;
 199 }
 200
 201 .form-control::-webkit-input-placeholder {
 202   color: #777777;
 203 }
 204
 205 .form-control {
 206   display: block;
 207   width: 100%;
 208   height: 34px;
 209   padding: 6px 12px;
 210   font-size: 14px;
 211   line-height: 1.428571429;
 212   color: #555555;
 213   vertical-align: middle;
 214   background-color: rgba(250, 250, 250, 0.7);
 215   border: 1px solid #cccccc;
 216   border-radius: 4px;
 217   -webkit-box-shadow: none;
 218           box-shadow: none;
 219   -webkit-transition: border-color ease-in-out 0.15s;
 220           transition: border-color ease-in-out 0.15s;
 221 }
 222
 223 .form-control:focus {
 224   border-color: rgb(88, 208, 121);
 225   outline: 0;
 226   -webkit-box-shadow: none;
 227   box-shadow: none;
 228 }
 229
 230 .scholarship-input-annotation {
 231         margin-bottom: -0.6em;
 232 }
 233
 234 .lp-signup .form-group {
 235   margin-bottom: 2px;
 236 }
 237
 238 .lp-label-news {
 239         display: inline-block;
 240 }
 241
 242 .checkbox .help-block {
 243   display: inline-block;
 244   margin-top: 0;
 245   margin-bottom: 10px;
 246   color: #737373;
 247 }
 248
 249 .form-group .lp-left-form-checkbox-text {
 250         text-align:right;
 251         font-weight: bold;
 252 }
 253
 254 @media screen and (min-width: 320px) and (max-width: 768px){
 255         .form-group .lp-left-form-checkbox-text {
 256                 text-align: left;
 257                 font-weight: bold;
 258         }
 259 }
 260
 261 .field-required {
 262         color: rgba(128, 0, 0, 0.6);
 263 }
 264
 265 .radio-inline,
 266 .checkbox-inline {
 267   display: inline-block;
 268   padding-left: 30px;
 269   margin-bottom: 0;
 270   font-weight: normal;
 271   vertical-align: middle;
 272   cursor: pointer;
 273 }
 274
 275 .radio-clear-link {
 276   display: inline-block;
 277   padding-left: 5px;
 278   margin-bottom: 0;
 279   margin-top: 5px;
 280   font-weight: normal;
 281   vertical-align: middle;
 282   cursor: pointer;
 283 }
 284
 285 .btn-default {
 286   color: #ffffff;
 287   background-color: rgba(88, 208, 121, 0.8);
 288   border-color: rgba(88, 208, 121, 0.5);
 289 }
 290
 291 .btn-default:hover,
 292 .btn-default:focus,
 293 .btn-default:active,
 294 .btn-default.active,
 295 .open .dropdown-toggle.btn-default {
 296   color: #ffffff;
 297   background-color: rgba(88, 208, 121, 1.0);
 298   border-color: rgba(88, 208, 121, 0.2);
 299 }
 300
 301 @media (min-width:768px) {
 302         .nav {
 303           padding-left: 0;
 304           margin-bottom: 0;
 305           list-style: none;
 306           padding-top: 1.0em;
 307         }
 308         .lp-home {
 309       padding-top: 2.0em;
 310       padding-bottom: 1.0em;
 311         }
 312         .nav-padding-top {
 313       margin-top: 4.12em;
 314         }
 315 }
 316
 317 .nav > li {
 318   position: relative;
 319   display: block;
 320   color: #ffffff;
 321   text-shadow: 0px 0px 0px #dadada;
 322   text-align: center;
 323   margin-bottom: 0.4em;
 324   border: none;
 325   border-radius: 5px;
 326 }
 327
 328 .nav > li > a {
 329   position: relative;
 330   display: block;
 331   padding: 10px 15px;
 332   background-color: rgba(145, 145, 145, 0.8);
 333   transition: background-color 1s;
 334 }
 335
 336 .nav > li.fsf-donate > a {
 337   background-color: rgba(58, 208, 61, 0.6);
 338   margin-top: 20px;
 339 }
 340
 341 .nav > li > a:hover,
 342 .nav > li > a:focus {
 343   text-decoration: none;
 344   background-color: rgba(88, 208, 121, 1.0);
 345 }
 346
 347 .nav-pills > li > a {
 348   border-radius: 5px;
 349   color: inherit;
 350 }
 351
 352 .nav-pills > li.active > a,
 353 .nav-pills > li.active > a:hover,
 354 .nav-pills > li.active > a:focus {
 355   color: #ffffff;
 356   background-color: rgba(88, 208, 121, 1.0);
 357 }
 358
 359 .btn-carousel {
 360         font-size: 1.15em;
 361         font-weight: 100;
 362 }
 363
 364 .carousel-control .icon-prev,
 365 .carousel-control .icon-next,
 366 .carousel-control .glyphicon-chevron-left,
 367 .carousel-control .glyphicon-chevron-right {
 368   position: absolute;
 369   top: 50%;
 370   left: 50%;
 371   z-index: 5;
 372   display: none;
 373 }
 374
 375 .carousel-caption-tr {
 376   position: absolute;
 377   font-size: 1.1em;
 378   top: 5%;
 379   bottom: auto;
 380   right: 1.5%;
 381   left: 38%;
 382   z-index: 10;
 383   padding-top: 10px;
 384   padding-bottom: 10px;
 385   color: #ffffff;
 386   text-align: center;
 387   background-color: rgba(0, 0, 0,0.6);
 388   border-radius: 8px;
 389 }
 390
 391 .carousel-caption-bl {
 392   position: absolute;
 393   font-size: 1.1em;
 394   top: auto;
 395   bottom: 5%;
 396   right: 45%;
 397   left: 2%;
 398   z-index: 10;
 399   padding-top: 10px;
 400   padding-bottom: 10px;
 401   padding-left: 10px;
 402   padding-right: 10px;
 403   color: #ffffff;
 404   text-align: center;
 405   background-color: rgba(0, 0, 0,0.6);
 406   border-radius: 8px;
 407 }
 408
 409 .carousel-caption-tl {
 410   position: absolute;
 411   font-size: 1.1em;
 412   top: 5%;
 413   bottom: auto;
 414   right: 34%;
 415   left: 2%;
 416   z-index: 10;
 417   padding-top: 10px;
 418   padding-bottom: 10px;
 419   color: #ffffff;
 420   text-align: center;
 421   background-color: rgba(0, 0, 0,0.6);
 422   border-radius: 8px;
 423 }
 424
 425 @media screen and (min-width: 1280px) {
 426   .carousel-caption-tr {
 427     padding-bottom: 10px;
 428         margin-left: 65px;
 429         margin-right: auto;
 430   }
 431
 432   .carousel-caption-bl {
 433     padding-bottom: 10px;
 434         margin-left: auto;
 435         margin-right: 65px;
 436   }
 437
 438 }
 439
 440 @media screen and (min-width: 600px) and (max-width: 980px){
 441         .btn-carousel {
 442                 font-size: 0.9em;
 443                 font-weight: 200;
 444         }
 445 }
 446
 447 @media screen and (min-width: 320px) and (max-width: 480px){
 448   .carousel-caption-tl {
 449     right: 2%;
 450   }
 451
 452   .btn-carousel {
 453           font-size: 0.85em;
 454           font-weight: 200;
 455   }
 456   .carousel-caption-tr {
 457     left: 1%;
 458   }
 459 }
 460
 461 a {
 462   color: rgb(88, 208, 121);
 463   text-decoration: none;
 464 }
 465
 466 a:hover,
 467 a:focus {
 468   color: rgb(38, 208, 61);
 469   text-decoration: none;
 470 }
 471
 472 hr {
 473   margin-top: 20px;
 474   margin-bottom: 20px;
 475   border: 0;
 476   border-top: 1px solid #bababa;
 477 }
 478
 479 .margin-top {
 480         margin-top: 22px;
 481 }
 482
 483 .speaker {
 484   vertical-align:top;
 485 }
 486
 487 .session-speaker h3 {
 488         margin-top: 0em;
 489 }
 490
 491 .session-speaker {
 492         margin-bottom: 1.8em;
 493 }
 494
 495 .speaker-photo {
 496   padding-top:23px;
 497   padding-right:15px;
 498 }
 499
 500 .lp-video {
 501         width: 100%;
 502 }
 503
 504 /* Footer - adapted from <http://getbootstrap.com/examples/sticky-footer/>
 505 -------------------------------------------------- */
 506
 507 html,
 508 body {
 509   height: 100%;
 510 }
 511
 512 #wrapper {
 513   min-height: 100%;
 514   height: auto !important;
 515   height: 100%;
 516   margin: 0 auto -60px;
 517   padding: 0 0 60px;
 518 }
 519
 520 #footer {
 521   height: auto;
 522   border-top: 2px solid #dadada;
 523   box-shadow: 0px 1px 9px rgba(255, 255, 255, 0.7);
 524   background-color: rgb(255, 255, 255);
 525   margin-top: 1.5em;
 526 }
 527
 528 #footer .container p {
 529         margin: 1.4em 0;
 530 }