@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap");
* {
  font-family: "Poppins", sans-serif;
  box-sizing: border-box;
  margin: 0;
  padding: 0;
}

body {
  background: #6b18ff;
}

.small {
  position: absolute;
  width: 50%;
  height: 60%;
  left: 20%;
  top: 19%;
  transition: 0.5s;
  transform: perspective(600px) rotateX(-1.98deg) rotateY(29.99deg)
    scale3d(1, 1, 1);
}

img {
  width: 100%;
  height: 100%;
  /* object-fit: cover;
  object-position: center; */
  position: absolute;
}

.imageList {
  width: 30%;
  right: 5%;
  top: 32%;
  position: absolute;
  font-size: 22px;
}

.imageList ul {
  left: 30%;
  position: absolute;
}

.imageList ul li {
  cursor: pointer;
  list-style: none;
  color: #fff;
  margin: 20px 0;
}

.shadow1 {
  top: 10%;
  left: -6%;
  width: 30%;
  height: 80%;
  position: absolute;
  background: rgba(255, 255, 255, 0.6);
}
.shadow2 {
  top: 16%;
  left: -11%;
  width: 30%;
  height: 68%;
  position: absolute;
  background: rgba(255, 255, 255, 0.3);
}

.btn-box {
  z-index: 10;
  right: 3%;
  top: 3%;
  position: absolute;
  cursor: pointer;
  font-size: 40px;
}

.full {
  position: absolute;
  width: 100%;
  height: 100%;
  left: 0;
  top: 0;
  transform: perspective(600px) rotateX(0) rotateY(0) scale3d(1, 1, 1);
  z-index: 8;
}