.gallery{width:100%}.gallery-container{align-items:center;display:flex;height:400px;margin:0 auto;max-width:1000px;position:relative}.gallery-item{height:150px;opacity:.4;position:absolute;transition:all .3s ease-in-out;width:248px;z-index:0}.gallery-item.gallery-item-selected{box-shadow:0 0 30px rgba(255,255,255,.6),0 0 60px rgba(255,255,255,.45),0 0 110px rgba(255,255,255,.25),0 0 100px rgba(255,255,255,.1);height:auto;opacity:1;left:50%;transform:translateX(-50%);width:510px;z-index:2}.gallery-item.gallery-item-next,.gallery-item.gallery-item-previous{//height:200px;height:auto;opacity:1;width:350px;z-index:1}.gallery-item.gallery-item-previous{left:30%;transform:translateX(-50%)}.gallery-item.gallery-item-next{left:70%;transform:translateX(-50%)}.gallery-item.gallery-item-first{left:15%;transform:translateX(-50%)}.gallery-item.gallery-item-last{left:85%;transform:translateX(-50%)}.gallery-controls{display:flex;justify-content:center;margin:30px 0}.gallery-controls button{border:0;cursor:pointer;font-size:16px;margin:0 20px;padding:0 12px;text-transform:capitalize}.gallery-controls button:focus{outline:0}.gallery-controls-next,.gallery-controls-previous{position:relative}.gallery-controls-next::before,.gallery-controls-previous::before{border:solid #000;border-width:0 2px 2px 0;content:'';display:inline-block;height:4px;padding:2px;position:absolute;width:4px}.gallery-controls-previous::before{left:-10px;top:0;transform:rotate(135deg) translateY(-50%);transition:left .15s ease-in-out}.gallery-controls-previous:hover::before{left:-18px}.gallery-controls-next::before{right:-10px;top:50%;transform:rotate(-45deg) translateY(-50%);transition:right .15s ease-in-out}.gallery-controls-next:hover::before{right:-18px}.gallery-nav{bottom:-15px;display:flex;justify-content:center;list-style:none;padding:0;position:absolute;width:100%}.gallery-nav li{background:#ccc;border-radius:50%;height:10px;margin:0 16px;width:10px}.gallery-nav li.gallery-item-selected{background:#555}.overlay-fade .image{display:block;width:100%;height:auto}.overlay-fade .overlay{position:absolute;top:0;bottom:0;left:0;right:0;height:100%;width:100%;opacity:0;transition:.5s ease;background-color:#008cba}.overlay-fade:hover .overlay{opacity:1}.overlay-fade .text{color:#fff;font-size:20px;position:absolute;top:50%;left:50%;-webkit-transform:translate(-50%,-50%);-ms-transform:translate(-50%,-50%);transform:translate(-50%,-50%);text-align:center}#bg-container{height:100%;background-image:url(http://via.placeholder.com/1350x400?text=);background-position:center;background-size:cover}#image-container{position:relative;height:300px;width:300px;background-color:green}