added more gif

index.html

@@ -150,21 +150,28 @@
 
 			<h2 class="margin_bottom_big">quelques exemples de projets réalisés :</h2>
 
+			<div class="projects_grid">
 				<figure class="project">
-				<img src="./docs/projects/fdf_pyramide_2.gif"/>
+					<img src="./docs/projects_square/fdf_pyramide_loop_square_2_light.gif"/>
 					<figcaption>description</figcaption>
 				</figure>
 
 				<figure class="project">
-				<img src="./docs/projects/cube3d_raycasting.gif"/>
+					<img src="./docs/projects_square/cube3d_tour_with_map_square.gif"/>
 					<figcaption>description</figcaption>
 				</figure>
 
 				<figure class="project">
-				<img src="./docs/projects/ljdp_map_clusters.gif"/>
+					<img src="./docs/projects_square/ljdp_map_clusters_square_light.gif"/>
 					<figcaption>description</figcaption>
 				</figure>
 
+				<figure class="project">
+					<img src="./docs/projects_square/kosmopolit_square.gif"/>
+					<figcaption>description</figcaption>
+				</figure>
+			</div>
+
 <!--
 			<article class="project">
 				<p>description</p>

styles/elements/projects.css

@@ -2,7 +2,15 @@
 	header {
 		height: 300px;
 	}
+	.projects_grid {
+		display: grid;
+		grid-template-columns: repeat(auto-fit, minmax(200px, auto));
+		grid-gap: 20px;
 		figure {
+			figcaption {
+				text-align: left;
+			}
+		}
 	}
 	article {
 		display: grid;