.button {
  border: var(--border);
  padding: 1rem 2rem;
  transition: color 0.2s ease-in-out, background 0.2s ease-in-out;
}

.button:hover {
  background: black;
  color: white;
}

.button:active {
  transform: scale(0.95);
}


#carousel-controls button {
  position: absolute;
  top: calc(50% - 3rem);
  background: none;
  border: 0px;
  font-size: 4rem;
  color: white;
  cursor: pointer;
  font-family: 'DM Serif';
}

#carousel-controls button[data-controls="prev"] {
  left: 1rem;
}
#carousel-controls button[data-controls="next"] {
  right: 1rem;
}

.slide-content {
  padding: 1rem;
  color:white;
}