@font-face { font-family: 'Langdon'; src: url("langdon.woff") format("woff"), url("langdon.svg#Langdon") format("svg"), url("langdon.eot"), url("langdon.eot?#iefix") format("embedded-opentype"); font-weight: normal; font-style: normal; }

html, body { height: 100%; background-color: #f8f9fa; }

main { flex: 1; }

.flex-0 { flex: 0; }

.flex-1 { flex: 1; }

@media (min-width: 1800px) { .layout-container { max-width: 85%; } }

.logo-header { background-image: linear-gradient(to bottom, #bd9ee5 0%, #563d7c 100%); background-repeat: repeat-x; position: relative; padding: 0; height: 12vw; }

@media (min-width: 576px) { .logo-header { height: 100px; } }

@media (min-width: 992px) { .logo-header { height: 120px; } }

@media (min-width: 1800px) { .logo-header { height: 130px; } }

.logo-header .logo { top: 0; height: 100%; text-align: center; position: relative; overflow: hidden; }

.logo-header .logo img { width: 100%; max-height: 50%; -webkit-filter: drop-shadow(0 0 1rem indigo); filter: drop-shadow(0 0 1rem indigo); }

@media (min-width: 768px) { .logo-header .logo img { width: 80%; } }

@media (max-width: 576px) { .logo-header .logo img { max-height: 80%; } }

.logo-header .logo p { color: white; font-size: 1.5rem; font-family: 'Nothing You Could Do'; margin: 0; margin-top: .25em; }

.accent-primary { font-family: 'Roboto Slab', sans-serif; font-weight: 700; }

.accent-secondary { font-family: 'Roboto Slab', sans-serif; font-weight: 100; }

.display-1, .display-2, .display-3, .display-4 { font-family: 'Roboto Slab', sans-serif; font-weight: 700; }

.accent-script { font-family: 'Nothing You Could Do', cursive; }

.card > .card-border-bottom { border-bottom: 1px solid rgba(0, 0, 0, 0.075); }

.card > .card-border-top { border-top: 1px solid rgba(0, 0, 0, 0.075); }

.card-corner { top: 0; right: 0; position: absolute; width: 0; height: 0; border-style: solid; border-width: 0 56px 56px 0; }

.card-corner-light { border-color: transparent rgba(255, 255, 255, 0.2) transparent transparent; }

.card-corner-dark { border-color: transparent rgba(0, 0, 0, 0.2) transparent transparent; }

.card-corner > * { margin-left: 28px; }

.card-header.bg-dark { background: #343a40 linear-gradient(180deg, #52585d, #343a40) repeat-x; }

.icon-card-image { max-height: 64px; }

.thead-dark, .thead-dark th { background: #343a40 linear-gradient(180deg, #52585d, #343a40) repeat-x; }

.full-height-card > .card { height: 100% !important; }

.card { box-shadow: rgba(0, 0, 0, 0.1) 0px 2px 20px -4px; }

pre { background-color: #e9ecef !important; border-radius: 0.3rem; padding: 6px; }

pre code { background-color: #e9ecef !important; }

.anchor { display: none; }

.collapsed-detail { max-height: 48px; overflow: hidden; position: relative; }

.collapsed-detail .fade-detail { position: absolute; bottom: 0em; width: 100%; height: 48px; background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, white 100%); background-repeat: repeat-x; }

.body-tabs .nav-tabs { border: 1px solid #dee2e6; border-radius: 0.25rem !important; padding: 0.5rem 0.5rem 0 0.5rem; background: #fff; }

.body-tabs .nav-tabs .nav-link:focus, .body-tabs .nav-tabs .nav-link:hover { border-bottom-color: transparent; }

.body-tabs .nav-tabs .nav-link.active { background-color: #f8f9fa; border-bottom-color: #f8f9fa; }

.search-results em { font-style: normal; background-color: #fff4d3; }

.popover { max-width: 80%; z-index: 10000; /* This is an ugly hack to make sure the popover "flips" by positioning it above the search box and then always making it taller than the header so it consistently displays below the search box - these heights need to match up with the header */ margin-bottom: 24vw; }

@media (min-width: 576px) { .popover { margin-bottom: 200px; } }

@media (min-width: 768px) { .popover { margin-bottom: 200px; } }

@media (min-width: 992px) { .popover { margin-bottom: 240px; } }

@media (min-width: 1200px) { .popover { margin-bottom: 260px; } }

.collapsed > .when-opened, :not(.collapsed) > .when-closed { display: none; }