descBox.css

html, body { width: 100%; height: 100%; }
.desc-description, .desc-title { display: none; }
.desc-image { cursor: pointer; }
.desc-mask { position: fixed; width: 100%; height: 100%; background: rgba(0, 0, 0, 0.8); z-index: 100; top: 0; left: 0; }
.desc-mask .desc-close { position: fixed; right: 15px; top: 15px; z-index: 101; color: #FFF; cursor: pointer; }
.desc-preview { position: fixed; z-index: 102; width: 50%; left: 10%; top: 10%; height: 80%; }
.desc-preview .desc-img-responsive { max-width: 100%; max-height: 100%; padding: 5%; padding-bottom: 0; border-radius: 5px; }
.desc-preview-background { position: fixed; z-index: 100; width: 10%; left: 25%; top: 10%; height: 10%; background: #FFF; border-radius: 5px; }
.desc-preview-description { position: fixed; z-index: 102; width: 30%; left: 60%; top: 10%; height: 80%; color: #FFF; padding-left: 2%; }
.desc-arrow-previous, .desc-arrow-next, .desc-preview-slide { text-decoration: underline; cursor: pointer; display: inline-block; vertical-align: top; padding-right: 10px; }