.bs-docs-section {
 margin-top:4em
}
.bs-docs-section .page-header h1 {
 padding:2rem 0;
 font-size:3rem
}
.bs-component {
 position:relative
}
.bs-component+.bs-component {
 margin-top:1rem
}
.bs-component .card {
 margin-bottom:1rem
}
.bs-component .modal {
 position:relative;
 top:auto;
 right:auto;
 left:auto;
 bottom:auto;
 z-index:1;
 display:block
}
.bs-component .modal-dialog {
 width:90%
}
.bs-component .popover {
 position:relative;
 display:inline-block;
 width:220px;
 margin:20px
}
.source-button {
 display:none;
 position:absolute;
 top:0;
 right:0;
 z-index:100;
 font-weight:bold
}
.source-button:hover {
 cursor:pointer
}
.bs-component:hover .source-button {
 display:block
}
#source-modal pre {
 max-height:calc(100vh - 11rem);
 background-color:rgba(0,0,0,0.7);
 color:rgba(255,255,255,0.7)
}
.section-tout {
 padding:6em 0 1em;
 border-bottom:1px solid rgba(0,0,0,0.05);
 background-color:#eaf1f1;
 text-align:center
}
.section-tout .icon {
 text-align:center;
 margin-bottom:1rem
}
.section-tout .fa {
 display:inline-block;
 padding:0.8em;
 font-size:2rem;
 background:#349aed;
 background:linear-gradient(145deg, #3b9cea 50%, #3db8eb 100%);
 border-radius:50%;
 color:rgba(0,0,0,0.5)
}
.section-tout p {
 margin-bottom:5em
}
.section-preview {
 padding:4em 0 4em
}
.section-preview .preview {
 margin-bottom:4em;
 background-color:#eaf1f1
}
.section-preview .preview img {
 max-width:100%
}
.section-preview .preview .image {
 position:relative
}
.section-preview .preview .image:before {
 box-shadow:inset 0 0 0 1px rgba(0,0,0,0.1);
 position:absolute;
 top:0;
 left:0;
 width:100%;
 height:100%;
 content:"";
 pointer-events:none
}
.section-preview .preview .options {
 padding:2em;
 border:1px solid rgba(0,0,0,0.05);
 border-top:none;
 text-align:center
}
.section-preview .preview .options p {
 margin-bottom:2em
}
.section-preview .dropdown-menu {
 text-align:left
}
.section-preview .lead {
 margin-bottom:2em
}
@media (max-width: 767px) {
 .section-preview .image img {
  width:100%
 }
}
@media (max-width: 767px) {
 .splash {
  padding-top:8em
 }
 .splash .logo {
  width:100px
 }
 .splash h1 {
  font-size:2em
 }
}
