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

.slider {
  position: absolute;
  left: 10%;
  top: 350px;
  width: 80%;
  height: 30vh;
  overflow: hidden;
}

.slider-inner {
  position: absolute;
  left: 0;
  top: 0;
  height: 100%;
  width: 200%;
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1.5rem;
  pointer-events: none;
  transition: 0s ease-in;
}

.slide {
  height: 100%;
}

.slide__img {
  width: 100%;
  height: 100%;
}

.slide__img--1 {
  background-color: aliceblue;
}

.slide__img--2 {
  background-color: tomato;
}

.slide__img--3 {
  background-color: aqua;
}

.slide__img--4 {
  background-color: blueviolet;
}

.slide__img--5 {
  background-color: yellow;
}

.slide__img--6 {
  background-color: turquoise;
}

.slide__img--7 {
  background-color: cornflowerblue;
}