body {
  background: 
  radial-gradient(circle at top left, transparent 30%, #00ffff77 30%, #00ffff3f 40%, #00ffff77 40%, #00ffff3f 50%, transparent 50%),
  radial-gradient(circle at bottom right, transparent 10%, #00ffff77 10%, #00ffff3f 20%, #00ffff77 20%, #00ffff3f 30%, transparent 30%),
  gray;
  background-attachment: fixed;
}

.slider-wrapper {
  order: 2;
}

#slider-prev {
  order: 1;
}

#slider-next {
  order: 3;
}

.slider-item {
  display: none;
  width: 256px;
  aspect-ratio: 1;
  overflow: hidden;
  transition-duration: 500ms;
}

.prev-prev, .prev, .active, .next, .next-next {
  display: block;
}

.prev, .active, .next {
  border: 4px solid;
  border-radius: 100%;
  border-color: lightgray;
}

.prev-prev, .next-next {
  visibility: hidden;
  scale: 0;
}

.prev-prev {
  width: 0px;
  order: 1;
}

.prev {
  order: 2;
}

.active {
  order: 3;
  border-color: #00ffff;
  box-shadow: 0px 0px 16px #00ffff;
  scale: 1.25;
  z-index: 1;
}

.next {
  order: 4;
}

.next-next {
  width: 0px;
  order: 5;
}