.zauberzahn-masonry-gallery {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    grid-auto-rows: 300px;
    gap: 24px;
}

/* Reset */

.zauberzahn-masonry-gallery figure {
    margin: 0;
    overflow: hidden;
    border-radius: 12px;
}

.zauberzahn-masonry-gallery img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}

/* positioning of the 5 images */
.zauberzahn-gallery-item:nth-of-type(1) {
    grid-column: span 4;
}

.zauberzahn-gallery-item:nth-of-type(2) {
    grid-column: span 5;
}

.zauberzahn-gallery-item:nth-of-type(3) {
    grid-column: span 3;
}

.zauberzahn-gallery-item:nth-of-type(4) {
    grid-column: span 7;
}

.zauberzahn-gallery-item:nth-of-type(5) {
    grid-column: span 5;
}

@media (max-width: 1200px) {
    .zauberzahn-masonry-gallery {
        grid-template-columns: repeat(4, 1fr);
    }

    .zauberzahn-gallery-item:nth-of-type(1),
    .zauberzahn-gallery-item:nth-of-type(2),
    .zauberzahn-gallery-item:nth-of-type(3),
    .zauberzahn-gallery-item:nth-of-type(4) {
        grid-column: span 2;
    }

    .zauberzahn-gallery-item:nth-of-type(5) {
        grid-column: span 4;
    }
}

@media (max-width: 800px) {
    .zauberzahn-masonry-gallery {
        grid-template-columns: 1fr;
    }

    .zauberzahn-gallery-item:nth-of-type(1),
    .zauberzahn-gallery-item:nth-of-type(2),
    .zauberzahn-gallery-item:nth-of-type(3),
    .zauberzahn-gallery-item:nth-of-type(4),
    .zauberzahn-gallery-item:nth-of-type(5) {
        grid-column: span 1;
    }
}