.gallery {
  max-width: 1600px;
  margin: 0 auto;
}

.gallery-chooser {
  background: var(--beige);
}

.gallery-chooser ul {
  display: none;
}

.gallery-chooser li {
  margin-bottom: var(--s-2);
}

.gallery-chooser .selected button {
  color: var(--gold);
}

.gallery-chooser button {
  color: var(--blue);
  font-size: var(--s-1);
  position: relative;
  text-align: left;
  transition: color 200ms ease;
}

.gallery-chooser button:hover {
  color: var(--gold);
  cursor: pointer;
}

.gallery-chooser .selected button::after {
  content: '';
  background: var(--gold);
  width: 200%;
  height: 1px;
  position: absolute;
  top: 50%;
  left: 110%;
}

.gallery-chooser button:focus {
  outline: none;
}

.gallery-chooser form {
  padding: var(--s0);
}

.gallery-chooser select {
  width: 100%;
  padding: var(--s-2);
  color: var(--blue);
  background: var(--beige-light);
  border: 1px solid var(--blue);
  font-size: var(--s-2);
}

.gallery-item {
  display: none;
  background: var(--beige);
  padding: var(--s0);
  padding-top: 0;
}

.gallery-item.selected {
  display: block;
}

.gallery-thumbs {
  padding: var(--s0);
  padding-top: 0;
  background: var(--beige);
}

.gallery .slideshow-thumbs {
  margin-bottom: 2px;
  margin-top: 0;
  display: none;
}

.gallery .slideshow-thumbs.selected {
  display: grid;
}

@media (min-width: 960px) {
  .gallery-item .aspect-ratio-wide {
    padding-top: 56%;
  }
}

@media (min-width: 1200px) {
  .gallery {
    display: grid;
    grid-template-columns: 30% 3fr;
  }

  .gallery-chooser {
    display: flex;
    justify-content: center;
    align-items: center;
  }

  .gallery-chooser form {
    display: none;
  }

  .gallery-chooser ul {
    display: block;
    padding-right: 1rem;
    overflow: hidden;
    margin-left: 2rem;
  }

  .gallery-item {
    padding: 0;
  }

  .gallery-thumbs {
    background: none;
    padding: 0;
    margin-top: 6px;
    grid-column: 2;
    grid-row: 2;
  }

  .gallery-thumbs .slideshow-thumbs {
    grid-gap: 6px;
  }
}

@media (min-width: 1400px) {
  .gallery-chooser button {
    font-size: var(--s0);
  }
}
