/* Masonry via CSS Columns */
.masonry {
    column-count: 7;
    column-gap: 1rem;
    padding: 0 1rem 0 1rem;
}

@media (max-width: 1100px) {
    .masonry {
        column-count: 4;
    }
}

@media (max-width: 780px) {
    .masonry {
        column-count: 2;
    }
}

@media (max-width: 520px) {
    .masonry {
        column-count: 1;
    }
}

.masonry-item {
    break-inside: avoid;
    -webkit-column-break-inside: avoid;
    margin-bottom: 1rem;
}

/* Big Button */
.btn-xl {
    padding: 1rem 2rem;
    font-size: 1.25rem;
}

/* Zoom-Styles */
.masonry-item img {
    transition: transform 280ms ease;
    transform-origin: center center;
    cursor: zoom-in; /* Standard: Zoom erlaubt */
}

    .masonry-item img.enlarged {
        position: relative;
        z-index: 1000;
        cursor: zoom-out;
        z-index: 10000;
    }

/* Mobile no zoom, normal Cursor  */
@media (max-width: 520px) {
    .masonry-item img {
        cursor: default;
    }
}