#pic-slider.slider-container{display:flex;align-items:center;width:100%;height:700px}#pic-slider.horizontal-layout{flex-direction:column}#pic-slider.vertical-layout{flex-direction:row}#pic-slider .slider-wrapper{display:flex;align-items:center;position:relative;width:calc(100% - 100px);height:100%;margin-left:20px}#pic-slider.horizontal-layout .slider-wrapper{width:100%;height:calc(100% - 100px);margin-left:0;margin-bottom:20px}#pic-slider .slider{width:100%;height:100%;overflow:hidden;position:relative}#pic-slider .slide{width:100%;height:100%;overflow:hidden;position:absolute;top:0;left:100%;background-repeat:no-repeat;cursor:zoom-in;transition:left .5s ease-in-out;width:100%;height:100%;object-fit:contain;transition:left .5s ease-in-out,transform .3s ease-in-out}#pic-slider .slide.active{left:0}#pic-slider .thumbnails-wrapper{display:flex;align-items:center;overflow:hidden}#pic-slider.horizontal-layout .thumbnails-wrapper{width:100%;flex-direction:row}#pic-slider.vertical-layout .thumbnails-wrapper{height:100%;flex-direction:column}#pic-slider .thumbnails-container{overflow:hidden}#pic-slider.horizontal-layout .thumbnails-container{width:100%}#pic-slider.vertical-layout .thumbnails-container{height:100%}#pic-slider .thumbnails{display:flex;transition:transform .3s ease-in-out}#pic-slider.horizontal-layout .thumbnails{flex-direction:row}#pic-slider.vertical-layout .thumbnails{flex-direction:column}#pic-slider .thumb{width:100px;min-height:100px;margin-right:10px;cursor:pointer;opacity:.6;transition:opacity .3s,transform .3s;flex:0 0 100px;object-fit:cover}#pic-slider.horizontal-layout .thumb{margin-right:10px;margin-bottom:0}#pic-slider.vertical-layout .thumb{margin-bottom:10px;margin-right:0}#pic-slider .thumb:hover,#pic-slider .thumb.active{opacity:1}#pic-slider .arrow{background:none;border:none;font-size:24px;cursor:pointer}#pic-slider.horizontal-layout .left-arrow,#pic-slider.horizontal-layout .right-arrow{position:absolute;top:50%;transform:translateY(-50%);z-index:1}#pic-slider.horizontal-layout .left-arrow{left:0}#pic-slider.horizontal-layout .right-arrow{right:0}#pic-slider.vertical-layout .up-arrow,#pic-slider.vertical-layout .down-arrow{display:block;transform:rotate(90deg)}@media(max-width: 750px){#pic-slider.slider-container{height:400px}}