.lightbox-img-container {
    cursor: zoom-in;
}

.lightbox-img-container.lightboxed {
    opacity: 1;
}

.lightbox-img-container .overlay {
    position: fixed;
    width: 100vw;
    height: 100vh;
    left: 0;
    top: 0;
    /* background: rgb(12, 56, 78); */
    background: black;
    opacity: 0;
    transform: scale(10);
    pointer-events: none;
    z-index: -1;
    transition: opacity var(--fadeTransition);
}

.lightbox-img-container.lightboxed .overlay {
    opacity: 0.9;
    pointer-events: all;
    cursor: zoom-out;
}

.lightbox-img-container.lightboxed>* {
    pointer-events: none;
}

section:has(.above-all),
.lightbox-img-container.above-all {
    z-index: 2;
    position: relative;
}

body:has(.lightboxed) nav {
    opacity: 0 !important;
    transition: opacity var(--fadeTransition) 0s;
}

body:has(.lightboxed) nav ul,
body:has(.lightboxed) .logo-small {
    pointer-events: none !important;
}

@media screen and (max-width: 600px) {
    .lightbox-img-container {
        pointer-events: none;
    }
}