1/*! 2 * Bootstrap Responsive v2.2.2 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@-ms-viewport { 11 width: device-width 12} 13 14.clearfix { 15 *zoom: 1 16} 17 18.clearfix:before, .clearfix:after { 19 display: table; 20 line-height: 0; 21 content: "" 22} 23 24.clearfix:after { 25 clear: both 26} 27 28.hide-text { 29 font: 0/0 a; 30 color: transparent; 31 text-shadow: none; 32 background-color: transparent; 33 border: 0 34} 35 36.input-block-level { 37 display: block; 38 width: 100%; 39 min-height: 30px; 40 -webkit-box-sizing: border-box; 41 -moz-box-sizing: border-box; 42 box-sizing: border-box 43} 44 45.hidden { 46 display: none; 47 visibility: hidden 48} 49 50.visible-phone { 51 display: none !important 52} 53 54.visible-tablet { 55 display: none !important 56} 57 58.hidden-desktop { 59 display: none !important 60} 61 62.visible-desktop { 63 display: inherit !important 64} 65 66@media (min-width: 768px) and (max-width: 979px) { 67 .hidden-desktop { 68 display: inherit !important 69 } 70 71 .visible-desktop { 72 display: none !important 73 } 74 75 .visible-tablet { 76 display: inherit !important 77 } 78 79 .hidden-tablet { 80 display: none !important 81 } 82} 83 84@media (max-width: 767px) { 85 .hidden-desktop { 86 display: inherit !important 87 } 88 89 .visible-desktop { 90 display: none !important 91 } 92 93 .visible-phone { 94 display: inherit !important 95 } 96 97 .hidden-phone { 98 display: none !important 99 } 100} 101 102@media (min-width: 1200px) { 103 .row { 104 margin-left: -30px; 105 *zoom: 1 106 } 107 108 .row:before, .row:after { 109 display: table; 110 line-height: 0; 111 content: "" 112 } 113 114 .row:after { 115 clear: both 116 } 117 118 [class*="span"] { 119 float: left; 120 min-height: 1px; 121 margin-left: 30px 122 } 123 124 .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { 125 width: 1170px 126 } 127 128 .span12 { 129 width: 1170px 130 } 131 132 .span11 { 133 width: 1070px 134 } 135 136 .span10 { 137 width: 970px 138 } 139 140 .span9 { 141 width: 870px 142 } 143 144 .span8 { 145 width: 770px 146 } 147 148 .span7 { 149 width: 670px 150 } 151 152 .span6 { 153 width: 570px 154 } 155 156 .span5 { 157 width: 470px 158 } 159 160 .span4 { 161 width: 370px 162 } 163 164 .span3 { 165 width: 270px 166 } 167 168 .span2 { 169 width: 170px 170 } 171 172 .span1 { 173 width: 70px 174 } 175 176 .offset12 { 177 margin-left: 1230px 178 } 179 180 .offset11 { 181 margin-left: 1130px 182 } 183 184 .offset10 { 185 margin-left: 1030px 186 } 187 188 .offset9 { 189 margin-left: 930px 190 } 191 192 .offset8 { 193 margin-left: 830px 194 } 195 196 .offset7 { 197 margin-left: 730px 198 } 199 200 .offset6 { 201 margin-left: 630px 202 } 203 204 .offset5 { 205 margin-left: 530px 206 } 207 208 .offset4 { 209 margin-left: 430px 210 } 211 212 .offset3 { 213 margin-left: 330px 214 } 215 216 .offset2 { 217 margin-left: 230px 218 } 219 220 .offset1 { 221 margin-left: 130px 222 } 223 224 .row-fluid { 225 width: 100%; 226 *zoom: 1 227 } 228 229 .row-fluid:before, .row-fluid:after { 230 display: table; 231 line-height: 0; 232 content: "" 233 } 234 235 .row-fluid:after { 236 clear: both 237 } 238 239 .row-fluid [class*="span"] { 240 display: block; 241 float: left; 242 width: 100%; 243 min-height: 30px; 244 margin-left: 2.564102564102564%; 245 *margin-left: 2.5109110747408616%; 246 -webkit-box-sizing: border-box; 247 -moz-box-sizing: border-box; 248 box-sizing: border-box 249 } 250 251 .row-fluid [class*="span"]:first-child { 252 margin-left: 0 253 } 254 255 .row-fluid .controls-row [class*="span"] + [class*="span"] { 256 margin-left: 2.564102564102564% 257 } 258 259 .row-fluid .span12 { 260 width: 100%; 261 *width: 99.94680851063829% 262 } 263 264 .row-fluid .span11 { 265 width: 91.45299145299145%; 266 *width: 91.39979996362975% 267 } 268 269 .row-fluid .span10 { 270 width: 82.90598290598291%; 271 *width: 82.8527914166212% 272 } 273 274 .row-fluid .span9 { 275 width: 74.35897435897436%; 276 *width: 74.30578286961266% 277 } 278 279 .row-fluid .span8 { 280 width: 65.81196581196582%; 281 *width: 65.75877432260411% 282 } 283 284 .row-fluid .span7 { 285 width: 57.26495726495726%; 286 *width: 57.21176577559556% 287 } 288 289 .row-fluid .span6 { 290 width: 48.717948717948715%; 291 *width: 48.664757228587014% 292 } 293 294 .row-fluid .span5 { 295 width: 40.17094017094017%; 296 *width: 40.11774868157847% 297 } 298 299 .row-fluid .span4 { 300 width: 31.623931623931625%; 301 *width: 31.570740134569924% 302 } 303 304 .row-fluid .span3 { 305 width: 23.076923076923077%; 306 *width: 23.023731587561375% 307 } 308 309 .row-fluid .span2 { 310 width: 14.52991452991453%; 311 *width: 14.476723040552828% 312 } 313 314 .row-fluid .span1 { 315 width: 5.982905982905983%; 316 *width: 5.929714493544281% 317 } 318 319 .row-fluid .offset12 { 320 margin-left: 105.12820512820512%; 321 *margin-left: 105.02182214948171% 322 } 323 324 .row-fluid .offset12:first-child { 325 margin-left: 102.56410256410257%; 326 *margin-left: 102.45771958537915% 327 } 328 329 .row-fluid .offset11 { 330 margin-left: 96.58119658119658%; 331 *margin-left: 96.47481360247316% 332 } 333 334 .row-fluid .offset11:first-child { 335 margin-left: 94.01709401709402%; 336 *margin-left: 93.91071103837061% 337 } 338 339 .row-fluid .offset10 { 340 margin-left: 88.03418803418803%; 341 *margin-left: 87.92780505546462% 342 } 343 344 .row-fluid .offset10:first-child { 345 margin-left: 85.47008547008548%; 346 *margin-left: 85.36370249136206% 347 } 348 349 .row-fluid .offset9 { 350 margin-left: 79.48717948717949%; 351 *margin-left: 79.38079650845607% 352 } 353 354 .row-fluid .offset9:first-child { 355 margin-left: 76.92307692307693%; 356 *margin-left: 76.81669394435352% 357 } 358 359 .row-fluid .offset8 { 360 margin-left: 70.94017094017094%; 361 *margin-left: 70.83378796144753% 362 } 363 364 .row-fluid .offset8:first-child { 365 margin-left: 68.37606837606839%; 366 *margin-left: 68.26968539734497% 367 } 368 369 .row-fluid .offset7 { 370 margin-left: 62.393162393162385%; 371 *margin-left: 62.28677941443899% 372 } 373 374 .row-fluid .offset7:first-child { 375 margin-left: 59.82905982905982%; 376 *margin-left: 59.72267685033642% 377 } 378 379 .row-fluid .offset6 { 380 margin-left: 53.84615384615384%; 381 *margin-left: 53.739770867430444% 382 } 383 384 .row-fluid .offset6:first-child { 385 margin-left: 51.28205128205128%; 386 *margin-left: 51.175668303327875% 387 } 388 389 .row-fluid .offset5 { 390 margin-left: 45.299145299145295%; 391 *margin-left: 45.1927623204219% 392 } 393 394 .row-fluid .offset5:first-child { 395 margin-left: 42.73504273504273%; 396 *margin-left: 42.62865975631933% 397 } 398 399 .row-fluid .offset4 { 400 margin-left: 36.75213675213675%; 401 *margin-left: 36.645753773413354% 402 } 403 404 .row-fluid .offset4:first-child { 405 margin-left: 34.18803418803419%; 406 *margin-left: 34.081651209310785% 407 } 408 409 .row-fluid .offset3 { 410 margin-left: 28.205128205128204%; 411 *margin-left: 28.0987452264048% 412 } 413 414 .row-fluid .offset3:first-child { 415 margin-left: 25.641025641025642%; 416 *margin-left: 25.53464266230224% 417 } 418 419 .row-fluid .offset2 { 420 margin-left: 19.65811965811966%; 421 *margin-left: 19.551736679396257% 422 } 423 424 .row-fluid .offset2:first-child { 425 margin-left: 17.094017094017094%; 426 *margin-left: 16.98763411529369% 427 } 428 429 .row-fluid .offset1 { 430 margin-left: 11.11111111111111%; 431 *margin-left: 11.004728132387708% 432 } 433 434 .row-fluid .offset1:first-child { 435 margin-left: 8.547008547008547%; 436 *margin-left: 8.440625568285142% 437 } 438 439 input, textarea, .uneditable-input { 440 margin-left: 0 441 } 442 443 .controls-row [class*="span"] + [class*="span"] { 444 margin-left: 30px 445 } 446 447 input.span12, textarea.span12, .uneditable-input.span12 { 448 width: 1156px 449 } 450 451 input.span11, textarea.span11, .uneditable-input.span11 { 452 width: 1056px 453 } 454 455 input.span10, textarea.span10, .uneditable-input.span10 { 456 width: 956px 457 } 458 459 input.span9, textarea.span9, .uneditable-input.span9 { 460 width: 856px 461 } 462 463 input.span8, textarea.span8, .uneditable-input.span8 { 464 width: 756px 465 } 466 467 input.span7, textarea.span7, .uneditable-input.span7 { 468 width: 656px 469 } 470 471 input.span6, textarea.span6, .uneditable-input.span6 { 472 width: 556px 473 } 474 475 input.span5, textarea.span5, .uneditable-input.span5 { 476 width: 456px 477 } 478 479 input.span4, textarea.span4, .uneditable-input.span4 { 480 width: 356px 481 } 482 483 input.span3, textarea.span3, .uneditable-input.span3 { 484 width: 256px 485 } 486 487 input.span2, textarea.span2, .uneditable-input.span2 { 488 width: 156px 489 } 490 491 input.span1, textarea.span1, .uneditable-input.span1 { 492 width: 56px 493 } 494 495 .thumbnails { 496 margin-left: -30px 497 } 498 499 .thumbnails > li { 500 margin-left: 30px 501 } 502 503 .row-fluid .thumbnails { 504 margin-left: 0 505 } 506} 507 508@media (min-width: 768px) and (max-width: 979px) { 509 .row { 510 margin-left: -20px; 511 *zoom: 1 512 } 513 514 .row:before, .row:after { 515 display: table; 516 line-height: 0; 517 content: "" 518 } 519 520 .row:after { 521 clear: both 522 } 523 524 [class*="span"] { 525 float: left; 526 min-height: 1px; 527 margin-left: 20px 528 } 529 530 .container, .navbar-static-top .container, .navbar-fixed-top .container, .navbar-fixed-bottom .container { 531 width: 724px 532 } 533 534 .span12 { 535 width: 724px 536 } 537 538 .span11 { 539 width: 662px 540 } 541 542 .span10 { 543 width: 600px 544 } 545 546 .span9 { 547 width: 538px 548 } 549 550 .span8 { 551 width: 476px 552 } 553 554 .span7 { 555 width: 414px 556 } 557 558 .span6 { 559 width: 352px 560 } 561 562 .span5 { 563 width: 290px 564 } 565 566 .span4 { 567 width: 228px 568 } 569 570 .span3 { 571 width: 166px 572 } 573 574 .span2 { 575 width: 104px 576 } 577 578 .span1 { 579 width: 42px 580 } 581 582 .offset12 { 583 margin-left: 764px 584 } 585 586 .offset11 { 587 margin-left: 702px 588 } 589 590 .offset10 { 591 margin-left: 640px 592 } 593 594 .offset9 { 595 margin-left: 578px 596 } 597 598 .offset8 { 599 margin-left: 516px 600 } 601 602 .offset7 { 603 margin-left: 454px 604 } 605 606 .offset6 { 607 margin-left: 392px 608 } 609 610 .offset5 { 611 margin-left: 330px 612 } 613 614 .offset4 { 615 margin-left: 268px 616 } 617 618 .offset3 { 619 margin-left: 206px 620 } 621 622 .offset2 { 623 margin-left: 144px 624 } 625 626 .offset1 { 627 margin-left: 82px 628 } 629 630 .row-fluid { 631 width: 100%; 632 *zoom: 1 633 } 634 635 .row-fluid:before, .row-fluid:after { 636 display: table; 637 line-height: 0; 638 content: "" 639 } 640 641 .row-fluid:after { 642 clear: both 643 } 644 645 .row-fluid [class*="span"] { 646 display: block; 647 float: left; 648 width: 100%; 649 min-height: 30px; 650 margin-left: 2.7624309392265194%; 651 *margin-left: 2.709239449864817%; 652 -webkit-box-sizing: border-box; 653 -moz-box-sizing: border-box; 654 box-sizing: border-box 655 } 656 657 .row-fluid [class*="span"]:first-child { 658 margin-left: 0 659 } 660 661 .row-fluid .controls-row [class*="span"] + [class*="span"] { 662 margin-left: 2.7624309392265194% 663 } 664 665 .row-fluid .span12 { 666 width: 100%; 667 *width: 99.94680851063829% 668 } 669 670 .row-fluid .span11 { 671 width: 91.43646408839778%; 672 *width: 91.38327259903608% 673 } 674 675 .row-fluid .span10 { 676 width: 82.87292817679558%; 677 *width: 82.81973668743387% 678 } 679 680 .row-fluid .span9 { 681 width: 74.30939226519337%; 682 *width: 74.25620077583166% 683 } 684 685 .row-fluid .span8 { 686 width: 65.74585635359117%; 687 *width: 65.69266486422946% 688 } 689 690 .row-fluid .span7 { 691 width: 57.18232044198895%; 692 *width: 57.12912895262725% 693 } 694 695 .row-fluid .span6 { 696 width: 48.61878453038674%; 697 *width: 48.56559304102504% 698 } 699 700 .row-fluid .span5 { 701 width: 40.05524861878453%; 702 *width: 40.00205712942283% 703 } 704 705 .row-fluid .span4 { 706 width: 31.491712707182323%; 707 *width: 31.43852121782062% 708 } 709 710 .row-fluid .span3 { 711 width: 22.92817679558011%; 712 *width: 22.87498530621841% 713 } 714 715 .row-fluid .span2 { 716 width: 14.3646408839779%; 717 *width: 14.311449394616199% 718 } 719 720 .row-fluid .span1 { 721 width: 5.801104972375691%; 722 *width: 5.747913483013988% 723 } 724 725 .row-fluid .offset12 { 726 margin-left: 105.52486187845304%; 727 *margin-left: 105.41847889972962% 728 } 729 730 .row-fluid .offset12:first-child { 731 margin-left: 102.76243093922652%; 732 *margin-left: 102.6560479605031% 733 } 734 735 .row-fluid .offset11 { 736 margin-left: 96.96132596685082%; 737 *margin-left: 96.8549429881274% 738 } 739 740 .row-fluid .offset11:first-child { 741 margin-left: 94.1988950276243%; 742 *margin-left: 94.09251204890089% 743 } 744 745 .row-fluid .offset10 { 746 margin-left: 88.39779005524862%; 747 *margin-left: 88.2914070765252% 748 } 749 750 .row-fluid .offset10:first-child { 751 margin-left: 85.6353591160221%; 752 *margin-left: 85.52897613729868% 753 } 754 755 .row-fluid .offset9 { 756 margin-left: 79.8342541436464%; 757 *margin-left: 79.72787116492299% 758 } 759 760 .row-fluid .offset9:first-child { 761 margin-left: 77.07182320441989%; 762 *margin-left: 76.96544022569647% 763 } 764 765 .row-fluid .offset8 { 766 margin-left: 71.2707182320442%; 767 *margin-left: 71.16433525332079% 768 } 769 770 .row-fluid .offset8:first-child { 771 margin-left: 68.50828729281768%; 772 *margin-left: 68.40190431409427% 773 } 774 775 .row-fluid .offset7 { 776 margin-left: 62.70718232044199%; 777 *margin-left: 62.600799341718584% 778 } 779 780 .row-fluid .offset7:first-child { 781 margin-left: 59.94475138121547%; 782 *margin-left: 59.838368402492065% 783 } 784 785 .row-fluid .offset6 { 786 margin-left: 54.14364640883978%; 787 *margin-left: 54.037263430116376% 788 } 789 790 .row-fluid .offset6:first-child { 791 margin-left: 51.38121546961326%; 792 *margin-left: 51.27483249088986% 793 } 794 795 .row-fluid .offset5 { 796 margin-left: 45.58011049723757%; 797 *margin-left: 45.47372751851417% 798 } 799 800 .row-fluid .offset5:first-child { 801 margin-left: 42.81767955801105%; 802 *margin-left: 42.71129657928765% 803 } 804 805 .row-fluid .offset4 { 806 margin-left: 37.01657458563536%; 807 *margin-left: 36.91019160691196% 808 } 809 810 .row-fluid .offset4:first-child { 811 margin-left: 34.25414364640884%; 812 *margin-left: 34.14776066768544% 813 } 814 815 .row-fluid .offset3 { 816 margin-left: 28.45303867403315%; 817 *margin-left: 28.346655695309746% 818 } 819 820 .row-fluid .offset3:first-child { 821 margin-left: 25.69060773480663%; 822 *margin-left: 25.584224756083227% 823 } 824 825 .row-fluid .offset2 { 826 margin-left: 19.88950276243094%; 827 *margin-left: 19.783119783707537% 828 } 829 830 .row-fluid .offset2:first-child { 831 margin-left: 17.12707182320442%; 832 *margin-left: 17.02068884448102% 833 } 834 835 .row-fluid .offset1 { 836 margin-left: 11.32596685082873%; 837 *margin-left: 11.219583872105325% 838 } 839 840 .row-fluid .offset1:first-child { 841 margin-left: 8.56353591160221%; 842 *margin-left: 8.457152932878806% 843 } 844 845 input, textarea, .uneditable-input { 846 margin-left: 0 847 } 848 849 .controls-row [class*="span"] + [class*="span"] { 850 margin-left: 20px 851 } 852 853 input.span12, textarea.span12, .uneditable-input.span12 { 854 width: 710px 855 } 856 857 input.span11, textarea.span11, .uneditable-input.span11 { 858 width: 648px 859 } 860 861 input.span10, textarea.span10, .uneditable-input.span10 { 862 width: 586px 863 } 864 865 input.span9, textarea.span9, .uneditable-input.span9 { 866 width: 524px 867 } 868 869 input.span8, textarea.span8, .uneditable-input.span8 { 870 width: 462px 871 } 872 873 input.span7, textarea.span7, .uneditable-input.span7 { 874 width: 400px 875 } 876 877 input.span6, textarea.span6, .uneditable-input.span6 { 878 width: 338px 879 } 880 881 input.span5, textarea.span5, .uneditable-input.span5 { 882 width: 276px 883 } 884 885 input.span4, textarea.span4, .uneditable-input.span4 { 886 width: 214px 887 } 888 889 input.span3, textarea.span3, .uneditable-input.span3 { 890 width: 152px 891 } 892 893 input.span2, textarea.span2, .uneditable-input.span2 { 894 width: 90px 895 } 896 897 input.span1, textarea.span1, .uneditable-input.span1 { 898 width: 28px 899 } 900}