Subversion Repositories SmartDukaan

Rev

Details | Last modification | View Log | RSS feed

Rev Author Line No. Line
12352 anikendra 1 
/* Add additional stylesheets below
2 
-------------------------------------------------- */
3 
/*
4 
  Bootstrap's documentation styles
5 
  Special styles for presenting Bootstrap's documentation and examples
6 
*/
7 
 
8 
 
9 
 
10 
/* Body and structure
11 
-------------------------------------------------- */
12 
 
13 
body {
14 
  position: relative;
15 
  padding-top: 40px;
16 
}
17 
 
18 
/* Code in headings */
19 
h3 code {
20 
  font-size: 14px;
21 
  font-weight: normal;
22 
}
23 
 
24 
 
25 
 
26 
/* Tweak navbar brand link to be super sleek
27 
-------------------------------------------------- */
28 
 
29 
body > .navbar {
30 
  font-size: 13px;
31 
}
32 
 
33 
/* Change the docs' brand */
34 
body > .navbar .brand {
35 
  padding-right: 0;
36 
  padding-left: 0;
37 
  margin-left: 20px;
38 
  font-weight: bold;
39 
  color: #000;
40 
  text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.125);
41 
  -webkit-transition: all .2s linear;
42 
     -moz-transition: all .2s linear;
43 
          transition: all .2s linear;
44 
}
45 
body > .navbar .brand:hover {
46 
  text-decoration: none;
47 
  text-shadow: 0 1px 0 rgba(255,255,255,.1), 0 0 30px rgba(255,255,255,.4);
48 
}
49 
 
50 
 
51 
/* Sections
52 
-------------------------------------------------- */
53 
 
54 
/* padding for in-page bookmarks and fixed navbar */
55 
section {
56 
  padding-top: 30px;
57 
}
58 
section > .page-header,
59 
section > .lead {
60 
  color: #5a5a5a;
61 
}
62 
section > ul li {
63 
  margin-bottom: 5px;
64 
}
65 
 
66 
/* Separators (hr) */
67 
.bs-docs-separator {
68 
  margin: 40px 0 39px;
69 
}
70 
 
71 
/* Faded out hr */
72 
hr.soften {
73 
  height: 1px;
74 
  margin: 70px 0;
75 
  background-image: -webkit-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0));
76 
  background-image:    -moz-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0));
77 
  background-image:     -ms-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0));
78 
  background-image:      -o-linear-gradient(left, rgba(0,0,0,0), rgba(0,0,0,.1), rgba(0,0,0,0));
79 
  border: 0;
80 
}
81 
 
82 
 
83 
 
84 
/* Jumbotrons
85 
-------------------------------------------------- */
86 
 
87 
/* Base class
88 
------------------------- */
89 
.jumbotron {
90 
  position: relative;
91 
  padding: 40px 0;
92 
  color: #fff;
93 
  text-align: center;
94 
  text-shadow: 0 1px 3px rgba(0,0,0,.4), 0 0 30px rgba(0,0,0,.075);
95 
  background: #020031; /* Old browsers */
96 
  background: -moz-linear-gradient(45deg,  #020031 0%, #6d3353 100%); /* FF3.6+ */
97 
  background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,#020031), color-stop(100%,#6d3353)); /* Chrome,Safari4+ */
98 
  background: -webkit-linear-gradient(45deg,  #020031 0%,#6d3353 100%); /* Chrome10+,Safari5.1+ */
99 
  background: -o-linear-gradient(45deg,  #020031 0%,#6d3353 100%); /* Opera 11.10+ */
100 
  background: -ms-linear-gradient(45deg,  #020031 0%,#6d3353 100%); /* IE10+ */
101 
  background: linear-gradient(45deg,  #020031 0%,#6d3353 100%); /* W3C */
102 
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#020031', endColorstr='#6d3353',GradientType=1 ); /* IE6-9 fallback on horizontal gradient */
103 
  -webkit-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
104 
     -moz-box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
105 
          box-shadow: inset 0 3px 7px rgba(0,0,0,.2), inset 0 -3px 7px rgba(0,0,0,.2);
106 
}
107 
.jumbotron h1 {
108 
  font-size: 80px;
109 
  font-weight: bold;
110 
  letter-spacing: -1px;
111 
  line-height: 1;
112 
}
113 
.jumbotron p {
114 
  font-size: 24px;
115 
  font-weight: 300;
116 
  line-height: 1.25;
117 
  margin-bottom: 30px;
118 
}
119 
 
120 
/* Link styles (used on .masthead-links as well) */
121 
.jumbotron a {
122 
  color: #fff;
123 
  color: rgba(255,255,255,.5);
124 
  -webkit-transition: all .2s ease-in-out;
125 
     -moz-transition: all .2s ease-in-out;
126 
          transition: all .2s ease-in-out;
127 
}
128 
.jumbotron a:hover {
129 
  color: #fff;
130 
  text-shadow: 0 0 10px rgba(255,255,255,.25);
131 
}
132 
 
133 
/* Download button */
134 
.masthead .btn {
135 
  padding: 19px 24px;
136 
  font-size: 24px;
137 
  font-weight: 200;
138 
  color: #fff; /* redeclare to override the `.jumbotron a` */
139 
  border: 0;
140 
  -webkit-border-radius: 6px;
141 
     -moz-border-radius: 6px;
142 
          border-radius: 6px;
143 
  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
144 
     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
145 
          box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
146 
  -webkit-transition: none;
147 
     -moz-transition: none;
148 
          transition: none;
149 
}
150 
.masthead .btn:hover {
151 
  -webkit-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
152 
     -moz-box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
153 
          box-shadow: inset 0 1px 0 rgba(255,255,255,.1), 0 1px 5px rgba(0,0,0,.25);
154 
}
155 
.masthead .btn:active {
156 
  -webkit-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
157 
     -moz-box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
158 
          box-shadow: inset 0 2px 4px rgba(0,0,0,.1), 0 1px 0 rgba(255,255,255,.1);
159 
}
160 
 
161 
 
162 
/* Pattern overlay
163 
------------------------- */
164 
.jumbotron .container {
165 
  position: relative;
166 
  z-index: 2;
167 
}
168 
.jumbotron:after {
169 
  content: '';
170 
  display: block;
171 
  position: absolute;
172 
  top: 0;
173 
  right: 0;
174 
  bottom: 0;
175 
  left: 0;
176 
  background: url(../img/bs-docs-masthead-pattern.png) repeat center center;
177 
  opacity: .4;
178 
}
179 
@media
180 
only screen and (-webkit-min-device-pixel-ratio: 2),
181 
only screen and (   min--moz-device-pixel-ratio: 2),
182 
only screen and (     -o-min-device-pixel-ratio: 2/1) {
183 
 
184 
  .jumbotron:after {
185 
    background-size: 150px 150px;
186 
  }
187 
 
188 
}
189 
 
190 
/* Masthead (docs home)
191 
------------------------- */
192 
.masthead {
193 
  padding: 70px 0 80px;
194 
  margin-bottom: 0;
195 
  color: #fff;
196 
}
197 
.masthead h1 {
198 
  font-size: 120px;
199 
  line-height: 1;
200 
  letter-spacing: -2px;
201 
}
202 
.masthead p {
203 
  font-size: 40px;
204 
  font-weight: 200;
205 
  line-height: 1.25;
206 
}
207 
 
208 
/* Textual links in masthead */
209 
.masthead-links {
210 
  margin: 0;
211 
  list-style: none;
212 
}
213 
.masthead-links li {
214 
  display: inline;
215 
  padding: 0 10px;
216 
  color: rgba(255,255,255,.25);
217 
}
218 
 
219 
/* Social proof buttons from GitHub & Twitter */
220 
.bs-docs-social {
221 
  padding: 15px 0;
222 
  text-align: center;
223 
  background-color: #f5f5f5;
224 
  border-top: 1px solid #fff;
225 
  border-bottom: 1px solid #ddd;
226 
}
227 
 
228 
/* Quick links on Home */
229 
.bs-docs-social-buttons {
230 
  margin-left: 0;
231 
  margin-bottom: 0;
232 
  padding-left: 0;
233 
  list-style: none;
234 
}
235 
.bs-docs-social-buttons li {
236 
  display: inline-block;
237 
  padding: 5px 8px;
238 
  line-height: 1;
239 
  *display: inline;
240 
  *zoom: 1;
241 
}
242 
 
243 
/* Subhead (other pages)
244 
------------------------- */
245 
.subhead {
246 
  text-align: left;
247 
  border-bottom: 1px solid #ddd;
248 
}
249 
.subhead h1 {
250 
  font-size: 60px;
251 
}
252 
.subhead p {
253 
  margin-bottom: 20px;
254 
}
255 
.subhead .navbar {
256 
  display: none;
257 
}
258 
 
259 
 
260 
 
261 
/* Marketing section of Overview
262 
-------------------------------------------------- */
263 
 
264 
.marketing {
265 
  text-align: center;
266 
  color: #5a5a5a;
267 
}
268 
.marketing h1 {
269 
  margin: 60px 0 10px;
270 
  font-size: 60px;
271 
  font-weight: 200;
272 
  line-height: 1;
273 
  letter-spacing: -1px;
274 
}
275 
.marketing h2 {
276 
  font-weight: 200;
277 
  margin-bottom: 5px;
278 
}
279 
.marketing p {
280 
  font-size: 16px;
281 
  line-height: 1.5;
282 
}
283 
.marketing .marketing-byline {
284 
  margin-bottom: 40px;
285 
  font-size: 20px;
286 
  font-weight: 300;
287 
  line-height: 1.25;
288 
  color: #999;
289 
}
290 
.marketing-img {
291 
  display: block;
292 
  margin: 0 auto 30px;
293 
  max-height: 145px;
294 
}
295 
 
296 
 
297 
 
298 
/* Footer
299 
-------------------------------------------------- */
300 
 
301 
.footer {
302 
  text-align: center;
303 
  padding: 30px 0;
304 
  margin-top: 70px;
305 
  border-top: 1px solid #e5e5e5;
306 
  background-color: #f5f5f5;
307 
}
308 
.footer p {
309 
  margin-bottom: 0;
310 
  color: #777;
311 
}
312 
.footer-links {
313 
  margin: 10px 0;
314 
}
315 
.footer-links li {
316 
  display: inline;
317 
  padding: 0 2px;
318 
}
319 
.footer-links li:first-child {
320 
  padding-left: 0;
321 
}
322 
 
323 
 
324 
 
325 
/* Special grid styles
326 
-------------------------------------------------- */
327 
 
328 
.show-grid {
329 
  margin-top: 10px;
330 
  margin-bottom: 20px;
331 
}
332 
.show-grid [class*="span"] {
333 
  background-color: #eee;
334 
  text-align: center;
335 
  -webkit-border-radius: 3px;
336 
     -moz-border-radius: 3px;
337 
          border-radius: 3px;
338 
  min-height: 40px;
339 
  line-height: 40px;
340 
}
341 
.show-grid:hover [class*="span"] {
342 
  background: #ddd;
343 
}
344 
.show-grid .show-grid {
345 
  margin-top: 0;
346 
  margin-bottom: 0;
347 
}
348 
.show-grid .show-grid [class*="span"] {
349 
  margin-top: 5px;
350 
}
351 
.show-grid [class*="span"] [class*="span"] {
352 
  background-color: #ccc;
353 
}
354 
.show-grid [class*="span"] [class*="span"] [class*="span"] {
355 
  background-color: #999;
356 
}
357 
.show-grid a{text-align: left;}
358 
 
359 
 
360 
/* Mini layout previews
361 
-------------------------------------------------- */
362 
.mini-layout {
363 
  border: 1px solid #ddd;
364 
  -webkit-border-radius: 6px;
365 
     -moz-border-radius: 6px;
366 
          border-radius: 6px;
367 
  -webkit-box-shadow: 0 1px 2px rgba(0,0,0,.075);
368 
     -moz-box-shadow: 0 1px 2px rgba(0,0,0,.075);
369 
          box-shadow: 0 1px 2px rgba(0,0,0,.075);
370 
}
371 
.mini-layout,
372 
.mini-layout .mini-layout-body,
373 
.mini-layout.fluid .mini-layout-sidebar {
374 
  height: 300px;
375 
}
376 
.mini-layout {
377 
  margin-bottom: 20px;
378 
  padding: 9px;
379 
}
380 
.mini-layout div {
381 
  -webkit-border-radius: 3px;
382 
     -moz-border-radius: 3px;
383 
          border-radius: 3px;
384 
}
385 
.mini-layout .mini-layout-body {
386 
  background-color: #dceaf4;
387 
  margin: 0 auto;
388 
  width: 70%;
389 
}
390 
.mini-layout.fluid .mini-layout-sidebar,
391 
.mini-layout.fluid .mini-layout-header,
392 
.mini-layout.fluid .mini-layout-body {
393 
  float: left;
394 
}
395 
.mini-layout.fluid .mini-layout-sidebar {
396 
  background-color: #bbd8e9;
397 
  width: 20%;
398 
}
399 
.mini-layout.fluid .mini-layout-body {
400 
  width: 77.5%;
401 
  margin-left: 2.5%;
402 
}
403 
 
404 
 
405 
 
406 
/* Download page
407 
-------------------------------------------------- */
408 
 
409 
.download .page-header {
410 
  margin-top: 36px;
411 
}
412 
.page-header .toggle-all {
413 
  margin-top: 5px;
414 
}
415 
 
416 
/* Space out h3s when following a section */
417 
.download h3 {
418 
  margin-bottom: 5px;
419 
}
420 
.download-builder input + h3,
421 
.download-builder .checkbox + h3 {
422 
  margin-top: 9px;
423 
}
424 
 
425 
/* Fields for variables */
426 
.download-builder input[type=text] {
427 
  margin-bottom: 9px;
428 
  font-family: Menlo, Monaco, "Courier New", monospace;
429 
  font-size: 12px;
430 
  color: #d14;
431 
}
432 
.download-builder input[type=text]:focus {
433 
  background-color: #fff;
434 
}
435 
 
436 
/* Custom, larger checkbox labels */
437 
.download .checkbox {
438 
  padding: 6px 10px 6px 25px;
439 
  font-size: 13px;
440 
  line-height: 18px;
441 
  color: #555;
442 
  background-color: #f9f9f9;
443 
  -webkit-border-radius: 3px;
444 
     -moz-border-radius: 3px;
445 
          border-radius: 3px;
446 
  cursor: pointer;
447 
}
448 
.download .checkbox:hover {
449 
  color: #333;
450 
  background-color: #f5f5f5;
451 
}
452 
.download .checkbox small {
453 
  font-size: 12px;
454 
  color: #777;
455 
}
456 
 
457 
/* Variables section */
458 
#variables label {
459 
  margin-bottom: 0;
460 
}
461 
 
462 
/* Giant download button */
463 
.download-btn {
464 
  margin: 36px 0 108px;
465 
}
466 
#download p,
467 
#download h4 {
468 
  max-width: 50%;
469 
  margin: 0 auto;
470 
  color: #999;
471 
  text-align: center;
472 
}
473 
#download h4 {
474 
  margin-bottom: 0;
475 
}
476 
#download p {
477 
  margin-bottom: 18px;
478 
}
479 
.download-btn .btn {
480 
  display: block;
481 
  width: auto;
482 
  padding: 19px 24px;
483 
  margin-bottom: 27px;
484 
  font-size: 30px;
485 
  line-height: 1;
486 
  text-align: center;
487 
  -webkit-border-radius: 6px;
488 
     -moz-border-radius: 6px;
489 
          border-radius: 6px;
490 
}
491 
 
492 
 
493 
 
494 
/* Misc
495 
-------------------------------------------------- */
496 
 
497 
/* Make tables spaced out a bit more */
498 
h2 + table,
499 
h3 + table,
500 
h4 + table,
501 
h2 + .row {
502 
  margin-top: 5px;
503 
}
504 
 
505 
/* Example sites showcase */
506 
.example-sites {
507 
  xmargin-left: 20px;
508 
}
509 
.example-sites img {
510 
  max-width: 100%;
511 
  margin: 0 auto;
512 
}
513 
 
514 
.scrollspy-example {
515 
  height: 200px;
516 
  overflow: auto;
517 
  position: relative;
518 
}
519 
 
520 
 
521 
/* Fake the :focus state to demo it */
522 
.focused {
523 
  border-color: rgba(82,168,236,.8);
524 
  -webkit-box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
525 
     -moz-box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
526 
          box-shadow: inset 0 1px 3px rgba(0,0,0,.1), 0 0 8px rgba(82,168,236,.6);
527 
  outline: 0;
528 
}
529 
 
530 
/* For input sizes, make them display block */
531 
.docs-input-sizes select,
532 
.docs-input-sizes input[type=text] {
533 
  display: block;
534 
  margin-bottom: 9px;
535 
}
536 
 
537 
/* Icons
538 
------------------------- */
539 
.the-icons {
540 
  margin-left: 0;
541 
  list-style: none;
542 
}
543 
.the-icons li {
544 
  float: left;
545 
  width: 25%;
546 
  line-height: 25px;
547 
}
548 
.the-icons i:hover {
549 
  background-color: rgba(255,0,0,.25);
550 
}
551 
 
552 
/* Example page
553 
------------------------- */
554 
.bootstrap-examples p {
555 
  font-size: 13px;
556 
  line-height: 18px;
557 
}
558 
.bootstrap-examples .thumbnail {
559 
  margin-bottom: 9px;
560 
  background-color: #fff;
561 
}
562 
 
563 
 
564 
 
565 
/* Bootstrap code examples
566 
-------------------------------------------------- */
567 
 
568 
/* Base class */
569 
.bs-docs-example {
570 
  position: relative;
571 
  margin: 15px 0;
572 
  padding: 39px 19px 14px;
573 
  *padding-top: 19px;
574 
  background-color: #fff;
575 
  border: 1px solid #ddd;
576 
  -webkit-border-radius: 4px;
577 
     -moz-border-radius: 4px;
578 
          border-radius: 4px;
579 
}
580 
 
581 
/* Echo out a label for the example */
582 
.bs-docs-example:after {
583 
  content: "Example";
584 
  position: absolute;
585 
  top: -1px;
586 
  left: -1px;
587 
  padding: 3px 7px;
588 
  font-size: 12px;
589 
  font-weight: bold;
590 
  background-color: #f5f5f5;
591 
  border: 1px solid #ddd;
592 
  color: #9da0a4;
593 
  -webkit-border-radius: 4px 0 4px 0;
594 
     -moz-border-radius: 4px 0 4px 0;
595 
          border-radius: 4px 0 4px 0;
596 
}
597 
 
598 
/* Remove spacing between an example and it's code */
599 
.bs-docs-example + .prettyprint {
600 
  margin-top: -20px;
601 
  padding-top: 15px;
602 
}
603 
 
604 
/* Tweak examples
605 
------------------------- */
606 
.bs-docs-example > p:last-child {
607 
  margin-bottom: 0;
608 
}
609 
.bs-docs-example .table,
610 
.bs-docs-example .progress,
611 
.bs-docs-example .well,
612 
.bs-docs-example .alert,
613 
.bs-docs-example .hero-unit,
614 
.bs-docs-example .pagination,
615 
.bs-docs-example .navbar,
616 
.bs-docs-example > .nav,
617 
.bs-docs-example blockquote {
618 
  margin-bottom: 5px;
619 
}
620 
.bs-docs-example .pagination {
621 
  margin-top: 0;
622 
}
623 
.bs-navbar-top-example,
624 
.bs-navbar-bottom-example {
625 
  z-index: 1;
626 
  padding: 0;
627 
  height: 90px;
628 
  overflow: hidden; /* cut the drop shadows off */
629 
}
630 
.bs-navbar-top-example .navbar-fixed-top,
631 
.bs-navbar-bottom-example .navbar-fixed-bottom {
632 
  margin-left: 0;
633 
  margin-right: 0;
634 
}
635 
.bs-navbar-top-example {
636 
  -webkit-border-radius: 0 0 4px 4px;
637 
     -moz-border-radius: 0 0 4px 4px;
638 
          border-radius: 0 0 4px 4px;
639 
}
640 
.bs-navbar-top-example:after {
641 
  top: auto;
642 
  bottom: -1px;
643 
  -webkit-border-radius: 0 4px 0 4px;
644 
     -moz-border-radius: 0 4px 0 4px;
645 
          border-radius: 0 4px 0 4px;
646 
}
647 
.bs-navbar-bottom-example {
648 
  -webkit-border-radius: 4px 4px 0 0;
649 
     -moz-border-radius: 4px 4px 0 0;
650 
          border-radius: 4px 4px 0 0;
651 
}
652 
.bs-navbar-bottom-example .navbar {
653 
  margin-bottom: 0;
654 
}
655 
form.bs-docs-example {
656 
  padding-bottom: 19px;
657 
}
658 
 
659 
/* Images */
660 
.bs-docs-example-images img {
661 
  margin: 10px;
662 
  display: inline-block;
663 
}
664 
 
665 
/* Tooltips */
666 
.bs-docs-tooltip-examples {
667 
  text-align: center;
668 
  margin: 0 0 10px;
669 
  list-style: none;
670 
}
671 
.bs-docs-tooltip-examples li {
672 
  display: inline;
673 
  padding: 0 10px;
674 
}
675 
 
676 
/* Popovers */
677 
.bs-docs-example-popover {
678 
  padding-bottom: 24px;
679 
  background-color: #f9f9f9;
680 
}
681 
.bs-docs-example-popover .popover {
682 
  position: relative;
683 
  display: block;
684 
  float: left;
685 
  width: 260px;
686 
  margin: 20px;
687 
}
688 
 
689 
/* Dropdowns */
690 
.bs-docs-example-submenus {
691 
  min-height: 180px;
692 
}
693 
.bs-docs-example-submenus > .pull-left + .pull-left {
694 
  margin-left: 20px;
695 
}
696 
.bs-docs-example-submenus .dropup > .dropdown-menu,
697 
.bs-docs-example-submenus .dropdown > .dropdown-menu {
698 
  display: block;
699 
  position: static;
700 
  margin-bottom: 5px;
701 
  *width: 180px;
702 
}
703 
 
704 
 
705 
 
706 
/* Responsive docs
707 
-------------------------------------------------- */
708 
 
709 
/* Utility classes table
710 
------------------------- */
711 
.responsive-utilities th small {
712 
  display: block;
713 
  font-weight: normal;
714 
  color: #999;
715 
}
716 
.responsive-utilities tbody th {
717 
  font-weight: normal;
718 
}
719 
.responsive-utilities td {
720 
  text-align: center;
721 
}
722 
.responsive-utilities td.is-visible {
723 
  color: #468847;
724 
  background-color: #dff0d8 !important;
725 
}
726 
.responsive-utilities td.is-hidden {
727 
  color: #ccc;
728 
  background-color: #f9f9f9 !important;
729 
}
730 
 
731 
/* Responsive tests
732 
------------------------- */
733 
.responsive-utilities-test {
734 
  margin-top: 5px;
735 
  margin-left: 0;
736 
  list-style: none;
737 
  overflow: hidden; /* clear floats */
738 
}
739 
.responsive-utilities-test li {
740 
  position: relative;
741 
  float: left;
742 
  width: 25%;
743 
  height: 43px;
744 
  font-size: 14px;
745 
  font-weight: bold;
746 
  line-height: 43px;
747 
  color: #999;
748 
  text-align: center;
749 
  border: 1px solid #ddd;
750 
  -webkit-border-radius: 4px;
751 
     -moz-border-radius: 4px;
752 
          border-radius: 4px;
753 
}
754 
.responsive-utilities-test li + li {
755 
  margin-left: 10px;
756 
}
757 
.responsive-utilities-test span {
758 
  position: absolute;
759 
  top:    -1px;
760 
  left:   -1px;
761 
  right:  -1px;
762 
  bottom: -1px;
763 
  -webkit-border-radius: 4px;
764 
     -moz-border-radius: 4px;
765 
          border-radius: 4px;
766 
}
767 
.responsive-utilities-test span {
768 
  color: #468847;
769 
  background-color: #dff0d8;
770 
  border: 1px solid #d6e9c6;
771 
}
772 
 
773 
 
774 
 
775 
/* Sidenav for Docs
776 
-------------------------------------------------- */
777 
 
778 
.bs-docs-sidenav {
779 
  width: 228px;
780 
  margin: 30px 0 0;
781 
  padding: 0;
782 
  background-color: #fff;
783 
  -webkit-border-radius: 6px;
784 
     -moz-border-radius: 6px;
785 
          border-radius: 6px;
786 
  -webkit-box-shadow: 0 1px 4px rgba(0,0,0,.065);
787 
     -moz-box-shadow: 0 1px 4px rgba(0,0,0,.065);
788 
          box-shadow: 0 1px 4px rgba(0,0,0,.065);
789 
}
790 
.bs-docs-sidenav > li > a {
791 
  display: block;
792 
  width: 190px \9;
793 
  margin: 0 0 -1px;
794 
  padding: 8px 14px;
795 
  border: 1px solid #e5e5e5;
796 
}
797 
.bs-docs-sidenav > li:first-child > a {
798 
  -webkit-border-radius: 6px 6px 0 0;
799 
     -moz-border-radius: 6px 6px 0 0;
800 
          border-radius: 6px 6px 0 0;
801 
}
802 
.bs-docs-sidenav > li:last-child > a {
803 
  -webkit-border-radius: 0 0 6px 6px;
804 
     -moz-border-radius: 0 0 6px 6px;
805 
          border-radius: 0 0 6px 6px;
806 
}
807 
.bs-docs-sidenav > .active > a {
808 
  position: relative;
809 
  z-index: 2;
810 
  padding: 9px 15px;
811 
  border: 0;
812 
  text-shadow: 0 1px 0 rgba(0,0,0,.15);
813 
  -webkit-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
814 
     -moz-box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
815 
          box-shadow: inset 1px 0 0 rgba(0,0,0,.1), inset -1px 0 0 rgba(0,0,0,.1);
816 
}
817 
/* Chevrons */
818 
.bs-docs-sidenav .icon-chevron-right {
819 
  float: right;
820 
  margin-top: 2px;
821 
  margin-right: -6px;
822 
  opacity: .25;
823 
}
824 
.bs-docs-sidenav > li > a:hover {
825 
  background-color: #f5f5f5;
826 
}
827 
.bs-docs-sidenav a:hover .icon-chevron-right {
828 
  opacity: .5;
829 
}
830 
.bs-docs-sidenav .active .icon-chevron-right,
831 
.bs-docs-sidenav .active a:hover .icon-chevron-right {
832 
  background-image: url(../img/glyphicons-halflings-white.png);
833 
  opacity: 1;
834 
}
835 
.bs-docs-sidenav.affix {
836 
  top: 40px;
837 
}
838 
.bs-docs-sidenav.affix-bottom {
839 
  position: absolute;
840 
  top: auto;
841 
  bottom: 270px;
842 
}
843 
 
844 
 
845 
 
846 
 
847 
/* Responsive
848 
-------------------------------------------------- */
849 
 
850 
/* Desktop large
851 
------------------------- */
852 
@media (min-width: 1200px) {
853 
  .bs-docs-container {
854 
    max-width: 970px;
855 
  }
856 
  .bs-docs-sidenav {
857 
    width: 258px;
858 
  }
859 
  .bs-docs-sidenav > li > a {
860 
    width: 230px \9; /* Override the previous IE8-9 hack */
861 
  }
862 
}
863 
 
864 
/* Desktop
865 
------------------------- */
866 
@media (max-width: 980px) {
867 
  /* Unfloat brand */
868 
  body > .navbar-fixed-top .brand {
869 
    float: left;
870 
    margin-left: 0;
871 
    padding-left: 10px;
872 
    padding-right: 10px;
873 
  }
874 
 
875 
  /* Inline-block quick links for more spacing */
876 
  .quick-links li {
877 
    display: inline-block;
878 
    margin: 5px;
879 
  }
880 
 
881 
  /* When affixed, space properly */
882 
  .bs-docs-sidenav {
883 
    top: 0;
884 
    width: 218px;
885 
    margin-top: 30px;
886 
    margin-right: 0;
887 
  }
888 
}
889 
 
890 
/* Tablet to desktop
891 
------------------------- */
892 
@media (min-width: 768px) and (max-width: 979px) {
893 
  /* Remove any padding from the body */
894 
  body {
895 
    padding-top: 0;
896 
  }
897 
  /* Widen masthead and social buttons to fill body padding */
898 
  .jumbotron {
899 
    margin-top: -20px; /* Offset bottom margin on .navbar */
900 
  }
901 
  /* Adjust sidenav width */
902 
  .bs-docs-sidenav {
903 
    width: 166px;
904 
    margin-top: 20px;
905 
  }
906 
  .bs-docs-sidenav.affix {
907 
    top: 0;
908 
  }
909 
}
910 
 
911 
/* Tablet
912 
------------------------- */
913 
@media (max-width: 767px) {
914 
  /* Remove any padding from the body */
915 
  body {
916 
    padding-top: 0;
917 
  }
918 
 
919 
  /* Widen masthead and social buttons to fill body padding */
920 
  .jumbotron {
921 
    padding: 40px 20px;
922 
    margin-top:   -20px; /* Offset bottom margin on .navbar */
923 
    margin-right: -20px;
924 
    margin-left:  -20px;
925 
  }
926 
  .masthead h1 {
927 
    font-size: 90px;
928 
  }
929 
  .masthead p,
930 
  .masthead .btn {
931 
    font-size: 24px;
932 
  }
933 
  .marketing .span4 {
934 
    margin-bottom: 40px;
935 
  }
936 
  .bs-docs-social {
937 
    margin: 0 -20px;
938 
  }
939 
 
940 
  /* Space out the show-grid examples */
941 
  .show-grid [class*="span"] {
942 
    margin-bottom: 5px;
943 
  }
944 
 
945 
  /* Sidenav */
946 
  .bs-docs-sidenav {
947 
    width: auto;
948 
    margin-bottom: 20px;
949 
  }
950 
  .bs-docs-sidenav.affix {
951 
    position: static;
952 
    width: auto;
953 
    top: 0;
954 
  }
955 
 
956 
  /* Unfloat the back to top link in footer */
957 
  .footer {
958 
    margin-left: -20px;
959 
    margin-right: -20px;
960 
    padding-left: 20px;
961 
    padding-right: 20px;
962 
  }
963 
  .footer p {
964 
    margin-bottom: 9px;
965 
  }
966 
}
967 
 
968 
/* Landscape phones
969 
------------------------- */
970 
@media (max-width: 480px) {
971 
  /* Remove padding above jumbotron */
972 
  body {
973 
    padding-top: 0;
974 
  }
975 
 
976 
  /* Change up some type stuff */
977 
  h2 small {
978 
    display: block;
979 
  }
980 
 
981 
  /* Downsize the jumbotrons */
982 
  .jumbotron h1 {
983 
    font-size: 45px;
984 
  }
985 
  .jumbotron p,
986 
  .jumbotron .btn {
987 
    font-size: 18px;
988 
  }
989 
  .jumbotron .btn {
990 
    display: block;
991 
    margin: 0 auto;
992 
  }
993 
 
994 
  /* center align subhead text like the masthead */
995 
  .subhead h1,
996 
  .subhead p {
997 
    text-align: center;
998 
  }
999 
 
1000 
  /* Marketing on home */
1001 
  .marketing h1 {
1002 
    font-size: 30px;
1003 
  }
1004 
  .marketing-byline {
1005 
    font-size: 18px;
1006 
  }
1007 
 
1008 
  /* center example sites */
1009 
  .example-sites {
1010 
    margin-left: 0;
1011 
  }
1012 
  .example-sites > li {
1013 
    float: none;
1014 
    display: block;
1015 
    max-width: 280px;
1016 
    margin: 0 auto 18px;
1017 
    text-align: center;
1018 
  }
1019 
  .example-sites .thumbnail > img {
1020 
    max-width: 270px;
1021 
  }
1022 
 
1023 
  /* Do our best to make tables work in narrow viewports */
1024 
  table code {
1025 
    white-space: normal;
1026 
    word-wrap: break-word;
1027 
    word-break: break-all;
1028 
  }
1029 
 
1030 
  /* Examples: dropdowns */
1031 
  .bs-docs-example-submenus > .pull-left {
1032 
    float: none;
1033 
    clear: both;
1034 
  }
1035 
  .bs-docs-example-submenus > .pull-left,
1036 
  .bs-docs-example-submenus > .pull-left + .pull-left {
1037 
    margin-left: 0;
1038 
  }
1039 
  .bs-docs-example-submenus p {
1040 
    margin-bottom: 0;
1041 
  }
1042 
  .bs-docs-example-submenus .dropup > .dropdown-menu,
1043 
  .bs-docs-example-submenus .dropdown > .dropdown-menu {
1044 
    margin-bottom: 10px;
1045 
    float: none;
1046 
    max-width: 180px;
1047 
  }
1048 
 
1049 
  /* Examples: modal */
1050 
  .modal-example .modal {
1051 
    position: relative;
1052 
    top: auto;
1053 
    right: auto;
1054 
    bottom: auto;
1055 
    left: auto;
1056 
  }
1057 
 
1058 
  /* Tighten up footer */
1059 
  .footer {
1060 
    padding-top: 20px;
1061 
    padding-bottom: 20px;
1062 
  }
1063 
}