.diy-slideshow{position:relative;display:block;overflow:hidden}
.diy-slideshow figure{position:absolute;width:100%;height:100%;pointer-events:none}
.diy-slideshow figure.show{pointer-events:auto;z-index:1}
.diy-slideshow.fade{opacity:1}
.diy-slideshow.fade figure.show{opacity:1}
.diy-slideshow.zoom figure.show{opacity:1}
.diy-slideshow.zoom figure img{transform:scale(1.25)}
.diy-slideshow.zoom figure.show img{animation-name:zoom;animation-fill-mode:forwards;animation-timing-function:linear;animation-delay:0}
@keyframes zoom {
0%{transform:scale(1)}
100%{transform:scale(1.25)}
}
.diy-slideshow.horizontal figure{animation-name:leaveX;animation-fill-mode:forwards}
.diy-slideshow.horizontal figure.show{animation-name:enterX;animation-fill-mode:forwards}
@keyframes leaveX {
0%{transform:translateX(0)}
100%{transform:translateX(-100%)}
}
@keyframes enterX {
0%{transform:translateX(100%)}
100%{transform:translateX(0)}
}
.diy-slideshow.vertical figure{animation-name:leaveY;animation-fill-mode:forwards}
.diy-slideshow.vertical figure.show{animation-name:enterY;animation-fill-mode:forwards}
@keyframes leaveY {
0%{transform:translateY(0)}
100%{transform:translateY(100%)}
}
@keyframes enterY {
0%{transform:translateY(-100%)}
100%{transform:translateY(0)}
}
.diy-slideshow figure img{width:100%;height:100%;object-fit:cover}
.diy-slideshow figure figcaption{position:absolute;font-size:.8em;line-height:1em;bottom:.75em;right:.75em;max-width:90%;padding:.5em;color:#fff;background:rgba(0,0,0,.5);border-radius:2px}
.diy-slideshow figure figcaption a{color:#fff}
.diy-slideshow .next,.diy-slideshow .prev{color:#fff;position:absolute;background:rgba(0,0,0,.75);top:50%;transform:translateY(-50%);z-index:10;font-size:1.5em;line-height:1em;user-select:none;transition:opacity .4s}
.diy-slideshow:hover .next,.diy-slideshow:hover .prev{opacity:.5}
.diy-slideshow .next:hover,.diy-slideshow .prev:hover{cursor:pointer;opacity:1}
.diy-slideshow .next{right:0;padding:15px 5px 15px 10px;border-top-left-radius:3px;border-bottom-left-radius:3px}
.diy-slideshow .prev{left:0;padding:15px 10px 15px 5px;border-top-right-radius:3px;border-bottom-right-radius:3px}