.title,ul.thumbs{white-space:nowrap}:root{--mobile-height:calc(100% - 100px);--desktop-height:calc(100% - 150px)}body{overflow:hidden;background-color:#000;touch-action:none}#overlay{display:flex;align-items:center;position:fixed;z-index:999;width:100%;height:100%;background:rgba(0,0,0,.9)}#loading{position:relative;color:#fff;margin:auto;font-size:1.5em;text-align:center}.title-container{display:flex;width:100%;height:50px;position:absolute;z-index:11;line-height:50px;color:#fff;background:#222;opacity:.9}#slideshow,#slideshow.fullscreen{height:100%;width:100%;overflow:hidden}.image,.img-wrapper{background-position:center center}.title{flex:1;font-size:18px;margin-left:10px;overflow:hidden;text-overflow:ellipsis}.all,.play{color:#999;cursor:pointer;margin:6px 10px 0;float:right}#slideshow{margin:100px auto;position:relative;background-color:#000}#slideshow.fullscreen{position:fixed;top:0;left:0;margin:0;padding:0}.img-wrapper{display:none;height:var(--desktop-height);position:absolute;margin-top:50px;margin-bottom:100px;left:0;right:0;overflow:hidden;z-index:8;background-size:contain;background-repeat:no-repeat;transition:height 2s,}#slideshow .img-wrapper.last-active{z-index:9}#slideshow .img-wrapper.active{display:block;z-index:10}.image,.thumb{display:inline-block;cursor:pointer}.modal{max-width:100%}.modal-body{text-align:justify}.snackbar,ul.thumbs{text-align:center;position:absolute}.image{padding:15.5%;margin:1%;background-size:cover}.thumbs-container{width:100%;height:100px;position:absolute;left:0;z-index:11;background:#222;opacity:.9}.top{top:0}.bottom{bottom:0}.next,.prev{width:3%;min-width:30px;height:48px;padding:35px 1%;color:#999;cursor:pointer}.prev{float:left}.next{float:right}.all:hover,.next:hover,.play:hover,.prev:hover{color:#555}ul.thumbs{top:0;left:5%;right:5%;height:100px;padding:0;margin:0 5%;overflow:hidden}.thumb,.thumb.active{width:76px;height:76px}.thumb{margin:10px 5px;overflow:hidden;background-size:cover;background-position:center center}.thumb:first-of-type{margin-left:0}.thumb.active{border:2px solid #FFF}.snackbar{opacity:.9;visibility:hidden;max-width:300px;background-color:#333;color:#fff;font-size:16px;border-radius:2px;padding:16px;z-index:15;left:0;right:0;bottom:13%;margin:0 auto}.snackbar.show{visibility:visible;-webkit-animation:fadein .5s,fadeout .5s 5s;animation:fadein .5s,fadeout .5s 5s}@keyframes fadein{from{bottom:0;opacity:0}to{bottom:13%;opacity:.9}}@keyframes fadeout{from{bottom:13%;opacity:.9}to{bottom:0;opacity:0}}@media screen and (max-width:991px){.img-wrapper{height:var(--mobile-height);margin-top:50px;margin-bottom:50px;transition:margin .35s,height .35s}.thumbs-container,.title-container{transition:all .35s}.next,.prev{width:3%;min-width:28px;height:48px;padding:10px 1%}.thumbs-container,ul.thumbs{height:50px}.thumb,.thumb.active{width:26px;height:26px}.image{width:48%}.timer.fullscreen{top:-5px}.title-container.fullscreen{top:-100px}.thumbs-container.fullscreen{bottom:-100px}.img-wrapper.fullscreen{margin:0;height:100%}}.timer{z-index:12;width:100%;height:5px;background-color:grey;position:fixed;transition:all .35s}.timer>.done{width:0%;height:5px;background-color:#fff}.ui-loader{display:none}