Warning, /webapps/ocs-webserver/httpdocs/theme/flatui/css/bootstrap/bootstrap-docs.css is written in an unsupported language. File is not indexed.
0001 /* Add additional stylesheets below 0002 -------------------------------------------------- */ 0003 /* 0004 Bootstrap's documentation styles 0005 Special styles for presenting Bootstrap's documentation and examples 0006 */ 0007 0008 0009 0010 /* Body and structure 0011 -------------------------------------------------- */ 0012 0013 body { 0014 position: relative; 0015 padding-top: 40px; 0016 } 0017 0018 /* Code in headings */ 0019 h3 code { 0020 font-size: 14px; 0021 font-weight: normal; 0022 } 0023 0024 0025 0026 /* Tweak navbar brand link to be super sleek 0027 -------------------------------------------------- */ 0028 0029 body > .navbar { 0030 font-size: 13px; 0031 } 0032 0033 /* Change the docs' brand */ 0034 body > .navbar .brand { 0035 padding-right: 0; 0036 padding-left: 0; 0037 margin-left: 20px; 0038 float: right; 0039 font-weight: bold; 0040 color: #000; 0041 text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.125); 0042 -webkit-transition: all .2s linear; 0043 -moz-transition: all .2s linear; 0044 transition: all .2s linear; 0045 } 0046 body > .navbar .brand:hover { 0047 text-decoration: none; 0048 text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.4); 0049 } 0050 0051 0052 /* Sections 0053 -------------------------------------------------- */ 0054 0055 /* padding for in-page bookmarks and fixed navbar */ 0056 section { 0057 padding-top: 30px; 0058 } 0059 section > .page-header, 0060 section > .lead { 0061 color: #5a5a5a; 0062 } 0063 section > ul li { 0064 margin-bottom: 5px; 0065 } 0066 0067 /* Separators (hr) */ 0068 .bs-docs-separator { 0069 margin: 40px 0 39px; 0070 } 0071 0072 /* Faded out hr */ 0073 hr.soften { 0074 height: 1px; 0075 margin: 70px 0; 0076 background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); 0077 background-image: -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); 0078 background-image: -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); 0079 background-image: -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0)); 0080 border: 0; 0081 } 0082 0083 0084 0085 /* Jumbotrons 0086 -------------------------------------------------- */ 0087 0088 /* Base class 0089 ------------------------- */ 0090 .jumbotron { 0091 position: relative; 0092 padding: 40px 0; 0093 color: #fff; 0094 text-align: center; 0095 text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075); 0096 background: #020031; /* Old browsers */ 0097 background: -moz-linear-gradient(45deg, #020031 0%, #6d3353 100%); /* FF3.6+ */ 0098 background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#020031), color-stop(100%,#6d3353)); /* Chrome,Safari4+ */ 0099 background: -webkit-linear-gradient(45deg, #020031 0%,#6d3353 100%); /* Chrome10+,Safari5.1+ */ 0100 background: -o-linear-gradient(45deg, #020031 0%,#6d3353 100%); /* Opera 11.10+ */ 0101 background: -ms-linear-gradient(45deg, #020031 0%,#6d3353 100%); /* IE10+ */ 0102 background: linear-gradient(45deg, #020031 0%,#6d3353 100%); /* W3C */ 0103 filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020031', endColorstr='#6d3353',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */ 0104 -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2); 0105 -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2); 0106 box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2); 0107 } 0108 .jumbotron h1 { 0109 font-size: 80px; 0110 font-weight: bold; 0111 letter-spacing: -1px; 0112 line-height: 1; 0113 } 0114 .jumbotron p { 0115 font-size: 24px; 0116 font-weight: 300; 0117 line-height: 1.25; 0118 margin-bottom: 30px; 0119 } 0120 0121 /* Link styles (used on .masthead-links as well) */ 0122 .jumbotron a { 0123 color: #fff; 0124 color: rgba(255,255,255,.5); 0125 -webkit-transition: all .2s ease-in-out; 0126 -moz-transition: all .2s ease-in-out; 0127 transition: all .2s ease-in-out; 0128 } 0129 .jumbotron a:hover { 0130 color: #fff; 0131 text-shadow: 0 0 10px rgba(255,255,255,.25); 0132 } 0133 0134 /* Download button */ 0135 .masthead .btn { 0136 padding: 19px 24px; 0137 font-size: 24px; 0138 font-weight: 200; 0139 color: #fff; /* redeclare to override the `.jumbotron a` */ 0140 border: 0; 0141 -webkit-border-radius: 6px; 0142 -moz-border-radius: 6px; 0143 border-radius: 6px; 0144 -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25); 0145 -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25); 0146 box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25); 0147 -webkit-transition: none; 0148 -moz-transition: none; 0149 transition: none; 0150 } 0151 .masthead .btn:hover { 0152 -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25); 0153 -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25); 0154 box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25); 0155 } 0156 .masthead .btn:active { 0157 -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1); 0158 -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1); 0159 box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1); 0160 } 0161 0162 0163 /* Pattern overlay 0164 ------------------------- */ 0165 .jumbotron .container { 0166 position: relative; 0167 z-index: 2; 0168 } 0169 .jumbotron:after { 0170 content: ''; 0171 display: block; 0172 position: absolute; 0173 top: 0; 0174 right: 0; 0175 bottom: 0; 0176 left: 0; 0177 background: url(../img/bs-docs-masthead-pattern.png) repeat center center; 0178 opacity: .4; 0179 } 0180 @media 0181 only screen and (-webkit-min-device-pixel-ratio: 2), 0182 only screen and ( min--moz-device-pixel-ratio: 2), 0183 only screen and ( -o-min-device-pixel-ratio: 2/1) { 0184 0185 .jumbotron:after { 0186 background-size: 150px 150px; 0187 } 0188 0189 } 0190 0191 /* Masthead (docs home) 0192 ------------------------- */ 0193 .masthead { 0194 padding: 70px 0 80px; 0195 margin-bottom: 0; 0196 color: #fff; 0197 } 0198 .masthead h1 { 0199 font-size: 120px; 0200 line-height: 1; 0201 letter-spacing: -2px; 0202 } 0203 .masthead p { 0204 font-size: 40px; 0205 font-weight: 200; 0206 line-height: 1.25; 0207 } 0208 0209 /* Textual links in masthead */ 0210 .masthead-links { 0211 margin: 0; 0212 list-style: none; 0213 } 0214 .masthead-links li { 0215 display: inline; 0216 padding: 0 10px; 0217 color: rgba(255,255,255,.25); 0218 } 0219 0220 /* Social proof buttons from GitHub & Twitter */ 0221 .bs-docs-social { 0222 padding: 15px 0; 0223 text-align: center; 0224 background-color: #f5f5f5; 0225 border-top: 1px solid #fff; 0226 border-bottom: 1px solid #ddd; 0227 } 0228 0229 /* Quick links on Home */ 0230 .bs-docs-social-buttons { 0231 margin-left: 0; 0232 margin-bottom: 0; 0233 padding-left: 0; 0234 list-style: none; 0235 } 0236 .bs-docs-social-buttons li { 0237 display: inline-block; 0238 padding: 5px 8px; 0239 line-height: 1; 0240 *display: inline; 0241 *zoom: 1; 0242 } 0243 0244 /* Subhead (other pages) 0245 ------------------------- */ 0246 .subhead { 0247 text-align: left; 0248 border-bottom: 1px solid #ddd; 0249 } 0250 .subhead h1 { 0251 font-size: 60px; 0252 } 0253 .subhead p { 0254 margin-bottom: 20px; 0255 } 0256 .subhead .navbar { 0257 display: none; 0258 } 0259 0260 0261 0262 /* Marketing section of Overview 0263 -------------------------------------------------- */ 0264 0265 .marketing { 0266 text-align: center; 0267 color: #5a5a5a; 0268 } 0269 .marketing h1 { 0270 margin: 60px 0 10px; 0271 font-size: 60px; 0272 font-weight: 200; 0273 line-height: 1; 0274 letter-spacing: -1px; 0275 } 0276 .marketing h2 { 0277 font-weight: 200; 0278 margin-bottom: 5px; 0279 } 0280 .marketing p { 0281 font-size: 16px; 0282 line-height: 1.5; 0283 } 0284 .marketing .marketing-byline { 0285 margin-bottom: 40px; 0286 font-size: 20px; 0287 font-weight: 300; 0288 line-height: 1.25; 0289 color: #999; 0290 } 0291 .marketing-img { 0292 display: block; 0293 margin: 0 auto 30px; 0294 max-height: 145px; 0295 } 0296 0297 0298 0299 /* Footer 0300 -------------------------------------------------- */ 0301 0302 .footer { 0303 text-align: center; 0304 padding: 30px 0; 0305 margin-top: 70px; 0306 border-top: 1px solid #e5e5e5; 0307 background-color: #f5f5f5; 0308 } 0309 .footer p { 0310 margin-bottom: 0; 0311 color: #777; 0312 } 0313 .footer-links { 0314 margin: 10px 0; 0315 } 0316 .footer-links li { 0317 display: inline; 0318 padding: 0 2px; 0319 } 0320 .footer-links li:first-child { 0321 padding-left: 0; 0322 } 0323 0324 0325 0326 /* Special grid styles 0327 -------------------------------------------------- */ 0328 0329 .show-grid { 0330 margin-top: 10px; 0331 margin-bottom: 20px; 0332 } 0333 .show-grid [class*="span"] { 0334 background-color: #eee; 0335 text-align: center; 0336 -webkit-border-radius: 3px; 0337 -moz-border-radius: 3px; 0338 border-radius: 3px; 0339 min-height: 40px; 0340 line-height: 40px; 0341 } 0342 .show-grid [class*="span"]:hover { 0343 background-color: #ddd; 0344 } 0345 .show-grid .show-grid { 0346 margin-top: 0; 0347 margin-bottom: 0; 0348 } 0349 .show-grid .show-grid [class*="span"] { 0350 margin-top: 5px; 0351 } 0352 .show-grid [class*="span"] [class*="span"] { 0353 background-color: #ccc; 0354 } 0355 .show-grid [class*="span"] [class*="span"] [class*="span"] { 0356 background-color: #999; 0357 } 0358 0359 0360 0361 /* Mini layout previews 0362 -------------------------------------------------- */ 0363 .mini-layout { 0364 border: 1px solid #ddd; 0365 -webkit-border-radius: 6px; 0366 -moz-border-radius: 6px; 0367 border-radius: 6px; 0368 -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.075); 0369 -moz-box-shadow: 0 1px 2px rgba(0,0,0,.075); 0370 box-shadow: 0 1px 2px rgba(0,0,0,.075); 0371 } 0372 .mini-layout, 0373 .mini-layout .mini-layout-body, 0374 .mini-layout.fluid .mini-layout-sidebar { 0375 height: 300px; 0376 } 0377 .mini-layout { 0378 margin-bottom: 20px; 0379 padding: 9px; 0380 } 0381 .mini-layout div { 0382 -webkit-border-radius: 3px; 0383 -moz-border-radius: 3px; 0384 border-radius: 3px; 0385 } 0386 .mini-layout .mini-layout-body { 0387 background-color: #dceaf4; 0388 margin: 0 auto; 0389 width: 70%; 0390 } 0391 .mini-layout.fluid .mini-layout-sidebar, 0392 .mini-layout.fluid .mini-layout-header, 0393 .mini-layout.fluid .mini-layout-body { 0394 float: left; 0395 } 0396 .mini-layout.fluid .mini-layout-sidebar { 0397 background-color: #bbd8e9; 0398 width: 20%; 0399 } 0400 .mini-layout.fluid .mini-layout-body { 0401 width: 77.5%; 0402 margin-left: 2.5%; 0403 } 0404 0405 0406 0407 /* Download page 0408 -------------------------------------------------- */ 0409 0410 .download .page-header { 0411 margin-top: 36px; 0412 } 0413 .page-header .toggle-all { 0414 margin-top: 5px; 0415 } 0416 0417 /* Space out h3s when following a section */ 0418 .download h3 { 0419 margin-bottom: 5px; 0420 } 0421 .download-builder input + h3, 0422 .download-builder .checkbox + h3 { 0423 margin-top: 9px; 0424 } 0425 0426 /* Fields for variables */ 0427 .download-builder input[type=text] { 0428 margin-bottom: 9px; 0429 font-family: Menlo, Monaco, "Courier New", monospace; 0430 font-size: 12px; 0431 color: #d14; 0432 } 0433 .download-builder input[type=text]:focus { 0434 background-color: #fff; 0435 } 0436 0437 /* Custom, larger checkbox labels */ 0438 .download .checkbox { 0439 padding: 6px 10px 6px 25px; 0440 font-size: 13px; 0441 line-height: 18px; 0442 color: #555; 0443 background-color: #f9f9f9; 0444 -webkit-border-radius: 3px; 0445 -moz-border-radius: 3px; 0446 border-radius: 3px; 0447 cursor: pointer; 0448 } 0449 .download .checkbox:hover { 0450 color: #333; 0451 background-color: #f5f5f5; 0452 } 0453 .download .checkbox small { 0454 font-size: 12px; 0455 color: #777; 0456 } 0457 0458 /* Variables section */ 0459 #variables label { 0460 margin-bottom: 0; 0461 } 0462 0463 /* Giant download button */ 0464 .download-btn { 0465 margin: 36px 0 108px; 0466 } 0467 #download p, 0468 #download h4 { 0469 max-width: 50%; 0470 margin: 0 auto; 0471 color: #999; 0472 text-align: center; 0473 } 0474 #download h4 { 0475 margin-bottom: 0; 0476 } 0477 #download p { 0478 margin-bottom: 18px; 0479 } 0480 .download-btn .btn { 0481 display: block; 0482 width: auto; 0483 padding: 19px 24px; 0484 margin-bottom: 27px; 0485 font-size: 30px; 0486 line-height: 1; 0487 text-align: center; 0488 -webkit-border-radius: 6px; 0489 -moz-border-radius: 6px; 0490 border-radius: 6px; 0491 } 0492 0493 0494 0495 /* Misc 0496 -------------------------------------------------- */ 0497 0498 /* Make tables spaced out a bit more */ 0499 h2 + table, 0500 h3 + table, 0501 h4 + table, 0502 h2 + .row { 0503 margin-top: 5px; 0504 } 0505 0506 /* Example sites showcase */ 0507 .example-sites { 0508 xmargin-left: 20px; 0509 } 0510 .example-sites img { 0511 max-width: 100%; 0512 margin: 0 auto; 0513 } 0514 0515 .scrollspy-example { 0516 height: 200px; 0517 overflow: auto; 0518 position: relative; 0519 } 0520 0521 0522 /* Fake the :focus state to demo it */ 0523 .focused { 0524 border-color: rgba(82,168,236,.8); 0525 -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); 0526 -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); 0527 box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6); 0528 outline: 0; 0529 } 0530 0531 /* For input sizes, make them display block */ 0532 .docs-input-sizes select, 0533 .docs-input-sizes input[type=text] { 0534 display: block; 0535 margin-bottom: 9px; 0536 } 0537 0538 /* Icons 0539 ------------------------- */ 0540 .the-icons { 0541 margin-left: 0; 0542 list-style: none; 0543 } 0544 .the-icons li { 0545 float: left; 0546 width: 25%; 0547 line-height: 25px; 0548 } 0549 .the-icons i:hover { 0550 background-color: rgba(255,0,0,.25); 0551 } 0552 0553 /* Example page 0554 ------------------------- */ 0555 .bootstrap-examples h4 { 0556 margin: 10px 0 5px; 0557 } 0558 .bootstrap-examples p { 0559 font-size: 13px; 0560 line-height: 18px; 0561 } 0562 .bootstrap-examples .thumbnail { 0563 margin-bottom: 9px; 0564 background-color: #fff; 0565 } 0566 0567 0568 0569 /* Bootstrap code examples 0570 -------------------------------------------------- */ 0571 0572 /* Base class */ 0573 .bs-docs-example { 0574 position: relative; 0575 margin: 15px 0; 0576 padding: 39px 19px 14px; 0577 *padding-top: 19px; 0578 background-color: #fff; 0579 border: 1px solid #ddd; 0580 -webkit-border-radius: 4px; 0581 -moz-border-radius: 4px; 0582 border-radius: 4px; 0583 } 0584 0585 /* Echo out a label for the example */ 0586 .bs-docs-example:after { 0587 content: "Example"; 0588 position: absolute; 0589 top: -1px; 0590 left: -1px; 0591 padding: 3px 7px; 0592 font-size: 12px; 0593 font-weight: bold; 0594 background-color: #f5f5f5; 0595 border: 1px solid #ddd; 0596 color: #9da0a4; 0597 -webkit-border-radius: 4px 0 4px 0; 0598 -moz-border-radius: 4px 0 4px 0; 0599 border-radius: 4px 0 4px 0; 0600 } 0601 0602 /* Remove spacing between an example and it's code */ 0603 .bs-docs-example + .prettyprint { 0604 margin-top: -20px; 0605 padding-top: 15px; 0606 } 0607 0608 /* Tweak examples 0609 ------------------------- */ 0610 .bs-docs-example > p:last-child { 0611 margin-bottom: 0; 0612 } 0613 .bs-docs-example .table, 0614 .bs-docs-example .progress, 0615 .bs-docs-example .well, 0616 .bs-docs-example .alert, 0617 .bs-docs-example .hero-unit, 0618 .bs-docs-example .pagination, 0619 .bs-docs-example .navbar, 0620 .bs-docs-example > .nav, 0621 .bs-docs-example blockquote { 0622 margin-bottom: 5px; 0623 } 0624 .bs-docs-example .pagination { 0625 margin-top: 0; 0626 } 0627 .bs-navbar-top-example, 0628 .bs-navbar-bottom-example { 0629 z-index: 1; 0630 padding: 0; 0631 height: 90px; 0632 overflow: hidden; /* cut the drop shadows off */ 0633 } 0634 .bs-navbar-top-example .navbar-fixed-top, 0635 .bs-navbar-bottom-example .navbar-fixed-bottom { 0636 margin-left: 0; 0637 margin-right: 0; 0638 } 0639 .bs-navbar-top-example { 0640 -webkit-border-radius: 0 0 4px 4px; 0641 -moz-border-radius: 0 0 4px 4px; 0642 border-radius: 0 0 4px 4px; 0643 } 0644 .bs-navbar-top-example:after { 0645 top: auto; 0646 bottom: -1px; 0647 -webkit-border-radius: 0 4px 0 4px; 0648 -moz-border-radius: 0 4px 0 4px; 0649 border-radius: 0 4px 0 4px; 0650 } 0651 .bs-navbar-bottom-example { 0652 -webkit-border-radius: 4px 4px 0 0; 0653 -moz-border-radius: 4px 4px 0 0; 0654 border-radius: 4px 4px 0 0; 0655 } 0656 .bs-navbar-bottom-example .navbar { 0657 margin-bottom: 0; 0658 } 0659 form.bs-docs-example { 0660 padding-bottom: 19px; 0661 } 0662 0663 /* Images */ 0664 .bs-docs-example-images img { 0665 margin: 10px; 0666 display: inline-block; 0667 } 0668 0669 /* Tooltips */ 0670 .bs-docs-tooltip-examples { 0671 text-align: center; 0672 margin: 0 0 10px; 0673 list-style: none; 0674 } 0675 .bs-docs-tooltip-examples li { 0676 display: inline; 0677 padding: 0 10px; 0678 } 0679 0680 /* Popovers */ 0681 .bs-docs-example-popover { 0682 padding-bottom: 24px; 0683 background-color: #f9f9f9; 0684 } 0685 .bs-docs-example-popover .popover { 0686 position: relative; 0687 display: block; 0688 float: left; 0689 width: 260px; 0690 margin: 20px; 0691 } 0692 0693 /* Dropdowns */ 0694 .bs-docs-example-submenus { 0695 min-height: 180px; 0696 } 0697 .bs-docs-example-submenus > .pull-left + .pull-left { 0698 margin-left: 20px; 0699 } 0700 .bs-docs-example-submenus .dropup > .dropdown-menu, 0701 .bs-docs-example-submenus .dropdown > .dropdown-menu { 0702 display: block; 0703 position: static; 0704 margin-bottom: 5px; 0705 *width: 180px; 0706 } 0707 0708 0709 0710 /* Responsive docs 0711 -------------------------------------------------- */ 0712 0713 /* Utility classes table 0714 ------------------------- */ 0715 .responsive-utilities th small { 0716 display: block; 0717 font-weight: normal; 0718 color: #999; 0719 } 0720 .responsive-utilities tbody th { 0721 font-weight: normal; 0722 } 0723 .responsive-utilities td { 0724 text-align: center; 0725 } 0726 .responsive-utilities td.is-visible { 0727 color: #468847; 0728 background-color: #dff0d8 !important; 0729 } 0730 .responsive-utilities td.is-hidden { 0731 color: #ccc; 0732 background-color: #f9f9f9 !important; 0733 } 0734 0735 /* Responsive tests 0736 ------------------------- */ 0737 .responsive-utilities-test { 0738 margin-top: 5px; 0739 margin-left: 0; 0740 list-style: none; 0741 overflow: hidden; /* clear floats */ 0742 } 0743 .responsive-utilities-test li { 0744 position: relative; 0745 float: left; 0746 width: 25%; 0747 height: 43px; 0748 font-size: 14px; 0749 font-weight: bold; 0750 line-height: 43px; 0751 color: #999; 0752 text-align: center; 0753 border: 1px solid #ddd; 0754 -webkit-border-radius: 4px; 0755 -moz-border-radius: 4px; 0756 border-radius: 4px; 0757 } 0758 .responsive-utilities-test li + li { 0759 margin-left: 10px; 0760 } 0761 .responsive-utilities-test span { 0762 position: absolute; 0763 top: -1px; 0764 left: -1px; 0765 right: -1px; 0766 bottom: -1px; 0767 -webkit-border-radius: 4px; 0768 -moz-border-radius: 4px; 0769 border-radius: 4px; 0770 } 0771 .responsive-utilities-test span { 0772 color: #468847; 0773 background-color: #dff0d8; 0774 border: 1px solid #d6e9c6; 0775 } 0776 0777 0778 0779 /* Sidenav for Docs 0780 -------------------------------------------------- */ 0781 0782 .bs-docs-sidenav { 0783 width: 228px; 0784 margin: 30px 0 0; 0785 padding: 0; 0786 background-color: #fff; 0787 -webkit-border-radius: 6px; 0788 -moz-border-radius: 6px; 0789 border-radius: 6px; 0790 -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.065); 0791 -moz-box-shadow: 0 1px 4px rgba(0,0,0,.065); 0792 box-shadow: 0 1px 4px rgba(0,0,0,.065); 0793 } 0794 .bs-docs-sidenav > li > a { 0795 display: block; 0796 width: 190px \9; 0797 margin: 0 0 -1px; 0798 padding: 8px 14px; 0799 border: 1px solid #e5e5e5; 0800 } 0801 .bs-docs-sidenav > li:first-child > a { 0802 -webkit-border-radius: 6px 6px 0 0; 0803 -moz-border-radius: 6px 6px 0 0; 0804 border-radius: 6px 6px 0 0; 0805 } 0806 .bs-docs-sidenav > li:last-child > a { 0807 -webkit-border-radius: 0 0 6px 6px; 0808 -moz-border-radius: 0 0 6px 6px; 0809 border-radius: 0 0 6px 6px; 0810 } 0811 .bs-docs-sidenav > .active > a { 0812 position: relative; 0813 z-index: 2; 0814 padding: 9px 15px; 0815 border: 0; 0816 text-shadow: 0 1px 0 rgba(0,0,0,.15); 0817 -webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1); 0818 -moz-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1); 0819 box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1); 0820 } 0821 /* Chevrons */ 0822 .bs-docs-sidenav .icon-chevron-right { 0823 float: right; 0824 margin-top: 2px; 0825 margin-right: -6px; 0826 opacity: .25; 0827 } 0828 .bs-docs-sidenav > li > a:hover { 0829 background-color: #f5f5f5; 0830 } 0831 .bs-docs-sidenav a:hover .icon-chevron-right { 0832 opacity: .5; 0833 } 0834 .bs-docs-sidenav .active .icon-chevron-right, 0835 .bs-docs-sidenav .active a:hover .icon-chevron-right { 0836 background-image: url(../img/glyphicons-halflings-white.png); 0837 opacity: 1; 0838 } 0839 .bs-docs-sidenav.affix { 0840 top: 40px; 0841 } 0842 .bs-docs-sidenav.affix-bottom { 0843 position: absolute; 0844 top: auto; 0845 bottom: 270px; 0846 } 0847 0848 0849 0850 0851 /* Responsive 0852 -------------------------------------------------- */ 0853 0854 /* Desktop large 0855 ------------------------- */ 0856 @media (min-width: 1200px) { 0857 .bs-docs-container { 0858 max-width: 970px; 0859 } 0860 .bs-docs-sidenav { 0861 width: 258px; 0862 } 0863 .bs-docs-sidenav > li > a { 0864 width: 230px \9; /* Override the previous IE8-9 hack */ 0865 } 0866 } 0867 0868 /* Desktop 0869 ------------------------- */ 0870 @media (max-width: 980px) { 0871 /* Unfloat brand */ 0872 body > .navbar-fixed-top .brand { 0873 float: left; 0874 margin-left: 0; 0875 padding-left: 10px; 0876 padding-right: 10px; 0877 } 0878 0879 /* Inline-block quick links for more spacing */ 0880 .quick-links li { 0881 display: inline-block; 0882 margin: 5px; 0883 } 0884 0885 /* When affixed, space properly */ 0886 .bs-docs-sidenav { 0887 top: 0; 0888 width: 218px; 0889 margin-top: 30px; 0890 margin-right: 0; 0891 } 0892 } 0893 0894 /* Tablet to desktop 0895 ------------------------- */ 0896 @media (min-width: 768px) and (max-width: 979px) { 0897 /* Remove any padding from the body */ 0898 body { 0899 padding-top: 0; 0900 } 0901 /* Widen masthead and social buttons to fill body padding */ 0902 .jumbotron { 0903 margin-top: -20px; /* Offset bottom margin on .navbar */ 0904 } 0905 /* Adjust sidenav width */ 0906 .bs-docs-sidenav { 0907 width: 166px; 0908 margin-top: 20px; 0909 } 0910 .bs-docs-sidenav.affix { 0911 top: 0; 0912 } 0913 } 0914 0915 /* Tablet 0916 ------------------------- */ 0917 @media (max-width: 767px) { 0918 /* Remove any padding from the body */ 0919 body { 0920 padding-top: 0; 0921 } 0922 0923 /* Widen masthead and social buttons to fill body padding */ 0924 .jumbotron { 0925 padding: 40px 20px; 0926 margin-top: -20px; /* Offset bottom margin on .navbar */ 0927 margin-right: -20px; 0928 margin-left: -20px; 0929 } 0930 .masthead h1 { 0931 font-size: 90px; 0932 } 0933 .masthead p, 0934 .masthead .btn { 0935 font-size: 24px; 0936 } 0937 .marketing .span4 { 0938 margin-bottom: 40px; 0939 } 0940 .bs-docs-social { 0941 margin: 0 -20px; 0942 } 0943 0944 /* Space out the show-grid examples */ 0945 .show-grid [class*="span"] { 0946 margin-bottom: 5px; 0947 } 0948 0949 /* Sidenav */ 0950 .bs-docs-sidenav { 0951 width: auto; 0952 margin-bottom: 20px; 0953 } 0954 .bs-docs-sidenav.affix { 0955 position: static; 0956 width: auto; 0957 top: 0; 0958 } 0959 0960 /* Unfloat the back to top link in footer */ 0961 .footer { 0962 margin-left: -20px; 0963 margin-right: -20px; 0964 padding-left: 20px; 0965 padding-right: 20px; 0966 } 0967 .footer p { 0968 margin-bottom: 9px; 0969 } 0970 } 0971 0972 /* Landscape phones 0973 ------------------------- */ 0974 @media (max-width: 480px) { 0975 /* Remove padding above jumbotron */ 0976 body { 0977 padding-top: 0; 0978 } 0979 0980 /* Change up some type stuff */ 0981 h2 small { 0982 display: block; 0983 } 0984 0985 /* Downsize the jumbotrons */ 0986 .jumbotron h1 { 0987 font-size: 45px; 0988 } 0989 .jumbotron p, 0990 .jumbotron .btn { 0991 font-size: 18px; 0992 } 0993 .jumbotron .btn { 0994 display: block; 0995 margin: 0 auto; 0996 } 0997 0998 /* center align subhead text like the masthead */ 0999 .subhead h1, 1000 .subhead p { 1001 text-align: center; 1002 } 1003 1004 /* Marketing on home */ 1005 .marketing h1 { 1006 font-size: 30px; 1007 } 1008 .marketing-byline { 1009 font-size: 18px; 1010 } 1011 1012 /* center example sites */ 1013 .example-sites { 1014 margin-left: 0; 1015 } 1016 .example-sites > li { 1017 float: none; 1018 display: block; 1019 max-width: 280px; 1020 margin: 0 auto 18px; 1021 text-align: center; 1022 } 1023 .example-sites .thumbnail > img { 1024 max-width: 270px; 1025 } 1026 1027 /* Do our best to make tables work in narrow viewports */ 1028 table code { 1029 white-space: normal; 1030 word-wrap: break-word; 1031 word-break: break-all; 1032 } 1033 1034 /* Examples: dropdowns */ 1035 .bs-docs-example-submenus > .pull-left { 1036 float: none; 1037 clear: both; 1038 } 1039 .bs-docs-example-submenus > .pull-left, 1040 .bs-docs-example-submenus > .pull-left + .pull-left { 1041 margin-left: 0; 1042 } 1043 .bs-docs-example-submenus p { 1044 margin-bottom: 0; 1045 } 1046 .bs-docs-example-submenus .dropup > .dropdown-menu, 1047 .bs-docs-example-submenus .dropdown > .dropdown-menu { 1048 margin-bottom: 10px; 1049 float: none; 1050 max-width: 180px; 1051 } 1052 1053 /* Examples: modal */ 1054 .modal-example .modal { 1055 position: relative; 1056 top: auto; 1057 right: auto; 1058 bottom: auto; 1059 left: auto; 1060 } 1061 1062 /* Tighten up footer */ 1063 .footer { 1064 padding-top: 20px; 1065 padding-bottom: 20px; 1066 } 1067 }