Mercurial > sat_legacy_website
comparison static/css/bootstrap-responsive.css @ 0:9305c6458e2f
initial commit
author | Goffi <goffi@goffi.org> |
---|---|
date | Sat, 28 Jul 2012 20:36:32 +0200 |
parents | |
children |
comparison
equal
deleted
inserted
replaced
-1:000000000000 | 0:9305c6458e2f |
---|---|
1 /*! | |
2 * Bootstrap Responsive v2.0.4 | |
3 * | |
4 * Copyright 2012 Twitter, Inc | |
5 * Licensed under the Apache License v2.0 | |
6 * http://www.apache.org/licenses/LICENSE-2.0 | |
7 * | |
8 * Designed and built with all the love in the world @twitter by @mdo and @fat. | |
9 */ | |
10 | |
11 .clearfix { | |
12 *zoom: 1; | |
13 } | |
14 | |
15 .clearfix:before, | |
16 .clearfix:after { | |
17 display: table; | |
18 content: ""; | |
19 } | |
20 | |
21 .clearfix:after { | |
22 clear: both; | |
23 } | |
24 | |
25 .hide-text { | |
26 font: 0/0 a; | |
27 color: transparent; | |
28 text-shadow: none; | |
29 background-color: transparent; | |
30 border: 0; | |
31 } | |
32 | |
33 .input-block-level { | |
34 display: block; | |
35 width: 100%; | |
36 min-height: 28px; | |
37 -webkit-box-sizing: border-box; | |
38 -moz-box-sizing: border-box; | |
39 -ms-box-sizing: border-box; | |
40 box-sizing: border-box; | |
41 } | |
42 | |
43 .hidden { | |
44 display: none; | |
45 visibility: hidden; | |
46 } | |
47 | |
48 .visible-phone { | |
49 display: none !important; | |
50 } | |
51 | |
52 .visible-tablet { | |
53 display: none !important; | |
54 } | |
55 | |
56 .hidden-desktop { | |
57 display: none !important; | |
58 } | |
59 | |
60 @media (max-width: 767px) { | |
61 .visible-phone { | |
62 display: inherit !important; | |
63 } | |
64 .hidden-phone { | |
65 display: none !important; | |
66 } | |
67 .hidden-desktop { | |
68 display: inherit !important; | |
69 } | |
70 .visible-desktop { | |
71 display: none !important; | |
72 } | |
73 } | |
74 | |
75 @media (min-width: 768px) and (max-width: 979px) { | |
76 .visible-tablet { | |
77 display: inherit !important; | |
78 } | |
79 .hidden-tablet { | |
80 display: none !important; | |
81 } | |
82 .hidden-desktop { | |
83 display: inherit !important; | |
84 } | |
85 .visible-desktop { | |
86 display: none !important ; | |
87 } | |
88 } | |
89 | |
90 @media (max-width: 480px) { | |
91 .nav-collapse { | |
92 -webkit-transform: translate3d(0, 0, 0); | |
93 } | |
94 .page-header h1 small { | |
95 display: block; | |
96 line-height: 18px; | |
97 } | |
98 input[type="checkbox"], | |
99 input[type="radio"] { | |
100 border: 1px solid #ccc; | |
101 } | |
102 .form-horizontal .control-group > label { | |
103 float: none; | |
104 width: auto; | |
105 padding-top: 0; | |
106 text-align: left; | |
107 } | |
108 .form-horizontal .controls { | |
109 margin-left: 0; | |
110 } | |
111 .form-horizontal .control-list { | |
112 padding-top: 0; | |
113 } | |
114 .form-horizontal .form-actions { | |
115 padding-right: 10px; | |
116 padding-left: 10px; | |
117 } | |
118 .modal { | |
119 position: absolute; | |
120 top: 10px; | |
121 right: 10px; | |
122 left: 10px; | |
123 width: auto; | |
124 margin: 0; | |
125 } | |
126 .modal.fade.in { | |
127 top: auto; | |
128 } | |
129 .modal-header .close { | |
130 padding: 10px; | |
131 margin: -10px; | |
132 } | |
133 .carousel-caption { | |
134 position: static; | |
135 } | |
136 } | |
137 | |
138 @media (max-width: 767px) { | |
139 body { | |
140 padding-right: 20px; | |
141 padding-left: 20px; | |
142 } | |
143 .navbar-fixed-top, | |
144 .navbar-fixed-bottom { | |
145 margin-right: -20px; | |
146 margin-left: -20px; | |
147 } | |
148 .container-fluid { | |
149 padding: 0; | |
150 } | |
151 .dl-horizontal dt { | |
152 float: none; | |
153 width: auto; | |
154 clear: none; | |
155 text-align: left; | |
156 } | |
157 .dl-horizontal dd { | |
158 margin-left: 0; | |
159 } | |
160 .container { | |
161 width: auto; | |
162 } | |
163 .row-fluid { | |
164 width: 100%; | |
165 } | |
166 .row, | |
167 .thumbnails { | |
168 margin-left: 0; | |
169 } | |
170 [class*="span"], | |
171 .row-fluid [class*="span"] { | |
172 display: block; | |
173 float: none; | |
174 width: auto; | |
175 margin-left: 0; | |
176 } | |
177 .input-large, | |
178 .input-xlarge, | |
179 .input-xxlarge, | |
180 input[class*="span"], | |
181 select[class*="span"], | |
182 textarea[class*="span"], | |
183 .uneditable-input { | |
184 display: block; | |
185 width: 100%; | |
186 min-height: 28px; | |
187 -webkit-box-sizing: border-box; | |
188 -moz-box-sizing: border-box; | |
189 -ms-box-sizing: border-box; | |
190 box-sizing: border-box; | |
191 } | |
192 .input-prepend input, | |
193 .input-append input, | |
194 .input-prepend input[class*="span"], | |
195 .input-append input[class*="span"] { | |
196 display: inline-block; | |
197 width: auto; | |
198 } | |
199 } | |
200 | |
201 @media (min-width: 768px) and (max-width: 979px) { | |
202 .row { | |
203 margin-left: -20px; | |
204 *zoom: 1; | |
205 } | |
206 .row:before, | |
207 .row:after { | |
208 display: table; | |
209 content: ""; | |
210 } | |
211 .row:after { | |
212 clear: both; | |
213 } | |
214 [class*="span"] { | |
215 float: left; | |
216 margin-left: 20px; | |
217 } | |
218 .container, | |
219 .navbar-fixed-top .container, | |
220 .navbar-fixed-bottom .container { | |
221 width: 724px; | |
222 } | |
223 .span12 { | |
224 width: 724px; | |
225 } | |
226 .span11 { | |
227 width: 662px; | |
228 } | |
229 .span10 { | |
230 width: 600px; | |
231 } | |
232 .span9 { | |
233 width: 538px; | |
234 } | |
235 .span8 { | |
236 width: 476px; | |
237 } | |
238 .span7 { | |
239 width: 414px; | |
240 } | |
241 .span6 { | |
242 width: 352px; | |
243 } | |
244 .span5 { | |
245 width: 290px; | |
246 } | |
247 .span4 { | |
248 width: 228px; | |
249 } | |
250 .span3 { | |
251 width: 166px; | |
252 } | |
253 .span2 { | |
254 width: 104px; | |
255 } | |
256 .span1 { | |
257 width: 42px; | |
258 } | |
259 .offset12 { | |
260 margin-left: 764px; | |
261 } | |
262 .offset11 { | |
263 margin-left: 702px; | |
264 } | |
265 .offset10 { | |
266 margin-left: 640px; | |
267 } | |
268 .offset9 { | |
269 margin-left: 578px; | |
270 } | |
271 .offset8 { | |
272 margin-left: 516px; | |
273 } | |
274 .offset7 { | |
275 margin-left: 454px; | |
276 } | |
277 .offset6 { | |
278 margin-left: 392px; | |
279 } | |
280 .offset5 { | |
281 margin-left: 330px; | |
282 } | |
283 .offset4 { | |
284 margin-left: 268px; | |
285 } | |
286 .offset3 { | |
287 margin-left: 206px; | |
288 } | |
289 .offset2 { | |
290 margin-left: 144px; | |
291 } | |
292 .offset1 { | |
293 margin-left: 82px; | |
294 } | |
295 .row-fluid { | |
296 width: 100%; | |
297 *zoom: 1; | |
298 } | |
299 .row-fluid:before, | |
300 .row-fluid:after { | |
301 display: table; | |
302 content: ""; | |
303 } | |
304 .row-fluid:after { | |
305 clear: both; | |
306 } | |
307 .row-fluid [class*="span"] { | |
308 display: block; | |
309 float: left; | |
310 width: 100%; | |
311 min-height: 28px; | |
312 margin-left: 2.762430939%; | |
313 *margin-left: 2.709239449638298%; | |
314 -webkit-box-sizing: border-box; | |
315 -moz-box-sizing: border-box; | |
316 -ms-box-sizing: border-box; | |
317 box-sizing: border-box; | |
318 } | |
319 .row-fluid [class*="span"]:first-child { | |
320 margin-left: 0; | |
321 } | |
322 .row-fluid .span12 { | |
323 width: 99.999999993%; | |
324 *width: 99.9468085036383%; | |
325 } | |
326 .row-fluid .span11 { | |
327 width: 91.436464082%; | |
328 *width: 91.38327259263829%; | |
329 } | |
330 .row-fluid .span10 { | |
331 width: 82.87292817100001%; | |
332 *width: 82.8197366816383%; | |
333 } | |
334 .row-fluid .span9 { | |
335 width: 74.30939226%; | |
336 *width: 74.25620077063829%; | |
337 } | |
338 .row-fluid .span8 { | |
339 width: 65.74585634900001%; | |
340 *width: 65.6926648596383%; | |
341 } | |
342 .row-fluid .span7 { | |
343 width: 57.182320438000005%; | |
344 *width: 57.129128948638304%; | |
345 } | |
346 .row-fluid .span6 { | |
347 width: 48.618784527%; | |
348 *width: 48.5655930376383%; | |
349 } | |
350 .row-fluid .span5 { | |
351 width: 40.055248616%; | |
352 *width: 40.0020571266383%; | |
353 } | |
354 .row-fluid .span4 { | |
355 width: 31.491712705%; | |
356 *width: 31.4385212156383%; | |
357 } | |
358 .row-fluid .span3 { | |
359 width: 22.928176794%; | |
360 *width: 22.874985304638297%; | |
361 } | |
362 .row-fluid .span2 { | |
363 width: 14.364640883%; | |
364 *width: 14.311449393638298%; | |
365 } | |
366 .row-fluid .span1 { | |
367 width: 5.801104972%; | |
368 *width: 5.747913482638298%; | |
369 } | |
370 input, | |
371 textarea, | |
372 .uneditable-input { | |
373 margin-left: 0; | |
374 } | |
375 input.span12, | |
376 textarea.span12, | |
377 .uneditable-input.span12 { | |
378 width: 714px; | |
379 } | |
380 input.span11, | |
381 textarea.span11, | |
382 .uneditable-input.span11 { | |
383 width: 652px; | |
384 } | |
385 input.span10, | |
386 textarea.span10, | |
387 .uneditable-input.span10 { | |
388 width: 590px; | |
389 } | |
390 input.span9, | |
391 textarea.span9, | |
392 .uneditable-input.span9 { | |
393 width: 528px; | |
394 } | |
395 input.span8, | |
396 textarea.span8, | |
397 .uneditable-input.span8 { | |
398 width: 466px; | |
399 } | |
400 input.span7, | |
401 textarea.span7, | |
402 .uneditable-input.span7 { | |
403 width: 404px; | |
404 } | |
405 input.span6, | |
406 textarea.span6, | |
407 .uneditable-input.span6 { | |
408 width: 342px; | |
409 } | |
410 input.span5, | |
411 textarea.span5, | |
412 .uneditable-input.span5 { | |
413 width: 280px; | |
414 } | |
415 input.span4, | |
416 textarea.span4, | |
417 .uneditable-input.span4 { | |
418 width: 218px; | |
419 } | |
420 input.span3, | |
421 textarea.span3, | |
422 .uneditable-input.span3 { | |
423 width: 156px; | |
424 } | |
425 input.span2, | |
426 textarea.span2, | |
427 .uneditable-input.span2 { | |
428 width: 94px; | |
429 } | |
430 input.span1, | |
431 textarea.span1, | |
432 .uneditable-input.span1 { | |
433 width: 32px; | |
434 } | |
435 } | |
436 | |
437 @media (min-width: 1200px) { | |
438 .row { | |
439 margin-left: -30px; | |
440 *zoom: 1; | |
441 } | |
442 .row:before, | |
443 .row:after { | |
444 display: table; | |
445 content: ""; | |
446 } | |
447 .row:after { | |
448 clear: both; | |
449 } | |
450 [class*="span"] { | |
451 float: left; | |
452 margin-left: 30px; | |
453 } | |
454 .container, | |
455 .navbar-fixed-top .container, | |
456 .navbar-fixed-bottom .container { | |
457 width: 1170px; | |
458 } | |
459 .span12 { | |
460 width: 1170px; | |
461 } | |
462 .span11 { | |
463 width: 1070px; | |
464 } | |
465 .span10 { | |
466 width: 970px; | |
467 } | |
468 .span9 { | |
469 width: 870px; | |
470 } | |
471 .span8 { | |
472 width: 770px; | |
473 } | |
474 .span7 { | |
475 width: 670px; | |
476 } | |
477 .span6 { | |
478 width: 570px; | |
479 } | |
480 .span5 { | |
481 width: 470px; | |
482 } | |
483 .span4 { | |
484 width: 370px; | |
485 } | |
486 .span3 { | |
487 width: 270px; | |
488 } | |
489 .span2 { | |
490 width: 170px; | |
491 } | |
492 .span1 { | |
493 width: 70px; | |
494 } | |
495 .offset12 { | |
496 margin-left: 1230px; | |
497 } | |
498 .offset11 { | |
499 margin-left: 1130px; | |
500 } | |
501 .offset10 { | |
502 margin-left: 1030px; | |
503 } | |
504 .offset9 { | |
505 margin-left: 930px; | |
506 } | |
507 .offset8 { | |
508 margin-left: 830px; | |
509 } | |
510 .offset7 { | |
511 margin-left: 730px; | |
512 } | |
513 .offset6 { | |
514 margin-left: 630px; | |
515 } | |
516 .offset5 { | |
517 margin-left: 530px; | |
518 } | |
519 .offset4 { | |
520 margin-left: 430px; | |
521 } | |
522 .offset3 { | |
523 margin-left: 330px; | |
524 } | |
525 .offset2 { | |
526 margin-left: 230px; | |
527 } | |
528 .offset1 { | |
529 margin-left: 130px; | |
530 } | |
531 .row-fluid { | |
532 width: 100%; | |
533 *zoom: 1; | |
534 } | |
535 .row-fluid:before, | |
536 .row-fluid:after { | |
537 display: table; | |
538 content: ""; | |
539 } | |
540 .row-fluid:after { | |
541 clear: both; | |
542 } | |
543 .row-fluid [class*="span"] { | |
544 display: block; | |
545 float: left; | |
546 width: 100%; | |
547 min-height: 28px; | |
548 margin-left: 2.564102564%; | |
549 *margin-left: 2.510911074638298%; | |
550 -webkit-box-sizing: border-box; | |
551 -moz-box-sizing: border-box; | |
552 -ms-box-sizing: border-box; | |
553 box-sizing: border-box; | |
554 } | |
555 .row-fluid [class*="span"]:first-child { | |
556 margin-left: 0; | |
557 } | |
558 .row-fluid .span12 { | |
559 width: 100%; | |
560 *width: 99.94680851063829%; | |
561 } | |
562 .row-fluid .span11 { | |
563 width: 91.45299145300001%; | |
564 *width: 91.3997999636383%; | |
565 } | |
566 .row-fluid .span10 { | |
567 width: 82.905982906%; | |
568 *width: 82.8527914166383%; | |
569 } | |
570 .row-fluid .span9 { | |
571 width: 74.358974359%; | |
572 *width: 74.30578286963829%; | |
573 } | |
574 .row-fluid .span8 { | |
575 width: 65.81196581200001%; | |
576 *width: 65.7587743226383%; | |
577 } | |
578 .row-fluid .span7 { | |
579 width: 57.264957265%; | |
580 *width: 57.2117657756383%; | |
581 } | |
582 .row-fluid .span6 { | |
583 width: 48.717948718%; | |
584 *width: 48.6647572286383%; | |
585 } | |
586 .row-fluid .span5 { | |
587 width: 40.170940171000005%; | |
588 *width: 40.117748681638304%; | |
589 } | |
590 .row-fluid .span4 { | |
591 width: 31.623931624%; | |
592 *width: 31.5707401346383%; | |
593 } | |
594 .row-fluid .span3 { | |
595 width: 23.076923077%; | |
596 *width: 23.0237315876383%; | |
597 } | |
598 .row-fluid .span2 { | |
599 width: 14.529914530000001%; | |
600 *width: 14.4767230406383%; | |
601 } | |
602 .row-fluid .span1 { | |
603 width: 5.982905983%; | |
604 *width: 5.929714493638298%; | |
605 } | |
606 input, | |
607 textarea, | |
608 .uneditable-input { | |
609 margin-left: 0; | |
610 } | |
611 input.span12, | |
612 textarea.span12, | |
613 .uneditable-input.span12 { | |
614 width: 1160px; | |
615 } | |
616 input.span11, | |
617 textarea.span11, | |
618 .uneditable-input.span11 { | |
619 width: 1060px; | |
620 } | |
621 input.span10, | |
622 textarea.span10, | |
623 .uneditable-input.span10 { | |
624 width: 960px; | |
625 } | |
626 input.span9, | |
627 textarea.span9, | |
628 .uneditable-input.span9 { | |
629 width: 860px; | |
630 } | |
631 input.span8, | |
632 textarea.span8, | |
633 .uneditable-input.span8 { | |
634 width: 760px; | |
635 } | |
636 input.span7, | |
637 textarea.span7, | |
638 .uneditable-input.span7 { | |
639 width: 660px; | |
640 } | |
641 input.span6, | |
642 textarea.span6, | |
643 .uneditable-input.span6 { | |
644 width: 560px; | |
645 } | |
646 input.span5, | |
647 textarea.span5, | |
648 .uneditable-input.span5 { | |
649 width: 460px; | |
650 } | |
651 input.span4, | |
652 textarea.span4, | |
653 .uneditable-input.span4 { | |
654 width: 360px; | |
655 } | |
656 input.span3, | |
657 textarea.span3, | |
658 .uneditable-input.span3 { | |
659 width: 260px; | |
660 } | |
661 input.span2, | |
662 textarea.span2, | |
663 .uneditable-input.span2 { | |
664 width: 160px; | |
665 } | |
666 input.span1, | |
667 textarea.span1, | |
668 .uneditable-input.span1 { | |
669 width: 60px; | |
670 } | |
671 .thumbnails { | |
672 margin-left: -30px; | |
673 } | |
674 .thumbnails > li { | |
675 margin-left: 30px; | |
676 } | |
677 .row-fluid .thumbnails { | |
678 margin-left: 0; | |
679 } | |
680 } | |
681 | |
682 @media (max-width: 979px) { | |
683 body { | |
684 padding-top: 0; | |
685 } | |
686 .navbar-fixed-top, | |
687 .navbar-fixed-bottom { | |
688 position: static; | |
689 } | |
690 .navbar-fixed-top { | |
691 margin-bottom: 18px; | |
692 } | |
693 .navbar-fixed-bottom { | |
694 margin-top: 18px; | |
695 } | |
696 .navbar-fixed-top .navbar-inner, | |
697 .navbar-fixed-bottom .navbar-inner { | |
698 padding: 5px; | |
699 } | |
700 .navbar .container { | |
701 width: auto; | |
702 padding: 0; | |
703 } | |
704 .navbar .brand { | |
705 padding-right: 10px; | |
706 padding-left: 10px; | |
707 margin: 0 0 0 -5px; | |
708 } | |
709 .nav-collapse { | |
710 clear: both; | |
711 } | |
712 .nav-collapse .nav { | |
713 float: none; | |
714 margin: 0 0 9px; | |
715 } | |
716 .nav-collapse .nav > li { | |
717 float: none; | |
718 } | |
719 .nav-collapse .nav > li > a { | |
720 margin-bottom: 2px; | |
721 } | |
722 .nav-collapse .nav > .divider-vertical { | |
723 display: none; | |
724 } | |
725 .nav-collapse .nav .nav-header { | |
726 color: #999999; | |
727 text-shadow: none; | |
728 } | |
729 .nav-collapse .nav > li > a, | |
730 .nav-collapse .dropdown-menu a { | |
731 padding: 6px 15px; | |
732 font-weight: bold; | |
733 color: #999999; | |
734 -webkit-border-radius: 3px; | |
735 -moz-border-radius: 3px; | |
736 border-radius: 3px; | |
737 } | |
738 .nav-collapse .btn { | |
739 padding: 4px 10px 4px; | |
740 font-weight: normal; | |
741 -webkit-border-radius: 4px; | |
742 -moz-border-radius: 4px; | |
743 border-radius: 4px; | |
744 } | |
745 .nav-collapse .dropdown-menu li + li a { | |
746 margin-bottom: 2px; | |
747 } | |
748 .nav-collapse .nav > li > a:hover, | |
749 .nav-collapse .dropdown-menu a:hover { | |
750 background-color: #222222; | |
751 } | |
752 .nav-collapse.in .btn-group { | |
753 padding: 0; | |
754 margin-top: 5px; | |
755 } | |
756 .nav-collapse .dropdown-menu { | |
757 position: static; | |
758 top: auto; | |
759 left: auto; | |
760 display: block; | |
761 float: none; | |
762 max-width: none; | |
763 padding: 0; | |
764 margin: 0 15px; | |
765 background-color: transparent; | |
766 border: none; | |
767 -webkit-border-radius: 0; | |
768 -moz-border-radius: 0; | |
769 border-radius: 0; | |
770 -webkit-box-shadow: none; | |
771 -moz-box-shadow: none; | |
772 box-shadow: none; | |
773 } | |
774 .nav-collapse .dropdown-menu:before, | |
775 .nav-collapse .dropdown-menu:after { | |
776 display: none; | |
777 } | |
778 .nav-collapse .dropdown-menu .divider { | |
779 display: none; | |
780 } | |
781 .nav-collapse .navbar-form, | |
782 .nav-collapse .navbar-search { | |
783 float: none; | |
784 padding: 9px 15px; | |
785 margin: 9px 0; | |
786 border-top: 1px solid #222222; | |
787 border-bottom: 1px solid #222222; | |
788 -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); | |
789 -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); | |
790 box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.1), 0 1px 0 rgba(255, 255, 255, 0.1); | |
791 } | |
792 .navbar .nav-collapse .nav.pull-right { | |
793 float: none; | |
794 margin-left: 0; | |
795 } | |
796 .nav-collapse, | |
797 .nav-collapse.collapse { | |
798 height: 0; | |
799 overflow: hidden; | |
800 } | |
801 .navbar .btn-navbar { | |
802 display: block; | |
803 } | |
804 .navbar-static .navbar-inner { | |
805 padding-right: 10px; | |
806 padding-left: 10px; | |
807 } | |
808 } | |
809 | |
810 @media (min-width: 980px) { | |
811 .nav-collapse.collapse { | |
812 height: auto !important; | |
813 overflow: visible !important; | |
814 } | |
815 } |