@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');

:root {
  --brand-color: #012169;
  --brand-color-rgb: 1, 33, 104;

  --bs-font-sans-serif: 'Open Sans', sans-serif;
  --bs-primary-rgb: var(--brand-color-rgb);

  --pr-button-color: #156f94;
}

.btn-primary {
  --bs-btn-bg: var(--pr-button-color);
  --bs-btn-hover-bg: var(--pr-button-color);
  --bs-btn-active-bg: var(--pr-button-color);
  --bs-btn-border-color: var(--pr-button-color);
  --bs-btn-hover-border-color: var(--pr-button-color);
  --bs-btn-active-border-color: var(--pr-button-color);
}

.navbar-toggler,
.navbar-toggler-icon {
  filter: invert(75%); /* to accommodate the dark background */
}

.text-bg-primary {
  background-color: rgba(var(--bs-primary-rgb), 0.3) !important;
}

header.bg-primary a.active {
  border-bottom: 1px solid rgba(255, 255, 255, 0.5);
}

.fs-7 {
  font-size: 0.75rem;
}

.bg-panta,
.bg-panta:hover {
  background-color: var(--pr-button-background);
}

h1,
h2 {
  font-weight: bold;
}

@media (min-width: 768px) {
  .fs-md-7 {
    font-size: var(--bs-body-font-size);
  }

  .text-md-uppercase {
    text-transform: uppercase !important;
  }

  .list-md-unstyled {
    list-style: none;
  }
}