/*
  Global base styles - loaded on every page after tokens.css (Views/Shared/_Root.cshtml).
  Only rules that apply site-wide belong here. Chrome-page layout is in content.css,
  the home page in home.css, and nav/footer in chrome.css.
*/
html {
  font-size: 14px;
  position: relative;
  min-height: 100%;
}

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

body {
  background: var(--soa-bg-body);
}

main {
  background: var(--soa-bg-main);
}

h1, h2, h3, h4, h5, h6 {
  font-family: var(--soa-font-heading);
  color: var(--green-700);
}

.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;
}

img {
  max-width: 100%;
  height: auto;
}

figure {
  margin: 0 0 1rem;
}

figcaption {
  font-size: 0.875rem;
  color: var(--bs-secondary-color);
}