::selection{color:#fff}.wrapper{max-width:1100px}.gallery{display:flex;flex-wrap:wrap}.gallery .image{padding:7px;width:calc(96% / 3)}.gallery .image span{display:flex;width:100%;overflow:hidden}.gallery .image img{width:100%;vertical-align:middle;transition:.3s}.gallery .image:hover img{transform:scale(1.1)}.preview-box{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(.9);background:#fff;max-width:700px;width:100%;z-index:5;opacity:0;pointer-events:none;border-radius:3px;padding:0 5px 5px;box-shadow:0 0 15px rgba(0,0,0,.2)}.preview-box.show{opacity:1;pointer-events:auto;transform:translate(-50%,-50%) scale(1);transition:.3s}.preview-box .details{display:flex;align-items:center;padding:12px 15px 12px 10px;justify-content:space-between}.preview-box .details .title{display:flex;font-size:18px;font-weight:400}.details .title p{margin:0 5px}.details .title p.current-img{font-weight:500}.details .icon{color:#c7ad72;font-size:20px;cursor:pointer}.preview-box .image-box{display:flex;width:100%;position:relative}.image-box .slide{position:absolute;top:50%;transform:translateY(-50%);color:#fff;font-size:30px;cursor:pointer;height:50px;width:60px;line-height:50px;text-align:center;border-radius:3px}.slide.prev{left:0}.slide.next{right:0}.image-box img{width:100%;border-radius:0 0 3px 3px}.shadow{position:fixed;top:0;left:0;height:100%;width:100%;z-index:2;display:none;background:rgba(0,0,0,.45)}@media(max-width:1000px){.gallery .image{width:calc(100% / 2)}}@media(max-width:600px){.gallery .image{width:100%;padding:4px}}