html {
  font-size: 14px;
}

@media (min-width: 768px) {
  html {
    font-size: 16px;
  }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
  box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
  position: relative;
  min-height: 100%;
}

body {
  margin-bottom: 60px;
  margin-top: 0; /* ensure no top margin */
}

/* Header overlay: fixed at top and will slide/fade in/out on scroll */
header {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  z-index: 1040;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,0.06);
}

/* Remove reserved top spacing from inner containers (allow .main-wrapper to keep header offset) */
.main-wrapper > .container,
.main-wrapper > .container > .row,
.main-wrapper > .container > .row > .col-12 {
  margin-top: 0;
  padding-top: 0;
}

/* When header is visible we add content-offset to push content below header height */
.main-wrapper {
  padding-top: var(--header-height, 56px);
  transition: padding-top 180ms ease;
}

/* Remove large margins on breadcrumb and top sections */
.breadcrumb,
nav[aria-label="breadcrumb"],
.container > nav,
.container.pt-2 {
  margin-top: 0 !important;
  padding-top: 0 !important;
}

/* Reduce navbar vertical padding to make header compact */
.navbar {
  padding-top: 0.35rem;
  padding-bottom: 0.35rem;
}

/* reduce any default top margin on first child elements inside main wrapper */
.main-wrapper > .container > *:first-child {
  margin-top: 0;
  padding-top: 0;
}

@media (max-width: 768px) {
  .main-wrapper { padding-top: var(--header-height, 56px); }
}