static/css/style.css

   1 body {
   2         padding-top: 45px;
   3 }
   4
   5 .container-body {
   6         background-color: white;
   7
   8         padding-top: 10px;
   9         padding-left: 15px;
  10         padding-right: 15px;
  11         padding-bottom: 10px;
  12 }
  13
  14 .ac {
  15         text-align: center;
  16 }
  17
  18 .ar {
  19         text-align: right;
  20 }
  21
  22 .clear {
  23         clear: both;
  24 }
  25
  26 .separator {
  27   margin: 40px 0 39px;
  28 }
  29
  30 .img-padding {
  31         padding: 10px;
  32 }
  33
  34 table.table-fireinfo td.bar {
  35         width: 70%;
  36 }
  37
  38 table.table-fireinfo td.key {
  39         width: 20%;
  40 }
  41
  42 table.table-fireinfo td.val {
  43         width: 10%;
  44 }
  45
  46 .wishes li div.thumbnail {
  47         padding: 1em;
  48 }
  49
  50 .objectives .icon {
  51         padding: 1.2em;
  52 }
  53
  54 .thumbnails .download-box {
  55         padding-top: 2em;
  56         padding-left: 2em;
  57         padding-right: 2em;
  58 }
  59
  60 section {
  61         padding-top: 40px;
  62 }
  63
  64 section > .page-header, section > .lead {
  65         color: #5a5a5a;
  66 }
  67
  68 section > ul li {
  69         margin-bottom: 5px;
  70 }
  71
  72 .jumbotron {
  73         position: relative;
  74         padding: 40px 0;
  75         color: #fff;
  76         text-align: center;
  77         text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075);
  78         background: #880400; /* Old browsers */
  79         background: -moz-linear-gradient(45deg, #000000 0%, #880400 100%); /* FF3.6+ */
  80         background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#000000), color-stop(100%,#880400)); /* Chrome,Safari4+ */
  81         background: -webkit-linear-gradient(45deg, #000000 0%,#880400 100%); /* Chrome10+,Safari5.1+ */
  82         background: -o-linear-gradient(45deg, #000000 0%, #880400 100%); /* Opera 11.10+ */
  83         background: -ms-linear-gradient(45deg, #000000 0%, #880400 100%); /* IE10+ */
  84         background: linear-gradient(45deg,  #000000 0%, #880400 100%); /* W3C */
  85         filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#000000', endColorstr='#880400',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
  86         -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
  87            -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
  88                     box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
  89         margin-bottom: 1em;
  90 }
  91
  92 .jumbotron h1 {
  93         font-size: 80px;
  94         font-weight: bold;
  95         letter-spacing: -1px;
  96         line-height: 1;
  97 }
  98
  99 .jumbotron p {
 100         font-size: 24px;
 101         font-weight: 300;
 102         line-height: 1.25;
 103         margin-bottom: 30px;
 104 }
 105
 106 .jumbotron a {
 107         color: #fff;
 108         color: rgba(255,255,255,.5);
 109 }
 110
 111 .jumbotron a:hover {
 112         color: #fff;
 113         text-shadow: 0 0 10px rgba(255,255,255,.25);
 114 }
 115
 116 /* Download button */
 117 .masthead .btn, .download-button {
 118   padding: 19px 24px;
 119   font-size: 24px;
 120   font-weight: 200;
 121   color: #fff;
 122 }
 123
 124 .jumbotron .container {
 125         position: relative;
 126         z-index: 2;
 127 }
 128
 129 .masthead {
 130         padding: 70px 0 60px;
 131         margin-bottom: 0;
 132         color: #fff;
 133 }
 134
 135 .masthead h1 {
 136         font-size: 120px;
 137         line-height: 1;
 138         letter-spacing: -2px;
 139 }
 140
 141 .masthead p {
 142         font-size: 40px;
 143         font-weight: 200;
 144         line-height: 1.25;
 145 }
 146
 147 .masthead-links {
 148         margin: 0;
 149         list-style: none;
 150 }
 151
 152 .masthead-links li {
 153         display: inline;
 154         padding: 0 10px;
 155         color: rgba(255,255,255,.5);
 156 }
 157
 158 .subhead {
 159         text-align: left;
 160         border-bottom: 1px solid #ddd;
 161 }
 162
 163 .subhead h1 {
 164         font-size: 60px;
 165 }
 166
 167 .subhead p {
 168         margin-bottom: 20px;
 169 }
 170
 171 .subhead .navbar {
 172         display: none;
 173 }
 174
 175 .footer {
 176 /*      text-align: center; */
 177         padding: 30px 0;
 178         margin-top: 70px;
 179         border-top: 1px solid #e5e5e5;
 180         background-color: #f8f8f8;
 181 }
 182
 183 .footer p {
 184         margin-bottom: 0;
 185         color: #777;
 186 }
 187
 188 .footer-links {
 189         margin: 10px 0;
 190 }
 191
 192 .footer-links li {
 193         display: inline;
 194         padding: 0 2px;
 195 }
 196
 197 .footer-links li:first-child {
 198         padding-left: 0;
 199 }
 200
 201 .sidenav {
 202         width: 228px;
 203         margin: 30px 0 0;
 204         padding: 0;
 205         background-color: #fff;
 206         -webkit-border-radius: 6px;
 207            -moz-border-radius: 6px;
 208                 border-radius: 6px;
 209         -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.065);
 210            -moz-box-shadow: 0 1px 4px rgba(0,0,0,.065);
 211                 box-shadow: 0 1px 4px rgba(0,0,0,.065);
 212 }
 213
 214 .sidenav > li > a {
 215         display: block;
 216         width: 190px \9;
 217         margin: 0 0 -1px;
 218         padding: 8px 14px;
 219         border: 1px solid #e5e5e5;
 220 }
 221
 222 .sidenav > li:first-child > a {
 223         -webkit-border-radius: 6px 6px 0 0;
 224            -moz-border-radius: 6px 6px 0 0;
 225                 border-radius: 6px 6px 0 0;
 226 }
 227
 228 .sidenav > li:last-child > a {
 229         -webkit-border-radius: 0 0 6px 6px;
 230            -moz-border-radius: 0 0 6px 6px;
 231                 border-radius: 0 0 6px 6px;
 232 }
 233
 234 .sidenav > .active > a {
 235         position: relative;
 236         z-index: 2;
 237         padding: 9px 15px;
 238         border: 0;
 239         text-shadow: 0 1px 0 rgba(0,0,0,.15);
 240         -webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
 241            -moz-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
 242                 box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
 243 }
 244
 245 .sidenav .icon-chevron-left {
 246         float: left;
 247         margin-top: 2px;
 248         margin-left: -6px;
 249         opacity: .25;
 250 }
 251
 252 .sidenav > li > a:hover {
 253         background-color: #f5f5f5;
 254 }
 255
 256 .sidenav a:hover .icon-chevron-left {
 257         opacity: .5;
 258 }
 259
 260 .sidenav .active .icon-chevron-left, .sidenav .active a:hover .icon-chevron-left {
 261   background-image: url(../img/glyphicons-halflings-white.png);
 262   opacity: 1;
 263 }
 264
 265 .sidenav.affix {
 266         top: 40px;
 267 }
 268
 269 .sidenav.affix-bottom {
 270         position: absolute;
 271         top: auto;
 272         bottom: 270px;
 273 }
 274
 275 .download-box {
 276         text-align: center;
 277
 278         margin-top: 100px;
 279         margin-bottom: 100px;
 280 }
 281
 282 .progress-small {
 283         margin-top: 6px;
 284         height: 6px;
 285 }
 286
 287 @media (min-width: 768px) and (max-width: 979px) {
 288         body {
 289                 padding-top: 0;
 290         }
 291         .jumbotron {
 292                 margin-top: -25px; /* Offset bottom margin on .navbar */
 293         }
 294
 295         .sidenav {
 296                 width: 166px;
 297                 margin-top: 20px;
 298         }
 299         .sidenav.affix {
 300                 top: 0;
 301         }
 302 }
 303
 304 @media (max-width: 767px) {
 305         body {
 306                 padding-top: 0;
 307         }
 308
 309         .jumbotron {
 310                 padding: 40px 20px;
 311                 margin-top:   -25px; /* Offset bottom margin on .navbar */
 312                 margin-right: -20px;
 313                 margin-left:  -20px;
 314         }
 315
 316         .masthead h1 {
 317                 font-size: 90px;
 318         }
 319
 320         .masthead p, .masthead .btn {
 321                 font-size: 24px;
 322         }
 323
 324         .sidenav {
 325                 width: auto;
 326                 margin-bottom: 20px;
 327         }
 328
 329         .sidenav.affix {
 330                 position: static;
 331                 width: auto;
 332                 top: 0;
 333         }
 334
 335         .footer {
 336                 margin-left: -20px;
 337                 margin-right: -20px;
 338                 padding-left: 20px;
 339                 padding-right: 20px;
 340         }
 341
 342         .footer p {
 343                 margin-bottom: 9px;
 344         }
 345 }
 346
 347 @media (max-width: 480px) {
 348         body {
 349                 padding-top: 0;
 350         }
 351
 352         h2 small {
 353                 display: block;
 354         }
 355
 356         .jumbotron h1 {
 357                 font-size: 45px;
 358         }
 359
 360         .jumbotron p, .jumbotron .btn {
 361                 font-size: 18px;
 362         }
 363
 364         .jumbotron .btn {
 365                 display: block;
 366                 margin: 0 auto;
 367         }
 368
 369         .subhead h1, .subhead p {
 370                 text-align: center;
 371         }
 372
 373         table code {
 374                 white-space: normal;
 375                 word-wrap: break-word;
 376                 word-break: break-all;
 377         }
 378
 379         .footer {
 380                 padding-top: 20px;
 381                 padding-bottom: 20px;
 382         }
 383 }
 384
 385 .planet-table td.date {
 386         width: 10em;
 387 }
 388
 389 .planet-table td.author {
 390         width: 10em;
 391 }
 392
 393 .news-entries td.date {
 394         width: 8em;
 395         text-align: right;
 396 }
 397
 398 .well-white {
 399         background-color: white;
 400 }
 401
 402 .table-wishlist-widget {
 403         width: 100%;
 404 }
 405
 406 .table-wishlist-widget td.progress-bar {
 407         width: 40%;
 408 }