static/css/style.css

   1 html {
   2         width: 100%;
   3         height: 100%;
   4 }
   5
   6 body {
   7         width: 100%;
   8         height: 100%;
   9         padding-top: 90px;
  10 }
  11
  12 .btn {
  13         -webkit-transition: all 0.3s ease-in-out;
  14         -moz-transition: all 0.3s ease-in-out;
  15         transition: all 0.3s ease-in-out;
  16 }
  17
  18 .btn-default {
  19         border: 2px solid #333;
  20         color: #333;
  21         background-color: transparent;
  22 }
  23
  24 .btn-default:hover, .btn-default:focus {
  25         border: 2px solid #333;
  26         outline: none;
  27         color: #ffffff;
  28         background-color: #333;
  29 }
  30
  31 .btn-primary {
  32         border: 2px solid #880400;
  33         color: #880400;
  34         background-color: transparent;
  35 }
  36
  37 .btn-primary:hover, .btn-primary:focus {
  38         border: 2px solid #880400;
  39         outline: none;
  40         color: #ffffff;
  41         background-color: #880400;
  42 }
  43
  44 .btn-success {
  45         border: 2px solid #5cb85c;
  46         color: #5cb85c;
  47         background-color: transparent;
  48 }
  49
  50 .btn-success:hover, .btn-success:focus {
  51         border: 2px solid #5cb85c;
  52         outline: none;
  53         color: #ffffff;
  54         background-color: #5cb85c;
  55 }
  56
  57 .btn-info {
  58         border: 2px solid #5bc0de;
  59         color: #5bc0de;
  60         background-color: transparent;
  61 }
  62
  63 .btn-info:hover, .btn-info:focus {
  64         border: 2px solid #5bc0de;
  65         outline: none;
  66         color: #ffffff;
  67         background-color: #5bc0de;
  68 }
  69
  70 .btn-warning {
  71         border: 2px solid #f0ad4e;
  72         color: #f0ad4e;
  73         background-color: transparent;
  74 }
  75
  76 .btn-warning:hover, .btn-warning:focus {
  77         border: 2px solid #f0ad4e;
  78         outline: none;
  79         color: #ffffff;
  80         background-color: #f0ad4e;
  81 }
  82
  83 .btn-danger {
  84         border: 2px solid #d9534f;
  85         color: #d9534f;
  86         background-color: transparent;
  87 }
  88
  89 .btn-danger:hover, .btn-danger:focus {
  90         border: 2px solid #d9534f;
  91         outline: none;
  92         color: #ffffff;
  93         background-color: #d9534f;
  94 }
  95
  96 .btn-lwl {
  97         border: 2px solid #4b0082;
  98         color: #4b0082;
  99         background-color: transparent;
 100 }
 101
 102 .btn-lwl:hover, .btn-lwl:focus {
 103         border: 2px solid #4b0082;
 104         outline: none;
 105         color: #ffffff;
 106         background-color: #4b0082;
 107 }
 108
 109 .navbar {
 110         margin-bottom: 0;
 111         border-bottom: 1px solid rgba(255, 255, 255, 0.3);
 112         background-color: #ffffff;
 113 }
 114
 115 .navbar-brand {
 116         font-weight: 600;
 117 }
 118
 119 .navbar-brand:focus {
 120         outline: none;
 121 }
 122
 123 .navbar-brand .navbar-brand-logo {
 124         float: left;
 125         width: 25px;
 126         height: 25px;
 127         margin-right: 5px;
 128 }
 129
 130 .navbar-custom .nav li a {
 131         -webkit-transition: background 0.3s ease-in-out;
 132         -moz-transition: background 0.3s ease-in-out;
 133         transition: background 0.3s ease-in-out;
 134 }
 135
 136 .navbar-custom .nav li a:hover, .navbar-custom .nav li a:focus,
 137 .navbar-custom .nav li.active {
 138         outline: none;
 139         background-color: rgba(255, 255, 255, 0.2);
 140 }
 141
 142 .navbar-toggle {
 143         padding: 4px 6px;
 144         font-size: 16px;
 145         color: #000000;
 146 }
 147
 148 .navbar-toggle:focus, .navbar-toggle:active {
 149         outline: none;
 150 }
 151
 152 @media (min-width: 767px) {
 153         .navbar {
 154                 padding: 20px 0;
 155                 border-bottom: none;
 156                 letter-spacing: 1px;
 157                 background: transparent;
 158                 -webkit-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
 159                 -moz-transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
 160                 transition: background 0.5s ease-in-out, padding 0.5s ease-in-out;
 161         }
 162
 163         .top-nav-collapse {
 164                 padding: 0;
 165                 background-color: rgba(255, 255, 255, 0.95);
 166         }
 167
 168         .navbar-custom.top-nav-collapse {
 169                 border-bottom: 1px solid rgba(136, 4, 0, 0.3);
 170         }
 171 }
 172
 173 .intro {
 174         display: table;
 175         width: 100%;
 176         height: auto;
 177         padding: 100px 0;
 178         text-align: center;
 179         background-color: #ffffff;
 180         -webkit-background-size: cover;
 181         -moz-background-size: cover;
 182         background-size: cover;
 183         -o-background-size: cover;
 184 }
 185
 186 .intro-body {
 187         display: table-cell;
 188         vertical-align: middle;
 189 }
 190
 191 .intro-body h1 {
 192         font-size: 120px;
 193         line-height: 1;
 194         letter-spacing: -2px;
 195 }
 196
 197 @media (min-width: 767px) {
 198         .intro {
 199                 height: 100%;
 200                 padding: 0;
 201         }
 202
 203         .intro-body {
 204                 padding-bottom: 50px;
 205         }
 206 }
 207
 208 .content-section {
 209         padding-top: 50px;
 210         padding-bottom: 50px;
 211 }
 212
 213 .content-section:first-of-type {
 214         padding-top: 0;
 215 }
 216
 217 .content-section:last-of-type {
 218         margin-bottom: 50px;
 219 }
 220
 221 @media (min-width: 767px) {
 222         .content-section {
 223                 padding-top: 75px;
 224                 padding-bottom: 75px;
 225         }
 226
 227         .content-section:first-of-type {
 228                 padding-top: 0;
 229         }
 230
 231         .content-section:last-of-type {
 232                 margin-bottom: 75px;
 233         }
 234 }
 235
 236 .dark-background {
 237         background: #880400; /* Old browsers */
 238         background: -moz-linear-gradient(45deg, #000000 0%, #880400 100%); /* FF3.6+ */
 239         background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#000000), color-stop(100%,#880400)); /* Chrome,Safari4+ */
 240         background: -webkit-linear-gradient(45deg, #000000 0%,#880400 100%); /* Chrome10+,Safari5.1+ */
 241         background: -o-linear-gradient(45deg, #000000 0%, #880400 100%); /* Opera 11.10+ */
 242         background: -ms-linear-gradient(45deg, #000000 0%, #880400 100%); /* IE10+ */
 243         background: linear-gradient(45deg,  #000000 0%, #880400 100%); /* W3C */
 244         filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#880400',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
 245         -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
 246         -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
 247         box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
 248
 249         color: white;
 250 }
 251
 252 .dark-background .btn-default {
 253         border: 2px solid white;
 254         color: white;
 255 }
 256
 257 .dark-background .btn-default:hover, .dark-background .btn-default:focus {
 258         color: #333;
 259         background-color: white;
 260 }
 261
 262
 263 .light-background {
 264         background: #e1e1e1;
 265 }
 266
 267 .lighter-background {
 268         background: #eeeeee;
 269 }
 270
 271 .red-background {
 272         background: #880400;
 273         color: white;
 274 }
 275
 276 .red-background a {
 277         color: white;
 278         text-decoration: underline;
 279 }
 280
 281 .red-background a:hover, .red-background a:focus {
 282         text-decoration: none;
 283 }
 284
 285 .page-header {
 286         text-align: center;
 287 }
 288
 289 .about-section {
 290         width: 100%;
 291         padding: 50px 0;
 292         color: white;
 293         -webkit-background-size: cover;
 294         -moz-background-size: cover;
 295         background-size: cover;
 296         -o-background-size: cover;
 297 }
 298
 299 @media (min-width: 767px) {
 300         .about-section {
 301                 padding: 100px 0;
 302         }
 303 }
 304
 305 .contribute-section hr {
 306         margin-top: 50px;
 307         margin-bottom: 50px;
 308 }
 309
 310 .btn-circle {
 311         width: 70px;
 312         height: 70px;
 313         margin-top: 15px;
 314         padding: 7px 16px;
 315         border: 2px solid #880400;
 316         border-radius: 35px;
 317         font-size: 40px;
 318         background: transparent;
 319         -webkit-transition: background 0.3s ease-in-out;
 320         -moz-transition: background 0.3s ease-in-out;
 321         transition: background 0.3s ease-in-out;
 322         vertical-align: bottom;
 323 }
 324
 325 .btn-circle:hover,
 326 .btn-circle:focus {
 327         outline: none;
 328         color: #000000;
 329         background: rgba(255, 255, 255, 0.1);
 330 }
 331
 332 .page-scroll .btn-circle i.animated {
 333         -webkit-transition-property: -webkit-transform;
 334         -webkit-transition-duration: 1s;
 335         -moz-transition-property: -moz-transform;
 336         -moz-transition-duration: 1s;
 337 }
 338
 339 .page-scroll .btn-circle:hover i.animated {
 340         -webkit-animation-name: pulse;
 341         -moz-animation-name: pulse;
 342         -webkit-animation-duration: 1.5s;
 343         -moz-animation-duration: 1.5s;
 344         -webkit-animation-iteration-count: infinite;
 345         -moz-animation-iteration-count: infinite;
 346         -webkit-animation-timing-function: linear;
 347         -moz-animation-timing-function: linear;
 348 }
 349
 350 .container-body {
 351   background-color: #FFF;
 352   padding: 10px 15px;
 353 }
 354
 355 .text-center, .ac, td.ac {
 356         text-align: center;
 357 }
 358
 359 .ar {
 360         text-align: right;
 361 }
 362
 363 .clear {
 364         clear: both;
 365 }
 366
 367 .separator {
 368         margin: 40px 0 39px;
 369 }
 370
 371 .img-padding {
 372         padding: 10px;
 373 }
 374
 375 a.link-normal {
 376         color: inherit;
 377 }
 378
 379 .text-overflow {
 380         white-space: nowrap;
 381         overflow: hidden;
 382         text-overflow: ellipsis;
 383 }
 384
 385 table.table-fireinfo td.bar {
 386 width: 70%;
 387 }
 388 table.table-fireinfo td.key {
 389 width: 20%;
 390 }
 391 table.table-fireinfo td.val {
 392 width: 10%;
 393 }
 394 .objectives .icon {
 395 padding: 1.2em;
 396 }
 397 .thumbnails .download-box {
 398 padding: 2em 2em 0 2em;
 399 }
 400
 401 section > .page-header ~ .page-header {
 402         padding-top: 60px;
 403 }
 404
 405 .jumbotron {
 406         color: white;
 407         background: #880400; /* Old browsers */
 408         background: -moz-linear-gradient(45deg, #000000 0%, #880400 100%); /* FF3.6+ */
 409         background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#000000), color-stop(100%,#880400)); /* Chrome,Safari4+ */
 410         background: -webkit-linear-gradient(45deg, #000000 0%,#880400 100%); /* Chrome10+,Safari5.1+ */
 411         background: -o-linear-gradient(45deg, #000000 0%, #880400 100%); /* Opera 11.10+ */
 412         background: -ms-linear-gradient(45deg, #000000 0%, #880400 100%); /* IE10+ */
 413         background: linear-gradient(45deg,  #000000 0%, #880400 100%); /* W3C */
 414         filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#880400',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
 415         -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
 416         -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
 417         box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
 418         text-align: center;
 419 }
 420
 421 .jumbotron a {
 422         color: white;
 423 }
 424
 425 /* Download button */
 426 .masthead .btn, .download-button {
 427         padding: 19px 24px;
 428         font-size: 24px;
 429 }
 430
 431 .masthead {
 432         padding-top: 70px;
 433         margin-bottom: 0;
 434 }
 435
 436 .masthead h1 {
 437         font-size: 120px;
 438         line-height: 1;
 439         letter-spacing: -2px;
 440 }
 441
 442 .masthead p.lead {
 443         font-size: 36px;
 444         font-weight: 200;
 445         line-height: 1.25;
 446 }
 447
 448 .footer {
 449         bottom: 0;
 450         height: 220px;
 451         width: 100%;
 452         border-top: 1px solid #E7E7E7;
 453         background-color: #F9F9F9;
 454         color: #777;
 455         padding: 20px 0;
 456         margin-top: 70px;
 457 }
 458
 459 .footer .links a {
 460         color: #777;
 461 }
 462
 463 .download-box {
 464 text-align: center;
 465 margin: 100px 0;
 466 }
 467 .progress-small {
 468 margin-top: 6px;
 469 height: 6px;
 470 }
 471 .planet-table td.author,
 472 .planet-table td.date {
 473 width: 10em;
 474 }
 475 .news-entries td.date {
 476 width: 8em;
 477 text-align: right;
 478 }
 479
 480 .table-wishlist-widget {
 481         width: 100%;
 482 }