git.roojs.org Git - bootswatch/blob - bower_components/bootstrap/assets/css/docs.css

   1 /*
   2  * Bootstrap Documentation
   3  * Special styles for presenting Bootstrap's documentation and code examples.
   4  */
   5
   6
   7
   8 /* Key scaffolding
   9 -------------------------------------------------- */
  10
  11 body {
  12   position: relative; /* For scrollyspy */
  13   padding-top: 50px; /* Account for fixed navbar */
  14 }
  15
  16 /* Custom docs button */
  17 .btn-bs {
  18   color: #563d7c;
  19   background-color: #fff;
  20   border-color: #e5e5e5;
  21 }
  22 .btn-bs:hover,
  23 .btn-bs:active {
  24   color: #fff;
  25   background-color: #563d7c;
  26   border-color: #563d7c;
  27 }
  28
  29 /* Temp CSS until RC2 */
  30 .bs-customize-placeholder {
  31   margin-bottom: -100px;
  32   padding: 80px 30px;
  33   text-align: center;
  34   background-color: #f5f5f5;
  35 }
  36
  37
  38 /* Top nav and header
  39 -------------------------------------------------- */
  40
  41 .bs-docs-nav {
  42   background-color: #563d7c;
  43 }
  44 .bs-docs-nav .navbar-brand {
  45   color: #fff;
  46 }
  47 .bs-docs-nav .navbar-nav > li > a {
  48   color: #cdbfe3;
  49 }
  50 .bs-docs-nav .navbar-nav > li > a:hover {
  51   color: #fff;
  52 }
  53 .bs-docs-nav .navbar-nav > .active > a,
  54 .bs-docs-nav .navbar-nav > .active > a:hover {
  55   color: #fff;
  56   background-color: #463265;
  57 }
  58 .bs-docs-nav .navbar-toggle {
  59   border-color: #563d7c;
  60 }
  61 .bs-docs-nav .navbar-toggle:hover {
  62   background-color: #463265;
  63   border-color: #463265;
  64 }
  65
  66 /* Old docs callout */
  67 .bs-old-docs {
  68   padding: 15px 20px;
  69   color: #777;
  70   background-color: #fafafa;
  71   border-bottom: 1px solid #e5e5e5;
  72 }
  73 .bs-old-docs strong {
  74   color: #555;
  75 }
  76 .bs-docs-home .bs-old-docs {
  77   text-align: center;
  78   border-top: 1px solid #e5e5e5;
  79 }
  80
  81
  82 /* Homepage masthead
  83 -------------------------------------------------- */
  84
  85 .bs-masthead {
  86   position: relative;
  87   padding: 30px 15px;
  88   text-align: center;
  89 }
  90 .bs-masthead h1 {
  91   font-size: 50px;
  92   line-height: 1;
  93 }
  94
  95 /* Download button */
  96 .bs-masthead .btn-bs {
  97   margin-top: 5px;
  98   margin-bottom: 5px;
  99   padding: 18px 24px;
 100   font-size: 21px;
 101 }
 102
 103 /* Textual links */
 104 .bs-social {
 105   margin-top: 30px;
 106   text-align: center;
 107 }
 108 .bs-masthead-links {
 109   margin-top: 20px;
 110   margin-bottom: 20px;
 111   padding-left: 0;
 112   list-style: none;
 113   text-align: center;
 114 }
 115 .bs-masthead-links li {
 116   display: inline;
 117   color: #999;
 118 }
 119 .bs-masthead-links li + li {
 120   margin-left: 20px;
 121 }
 122
 123
 124
 125 /* Customize and Download button
 126 -------------------------------------------------- */
 127
 128 .bs-customizer .toggle {
 129   float: right;
 130 }
 131 .bs-customizer label {
 132   margin-top: 10px;
 133   font-weight: 500;
 134   color: #444;
 135 }
 136 .bs-customizer h2 {
 137   margin-top: 0;
 138   margin-bottom: 5px;
 139   padding-top: 30px;
 140 }
 141 .bs-customizer h4 {
 142   margin-top: 15px;
 143 }
 144 .bs-customizer input[type="text"] {
 145   background-color: #fafafa;
 146 }
 147 .bs-customizer .help-block {
 148   font-size: 12px;
 149 }
 150
 151 .bs-customize-download {
 152   text-align: center;
 153 }
 154
 155
 156
 157 /* Docs pages and sections
 158 -------------------------------------------------- */
 159
 160 /* Page headers */
 161 .bs-header {
 162   padding: 30px 30px 40px;
 163   font-size: 16px;
 164   color: #5a5a5a;
 165   text-align: center;
 166   border-bottom: 1px solid #e5e5e5;
 167 }
 168 .bs-header h1 {
 169   color: #563d7c;
 170 }
 171 .bs-header p {
 172   font-weight: 300;
 173   line-height: 1.5;
 174 }
 175 .bs-header .container {
 176   position: relative;
 177 }
 178
 179 .bs-docs-section + .bs-docs-section {
 180   margin-top: 80px;
 181 }
 182
 183 /* Ads in page headers */
 184 .carbonad {
 185   width: auto !important;
 186   margin: 50px -30px -40px !important;
 187   padding: 20px !important;
 188   overflow: hidden; /* clearfix */
 189   height: auto !important;
 190   font-size: 13px !important;
 191   line-height: 16px !important;
 192   text-align: left;
 193   background: none !important;
 194   border: 0 !important;
 195   border-top: 1px solid #e5e5e5 !important;
 196 }
 197 .carbonad-img {
 198   margin: 0 !important;
 199 }
 200 .carbonad-text,
 201 .carbonad-tag {
 202   float: none !important;
 203   display: block !important;
 204   width: auto !important;
 205   height: auto !important;
 206   margin-left: 145px !important;
 207   font-family: "Helvetica Neue", Helvetica, Arial, sans-serif !important;
 208 }
 209 .carbonad-text {
 210   padding-top: 0 !important;
 211 }
 212 .carbonad-tag {
 213   text-align: left !important;
 214 }
 215 .carbonad #azcarbon > img {
 216   display: none; /* hide what I assume are tracking images */
 217 }
 218
 219
 220
 221 /* Docs sidebar
 222 -------------------------------------------------- */
 223
 224 /* By default it's not affixed in mobile views, so undo that */
 225 .bs-sidebar.affix {
 226   position: static;
 227 }
 228
 229 /* First level of nav */
 230 .bs-sidenav {
 231   margin-top: 30px;
 232   margin-bottom: 30px;
 233   padding-top:    10px;
 234   padding-bottom: 10px;
 235   text-shadow: 0 1px 0 #fff;
 236   background-color: #f7f5fa;
 237   border-radius: 5px;
 238 }
 239
 240 /* All levels of nav */
 241 .bs-sidebar .nav > li > a {
 242   display: block;
 243   color: #716b7a;
 244   padding: 5px 20px;
 245 }
 246 .bs-sidebar .nav > li > a:hover,
 247 .bs-sidebar .nav > li > a:focus {
 248   text-decoration: none;
 249   background-color: #e5e3e9;
 250   border-right: 1px solid #dbd8e0;
 251 }
 252 .bs-sidebar .nav > .active > a,
 253 .bs-sidebar .nav > .active:hover > a,
 254 .bs-sidebar .nav > .active:focus > a {
 255   font-weight: bold;
 256   color: #563d7c;
 257   background-color: transparent;
 258   border-right: 1px solid #563d7c;
 259 }
 260
 261 /* Nav: second level (shown on .active) */
 262 .bs-sidebar .nav .nav {
 263   display: none;
 264   margin-bottom: 8px;
 265 }
 266 .bs-sidebar .nav > .active > ul {
 267   display: block;
 268 }
 269 .bs-sidebar .nav .nav > li > a {
 270   padding-top:    3px;
 271   padding-bottom: 3px;
 272   padding-left: 30px;
 273   font-size: 90%;
 274 }
 275
 276
 277
 278 /* Side notes for calling out things
 279 -------------------------------------------------- */
 280
 281 /* Base styles (regardless of theme) */
 282 .bs-callout {
 283   margin: 20px 0;
 284   padding: 15px 30px 15px 15px;
 285   border-left: 5px solid #eee;
 286 }
 287 .bs-callout h4 {
 288   margin-top: 0;
 289 }
 290 .bs-callout p:last-child {
 291   margin-bottom: 0;
 292 }
 293 .bs-callout code,
 294 .bs-callout .highlight {
 295   background-color: #fff;
 296 }
 297
 298 /* Themes for different contexts */
 299 .bs-callout-danger {
 300   background-color: #fcf2f2;
 301   border-color: #dFb5b4;
 302 }
 303 .bs-callout-warning {
 304   background-color: #fefbed;
 305   border-color: #f1e7bc;
 306 }
 307 .bs-callout-info {
 308   background-color: #f0f7fd;
 309   border-color: #d0e3f0;
 310 }
 311
 312
 313
 314 /* Special grid styles
 315 -------------------------------------------------- */
 316
 317 .show-grid {
 318   margin-bottom: 15px;
 319 }
 320 .show-grid [class^="col-"] {
 321   padding-top: 10px;
 322   padding-bottom: 10px;
 323   background-color: #eee;
 324   border: 1px solid #ddd;
 325   background-color: rgba(86,61,124,.15);
 326   border: 1px solid rgba(86,61,124,.2);
 327 }
 328
 329
 330
 331 /* Bootstrap code examples
 332 -------------------------------------------------- */
 333
 334 /* Base class */
 335 .bs-example {
 336   position: relative;
 337   padding: 45px 15px 15px;
 338   margin: 0 -15px -1px;
 339   background-color: #fafafa;
 340   box-shadow: inset 0 3px 6px rgba(0,0,0,.05);
 341   border-color: #e5e5e5 #eee #eee;
 342   border-style: solid;
 343   border-width: 1px 0;
 344 }
 345 /* Echo out a label for the example */
 346 .bs-example:after {
 347   content: "Example";
 348   position: absolute;
 349   top:  15px;
 350   left: 15px;
 351   font-size: 12px;
 352   font-weight: bold;
 353   color: #bbb;
 354   text-transform: uppercase;
 355   letter-spacing: 1px;
 356 }
 357
 358 /* Tweak display of the examples */
 359 .bs-example + .prettyprint,
 360 .bs-example + .highlight {
 361   margin-top: 0;
 362   border-top-left-radius: 0;
 363   border-top-right-radius: 0;
 364 }
 365
 366 /* Tweak content of examples for optimum awesome */
 367 .bs-example > p:last-child,
 368 .bs-example > ul:last-child,
 369 .bs-example > ol:last-child,
 370 .bs-example > blockquote:last-child,
 371 .bs-example > input:last-child,
 372 .bs-example > select:last-child,
 373 .bs-example > textarea:last-child,
 374 .bs-example > .table:last-child,
 375 .bs-example > .navbar:last-child
 376 .bs-example > .jumbotron:last-child,
 377 .bs-example > .alert:last-child,
 378 .bs-example > .panel:last-child,
 379 .bs-example > .list-group:last-child,
 380 .bs-example > .well:last-child {
 381   margin-bottom: 0;
 382 }
 383 .bs-example > p > .close {
 384   float: none;
 385 }
 386
 387 /* Typography */
 388 .bs-example-type .table td {
 389   color: #999;
 390   vertical-align: middle;
 391   border-color: ;
 392 }
 393 .bs-example-type .table td,
 394 .bs-example-type .table th {
 395   padding: 15px 0;
 396   border-color: #eee;
 397 }
 398 .bs-example-type .table tr:first-child td,
 399 .bs-example-type .table tr:first-child th {
 400   border-top: 0;
 401 }
 402 .bs-example-type h1,
 403 .bs-example-type h2,
 404 .bs-example-type h3,
 405 .bs-example-type h4,
 406 .bs-example-type h5,
 407 .bs-example-type h6 {
 408   margin: 0;
 409 }
 410
 411 /* Forms */
 412 .bs-example.form-inline select,
 413 .bs-example.form-inline input[type="text"],
 414 .bs-example.form-inline input[type="password"] {
 415   width: 180px;
 416 }
 417 .bs-example-control-sizing select,
 418 .bs-example-control-sizing input[type="text"] + input[type="text"] {
 419   margin-top: 10px;
 420 }
 421 .bs-example-form .input-group {
 422   margin-bottom: 10px;
 423 }
 424
 425 /* List groups */
 426 .bs-example > .list-group {
 427   max-width: 400px;
 428 }
 429
 430 /* Navbar examples */
 431 .bs-example .navbar:last-child {
 432   margin-bottom: 0;
 433 }
 434 .bs-navbar-top-example,
 435 .bs-navbar-bottom-example {
 436   z-index: 1;
 437   padding: 0;
 438   min-height: 110px;
 439   overflow: hidden; /* cut the drop shadows off */
 440 }
 441 .bs-navbar-top-example .navbar-fixed-top,
 442 .bs-navbar-bottom-example .navbar-fixed-bottom {
 443   position: relative;
 444   margin-left: 0;
 445   margin-right: 0;
 446 }
 447 .bs-navbar-top-example .navbar-fixed-top {
 448   top: -1px;
 449 }
 450 .bs-navbar-bottom-example .navbar-fixed-bottom {
 451   bottom: -1px;
 452 }
 453 .bs-navbar-top-example {
 454   -webkit-border-radius: 0 0 4px 4px;
 455      -moz-border-radius: 0 0 4px 4px;
 456           border-radius: 0 0 4px 4px;
 457 }
 458 .bs-navbar-top-example:after {
 459   top: auto;
 460   bottom: 15px;
 461   -webkit-border-radius: 0 4px 0 4px;
 462      -moz-border-radius: 0 4px 0 4px;
 463           border-radius: 0 4px 0 4px;
 464 }
 465 .bs-navbar-bottom-example {
 466   -webkit-border-radius: 4px 4px 0 0;
 467      -moz-border-radius: 4px 4px 0 0;
 468           border-radius: 4px 4px 0 0;
 469 }
 470 .bs-navbar-bottom-example .navbar {
 471   margin-bottom: 0;
 472 }
 473
 474 /* Example modals */
 475 .bs-example-modal {
 476   background-color: #f5f5f5;
 477 }
 478 .bs-example-modal .modal {
 479   position: relative;
 480   top: auto;
 481   right: auto;
 482   left: auto;
 483   bottom: auto;
 484   z-index: 1;
 485   display: block;
 486 }
 487 .bs-example-modal .modal-dialog {
 488   left: auto;
 489   margin-left: auto;
 490   margin-right: auto;
 491 }
 492
 493 /* Example dropdowns */
 494 .bs-example > .dropdown > .dropdown-menu,
 495 .bs-example-submenu > .pull-left > .dropup > .dropdown-menu,
 496 .bs-example-submenu > .pull-left > .dropdown > .dropdown-menu {
 497   position: static;
 498   display: block;
 499   margin-bottom: 5px;
 500 }
 501 .bs-example-submenu {
 502   min-height: 230px;
 503 }
 504 .bs-example-submenu > .pull-left + .pull-left {
 505   margin-left: 20px;
 506 }
 507
 508 /* Example tabbable tabs */
 509 .bs-example-tabs .nav-tabs {
 510   margin-bottom: 15px;
 511 }
 512
 513 /* Tooltips */
 514 .bs-example-tooltips {
 515   text-align: center;
 516 }
 517
 518 /* Popovers */
 519 .bs-example-popover {
 520   padding-bottom: 24px;
 521   background-color: #f9f9f9;
 522 }
 523 .bs-example-popover .popover {
 524   position: relative;
 525   display: block;
 526   float: left;
 527   width: 260px;
 528   margin: 20px;
 529 }
 530
 531
 532
 533 /* Example templates
 534 -------------------------------------------------- */
 535
 536 .bs-examples h4 {
 537   margin-bottom: 5px;
 538 }
 539 .bs-examples p {
 540   margin-bottom: 20px;
 541 }
 542
 543
 544
 545 /* Responsive docs
 546 -------------------------------------------------- */
 547
 548 /* Responsive (scrollable) doc tables */
 549 @media (max-width: 768px) {
 550   .bs-table-scrollable {
 551     width: 100%;
 552     margin-bottom: 15px;
 553     overflow-y: hidden;
 554     overflow-x: scroll;
 555     border: 1px solid #ddd;
 556   }
 557   .bs-table-scrollable .table {
 558     margin-bottom: 0;
 559     border: 0;
 560   }
 561   .bs-table-scrollable .table th,
 562   .bs-table-scrollable .table td {
 563     white-space: nowrap;
 564   }
 565   .bs-table-scrollable .table th:first-child,
 566   .bs-table-scrollable .table td:first-child {
 567     border-left: 0;
 568   }
 569   .bs-table-scrollable .table th:last-child,
 570   .bs-table-scrollable .table td:last-child {
 571     border-right: 0;
 572   }
 573   .bs-table-scrollable .table tr:last-child th,
 574   .bs-table-scrollable .table tr:last-child td {
 575     border-bottom: 0;
 576   }
 577 }
 578
 579 /* Related: responsive utilities tables */
 580 .table code {
 581   font-size: 13px;
 582   font-weight: normal;
 583 }
 584
 585 /* Utility classes table
 586 ------------------------- */
 587 .bs-table th small,
 588 .responsive-utilities th small {
 589   display: block;
 590   font-weight: normal;
 591   color: #999;
 592 }
 593 .responsive-utilities tbody th {
 594   font-weight: normal;
 595 }
 596 .responsive-utilities td {
 597   text-align: center;
 598 }
 599 .responsive-utilities td.is-visible {
 600   color: #468847;
 601   background-color: #dff0d8 !important;
 602 }
 603 .responsive-utilities td.is-hidden {
 604   color: #ccc;
 605   background-color: #f9f9f9 !important;
 606 }
 607
 608 /* Responsive tests
 609 ------------------------- */
 610 .responsive-utilities-test {
 611   margin-top: 5px;
 612   padding-left: 0;
 613   list-style: none;
 614   overflow: hidden; /* clear floats */
 615 }
 616 .responsive-utilities-test li {
 617   position: relative;
 618   float: left;
 619   width: 25%;
 620 }
 621 .responsive-utilities-test li + li {
 622   margin-left: 10px;
 623 }
 624 .responsive-utilities-test span {
 625   padding: 15px 10px;
 626   font-size: 14px;
 627   font-weight: bold;
 628   line-height: 1.1;
 629   text-align: center;
 630   border-radius: 4px;
 631 }
 632 .responsive-utilities-test.visible-on [class*="hidden"],
 633 .responsive-utilities-test.hidden-on [class*="visible"] {
 634   color: #999;
 635   border: 1px solid #ddd;
 636 }
 637 .responsive-utilities-test.visible-on [class*="visible"],
 638 .responsive-utilities-test.hidden-on [class*="hidden"] {
 639   color: #468847;
 640   background-color: #dff0d8;
 641   border: 1px solid #d6e9c6;
 642 }
 643
 644
 645
 646 /* Footer
 647 -------------------------------------------------- */
 648
 649 .bs-footer {
 650   padding-top: 40px;
 651   padding-bottom: 30px;
 652   margin-top: 100px;
 653   text-align: center;
 654   border-top: 1px solid #e5e5e5;
 655 }
 656 .bs-footer p {
 657   margin-bottom: 0;
 658   color: #777;
 659 }
 660 .footer-links {
 661   margin: 10px 0;
 662   padding-left: 0;
 663 }
 664 .footer-links li {
 665   display: inline;
 666   padding: 0 2px;
 667 }
 668 .footer-links li:first-child {
 669   padding-left: 0;
 670 }
 671
 672 /* Social proof buttons from GitHub & Twitter */
 673 .bs-social {
 674   margin-bottom: 20px;
 675 }
 676 .bs-social-buttons {
 677   display: inline-block;
 678   margin-bottom: 0;
 679   padding-left: 0;
 680   list-style: none;
 681 }
 682 .bs-social-buttons li {
 683   display: inline-block;
 684   line-height: 1;
 685 }
 686 .bs-social-buttons li + li {
 687   margin-left: 15px;
 688 }
 689 .bs-social-buttons .twitter-follow-button {
 690   width: 225px !important;
 691 }
 692 .bs-social-buttons .twitter-share-button {
 693   width: 98px !important;
 694 }
 695
 696
 697
 698 /* Misc docs stuff
 699 -------------------------------------------------- */
 700
 701 /* Pseudo :focus state for showing how it looks in the docs */
 702 input.focused {
 703   border-color: rgba(82,168,236,.8);
 704   outline: 0;
 705   outline: thin dotted \9; /* IE6-9 */
 706   -moz-box-shadow: 0 0 8px rgba(82,168,236,.6);
 707        box-shadow: 0 0 8px rgba(82,168,236,.6);
 708 }
 709
 710 /* Scrollspy demo on fixed height div */
 711 .scrollspy-example {
 712   position: relative;
 713   height: 200px;
 714   margin-top: 10px;
 715   overflow: auto;
 716 }
 717
 718 .highlight {
 719   padding: 9px 14px;
 720   margin-bottom: 14px;
 721   background-color: #f7f7f9;
 722   border: 1px solid #e1e1e8;
 723   border-radius: 4px;
 724 }
 725 .highlight pre {
 726   padding: 0;
 727   margin-top: 0;
 728   margin-bottom: 0;
 729   background-color: transparent;
 730   border: 0;
 731   white-space: nowrap;
 732 }
 733 .highlight pre code {
 734   font-size: inherit;
 735   color: #333; /* Effectively the base text color */
 736 }
 737 .highlight pre .lineno {
 738   display: inline-block;
 739   width: 22px;
 740   padding-right: 5px;
 741   margin-right: 10px;
 742   text-align: right;
 743   color: #bebec5;
 744 }
 745
 746 /* Better spacing on download options in getting started */
 747 .bs-docs-dl-options h4 {
 748   margin-top: 15px;
 749   margin-bottom: 5px;
 750 }
 751
 752 /* Hide the top link initially */
 753 .bs-top {
 754   display: none;
 755 }
 756
 757
 758 /* Responsive variations
 759 -------------------------------------------------- */
 760
 761 /* Hide code snippets on mobile devices */
 762 @media screen and (max-width: 480px) {
 763   .highlight {
 764     display: none;
 765   }
 766 }
 767
 768 /* Tablets and up */
 769 @media screen and (min-width: 768px) {
 770
 771   /* Back to top link */
 772   .bs-top {
 773     display: block; /* Unhide */
 774     float: left;
 775     padding: 7px 15px;
 776     font-weight: 500;
 777     color: #999;
 778     background-color: #eee;
 779     border-radius: 4px;
 780   }
 781   .bs-top:hover {
 782     color: #fff;
 783     text-decoration: none;
 784     background-color: #999;
 785   }
 786   .bs-top.affix {
 787     position: fixed;
 788     right:  15px;
 789     bottom: 15px;
 790   }
 791   .bs-header {
 792     font-size: 21px;
 793     text-align: left;
 794   }
 795   .bs-header h1 {
 796     font-size: 60px;
 797     line-height: 1;
 798   }
 799
 800   .bs-example {
 801     margin-left: 0;
 802     margin-right: 0;
 803     background-color: #fff;
 804     border-width: 1px;
 805     border-color: #ddd;
 806     border-radius: 4px 4px 0 0;
 807     box-shadow: none;
 808   }
 809
 810   .carbonad {
 811     margin: 0 !important;
 812     border: 1px solid #e5e5e5 !important;
 813     border-radius: 4px;
 814   }
 815
 816   /* Show the docs nav */
 817   .bs-sidebar {
 818     display: block;
 819   }
 820
 821   /* Tweak display of docs jumbotrons */
 822   .bs-masthead {
 823     padding-top:    100px;
 824     padding-bottom: 100px;
 825   }
 826   .bs-masthead h1 {
 827     font-size: 100px;
 828   }
 829   .bs-masthead p {
 830     margin-left: 15%;
 831     margin-right: 15%;
 832     font-size: 30px;
 833   }
 834
 835   .bs-navbar-top-example .navbar-fixed-top,
 836   .bs-navbar-bottom-example .navbar-fixed-bottom {
 837     position: absolute;
 838   }
 839
 840 }
 841
 842 /* Tablets/desktops and up */
 843 @media screen and (min-width: 992px) {
 844
 845   /* Widen the fixed sidebar */
 846   .bs-sidebar.affix,
 847   .bs-sidebar.affix-bottom {
 848     width: 213px;
 849   }
 850   .bs-sidebar.affix {
 851     position: fixed; /* Undo the static from mobile-first approach */
 852     top: 80px;
 853   }
 854   .bs-sidebar.affix-bottom {
 855     position: absolute; /* Undo the static from mobile-first approach */
 856   }
 857   .bs-sidebar.affix-bottom .bs-sidenav,
 858   .bs-sidebar.affix .bs-sidenav {
 859     margin-top: 0;
 860     margin-bottom: 0;
 861   }
 862   .bs-header h1,
 863   .bs-header p {
 864     margin-right: 380px;
 865   }
 866   .carbonad {
 867     position: absolute;
 868     top: 20px;
 869     right: 0;
 870     padding: 15px !important;
 871     width: 330px !important;
 872     min-height: 132px;
 873   }
 874
 875 }
 876
 877 /* Large desktops and up */
 878 @media screen and (min-width: 1200px) {
 879
 880   /* Widen the fixed sidebar again */
 881   .bs-sidebar.affix-bottom,
 882   .bs-sidebar.affix {
 883     width: 270px;
 884   }
 885
 886 }