POLICY-SDK-APP/src/main/webapp/app/policyApp/CSS/bootstrap/docs/assets/css/src/docs.css

   1 /*!
   2  * Bootstrap Docs (http://getbootstrap.com)
   3  * Copyright 2011-2014 Twitter, Inc.
   4  * Licensed under the Creative Commons Attribution 3.0 Unported License. For
   5  * details, see http://creativecommons.org/licenses/by/3.0/.
   6  */
   7
   8
   9 /*
  10  * Bootstrap Documentation
  11  * Special styles for presenting Bootstrap's documentation and code examples.
  12  */
  13
  14
  15 /*
  16  * Scaffolding
  17  *
  18  * Update the basics of our documents to prep for docs content.
  19  */
  20
  21 body {
  22   position: relative; /* For scrollspy */
  23 }
  24
  25 /* Keep code small in tables on account of limited space */
  26 .table code {
  27   font-size: 13px;
  28   font-weight: normal;
  29 }
  30
  31 /* Inline code within headings retain the heading's background-color */
  32 h2 code,
  33 h3 code,
  34 h4 code {
  35   background-color: inherit;
  36 }
  37
  38 /* Outline button for use within the docs */
  39 .btn-outline {
  40   color: #563d7c;
  41   background-color: transparent;
  42   border-color: #563d7c;
  43 }
  44 .btn-outline:hover,
  45 .btn-outline:focus,
  46 .btn-outline:active {
  47   color: #fff;
  48   background-color: #563d7c;
  49   border-color: #563d7c;
  50 }
  51
  52 /* Inverted outline button (white on dark) */
  53 .btn-outline-inverse {
  54   color: #fff;
  55   background-color: transparent;
  56   border-color: #cdbfe3;
  57 }
  58 .btn-outline-inverse:hover,
  59 .btn-outline-inverse:focus,
  60 .btn-outline-inverse:active {
  61   color: #563d7c;
  62   text-shadow: none;
  63   background-color: #fff;
  64   border-color: #fff;
  65 }
  66
  67 /* Bootstrap "B" icon */
  68 .bs-docs-booticon {
  69   display: block;
  70   font-weight: 500;
  71   color: #fff;
  72   text-align: center;
  73   cursor: default;
  74   background-color: #563d7c;
  75   border-radius: 15%;
  76 }
  77 .bs-docs-booticon-sm {
  78   width: 30px;
  79   height: 30px;
  80   font-size: 20px;
  81   line-height: 28px;
  82 }
  83 .bs-docs-booticon-lg {
  84   width: 144px;
  85   height: 144px;
  86   font-size: 108px;
  87   line-height: 140px;
  88 }
  89 .bs-docs-booticon-inverse {
  90   color: #563d7c;
  91   background-color: #fff;
  92 }
  93 .bs-docs-booticon-outline {
  94   background-color: transparent;
  95   border: 1px solid #cdbfe3;
  96 }
  97
  98
  99 /*
 100  * Fancy skip link
 101  *
 102  * Make it look a bit less "bare bones"
 103  * Also includes focus suppression for the Chrome tabindex="-1" workaround
 104  */
 105
 106 #skippy {
 107   display: block;
 108   padding: 1em;
 109   color: #fff;
 110   background-color: #6f5499;
 111   outline: 0;
 112 }
 113
 114 #skippy .skiplink-text {
 115   padding: .5em;
 116   outline: 1px dotted;
 117 }
 118
 119 #content:focus {
 120   outline: none;
 121 }
 122
 123
 124 /*
 125  * Main navigation
 126  *
 127  * Turn the `.navbar` at the top of the docs purple.
 128  */
 129
 130 .bs-docs-nav {
 131   margin-bottom: 0;
 132   background-color: #fff;
 133   border-bottom: 0;
 134 }
 135 .bs-home-nav .bs-nav-b {
 136   display: none;
 137 }
 138 .bs-docs-nav .navbar-brand,
 139 .bs-docs-nav .navbar-nav > li > a {
 140   font-weight: 500;
 141   color: #563d7c;
 142 }
 143 .bs-docs-nav .navbar-nav > li > a:hover,
 144 .bs-docs-nav .navbar-nav > .active > a,
 145 .bs-docs-nav .navbar-nav > .active > a:hover {
 146   color: #463265;
 147   background-color: #f9f9f9;
 148 }
 149 .bs-docs-nav .navbar-toggle .icon-bar {
 150   background-color: #563d7c;
 151 }
 152 .bs-docs-nav .navbar-header .navbar-toggle {
 153   border-color: #fff;
 154 }
 155 .bs-docs-nav .navbar-header .navbar-toggle:hover,
 156 .bs-docs-nav .navbar-header .navbar-toggle:focus {
 157   background-color: #f9f9f9;
 158   border-color: #f9f9f9;
 159 }
 160
 161
 162 /*
 163  * Footer
 164  *
 165  * Separated section of content at the bottom of all pages, save the homepage.
 166  */
 167
 168 .bs-docs-footer {
 169   padding-top: 40px;
 170   padding-bottom: 40px;
 171   margin-top: 100px;
 172   color: #767676;
 173   text-align: center;
 174   border-top: 1px solid #e5e5e5;
 175 }
 176 .bs-docs-footer-links {
 177   padding-left: 0;
 178   margin-top: 20px;
 179 }
 180 .bs-docs-footer-links li {
 181   display: inline;
 182   padding: 0 2px;
 183 }
 184 .bs-docs-footer-links li:first-child {
 185   padding-left: 0;
 186 }
 187
 188 @media (min-width: 768px) {
 189   .bs-docs-footer p {
 190     margin-bottom: 0;
 191   }
 192 }
 193
 194
 195 /*
 196  * Social buttons
 197  *
 198  * Twitter and GitHub social action buttons (for homepage and footer).
 199  */
 200
 201 .bs-docs-social {
 202   margin-bottom: 20px;
 203   text-align: center;
 204 }
 205 .bs-docs-social-buttons {
 206   display: inline-block;
 207   padding-left: 0;
 208   margin-bottom: 0;
 209   list-style: none;
 210 }
 211 .bs-docs-social-buttons li {
 212   display: inline-block;
 213   padding: 5px 8px;
 214   line-height: 1;
 215 }
 216 .bs-docs-social-buttons .twitter-follow-button {
 217   width: 225px !important;
 218 }
 219 .bs-docs-social-buttons .twitter-share-button {
 220   width: 98px !important;
 221 }
 222 /* Style the GitHub buttons via CSS instead of inline attributes */
 223 .github-btn {
 224   overflow: hidden;
 225   border: 0;
 226 }
 227
 228
 229 /*
 230  * Homepage
 231  *
 232  * Tweaks to the custom homepage and the masthead (main jumbotron).
 233  */
 234
 235 /* Share masthead with page headers */
 236 .bs-docs-masthead,
 237 .bs-docs-header {
 238   position: relative;
 239   padding: 30px 15px;
 240   color: #cdbfe3;
 241   text-align: center;
 242   text-shadow: 0 1px 0 rgba(0,0,0,.1);
 243   background-color: #6f5499;
 244   background-image: -webkit-gradient(linear, left top, left bottom, from(#563d7c), to(#6f5499));
 245   background-image: -webkit-linear-gradient(top, #563d7c 0%, #6f5499 100%);
 246   background-image:      -o-linear-gradient(top, #563d7c 0%, #6f5499 100%);
 247   background-image:         linear-gradient(to bottom, #563d7c 0%, #6f5499 100%);
 248   filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#563d7c', endColorstr='#6F5499', GradientType=0);
 249   background-repeat: repeat-x;
 250 }
 251
 252 /* Masthead (headings and download button) */
 253 .bs-docs-masthead .bs-docs-booticon {
 254   margin: 0 auto 30px;
 255 }
 256 .bs-docs-masthead h1 {
 257   font-weight: 300;
 258   line-height: 1;
 259   color: #fff;
 260 }
 261 .bs-docs-masthead .lead {
 262   margin: 0 auto 30px;
 263   font-size: 20px;
 264   color: #fff;
 265 }
 266 .bs-docs-masthead .version {
 267   margin-top: -15px;
 268   margin-bottom: 30px;
 269   color: #9783b9;
 270 }
 271 .bs-docs-masthead .btn {
 272   width: 100%;
 273   padding: 15px 30px;
 274   font-size: 20px;
 275 }
 276
 277 @media (min-width: 480px) {
 278   .bs-docs-masthead .btn {
 279     width: auto;
 280   }
 281 }
 282
 283 @media (min-width: 768px) {
 284   .bs-docs-masthead {
 285     padding: 80px 0;
 286   }
 287   .bs-docs-masthead h1 {
 288     font-size: 60px;
 289   }
 290   .bs-docs-masthead .lead {
 291     font-size: 24px;
 292   }
 293 }
 294
 295 @media (min-width: 992px) {
 296   .bs-docs-masthead .lead {
 297     width: 80%;
 298     font-size: 30px;
 299   }
 300 }
 301
 302
 303 /*
 304  * Page headers
 305  *
 306  * Jumbotron-esque headers at the top of every page that's not the homepage.
 307  */
 308
 309 /* Page headers */
 310 .bs-docs-header {
 311   margin-bottom: 40px;
 312   font-size: 20px;
 313 }
 314 .bs-docs-header h1 {
 315   margin-top: 0;
 316   color: #fff;
 317 }
 318 .bs-docs-header p {
 319   margin-bottom: 0;
 320   font-weight: 300;
 321   line-height: 1.4;
 322 }
 323 .bs-docs-header .container {
 324   position: relative;
 325 }
 326
 327 @media (min-width: 768px) {
 328   .bs-docs-header {
 329     padding-top: 60px;
 330     padding-bottom: 60px;
 331     font-size: 24px;
 332     text-align: left;
 333   }
 334   .bs-docs-header h1 {
 335     font-size: 60px;
 336     line-height: 1;
 337   }
 338 }
 339
 340 @media (min-width: 992px) {
 341   .bs-docs-header h1,
 342   .bs-docs-header p {
 343     margin-right: 380px;
 344   }
 345 }
 346
 347
 348 /*
 349  * Carbon ads
 350  *
 351  * Single display ad that shows on all pages (except homepage) in page headers.
 352  * The hella `!important` is required for any pre-set property.
 353  */
 354
 355 .carbonad {
 356   width: auto !important;
 357   height: auto !important;
 358   padding: 20px !important;
 359   margin: 30px -30px -31px !important;
 360   overflow: hidden; /* clearfix */
 361   font-size: 13px !important;
 362   line-height: 16px !important;
 363   text-align: left;
 364   background: transparent !important;
 365   border: solid #866ab3 !important;
 366   border-width: 1px 0 !important;
 367 }
 368 .carbonad-img {
 369   margin: 0 !important;
 370 }
 371 .carbonad-text,
 372 .carbonad-tag {
 373   display: block !important;
 374   float: none !important;
 375   width: auto !important;
 376   height: auto !important;
 377   margin-left: 145px !important;
 378   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
 379 }
 380 .carbonad-text {
 381   padding-top: 0 !important;
 382 }
 383 .carbonad-tag {
 384   color: inherit !important;
 385   text-align: left !important;
 386 }
 387 .carbonad-text a,
 388 .carbonad-tag a {
 389   color: #fff !important;
 390 }
 391 .carbonad #azcarbon > img {
 392   display: none; /* hide what I assume are tracking images */
 393 }
 394
 395 @media (min-width: 480px) {
 396   .carbonad {
 397     width: 330px !important;
 398     margin: 20px auto !important;
 399     border-width: 1px !important;
 400     border-radius: 4px;
 401   }
 402   .bs-docs-masthead .carbonad {
 403     margin: 50px auto 0 !important;
 404   }
 405 }
 406
 407 @media (min-width: 768px) {
 408   .carbonad {
 409     margin-right: 0 !important;
 410     margin-left: 0 !important;
 411   }
 412 }
 413
 414 @media (min-width: 992px) {
 415   .carbonad {
 416     position: absolute;
 417     top: 0;
 418     right: 15px; /* 15px instead of 0 since box-sizing */
 419     width: 330px !important;
 420     padding: 15px !important;
 421     margin: 0 !important;
 422   }
 423   .bs-docs-masthead .carbonad {
 424     position: static;
 425   }
 426 }
 427
 428
 429 /*
 430  * Homepage featurettes
 431  *
 432  * Reasons to use Bootstrap, entries from the Expo, and more.
 433  */
 434
 435 .bs-docs-featurette {
 436   padding-top: 40px;
 437   padding-bottom: 40px;
 438   font-size: 16px;
 439   line-height: 1.5;
 440   color: #555;
 441   text-align: center;
 442   background-color: #fff;
 443   border-bottom: 1px solid #e5e5e5;
 444 }
 445 .bs-docs-featurette + .bs-docs-footer {
 446   margin-top: 0;
 447   border-top: 0;
 448 }
 449
 450 .bs-docs-featurette-title {
 451   margin-bottom: 5px;
 452   font-size: 30px;
 453   font-weight: normal;
 454   color: #333;
 455 }
 456 .half-rule {
 457   width: 100px;
 458   margin: 40px auto;
 459 }
 460 .bs-docs-featurette h3 {
 461   margin-bottom: 5px;
 462   font-weight: normal;
 463   color: #333;
 464 }
 465 .bs-docs-featurette-img {
 466   display: block;
 467   margin-bottom: 20px;
 468   color: #333;
 469 }
 470 .bs-docs-featurette-img:hover {
 471   color: #337ab7;
 472   text-decoration: none;
 473 }
 474 .bs-docs-featurette-img img {
 475   display: block;
 476   margin-bottom: 15px;
 477 }
 478
 479 @media (min-width: 480px) {
 480   .bs-docs-featurette .img-responsive {
 481     margin-top: 30px;
 482   }
 483 }
 484 @media (min-width: 768px) {
 485   .bs-docs-featurette {
 486     padding-top: 100px;
 487     padding-bottom: 100px;
 488   }
 489   .bs-docs-featurette-title {
 490     font-size: 40px;
 491   }
 492   .bs-docs-featurette .lead {
 493     max-width: 80%;
 494     margin-right: auto;
 495     margin-left: auto;
 496   }
 497   .bs-docs-featurette .img-responsive {
 498     margin-top: 0;
 499   }
 500 }
 501
 502
 503 /*
 504  * Featured sites
 505  *
 506  * Homepage thumbnails from the Expo.
 507  */
 508
 509 .bs-docs-featured-sites {
 510   margin-right: -1px;
 511   margin-left: -1px;
 512 }
 513 .bs-docs-featured-sites .col-xs-6 {
 514   padding: 1px;
 515 }
 516 .bs-docs-featured-sites .img-responsive {
 517   margin-top: 0;
 518 }
 519
 520 @media (min-width: 768px) {
 521   .bs-docs-featured-sites .col-sm-3:first-child img {
 522     border-top-left-radius: 4px;
 523     border-bottom-left-radius: 4px;
 524   }
 525   .bs-docs-featured-sites .col-sm-3:last-child img {
 526     border-top-right-radius: 4px;
 527     border-bottom-right-radius: 4px;
 528   }
 529 }
 530
 531
 532 /*
 533  * Examples
 534  *
 535  * Linked docs examples.
 536  */
 537
 538 .bs-examples .thumbnail {
 539   margin-bottom: 10px;
 540 }
 541 .bs-examples h4 {
 542   margin-bottom: 5px;
 543 }
 544 .bs-examples p {
 545   margin-bottom: 20px;
 546 }
 547
 548 @media (max-width: 480px) {
 549   .bs-examples {
 550     margin-right: -10px;
 551     margin-left: -10px;
 552   }
 553   .bs-examples > [class^="col-"] {
 554     padding-right: 10px;
 555     padding-left: 10px;
 556   }
 557 }
 558
 559
 560 /*
 561  * Side navigation
 562  *
 563  * Scrollspy and affixed enhanced navigation to highlight sections and secondary
 564  * sections of docs content.
 565  */
 566
 567 /* By default it's not affixed in mobile views, so undo that */
 568 .bs-docs-sidebar.affix {
 569   position: static;
 570 }
 571 @media (min-width: 768px) {
 572   .bs-docs-sidebar {
 573     padding-left: 20px;
 574   }
 575 }
 576
 577 /* First level of nav */
 578 .bs-docs-sidenav {
 579   margin-top: 20px;
 580   margin-bottom: 20px;
 581 }
 582
 583 /* All levels of nav */
 584 .bs-docs-sidebar .nav > li > a {
 585   display: block;
 586   padding: 4px 20px;
 587   font-size: 13px;
 588   font-weight: 500;
 589   color: #767676;
 590 }
 591 .bs-docs-sidebar .nav > li > a:hover,
 592 .bs-docs-sidebar .nav > li > a:focus {
 593   padding-left: 19px;
 594   color: #563d7c;
 595   text-decoration: none;
 596   background-color: transparent;
 597   border-left: 1px solid #563d7c;
 598 }
 599 .bs-docs-sidebar .nav > .active > a,
 600 .bs-docs-sidebar .nav > .active:hover > a,
 601 .bs-docs-sidebar .nav > .active:focus > a {
 602   padding-left: 18px;
 603   font-weight: bold;
 604   color: #563d7c;
 605   background-color: transparent;
 606   border-left: 2px solid #563d7c;
 607 }
 608
 609 /* Nav: second level (shown on .active) */
 610 .bs-docs-sidebar .nav .nav {
 611   display: none; /* Hide by default, but at >768px, show it */
 612   padding-bottom: 10px;
 613 }
 614 .bs-docs-sidebar .nav .nav > li > a {
 615   padding-top: 1px;
 616   padding-bottom: 1px;
 617   padding-left: 30px;
 618   font-size: 12px;
 619   font-weight: normal;
 620 }
 621 .bs-docs-sidebar .nav .nav > li > a:hover,
 622 .bs-docs-sidebar .nav .nav > li > a:focus {
 623   padding-left: 29px;
 624 }
 625 .bs-docs-sidebar .nav .nav > .active > a,
 626 .bs-docs-sidebar .nav .nav > .active:hover > a,
 627 .bs-docs-sidebar .nav .nav > .active:focus > a {
 628   padding-left: 28px;
 629   font-weight: 500;
 630 }
 631
 632 /* Back to top (hidden on mobile) */
 633 .back-to-top,
 634 .bs-docs-theme-toggle {
 635   display: none;
 636   padding: 4px 10px;
 637   margin-top: 10px;
 638   margin-left: 10px;
 639   font-size: 12px;
 640   font-weight: 500;
 641   color: #999;
 642 }
 643 .back-to-top:hover,
 644 .bs-docs-theme-toggle:hover {
 645   color: #563d7c;
 646   text-decoration: none;
 647 }
 648 .bs-docs-theme-toggle {
 649   margin-top: 0;
 650 }
 651
 652 @media (min-width: 768px) {
 653   .back-to-top,
 654   .bs-docs-theme-toggle {
 655     display: block;
 656   }
 657 }
 658
 659 /* Show and affix the side nav when space allows it */
 660 @media (min-width: 992px) {
 661   .bs-docs-sidebar .nav > .active > ul {
 662     display: block;
 663   }
 664   /* Widen the fixed sidebar */
 665   .bs-docs-sidebar.affix,
 666   .bs-docs-sidebar.affix-bottom {
 667     width: 213px;
 668   }
 669   .bs-docs-sidebar.affix {
 670     position: fixed; /* Undo the static from mobile first approach */
 671     top: 20px;
 672   }
 673   .bs-docs-sidebar.affix-bottom {
 674     position: absolute; /* Undo the static from mobile first approach */
 675   }
 676   .bs-docs-sidebar.affix-bottom .bs-docs-sidenav,
 677   .bs-docs-sidebar.affix .bs-docs-sidenav {
 678     margin-top: 0;
 679     margin-bottom: 0;
 680   }
 681 }
 682 @media (min-width: 1200px) {
 683   /* Widen the fixed sidebar again */
 684   .bs-docs-sidebar.affix-bottom,
 685   .bs-docs-sidebar.affix {
 686     width: 263px;
 687   }
 688 }
 689
 690
 691 /*
 692  * Docs sections
 693  *
 694  * Content blocks for each component or feature.
 695  */
 696
 697 /* Space things out */
 698 .bs-docs-section {
 699   margin-bottom: 60px;
 700 }
 701 .bs-docs-section:last-child {
 702   margin-bottom: 0;
 703 }
 704
 705 h1[id] {
 706   padding-top: 20px;
 707   margin-top: 0;
 708 }
 709
 710
 711 /*
 712  * Callouts
 713  *
 714  * Not quite alerts, but custom and helpful notes for folks reading the docs.
 715  * Requires a base and modifier class.
 716  */
 717
 718 /* Common styles for all types */
 719 .bs-callout {
 720   padding: 20px;
 721   margin: 20px 0;
 722   border: 1px solid #eee;
 723   border-left-width: 5px;
 724   border-radius: 3px;
 725 }
 726 .bs-callout h4 {
 727   margin-top: 0;
 728   margin-bottom: 5px;
 729 }
 730 .bs-callout p:last-child {
 731   margin-bottom: 0;
 732 }
 733 .bs-callout code {
 734   border-radius: 3px;
 735 }
 736
 737 /* Tighten up space between multiple callouts */
 738 .bs-callout + .bs-callout {
 739   margin-top: -5px;
 740 }
 741
 742 /* Variations */
 743 .bs-callout-danger {
 744   border-left-color: #ce4844;
 745 }
 746 .bs-callout-danger h4 {
 747   color: #ce4844;
 748 }
 749 .bs-callout-warning {
 750   border-left-color: #aa6708;
 751 }
 752 .bs-callout-warning h4 {
 753   color: #aa6708;
 754 }
 755 .bs-callout-info {
 756   border-left-color: #1b809e;
 757 }
 758 .bs-callout-info h4 {
 759   color: #1b809e;
 760 }
 761
 762
 763 /*
 764  * Color swatches
 765  *
 766  * Color swatches and associated values for our grayscale and brand colors.
 767  */
 768
 769 .color-swatches {
 770   margin: 0 -5px;
 771   overflow: hidden; /* clearfix */
 772 }
 773 .color-swatch {
 774   float: left;
 775   width: 60px;
 776   height: 60px;
 777   margin: 0 5px;
 778   border-radius: 3px;
 779 }
 780
 781 @media (min-width: 768px) {
 782   .color-swatch {
 783     width: 100px;
 784     height: 100px;
 785   }
 786 }
 787
 788 /* Framework colors */
 789 .color-swatches .gray-darker {
 790   background-color: #222;
 791 }
 792 .color-swatches .gray-dark {
 793   background-color: #333;
 794 }
 795 .color-swatches .gray {
 796   background-color: #555;
 797 }
 798 .color-swatches .gray-light {
 799   background-color: #999;
 800 }
 801 .color-swatches .gray-lighter {
 802   background-color: #eee;
 803 }
 804 .color-swatches .brand-primary {
 805   background-color: #337ab7;
 806 }
 807 .color-swatches .brand-success {
 808   background-color: #5cb85c;
 809 }
 810 .color-swatches .brand-warning {
 811   background-color: #f0ad4e;
 812 }
 813 .color-swatches .brand-danger {
 814   background-color: #d9534f;
 815 }
 816 .color-swatches .brand-info {
 817   background-color: #5bc0de;
 818 }
 819
 820 /* Docs colors */
 821 .color-swatches .bs-purple {
 822   background-color: #563d7c;
 823 }
 824 .color-swatches .bs-purple-light {
 825   background-color: #c7bfd3;
 826 }
 827 .color-swatches .bs-purple-lighter {
 828   background-color: #e5e1ea;
 829 }
 830 .color-swatches .bs-gray {
 831   background-color: #f9f9f9;
 832 }
 833
 834
 835 /*
 836  * Team members
 837  *
 838  * Avatars, names, and usernames for core team.
 839  */
 840
 841 .bs-team .team-member {
 842   line-height: 32px;
 843   color: #555;
 844 }
 845 .bs-team .team-member:hover {
 846   color: #333;
 847   text-decoration: none;
 848 }
 849 .bs-team .github-btn {
 850   float: right;
 851   width: 180px;
 852   height: 20px;
 853   margin-top: 6px;
 854 }
 855 .bs-team img {
 856   float: left;
 857   width: 32px;
 858   margin-right: 10px;
 859   border-radius: 4px;
 860 }
 861
 862
 863 /*
 864  * Wall of Browser Bugs
 865  *
 866  * Better display for the responsive table on the Wall of Browser Bugs.
 867  */
 868
 869 .bs-docs-browser-bugs td p {
 870   margin-bottom: 0;
 871 }
 872
 873 .bs-docs-browser-bugs th:first-child {
 874   width: 18%;
 875 }
 876
 877
 878 /*
 879  * Grid examples
 880  *
 881  * Highlight the grid columns within the docs so folks can see their padding,
 882  * alignment, sizing, etc.
 883  */
 884
 885 .show-grid {
 886   margin-bottom: 15px;
 887 }
 888 .show-grid [class^="col-"] {
 889   padding-top: 10px;
 890   padding-bottom: 10px;
 891   background-color: #eee;
 892   background-color: rgba(86,61,124,.15);
 893   border: 1px solid #ddd;
 894   border: 1px solid rgba(86,61,124,.2);
 895 }
 896
 897
 898 /*
 899  * Examples
 900  *
 901  * Isolated sections of example content for each component or feature. Usually
 902  * followed by a code snippet.
 903  */
 904
 905 .bs-example {
 906   position: relative;
 907   padding: 45px 15px 15px;
 908   margin: 0 -15px 15px;
 909   border-color: #e5e5e5 #eee #eee;
 910   border-style: solid;
 911   border-width: 1px 0;
 912   -webkit-box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
 913           box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
 914 }
 915 /* Echo out a label for the example */
 916 .bs-example:after {
 917   position: absolute;
 918   top: 15px;
 919   left: 15px;
 920   font-size: 12px;
 921   font-weight: bold;
 922   color: #959595;
 923   text-transform: uppercase;
 924   letter-spacing: 1px;
 925   content: "Example";
 926 }
 927
 928 .bs-example-padded-bottom {
 929   padding-bottom: 24px;
 930 }
 931
 932 /* Tweak display of the code snippets when following an example */
 933 .bs-example + .highlight,
 934 .bs-example + .zero-clipboard + .highlight {
 935   margin: -15px -15px 15px;
 936   border-width: 0 0 1px;
 937   border-radius: 0;
 938 }
 939
 940 /* Make the examples and snippets not full-width */
 941 @media (min-width: 768px) {
 942   .bs-example {
 943     margin-right: 0;
 944     margin-left: 0;
 945     background-color: #fff;
 946     border-color: #ddd;
 947     border-width: 1px;
 948     border-radius: 4px 4px 0 0;
 949     -webkit-box-shadow: none;
 950             box-shadow: none;
 951   }
 952   .bs-example + .highlight,
 953   .bs-example + .zero-clipboard + .highlight {
 954     margin-top: -16px;
 955     margin-right: 0;
 956     margin-left: 0;
 957     border-width: 1px;
 958     border-bottom-right-radius: 4px;
 959     border-bottom-left-radius: 4px;
 960   }
 961   .bs-example-standalone {
 962     border-radius: 4px;
 963   }
 964 }
 965
 966 /* Undo width of container */
 967 .bs-example .container {
 968   width: auto;
 969 }
 970
 971 /* Tweak content of examples for optimum awesome */
 972 .bs-example > p:last-child,
 973 .bs-example > ul:last-child,
 974 .bs-example > ol:last-child,
 975 .bs-example > blockquote:last-child,
 976 .bs-example > .form-control:last-child,
 977 .bs-example > .table:last-child,
 978 .bs-example > .navbar:last-child,
 979 .bs-example > .jumbotron:last-child,
 980 .bs-example > .alert:last-child,
 981 .bs-example > .panel:last-child,
 982 .bs-example > .list-group:last-child,
 983 .bs-example > .well:last-child,
 984 .bs-example > .progress:last-child,
 985 .bs-example > .table-responsive:last-child > .table {
 986   margin-bottom: 0;
 987 }
 988 .bs-example > p > .close {
 989   float: none;
 990 }
 991
 992 /* Typography */
 993 .bs-example-type .table .type-info {
 994   color: #767676;
 995   vertical-align: middle;
 996 }
 997 .bs-example-type .table td {
 998   padding: 15px 0;
 999   border-color: #eee;
1000 }
1001 .bs-example-type .table tr:first-child td {
1002   border-top: 0;
1003 }
1004 .bs-example-type h1,
1005 .bs-example-type h2,
1006 .bs-example-type h3,
1007 .bs-example-type h4,
1008 .bs-example-type h5,
1009 .bs-example-type h6 {
1010   margin: 0;
1011 }
1012
1013 /* Contextual background colors */
1014 .bs-example-bg-classes p {
1015   padding: 15px;
1016 }
1017
1018 /* Images */
1019 .bs-example > .img-circle,
1020 .bs-example > .img-rounded,
1021 .bs-example > .img-thumbnail {
1022   margin: 5px;
1023 }
1024
1025 /* Tables */
1026 .bs-example > .table-responsive > .table {
1027   background-color: #fff;
1028 }
1029
1030 /* Buttons */
1031 .bs-example > .btn,
1032 .bs-example > .btn-group {
1033   margin-top: 5px;
1034   margin-bottom: 5px;
1035 }
1036 .bs-example > .btn-toolbar + .btn-toolbar {
1037   margin-top: 10px;
1038 }
1039
1040 /* Forms */
1041 .bs-example-control-sizing select,
1042 .bs-example-control-sizing input[type="text"] + input[type="text"] {
1043   margin-top: 10px;
1044 }
1045 .bs-example-form .input-group {
1046   margin-bottom: 10px;
1047 }
1048 .bs-example > textarea.form-control {
1049   resize: vertical;
1050 }
1051
1052 /* List groups */
1053 .bs-example > .list-group {
1054   max-width: 400px;
1055 }
1056
1057 /* Navbars */
1058 .bs-example .navbar:last-child {
1059   margin-bottom: 0;
1060 }
1061 .bs-navbar-top-example,
1062 .bs-navbar-bottom-example {
1063   z-index: 1;
1064   padding: 0;
1065   overflow: hidden; /* cut the drop shadows off */
1066 }
1067 .bs-navbar-top-example .navbar-header,
1068 .bs-navbar-bottom-example .navbar-header {
1069   margin-left: 0;
1070 }
1071 .bs-navbar-top-example .navbar-fixed-top,
1072 .bs-navbar-bottom-example .navbar-fixed-bottom {
1073   position: relative;
1074   margin-right: 0;
1075   margin-left: 0;
1076 }
1077 .bs-navbar-top-example {
1078   padding-bottom: 45px;
1079 }
1080 .bs-navbar-top-example:after {
1081   top: auto;
1082   bottom: 15px;
1083 }
1084 .bs-navbar-top-example .navbar-fixed-top {
1085   top: -1px;
1086 }
1087 .bs-navbar-bottom-example {
1088   padding-top: 45px;
1089 }
1090 .bs-navbar-bottom-example .navbar-fixed-bottom {
1091   bottom: -1px;
1092 }
1093 .bs-navbar-bottom-example .navbar {
1094   margin-bottom: 0;
1095 }
1096 @media (min-width: 768px) {
1097   .bs-navbar-top-example .navbar-fixed-top,
1098   .bs-navbar-bottom-example .navbar-fixed-bottom {
1099     position: absolute;
1100   }
1101 }
1102
1103 /* Pagination */
1104 .bs-example .pagination {
1105   margin-top: 10px;
1106   margin-bottom: 10px;
1107 }
1108
1109 /* Pager */
1110 .bs-example > .pager {
1111   margin-top: 0;
1112 }
1113
1114 /* Example modals */
1115 .bs-example-modal {
1116   background-color: #f5f5f5;
1117 }
1118 .bs-example-modal .modal {
1119   position: relative;
1120   top: auto;
1121   right: auto;
1122   bottom: auto;
1123   left: auto;
1124   z-index: 1;
1125   display: block;
1126 }
1127 .bs-example-modal .modal-dialog {
1128   left: auto;
1129   margin-right: auto;
1130   margin-left: auto;
1131 }
1132
1133 /* Example dropdowns */
1134 .bs-example > .dropdown > .dropdown-toggle {
1135   float: left;
1136 }
1137 .bs-example > .dropdown > .dropdown-menu {
1138   position: static;
1139   display: block;
1140   margin-bottom: 5px;
1141   clear: left;
1142 }
1143
1144 /* Example tabbable tabs */
1145 .bs-example-tabs .nav-tabs {
1146   margin-bottom: 15px;
1147 }
1148
1149 /* Tooltips */
1150 .bs-example-tooltips {
1151   text-align: center;
1152 }
1153 .bs-example-tooltips > .btn {
1154   margin-top: 5px;
1155   margin-bottom: 5px;
1156 }
1157 .bs-example-tooltip .tooltip {
1158   position: relative;
1159   display: inline-block;
1160   margin: 10px 20px;
1161   opacity: 1;
1162 }
1163
1164 /* Popovers */
1165 .bs-example-popover {
1166   padding-bottom: 24px;
1167   background-color: #f9f9f9;
1168 }
1169 .bs-example-popover .popover {
1170   position: relative;
1171   display: block;
1172   float: left;
1173   width: 260px;
1174   margin: 20px;
1175 }
1176
1177 /* Scrollspy demo on fixed height div */
1178 .scrollspy-example {
1179   position: relative;
1180   height: 200px;
1181   margin-top: 10px;
1182   overflow: auto;
1183 }
1184
1185 .bs-example > .nav-pills-stacked-example {
1186   max-width: 300px;
1187 }
1188
1189 /* Simple collapse example */
1190 #collapseExample .well {
1191   margin-bottom: 0;
1192 }
1193
1194 /* Don't wrap event names in Events tables in JS plugin docs */
1195 .bs-events-table > thead > tr > th:first-child,
1196 .bs-events-table > tbody > tr > td:first-child {
1197   white-space: nowrap;
1198 }
1199
1200 .bs-events-table > thead > tr > th:first-child {
1201   width: 150px;
1202 }
1203
1204 .js-options-table > thead > tr > th:nth-child(1),
1205 .js-options-table > thead > tr > th:nth-child(2) {
1206   width: 100px;
1207 }
1208
1209 .js-options-table > thead > tr > th:nth-child(3) {
1210   width: 50px;
1211 }
1212
1213 /*
1214  * Code snippets
1215  *
1216  * Generated via Pygments and Jekyll, these are snippets of HTML, CSS, and JS.
1217  */
1218
1219 .highlight {
1220   padding: 9px 14px;
1221   margin-bottom: 14px;
1222   background-color: #f7f7f9;
1223   border: 1px solid #e1e1e8;
1224   border-radius: 4px;
1225 }
1226 .highlight pre {
1227   padding: 0;
1228   margin-top: 0;
1229   margin-bottom: 0;
1230   word-break: normal;
1231   white-space: nowrap;
1232   background-color: transparent;
1233   border: 0;
1234 }
1235 .highlight pre code {
1236   font-size: inherit;
1237   color: #333; /* Effectively the base text color */
1238 }
1239 .highlight pre code:first-child {
1240   display: inline-block;
1241   padding-right: 45px;
1242 }
1243
1244
1245 /*
1246  * Responsive tests
1247  *
1248  * Generate a set of tests to show the responsive utilities in action.
1249  */
1250
1251 /* Responsive (scrollable) doc tables */
1252 .table-responsive .highlight pre {
1253   white-space: normal;
1254 }
1255
1256 /* Utility classes table  */
1257 .bs-table th small,
1258 .responsive-utilities th small {
1259   display: block;
1260   font-weight: normal;
1261   color: #999;
1262 }
1263 .responsive-utilities tbody th {
1264   font-weight: normal;
1265 }
1266 .responsive-utilities td {
1267   text-align: center;
1268 }
1269 .responsive-utilities td.is-visible {
1270   color: #468847;
1271   background-color: #dff0d8 !important;
1272 }
1273 .responsive-utilities td.is-hidden {
1274   color: #ccc;
1275   background-color: #f9f9f9 !important;
1276 }
1277
1278 /* Responsive tests */
1279 .responsive-utilities-test {
1280   margin-top: 5px;
1281 }
1282 .responsive-utilities-test .col-xs-6 {
1283   margin-bottom: 10px;
1284 }
1285 .responsive-utilities-test span {
1286   display: block;
1287   padding: 15px 10px;
1288   font-size: 14px;
1289   font-weight: bold;
1290   line-height: 1.1;
1291   text-align: center;
1292   border-radius: 4px;
1293 }
1294 .visible-on .col-xs-6 .hidden-xs,
1295 .visible-on .col-xs-6 .hidden-sm,
1296 .visible-on .col-xs-6 .hidden-md,
1297 .visible-on .col-xs-6 .hidden-lg,
1298 .hidden-on .col-xs-6 .hidden-xs,
1299 .hidden-on .col-xs-6 .hidden-sm,
1300 .hidden-on .col-xs-6 .hidden-md,
1301 .hidden-on .col-xs-6 .hidden-lg {
1302   color: #999;
1303   border: 1px solid #ddd;
1304 }
1305 .visible-on .col-xs-6 .visible-xs-block,
1306 .visible-on .col-xs-6 .visible-sm-block,
1307 .visible-on .col-xs-6 .visible-md-block,
1308 .visible-on .col-xs-6 .visible-lg-block,
1309 .hidden-on .col-xs-6 .visible-xs-block,
1310 .hidden-on .col-xs-6 .visible-sm-block,
1311 .hidden-on .col-xs-6 .visible-md-block,
1312 .hidden-on .col-xs-6 .visible-lg-block {
1313   color: #468847;
1314   background-color: #dff0d8;
1315   border: 1px solid #d6e9c6;
1316 }
1317
1318
1319 /*
1320  * Glyphicons
1321  *
1322  * Special styles for displaying the icons and their classes in the docs.
1323  */
1324
1325 .bs-glyphicons {
1326   margin: 0 -10px 20px;
1327   overflow: hidden;
1328 }
1329 .bs-glyphicons-list {
1330   padding-left: 0;
1331   list-style: none;
1332 }
1333 .bs-glyphicons li {
1334   float: left;
1335   width: 25%;
1336   height: 115px;
1337   padding: 10px;
1338   font-size: 10px;
1339   line-height: 1.4;
1340   text-align: center;
1341   background-color: #f9f9f9;
1342   border: 1px solid #fff;
1343 }
1344 .bs-glyphicons .glyphicon {
1345   margin-top: 5px;
1346   margin-bottom: 10px;
1347   font-size: 24px;
1348 }
1349 .bs-glyphicons .glyphicon-class {
1350   display: block;
1351   text-align: center;
1352   word-wrap: break-word; /* Help out IE10+ with class names */
1353 }
1354 .bs-glyphicons li:hover {
1355   color: #fff;
1356   background-color: #563d7c;
1357 }
1358
1359 @media (min-width: 768px) {
1360   .bs-glyphicons {
1361     margin-right: 0;
1362     margin-left: 0;
1363   }
1364   .bs-glyphicons li {
1365     width: 12.5%;
1366     font-size: 12px;
1367   }
1368 }
1369
1370
1371 /*
1372  * Customizer
1373  *
1374  * Since this is so form control heavy, we have quite a few styles to customize
1375  * the display of inputs, headings, and more. Also included are all the download
1376  * buttons and actions.
1377  */
1378
1379 .bs-customizer .toggle {
1380   float: right;
1381   margin-top: 25px;
1382 }
1383
1384 /* Headings and form contrls */
1385 .bs-customizer label {
1386   margin-top: 10px;
1387   font-weight: 500;
1388   color: #555;
1389 }
1390 .bs-customizer h2 {
1391   padding-top: 30px;
1392   margin-top: 0;
1393   margin-bottom: 5px;
1394 }
1395 .bs-customizer h3 {
1396   margin-bottom: 0;
1397 }
1398 .bs-customizer h4 {
1399   margin-top: 15px;
1400   margin-bottom: 0;
1401 }
1402 .bs-customizer .bs-callout h4 {
1403   margin-top: 0; /* lame, but due to specificity we have to duplicate */
1404   margin-bottom: 5px;
1405 }
1406 .bs-customizer input[type="text"] {
1407   font-family: Menlo, Monaco, Consolas, "Courier New", monospace;
1408   background-color: #fafafa;
1409 }
1410 .bs-customizer .help-block {
1411   margin-bottom: 5px;
1412   font-size: 12px;
1413 }
1414
1415 /* For the variables, use regular weight */
1416 #less-section label {
1417   font-weight: normal;
1418 }
1419
1420 /* Downloads */
1421 .bs-customize-download .btn-outline {
1422   padding: 20px;
1423 }
1424
1425 /* Error handling */
1426 .bs-customizer-alert {
1427   position: fixed;
1428   top: 0;
1429   right: 0;
1430   left: 0;
1431   z-index: 1030;
1432   padding: 15px 0;
1433   color: #fff;
1434   background-color: #d9534f;
1435   border-bottom: 1px solid #b94441;
1436   -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
1437           box-shadow: inset 0 1px 0 rgba(255,255,255,.25);
1438 }
1439 .bs-customizer-alert .close {
1440   margin-top: -4px;
1441   font-size: 24px;
1442 }
1443 .bs-customizer-alert p {
1444   margin-bottom: 0;
1445 }
1446 .bs-customizer-alert .glyphicon {
1447   margin-right: 5px;
1448 }
1449 .bs-customizer-alert pre {
1450   margin: 10px 0 0;
1451   color: #fff;
1452   background-color: #a83c3a;
1453   border-color: #973634;
1454   -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
1455           box-shadow: inset 0 2px 4px rgba(0,0,0,.05), 0 1px 0 rgba(255,255,255,.1);
1456 }
1457
1458 .bs-dropzone {
1459   position: relative;
1460   padding: 20px;
1461   margin-bottom: 20px;
1462   color: #777;
1463   text-align: center;
1464   border: 2px dashed #eee;
1465   border-radius: 4px;
1466 }
1467 .bs-dropzone .import-header {
1468   margin-bottom: 5px;
1469 }
1470 .bs-dropzone .glyphicon-download-alt {
1471   font-size: 40px;
1472 }
1473 .bs-dropzone hr {
1474   width: 100px;
1475 }
1476 .bs-dropzone .lead {
1477   margin-bottom: 10px;
1478   font-weight: normal;
1479   color: #333;
1480 }
1481 /*.bs-dropzone*/ #import-manual-trigger {
1482   cursor: pointer;
1483 }
1484 .bs-dropzone p:last-child {
1485   margin-bottom: 0;
1486 }
1487
1488 /*
1489  * Brand guidelines
1490  *
1491  * Extra styles for displaying wordmarks, logos, etc.
1492  */
1493
1494 /* Logo series wrapper */
1495 .bs-brand-logos {
1496   display: table;
1497   width: 100%;
1498   margin-bottom: 15px;
1499   overflow: hidden;
1500   color: #563d7c;
1501   background-color: #f9f9f9;
1502   border-radius: 4px;
1503 }
1504
1505 /* Individual items */
1506 .bs-brand-item {
1507   padding: 60px 0;
1508   text-align: center;
1509 }
1510 .bs-brand-item + .bs-brand-item {
1511   border-top: 1px solid #fff;
1512 }
1513 .bs-brand-logos .inverse {
1514   color: #fff;
1515   background-color: #563d7c;
1516 }
1517
1518 /* Heading content within */
1519 .bs-brand-item h1,
1520 .bs-brand-item h3 {
1521   margin-top: 0;
1522   margin-bottom: 0;
1523 }
1524 .bs-brand-item .bs-docs-booticon {
1525   margin-right: auto;
1526   margin-left: auto;
1527 }
1528
1529 /* Make the icons stand out on what is/isn't okay */
1530 .bs-brand-item .glyphicon {
1531   width: 30px;
1532   height: 30px;
1533   margin: 10px auto -10px;
1534   line-height: 30px;
1535   color: #fff;
1536   border-radius: 50%;
1537 }
1538 .bs-brand-item .glyphicon-ok {
1539   background-color: #5cb85c;
1540 }
1541 .bs-brand-item .glyphicon-remove {
1542   background-color: #d9534f;
1543 }
1544
1545 @media (min-width: 768px) {
1546   .bs-brand-item {
1547     display: table-cell;
1548     width: 1%;
1549   }
1550   .bs-brand-item + .bs-brand-item {
1551     border-top: 0;
1552     border-left: 1px solid #fff;
1553   }
1554   .bs-brand-item h1 {
1555     font-size: 60px;
1556   }
1557 }
1558
1559
1560 /*
1561  * ZeroClipboard styles
1562  */
1563
1564 .zero-clipboard {
1565   position: relative;
1566   display: none;
1567 }
1568 .btn-clipboard {
1569   position: absolute;
1570   top: 0;
1571   right: 0;
1572   z-index: 10;
1573   display: block;
1574   padding: 5px 8px;
1575   font-size: 12px;
1576   color: #767676;
1577   cursor: pointer;
1578   background-color: #fff;
1579   border: 1px solid #e1e1e8;
1580   border-radius: 0 4px 0 4px;
1581 }
1582 .btn-clipboard-hover {
1583   color: #fff;
1584   background-color: #563d7c;
1585   border-color: #563d7c;
1586 }
1587
1588 @media (min-width: 768px) {
1589   .zero-clipboard {
1590     display: block;
1591   }
1592   .bs-example + .zero-clipboard .btn-clipboard {
1593     top: -16px;
1594     border-top-right-radius: 0;
1595   }
1596 }
1597
1598
1599 /*
1600  * Miscellaneous
1601  *
1602  * Odds and ends for optimum docs display.
1603  */
1604
1605 /* Pseudo :focus state for showing how it looks in the docs */
1606 #focusedInput {
1607   border-color: rgb(204,204,204); /* Restate unfocused value to make CSSLint happy that there's a pre-CSS3 fallback*/
1608   border-color: rgba(82,168,236,.8);
1609   outline: 0;
1610   outline: thin dotted \9; /* IE6-9 */
1611   -webkit-box-shadow: 0 0 8px rgba(82,168,236,.6);
1612           box-shadow: 0 0 8px rgba(82,168,236,.6);
1613 }