Imagen de los 17 objetivos añadida e imagnes de impacto

.vscode/settings.json

@@ -0,0 +1,3 @@
+{
+    "liveServer.settings.port": 5501
+}

src/pages/index.astro

@@ -80,9 +80,9 @@ const animateOnScroll = `
 						</div>
 						<div class="col-md-6 animate-on-scroll">
 							<div
-								class="bg-secondary text-white p-5 text-center"
+								class=" text-white p-5 text-center"
 							>
-								<p>Aquí iría una imagen de los 17 ODS</p>
+								<img src="../../public/imgs/17Objetivos.png" alt="" class="img-thumbnail .img-fluid">
 							</div>
 						</div>
 					</div>
@@ -158,7 +158,12 @@ const animateOnScroll = `
 						  [1, 2, 3, 4, 5, 6].map((num) => (
 							<div class="col-md-4 animate-on-scroll">
 							  <div class="bg-light p-4 text-center">
-										<p>Imagen de impacto {num}</p>
+								<img 
+								  src={`../../public/imgs/imgimp${num}.jpg`} 
+								  alt={`Imagen de impacto ${num}`} 
+								  class="img-fluid img-fit" 
+								/>
+
 							  </div>
 							</div>
 						  ))
@@ -291,4 +296,12 @@ const animateOnScroll = `
 		height: 40px;
 		margin-right: 10px;
 	}
+
+	.img-fit{
+		width: 100%;
+		height: 200px;
+		object-fit: cover;
+		border-radius: 8px;
+	}
+
 </style>