section {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  width: auto;
  margin-top: clamp(5.35em, 11dvw + 0.2rem, 8em);
}

img {
  object-fit: contain;
  border: 1px solid #eee;
}

#vertical {
  display: none;
}

.delay {
  animation: delay 0.05s ease-in 0.2s backwards;
}

@keyframes delay {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

p {
  font-size: clamp(0.88em, 1dvw + 0.4rem, 1em);
  letter-spacing: 0.04em;
  margin-right: -0.04em;
  line-height: 1.3em;
}

#gay-art-first-line {
  margin-top: min(0.5dvw + 0.2rem, 0.43em);
}

#gay-art-artist-name {
  letter-spacing: 0.06em;
  margin-right: -0.06em;
}

#gay-art-artist-name:hover {
  color: #fef;
  text-shadow: var(--halos);
  transition: 0.5s;
}

.gay-art-collection-dot {
  font-weight: 900;
  padding: 0.08em 0.28em 0em;
}

.art-collection-dot {
  font-weight: 900;
  padding: 0.08em 0.24em 0em 0.28em;
}

.collection-dot {
  font-weight: 900;
  padding: 0.08em 0.18em 0em 0.28em;
}

.gay-collection-dot {
  font-weight: 900;
  padding: 0.08em 0.14em 0em 0.28em;
}

.gay-art-dot {
  font-weight: 900;
  padding: 0.08em 0.24em 0em;
}

.art-gay-dot {
  font-weight: 900;
  padding: 0.08em 0.28em 0em 0.24em;
}

.art-dot {
  font-weight: 900;
  padding: 0.08em 0.24em 0em 0.2em;
}

.gay-dot {
  font-weight: 900;
  padding: 0.08em 0.24em 0em 0.14em;
}

.dot {
  font-weight: 900;
  padding: 0.08em 0.2em 0em 0.24em;
}

button {
  font-size: clamp(1.05em, 1.35dvw + 0.4rem, 1.2em);
  letter-spacing: 0.18em;
  margin-left: 0.6em;
  padding: 0.52em 1.5em 1.5em;
}

@media (max-width: 720px) {
  section {
    margin-top: min(23dvw + 0.76rem, 9.8em);
  }

  img {
    margin: auto;
  }

  #horizontal {
    display: none;
  }

  #vertical {
    display: contents;
  }

  p {
    font-size: min(2.2dvw + 0.35rem, 1.2rem);
  }

  button {
    font-size: min(2.9dvw + 0.35rem, 1.45rem);
  }
}
