Fix PXE boot URL
[people/shoehn/ipfire.org.git] / static / css / style.css
CommitLineData
60b0917c
MT
1html {
2 width: 100%;
3 height: 100%;
4}
5
940227cb 6body {
60b0917c
MT
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
8629ec0f
MT
115.navbar .btn {
116 padding: 5px;
117 margin: 5px;
118}
119
120.navbar .btn-success:hover {
121 background-color: #5cb85c !important;
122}
123
60b0917c
MT
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;
65b56a68 204}
5c124878 205
60b0917c
MT
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;
500f2409 278}
110e8687 279
60b0917c 280.red-background {
110e8687
MT
281 background: #880400;
282 color: white;
60024cc8 283}
110e8687 284
60b0917c
MT
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
60024cc8 359.container-body {
500f2409 360 background-color: #FFF;
361 padding: 10px 15px;
362}
5c124878 363
60b0917c 364.text-center, .ac, td.ac {
5c124878 365 text-align: center;
7771acea 366}
5c124878 367
3d74a9b9 368.ar {
5c124878 369 text-align: right;
3d74a9b9 370}
5c124878 371
55b162d6 372.clear {
5c124878 373 clear: both;
55b162d6 374}
5c124878 375
55b162d6 376.separator {
5c124878 377 margin: 40px 0 39px;
55b162d6 378}
5c124878 379
55b162d6 380.img-padding {
5c124878 381 padding: 10px;
55b162d6 382}
5c124878 383
60b0917c
MT
384a.link-normal {
385 color: inherit;
386}
387
388.text-overflow {
389 white-space: nowrap;
390 overflow: hidden;
391 text-overflow: ellipsis;
392}
393
60024cc8 394table.table-fireinfo td.bar {
65b56a68 395width: 70%;
91a446f0 396}
60024cc8 397table.table-fireinfo td.key {
65b56a68 398width: 20%;
314d46c8 399}
60024cc8 400table.table-fireinfo td.val {
65b56a68 401width: 10%;
54b8df1a 402}
7771acea 403.objectives .icon {
65b56a68 404padding: 1.2em;
7771acea 405}
7771acea 406.thumbnails .download-box {
65b56a68 407padding: 2em 2em 0 2em;
9b5ac075 408}
66f34dde
MT
409
410section > .page-header ~ .page-header {
60b0917c 411 padding-top: 60px;
9b5ac075 412}
05f8cfae 413
9b5ac075 414.jumbotron {
05f8cfae
MT
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);
3d6a81b2 427 text-align: center;
9b5ac075 428}
05f8cfae 429
c6ba6949
MT
430.jumbotron a {
431 color: white;
432}
433
9b5ac075
MT
434/* Download button */
435.masthead .btn, .download-button {
05f8cfae
MT
436 padding: 19px 24px;
437 font-size: 24px;
9b5ac075 438}
05f8cfae 439
9b5ac075 440.masthead {
05f8cfae
MT
441 padding-top: 70px;
442 margin-bottom: 0;
9b5ac075 443}
05f8cfae 444
9b5ac075 445.masthead h1 {
05f8cfae
MT
446 font-size: 120px;
447 line-height: 1;
448 letter-spacing: -2px;
9b5ac075 449}
05f8cfae
MT
450
451.masthead p.lead {
452 font-size: 36px;
453 font-weight: 200;
454 line-height: 1.25;
9b5ac075 455}
05f8cfae 456
500f2409 457.footer {
60b0917c
MT
458 bottom: 0;
459 height: 220px;
460 width: 100%;
b4c68079
MT
461 border-top: 1px solid #E7E7E7;
462 background-color: #F9F9F9;
463 color: #777;
464 padding: 20px 0;
465 margin-top: 70px;
9b5ac075 466}
b4c68079 467
60b0917c
MT
468.footer .links a {
469 color: #777;
9b5ac075 470}
66f34dde 471
f4bf90da 472.download-box {
65b56a68 473text-align: center;
474margin: 100px 0;
f4bf90da 475}
9d7e697a 476.progress-small {
65b56a68 477margin-top: 6px;
478height: 6px;
cc3b928d 479}
65b56a68 480.planet-table td.author,
481.planet-table td.date {
482width: 10em;
cc3b928d 483}
3d74a9b9 484.news-entries td.date {
65b56a68 485width: 8em;
486text-align: right;
9d7e697a 487}
53664d15
MT
488
489.table-wishlist-widget {
490 width: 100%;
9d7e697a 491}