.img-preview{position:fixed;top:0;right:0;bottom:0;left:0;z-index:1000;background:rgba(0,0,0,.5);-webkit-user-select:none;-moz-user-select:none;user-select:none}.img-preview-content{display:flex;width:100%;height:100%;color:#fff;justify-content:center;align-items:center}.img-preview-image{cursor:pointer;transition:transform .3s}.img-preview__close{position:absolute;top:-40px;right:-40px;width:80px;height:80px;overflow:hidden;color:#fff;cursor:pointer;background-color:#00000080;border-radius:50%;transition:all .2s}.img-preview__close-icon{position:absolute;top:46px;left:16px;font-size:16px}.img-preview__close:hover{background-color:#000c}.img-preview__index{position:absolute;bottom:5%;left:50%;padding:0 22px;font-size:16px;background:rgba(109,109,109,.6);border-radius:15px;transform:translate(-50%)}.img-preview__controller{position:absolute;bottom:10%;left:50%;display:flex;width:260px;height:44px;padding:0 22px;margin-left:-139px;background:rgba(109,109,109,.6);border-radius:22px;justify-content:center}.img-preview__controller-item{display:flex;height:100%;padding:0 9px;font-size:24px;cursor:pointer;transition:all .2s}.img-preview__controller-item:hover{transform:scale(1.2)}.img-preview__controller-item img{width:1em}.img-preview__arrow{position:absolute;top:50%;display:flex;align-items:center;justify-content:center;width:50px;height:50px;font-size:28px;cursor:pointer;background-color:#00000080;border-radius:50%;transition:all .2s}.img-preview__arrow:hover{background-color:#000c}.img-preview__arrow.left{left:50px}.img-preview__arrow.right{right:50px}
