From 25044f9f1c06f5f6e8fd3bdc3452828681bca4da Mon Sep 17 00:00:00 2001
From: Stanley Lew <stanley43595@gmail.com>
Date: Mon, 20 Nov 2023 00:50:53 -0800
Subject: [PATCH] fixed focus + added pic

---
 src/components/home/Focus.jsx   | 2 +-
 src/components/home/WhyJoin.jsx | 3 ++-
 2 files changed, 3 insertions(+), 2 deletions(-)

diff --git a/src/components/home/Focus.jsx b/src/components/home/Focus.jsx
index 0c80e1d..8dc9976 100644
--- a/src/components/home/Focus.jsx
+++ b/src/components/home/Focus.jsx
@@ -2,7 +2,7 @@ import ArrowLink from "../ArrowLink";
 
 const Focus = ({ title, description, link, icon }) => {
   return (
-    <div className="col-span-1 md:col-span-2 relative flex flex-col items-center bg-blue-100 p-2">
+    <div className="col-span-2 md:col-span-1 relative flex flex-col items-center bg-blue-100 p-2">
       <div className="flex justify-center text-3xl text-ewb-green my-2">
         {icon}
       </div>
diff --git a/src/components/home/WhyJoin.jsx b/src/components/home/WhyJoin.jsx
index c10e57c..8415ac2 100644
--- a/src/components/home/WhyJoin.jsx
+++ b/src/components/home/WhyJoin.jsx
@@ -2,6 +2,7 @@ import Title from "../Title";
 import { FOCUS } from "@/data/focus";
 import Focus from "./Focus";
 import Picture from "../Picture";
+import img1 from "../../../public/images/whyJoin.webp";
 const WhyJoin = () => {
   return (
     <div className="py-16 w-11/12 flex flex-col items-center">
@@ -27,7 +28,7 @@ const WhyJoin = () => {
           />
         ))}
       </div>
-      <Picture picture="/images/CostaRica/CostaRica1.gif" />
+      <Picture picture={img1.src} />
     </div>
   );
 };