/* Localities styles. Mobile first; Bootstrap 5 breakpoints. */

/* Base: extra-small screens. */

.location-credit-link {
  font-size: .875rem;
  color: var(--muted);
  text-align: center;
  margin-top: 24px;
}

.location-credit-link a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.location-credits a {
  text-decoration: underline;
  text-underline-offset: 3px;
}

.location-credits {
  font-size: .875rem;
  color: var(--muted);
  border-top: 1px solid var(--line);
  padding-top: 20px;
  margin-top: 24px;
}

.location-credits summary {
  cursor: pointer;
  color: #89672e;
}

.location-credits ul {
  margin-top: 15px;
}

.other-localities-section {
  background: #fff;
}

.other-localities-section .locality-grid {
  grid-template-columns: 1fr;
}

.other-localities-section .locality-grid img {
  height: 260px;
}

@media (min-width: 576px) {
  .other-localities-section .locality-grid {
    grid-template-columns: repeat(2,minmax(0,1fr));
  }

  .other-localities-section .locality-grid img {
    height: 290px;
  }
}

@media (min-width: 992px) {
  .other-localities-section .locality-grid {
    grid-template-columns: repeat(4,minmax(0,1fr));
  }
}
