body {
  font-family: 'Montserrat', sans-serif;
}

.font-khula {
  font-family: 'Khula', sans-serif;
}

#site-footer {
  font-family: 'Khula', sans-serif;
  color: #C2D2D4;
}

.arrow-button {
  border: 1px solid #FFFFFF;
  color: #FFFFFF;
}
.arrow-button > img {
  filter: invert(1);
}

.arrow-button:hover {
  border: 1px solic #000000;
  background-color: #FFFFFF;
  color: #000000;
}
.arrow-button:hover > img {
  filter: invert(0);
}

.arrow-button.alt {
  border: 1px solid #000000;
  color: #000000;
}
.arrow-button.alt > img {
  filter: invert(0);
}
.arrow-button.alt:hover {
  border: 1px solic #FFFFFF;
  background-color: #000000;
  color: #FFFFFF;
}
.arrow-button.alt:hover > img {
   filter: invert(1);
 }

.horizontal-gallery {
   display: flex;
   overflow-x: auto;
   scroll-snap-type: x mandatory;
   scroll-behavior: smooth;
   gap: 16px;
 }

.horizontal-gallery img {
   width: 70%;
   flex-shrink: 0;
   scroll-snap-align: start;
   object-fit: cover;
 }

@media (min-width: 768px) {
  .horizontal-gallery {
    display: none;
  }
}