* {
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

.blinds2 {
  width: 800px;
  aspect-ratio: 16 /9;
  overflow: hidden;
  /*background: #111;*/
}

.slider {
  position: relative;
  width: 800px;
  overflow: hidden;
}

.slide {
  position: absolute;
  width: 800px;
  aspect-ratio: 16 / 9;
  display: grid;
  grid-template-rows: repeat(5, 1fr);
}

.slide div {
  background-size: cover;
  background-position: center;
  transition: transform 0.3s ease-in-out;
}

.hidden {
  transform: scaleY(0);
}

.controls {
  position: absolute;
  bottom: 20px;
  left: 50%;
  border-radius: 9px;
  transform: translateX(-50%);
  display: flex;
  /*gap: 20px;*/
}

.controls button {
  /*padding: 12px 20px;*/
  /*font-size: 18px;*/
  cursor: pointer;
  background: rgb(228,168,38);
  border: none;
  /*border-radius: 9px;*/
  transition: background 0.3s;
}

.controls button:hover {
  background: rgb(228,168,38);
}

