.slides {
  position: relative;
}

.slides li {
  list-style: none;
  margin: 0;
  opacity: 0;
  transition: opacity 1s, transform 1s;
  position: absolute;
  z-index: 0;
  text-align: center;
  transform: scale(1.2,1.2);
  transform: rotate(9deg) translateY(40px);
  padding: 8px;
  background: white;
  border: 1px solid black;
  box-shadow: 8px 8px rgba(0, 0, 0, .2);
}
.slides li:hover {
  box-shadow: none;
  top: 8px;
  left: 8px;
}
.slides li > img {
  width: 100%;
  height: auto;
  border: 0;
  margin: 0;
  padding: 0;
  border: 1px solid black;
}

.slides li.reveal {
  opacity: 1;
  z-index: 100;
  transform: scale(1);
  transform: rotate: 0 !important;
}