table {
  border-collapse: collapse;
  width: auto;
  /* display: inline; */
  margin-top: var(--heading_gap);
  margin-bottom: var(--heading_gap);
  display: block;
}

table a {
  color: var(--main_color);
  text-decoration: none;
  font-size: unset;
  font-weight: unset;
  font-style: unset;
}

th,
td {
  border: 1px solid var(--main_color);
  padding: 8px;
  color: var(--main_color);
}

th {
  background-color: var(--tableHead_color);
  text-align: left;
}

tr:not(:has(th)):hover {
  background-color: var(--main_color);
  color: var(--secondary_color);
}
tr:not(:has(th)):hover td {
  color: var(--secondary_color);
}

h4 {
  /* margin-top: var(--heading_gap); */
  margin-bottom: calc(var(--heading_gap) / 2);
}

.back-link h3 {
  color: var(--grey_color);
}

li {
  margin-left: 2vw;
  font-size: var(--p_font_size);
  color: var(--main_color);
}

.additional-resources li {
  margin: 0;
}

.text-content {
  margin-bottom: var(--heading_gap);
  margin-top: var(--heading_gap);
  display: flex;
  flex-direction: column;
  /* gap: var(--heading_gap); */
}

h2 {
  margin-top: var(--heading_gap);
}
h3 {
  margin-top: calc(var(--heading_gap) / 2);
}
* {
  list-style-type: none;
}

.img-small img {
  max-width: max(10vw, 150px);
  width: 100%;
  height: auto;
}
.img-medium img {
  max-width: max(20vw, 600px);
  width: 100%;
  height: auto;
}
.img-large img {
  max-width: max(30vw, 1000px);
  width: 100%;
  height: auto;
}

img {
  margin-bottom: var(--heading_gap);
  margin-top: var(--heading_gap);
}

.gallery-images {
  display: grid;
  grid-template-columns: repeat(auto-fit, 10vw);
  gap: calc(var(--masonry_gap) / 3);
  margin-bottom: var(--heading_gap);
  margin-top: var(--heading_gap);
}
.gallery-images img {
  width: 100%;
  height: auto;
  display: block;
}