]> git.ipfire.org Git - people/shoehn/ipfire.org.git/blame - static/css/style.css
talk: Show different types of phone numbers
[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
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;
65b56a68 195}
5c124878 196
60b0917c
MT
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;
500f2409 269}
110e8687 270
60b0917c 271.red-background {
110e8687
MT
272 background: #880400;
273 color: white;
60024cc8 274}
110e8687 275
60b0917c
MT
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
60024cc8 350.container-body {
500f2409 351 background-color: #FFF;
352 padding: 10px 15px;
353}
5c124878 354
60b0917c 355.text-center, .ac, td.ac {
5c124878 356 text-align: center;
7771acea 357}
5c124878 358
3d74a9b9 359.ar {
5c124878 360 text-align: right;
3d74a9b9 361}
5c124878 362
55b162d6 363.clear {
5c124878 364 clear: both;
55b162d6 365}
5c124878 366
55b162d6 367.separator {
5c124878 368 margin: 40px 0 39px;
55b162d6 369}
5c124878 370
55b162d6 371.img-padding {
5c124878 372 padding: 10px;
55b162d6 373}
5c124878 374
60b0917c
MT
375a.link-normal {
376 color: inherit;
377}
378
379.text-overflow {
380 white-space: nowrap;
381 overflow: hidden;
382 text-overflow: ellipsis;
383}
384
60024cc8 385table.table-fireinfo td.bar {
65b56a68 386width: 70%;
91a446f0 387}
60024cc8 388table.table-fireinfo td.key {
65b56a68 389width: 20%;
314d46c8 390}
60024cc8 391table.table-fireinfo td.val {
65b56a68 392width: 10%;
54b8df1a 393}
7771acea 394.objectives .icon {
65b56a68 395padding: 1.2em;
7771acea 396}
7771acea 397.thumbnails .download-box {
65b56a68 398padding: 2em 2em 0 2em;
9b5ac075 399}
66f34dde
MT
400
401section > .page-header ~ .page-header {
60b0917c 402 padding-top: 60px;
9b5ac075 403}
05f8cfae 404
9b5ac075 405.jumbotron {
05f8cfae
MT
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);
3d6a81b2 418 text-align: center;
9b5ac075 419}
05f8cfae 420
c6ba6949
MT
421.jumbotron a {
422 color: white;
423}
424
9b5ac075
MT
425/* Download button */
426.masthead .btn, .download-button {
05f8cfae
MT
427 padding: 19px 24px;
428 font-size: 24px;
9b5ac075 429}
05f8cfae 430
9b5ac075 431.masthead {
05f8cfae
MT
432 padding-top: 70px;
433 margin-bottom: 0;
9b5ac075 434}
05f8cfae 435
9b5ac075 436.masthead h1 {
05f8cfae
MT
437 font-size: 120px;
438 line-height: 1;
439 letter-spacing: -2px;
9b5ac075 440}
05f8cfae
MT
441
442.masthead p.lead {
443 font-size: 36px;
444 font-weight: 200;
445 line-height: 1.25;
9b5ac075 446}
05f8cfae 447
500f2409 448.footer {
60b0917c
MT
449 bottom: 0;
450 height: 220px;
451 width: 100%;
b4c68079
MT
452 border-top: 1px solid #E7E7E7;
453 background-color: #F9F9F9;
454 color: #777;
455 padding: 20px 0;
456 margin-top: 70px;
9b5ac075 457}
b4c68079 458
60b0917c
MT
459.footer .links a {
460 color: #777;
9b5ac075 461}
66f34dde 462
f4bf90da 463.download-box {
65b56a68 464text-align: center;
465margin: 100px 0;
f4bf90da 466}
9d7e697a 467.progress-small {
65b56a68 468margin-top: 6px;
469height: 6px;
cc3b928d 470}
65b56a68 471.planet-table td.author,
472.planet-table td.date {
473width: 10em;
cc3b928d 474}
3d74a9b9 475.news-entries td.date {
65b56a68 476width: 8em;
477text-align: right;
9d7e697a 478}
53664d15
MT
479
480.table-wishlist-widget {
481 width: 100%;
9d7e697a 482}