/* user-override.css */ #header { height: 240px; display: inline-grid; justify-content:space-between; } #header, #outer_lightgallery { background-color: rgba(0, 0, 0, 0.2); background-position: center center; background-repeat: no-repeat; background-size: 100% auto; border-radius: 12px; box-shadow: 1px 3px 8px rgba(0, 0, 0, 0.6); left: 5%; max-height: 100%; position: relative; top: 0; width: 90%; z-index: 10; } #outer_lightgallery { display: block; margin-top: 1em; min-height:2em; /* new */ text-align: center; /* display: flex */ /* justify-content: center; */ } #lightgallery, #filter-results, #results { padding: 1em; } #lightgallery img, #results img { width: 205px; height: 205px; object-fit: cover; z-index: 9; padding: 0 3px 3px 0; } #header h1, #nav, #zip { display: inline-block; /* background-color: #ddd; */ /* color: #fff; */ background-color:rgba(255, 255, 255, 0.5); padding: 0.5em; height: 2em; border-radius: 0 0 12px 12px; border-radius: 12px; } #header { background-image: url("header/header.jpg"); } #nav { height: 2.5em; } #zip { position: absolute; right: 1em; bottom: 1em; height: 4em; } .lg-zoom-in-out { .lg-item { // By default all slides should be hidden opacity: 0; will-change: transform, opacity; // For the zoom in transition, set scale3d to 2 &.lg-prev-slide { transform: scale3d(2, 2, 2); } // For the zoom out transition, set scale3d to 0 &.lg-next-slide { transform: scale3d(0, 0, 0); } // Reset opacity and transition &.lg-current { transform: scale3d(1, 1, 1); opacity: 1; } // Add CSS transition for opacity and transform &.lg-prev-slide, &.lg-next-slide, &.lg-current { transition: transform 1s cubic-bezier(0, 0, 0.25, 1) 0s, opacity 1s ease 0s; } } }