body {
 padding-top:75px;
 padding-bottom:20px;
}
iframe {
 overflow:hidden;
 border:none
}
.navbar .bi {
 margin-right:.25rem;
 font-size:1rem
}
#home .navbar,
#help .navbar {
 background:linear-gradient(145deg, #375ee3 0%, #6543e0 80%)
}
#home .navbar-brand .nav-link,
#help .navbar-brand .nav-link {
 display:inline-block;
 margin-right:-30px
}
#home {
 padding-top:0
}
#home .btn {
 padding:.5rem .9rem
}
.bs-section {
 margin-top:1em
}
.bs-section .page-header h1 {
 padding:1rem 0;
 font-size:2rem
}
.dropdown-menu.show[aria-labelledby=themes] {
 display:flex;
 flex-wrap:wrap;
 width:420px
}
.dropdown-menu.show[aria-labelledby=themes] .dropdown-item {
 width:33.333333%
}
.dropdown-menu.show[aria-labelledby=themes] .dropdown-item:first-child {
 width:100%
}
.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;
 bottom:auto;
 left: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 {
 position:absolute;
 top:0;
 right:0;
 z-index:100;
 display:none;
 font-weight:700
}
.source-button i {
 pointer-events:none
}
.source-button:hover {
 cursor:pointer
}
.bs-component:hover .source-button {
 display:block
}
#source-modal pre {
 max-height:calc(100vh - 11rem)
}
.progress {
 margin-bottom:10px
}
#footer {
 padding-top:6em;
 margin-bottom:0
}
#footer li {
 float:left;
 margin-right:1.5em;
 margin-bottom:1.5em
}
#footer p {
 margin-bottom:0;
 clear:left
}
.splash {
 position:relative;
 padding:12em 0 6em;
 color:#fff;
 text-align:center;
 background-color:#375ee3;
 background-image:url("../img/splash.svg"),linear-gradient(145deg, #375ee3 0%, #6543e0 80%);
 background-repeat:no-repeat;
 background-size:cover
}
.splash .logo {
 width:160px
}
.splash h1 {
 font-size:3em;
 color:#fff
}
.splash #social {
 margin:2em 0 3em
}
.splash .alert {
 margin:2em 0;
 border:none
}
.splash .sponsor a {
 color:#fff
}
.section-title {
 padding:1em 0
}

.add-component {
 padding:2em;
 text-align: center;
}

.add-component .icon {
 display:flex;
 align-items:center;
 justify-content:center;
 width:100%;
 height:100%;
 margin:0 auto 1rem;
 font-size:3rem;
 border-radius:50%
}

.section-title .lead {
 margin-bottom:1em
}
.section-tout {
 padding:6em 0 1em;
 text-align:center;
 background-color:#eaf1f1;
 border-bottom:1px solid rgba(0,0,0,.05)
}
.section-tout .icon {
 display:flex;
 align-items:center;
 justify-content:center;
 width:80px;
 height:80px;
 margin:0 auto 1rem;
 font-size:2rem;
 line-height:1;
 border-radius:50%
}
.section-tout p {
 margin-bottom:5em
}
.sponsor a {
 text-decoration:none
}
.sponsor #carbonads {
 max-width:240px;
 margin:0 auto
}
.sponsor .carbon-text {
 display:block;
 margin-top:1em;
 font-size:12px
}
.sponsor .carbon-poweredby {
 float:right;
 margin-top:1em;
 font-size:10px
}
@media(max-width: 767px) {
 .splash {
  padding-top:8em
 }
 .splash .logo {
  width:100px
 }
 .splash h1 {
  font-size:2em
 }
 #banner {
  margin-bottom:2em;
  text-align:center
 }
}
@media(max-width: 991px) {
 .navbar .bi {
  display:none
 }
}
@media(min-width: 992px) {
 .navbar-transparent {
  background:none !important
 }
}
.bs-component>.btn,
.bs-component>.btn-toolbar>.btn-group,
.bs-component>.btn-group,