1 files changed, 18 insertions, 5 deletions
diff --git a/gallerie.css b/gallerie.css
index ef7c60b..cdb0fae 100644
--- a/gallerie.css
+++ b/gallerie.css
@@ -7,14 +7,26 @@ main {
 
 .mosaic {
     display: grid;
-    grid-template-columns: repeat(auto-fill, minmax(25em, 1fr));
+    grid-template-columns: repeat(auto-fill, minmax(var(--mosaic-side), 1fr));
     grid-gap: 0.8em;
 }
 
 .mosaic.photos {
-    grid-auto-rows: 14em;
+    --mosaic-side: 14em;
+}
+.mosaic .photo {
+    position: relative;
+    width: 100%;
+    height: 0;
+    padding-bottom: 100%;
+}
+.mosaic .photo > * {
+    position: absolute;
+    top: 0;
+    left: 0;
+    width: 100%;
+    height: 100%;
 }
-
 .mosaic img {
     object-position: center;
     object-fit: cover;
@@ -23,18 +35,19 @@ main {
     transition: filter 0.5s;
     filter: grayscale(0.8) brightness(0.4);
 }
-
 .mosaic img:hover {
     filter: none;
 }
 
+.mosaic.videos {
+    --mosaic-side: 25em;
+}
 .mosaic .video {
     position: relative;
     width: 100%;
     height: 0;
     padding-bottom: 56.25%;           /* 9/16 */
 }
-
 .mosaic .video .yt {
     position: absolute;
     top: 0;