2014/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 .lp-banner {
   9   box-shadow: 0px 1px 5px rgba(255, 255, 255, 0.7);
  10   margin-bottom: 20px;
  11   text-shadow: 0px 1px 0px #ffffff;
  12   background-image: url(/2014/assets/img/l-noise.png);
  13 }
  14
  15 .lp-head h1 {
  16   margin-bottom: 0.001em;
  17   margin-left: 10px;
  18   font-size: 50px;
  19 }
  20 .lp-head h1 small {
  21   font-size: 38px;
  22   color: rgba(128, 0, 0, 0.6);
  23 }
  24
  25 .lp-head h1 a {
  26   color: inherit;
  27   text-decoration: none;
  28 }
  29
  30 .lp-head h1 a:hover {
  31   color: inherit;
  32   text-decoration: none;
  33 }
  34
  35 .lp-head p {
  36   margin: 0 0 1px;
  37   margin-left: 10px;
  38 }
  39
  40 .lp-signup {
  41   margin-right: 10px;
  42   margin-left: 10px;
  43 }
  44
  45 .lp-banner .container {
  46         padding-right: 5px;
  47         padding-left: 5px;
  48         margin-right: auto;
  49         margin-left: auto;
  50 }
  51
  52
  53 .fsf-donate-button {
  54   margin-left: 24%;
  55   margin-top: 25px;
  56   margin-bottom: 10px;
  57   width:56%;
  58 }
  59
  60 @media (max-width:768px) {
  61         .fsf-donate-button {
  62           margin-left: 34%;
  63           margin-top: 25px;
  64           margin-bottom: 10px;
  65           width:32%;
  66         }
  67 }
  68
  69 @media (min-width:320px) and (max-width:360px) {
  70   .fsf-donate-button {
  71         margin-left: 24%;
  72         margin-top: 25px;
  73         margin-bottom: 10px;
  74         width:56%;
  75   }
  76 }
  77
  78 .page-header {
  79   padding-bottom: 9px;
  80   margin: 40px 0 20px;
  81   border-bottom: none;
  82 }
  83
  84
  85 .form-control:-moz-placeholder {
  86   color: #777777;
  87 }
  88
  89 .form-control::-moz-placeholder {
  90   color: #777777;
  91 }
  92
  93 .form-control:-ms-input-placeholder {
  94   color: #777777;
  95 }
  96
  97 .form-control::-webkit-input-placeholder {
  98   color: #777777;
  99 }
 100
 101 .form-control {
 102   display: block;
 103   width: 100%;
 104   height: 34px;
 105   padding: 6px 12px;
 106   font-size: 14px;
 107   line-height: 1.428571429;
 108   color: #555555;
 109   text-shadow: 0px 1px 0px #ffffff;
 110   vertical-align: middle;
 111   background-color: rgba(250, 250, 250, 0.7);
 112   border: 1px solid #cccccc;
 113   border-radius: 4px;
 114   -webkit-box-shadow: none;
 115           box-shadow: none;
 116   -webkit-transition: border-color ease-in-out 0.15s;
 117           transition: border-color ease-in-out 0.15s;
 118 }
 119
 120 .form-control:focus {
 121   border-color: #919191;
 122   outline: 0;
 123   -webkit-box-shadow: none;
 124   box-shadow: none;
 125 }
 126
 127 .lp-signup .form-group {
 128   margin-bottom: 2px;
 129 }
 130
 131 .lp-label-news {
 132         display: inline-block;
 133 }
 134
 135 .checkbox .help-block {
 136   display: inline-block;
 137   margin-top: 0;
 138   margin-bottom: 10px;
 139   color: #737373;
 140 }
 141
 142 .form-group .lp-left-form-checkbox-text {
 143         text-align:right;
 144         font-weight: bold;
 145 }
 146
 147 @media screen and (min-width: 320px) and (max-width: 768px){
 148         .form-group .lp-left-form-checkbox-text {
 149                 text-align: left;
 150                 font-weight: bold;
 151         }
 152 }
 153
 154 .field-required {
 155         color: rgba(128, 0, 0, 0.6);
 156 }
 157
 158 .radio-inline,
 159 .checkbox-inline {
 160   display: inline-block;
 161   padding-left: 30px;
 162   margin-bottom: 0;
 163   font-weight: normal;
 164   vertical-align: middle;
 165   cursor: pointer;
 166 }
 167
 168 .radio-clear-link {
 169   display: inline-block;
 170   padding-left: 5px;
 171   margin-bottom: 0;
 172   margin-top: 5px;
 173   font-weight: normal;
 174   vertical-align: middle;
 175   cursor: pointer;
 176 }
 177
 178 .btn-default {
 179   color: #ffffff;
 180   background-color: rgba(145, 145, 145, 0.5);
 181   border-color: rgba(145, 145, 145, 0.2);
 182 }
 183
 184 .btn-default:hover,
 185 .btn-default:focus,
 186 .btn-default:active,
 187 .btn-default.active,
 188 .open .dropdown-toggle.btn-default {
 189   color: #ffffff;
 190   background-color: rgba(129, 129, 129, 0.5);
 191   border-color: rgba(129, 129, 129, 0.2);
 192 }
 193
 194
 195 @media (min-width:768px) {
 196         .nav {
 197           padding-left: 0;
 198           margin-bottom: 0;
 199           list-style: none;
 200           padding-top: 1.0em;
 201         }
 202         .lp-home {
 203       padding-top: 2.0em;
 204         }
 205 }
 206
 207 .nav > li {
 208   position: relative;
 209   display: block;
 210   color: #ffffff;
 211   text-shadow: 0px 0px 0px #dadada;
 212   text-align: center;
 213   margin-bottom: 0.4em;
 214   border: none;
 215   border-radius: 5px;
 216 }
 217
 218 .nav > li > a {
 219   position: relative;
 220   display: block;
 221   padding: 10px 15px;
 222   background-color: rgba(145, 145, 145, 0.8);
 223   transition: background-color 1s;
 224 }
 225
 226 .nav > li.fsf-donate > a {
 227   background-color: rgba(128, 0, 0, 0.6);
 228   margin-top: 20px;
 229 }
 230
 231 .nav > li > a:hover,
 232 .nav > li > a:focus {
 233   text-decoration: none;
 234   background-color: rgba(128, 0, 0, 0.7);
 235 }
 236
 237 .nav-pills > li > a {
 238   border-radius: 5px;
 239   color: inherit;
 240 }
 241
 242 .nav-pills > li.active > a,
 243 .nav-pills > li.active > a:hover,
 244 .nav-pills > li.active > a:focus {
 245   color: #ffffff;
 246   background-color: rgba(128, 0, 0, 0.7);
 247 }
 248
 249 .carousel-control .icon-prev,
 250 .carousel-control .icon-next,
 251 .carousel-control .glyphicon-chevron-left,
 252 .carousel-control .glyphicon-chevron-right {
 253   position: absolute;
 254   top: 50%;
 255   left: 50%;
 256   z-index: 5;
 257   display: none;
 258 }
 259
 260 .carousel-caption-tr {
 261   position: absolute;
 262   top: 5%;
 263   bottom: auto;
 264   right: 2%;
 265   left: 38%;
 266   z-index: 10;
 267   padding-top: 10px;
 268   padding-bottom: 10px;
 269   color: #ffffff;
 270   text-align: center;
 271   background-color: rgba(0, 0, 0,0.4);
 272   text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
 273   border-radius: 8px;
 274 }
 275
 276 .call-for-proposal {
 277         right: 2%;
 278         left: 35%;
 279 }
 280
 281 .carousel-caption-bl {
 282   position: absolute;
 283   top: auto;
 284   bottom: 5%;
 285   right: 45%;
 286   left: 2%;
 287   z-index: 10;
 288   padding-top: 10px;
 289   padding-bottom: 10px;
 290   padding-left: 10px;
 291   padding-right: 10px;
 292   color: #ffffff;
 293   text-align: center;
 294   background-color: rgba(0, 0, 0,0.4);
 295   text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
 296   border-radius: 8px;
 297 }
 298
 299 .carousel-caption-tl {
 300   position: absolute;
 301   top: 5%;
 302   bottom: auto;
 303   right: 55%;
 304   left: 2%;
 305   z-index: 10;
 306   padding-top: 10px;
 307   padding-bottom: 10px;
 308   color: #ffffff;
 309   text-align: center;
 310   background-color: rgba(0, 0, 0,0.4);
 311   text-shadow: 0 1px 2px rgba(0, 0, 0, 0.6);
 312   border-radius: 8px;
 313 }
 314
 315 @media screen and (min-width: 1280px) {
 316   .carousel-caption-tr {
 317     padding-bottom: 10px;
 318         margin-left: 65px;
 319         margin-right: auto;
 320   }
 321
 322   .carousel-caption-bl {
 323     padding-bottom: 10px;
 324         margin-left: auto;
 325         margin-right: 65px;
 326   }
 327
 328 }
 329
 330 @media screen and (min-width: 320px) and (max-width: 480px){
 331   .carousel-caption-tl {
 332     right: 24%;
 333   }
 334   .carousel-caption-tr {
 335     left: 1%;
 336   }
 337 }
 338
 339 a {
 340   color: #428bca;
 341   text-decoration: none;
 342 }
 343
 344 a:hover,
 345 a:focus {
 346   color: #800000;
 347   text-decoration: none;
 348 }
 349
 350 hr {
 351   margin-top: 20px;
 352   margin-bottom: 20px;
 353   border: 0;
 354   border-top: 1px solid #bababa;
 355 }
 356
 357 .margin-top {
 358         margin-top: 22px;
 359 }
 360
 361 /* Footer - adapted from <http://getbootstrap.com/examples/sticky-footer/>
 362 -------------------------------------------------- */
 363
 364 html,
 365 body {
 366   height: 100%;
 367 }
 368
 369 #wrapper {
 370   min-height: 100%;
 371   height: auto !important;
 372   height: 100%;
 373   margin: 0 auto -60px;
 374   padding: 0 0 60px;
 375 }
 376
 377 #footer {
 378   height: auto;
 379   border-top: 2px solid #dadada;
 380   box-shadow: 0px 1px 9px rgba(255, 255, 255, 0.7);
 381   background-color: rgb(255, 255, 255);
 382   margin-top: 1.5em;
 383 }
 384
 385 #footer .container p {
 386         margin: 1.4em 0;
 387 }