.wrapper{
    margin-top: -25px;
    margin-left: -105px;
    width: 80px;
    height: 130px;
    position: relative;
    transform-style: preserve-3d;
    animation: Anim 45s linear infinite; /*tiempo de demora de la rotaci*/
}
@keyframes Anim {
    0%{
        transform: perspective(1000px) rotateY(0);
    }
    100%{
        transform: perspective(1000px) rotateY(360deg);
    }
}
.wrapper span{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
    transform-origin: center;
    transform-style: preserve-3d;
    transform: rotateY(calc(24deg * var(--i))) translateZ(210px);/*dividir las fotos entre 360 y en wrapper width ajustar el espacio si fuera preciso*/
}
.wrapper span img{
    width: 105%;
    height: 100%;
    object-fit: cover;
    border: 2px solid rgb(126, 67, 45);
    transition: 0.3s;
}
.wrapper span:hover img{
    transform: scale(1.6); /*Amplia el zoom de la foto*/
    box-shadow: 0 0 10px #3a86ff,
                0 0 25px #27ae60,
                0 0 40px #3a86ff,
                0 0 70px #27ae60,
                0 0 100px -30px #3a86ff,
                0 0 125px -50px #27ae60;
}
 /*
  @media screen and (max-width:800px) {
      .wrapper {
          margin-left: 298px;
      }
  }*/
 @media (max-width: 690px) {
     .wrapper {
         margin-top: -25px;
         margin-left: -105px;
         width: 75px;
         height: 120px;
     }

     .wrapper span {
         transform: rotateY(calc(24deg * var(--i))) translateZ(190px);
         /*dividir las fotos entre 360 y en wrapper width ajustar el espacio si fuera preciso*/
     }
 }