/* Photo galleries (written by the photo admin, admin/lib.php): the full width of the page.
   Rows: the photos of a row get the same height and together fill the width (flex-grow = width / height).
   Squares: 3 per row. On phones every photo gets the full width (squares: 2 per row). */
.dv-gallery { margin: 0 0 24px; }
.dv-gallery .tiled-gallery-item { position: relative; float: none; width: auto; min-width: 0; overflow: hidden; }
.dv-gallery .tiled-gallery-item a { display: block; }
.dv-gallery .tiled-gallery-item img,
.dv-gallery .tiled-gallery-item img:hover { display: block; width: 100%; height: auto; margin: 0 !important; }

.dv-rect .dv-row { display: flex; gap: 4px; margin: 0 0 4px; max-width: 100%; }
.dv-rect .dv-row > .tiled-gallery-item { flex-shrink: 1; flex-basis: 0; }

.dv-square { display: grid; grid-template-columns: repeat(3, 1fr); gap: 4px; }
.dv-square .tiled-gallery-item img { aspect-ratio: 1 / 1; object-fit: cover; }

@media (max-width: 600px) {
    .dv-rect .dv-row { flex-wrap: wrap; width: auto !important; }
    .dv-rect .dv-row > .tiled-gallery-item { flex: 1 1 100% !important; }
    .dv-square { grid-template-columns: repeat(2, 1fr); }
}