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