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