diff --git a/components/States/HospitalListCard.jsx b/components/States/HospitalListCard.jsx
index 264562d..877b188 100644
--- a/components/States/HospitalListCard.jsx
+++ b/components/States/HospitalListCard.jsx
@@ -9,7 +9,12 @@ const mapStatuses = (statuses, hospital) => {
     return (
       <div key={i} className="py-2 px-2 flex items-center space-x-2">
         <span className={`${colorForIcon(hospital[item])}`}>
-          <svg width="30" height="30" viewBox="0 0 48 48" xmlns="http://www.w3.org/2000/svg">
+          <svg
+            width="30"
+            height="30"
+            viewBox="0 0 48 48"
+            xmlns="http://www.w3.org/2000/svg"
+          >
             <path d={icons[item]} fill="currentColor" fillRule="nonzero" />
           </svg>
         </span>
@@ -21,8 +26,12 @@ const mapStatuses = (statuses, hospital) => {
 
 const HospitalListCard = (hospital) => {
   const getImageData = (hospital) => {
-    const hospitalPhoto = hospital.hospital_photos.filter((photo) => photo !== "");
-    const hospitalGallery = hospital.hospital_gallery.filter((photo) => photo !== "");
+    const hospitalPhoto = hospital.hospital_photos.filter(
+      (photo) => photo !== ""
+    );
+    const hospitalGallery = hospital.hospital_gallery.filter(
+      (photo) => photo !== ""
+    );
     return [...hospitalPhoto, ...hospitalGallery];
   };
 
@@ -34,7 +43,9 @@ const HospitalListCard = (hospital) => {
             <div className="font-semibold text-lg md:text-2xl mb-2 mt-4 pr-2">
               {hospital.hospital_name}
             </div>
-            <div className="font-semibold text-base mb-2 mt-4 pr-2">{hospital.district} Dt.</div>
+            <div className="font-semibold text-base mb-2 mt-4 pr-2">
+              {hospital.district} Dt.
+            </div>
             <div className="mt-4 flex justify-center md:justify-start">
               <img
                 className="object-cover shadow-lg h-32 w-32 rounded-full"
@@ -83,7 +94,7 @@ const HospitalListCard = (hospital) => {
             </div>
           )}
         </div>
-        <div className="border p-2 bg-primary-100 flex justify-between">
+        <div className="border p-2 bg-primary-100 flex flex-col md:flex-row justify-between">
           <div className="font-semibold text-md">Hospital Status Details</div>
           <div className="flex space-x-3">
             <div className="flex items-center text-red-500 font-semibold text-sm">
@@ -101,46 +112,57 @@ const HospitalListCard = (hospital) => {
           </div>
         </div>
         <div className="px-4">
-          <div className="grid md:grid-cols-3 uppercase mt-2 font-semibold text-gray-600">
-            <div>Site</div>
-            <div>Equipment</div>
-            <div>Technology</div>
-          </div>
-          <div className="grid md:grid-cols-3">
+          <div className="grid md:grid-cols-3 gap-2 uppercase mt-2 font-semibold text-gray-600">
             <div>
-              {mapStatuses(
-                ["site_space", "site_electrical", "site_internet", "site_oxygen"],
-                hospital
-              )}
+              <div>Site</div>
+              <div className="text-black">
+                {mapStatuses(
+                  [
+                    "site_space",
+                    "site_electrical",
+                    "site_internet",
+                    "site_oxygen",
+                  ],
+                  hospital
+                )}
+              </div>
             </div>
             <div>
-              {mapStatuses(
-                [
-                  "equipment_ordered",
-                  "equipment_delivered",
-                  "equipment_installed",
-                  "equipment_staff_trained",
-                ],
-                hospital
-              )}
+              <div>Equipment</div>
+              <div className="text-black">
+                {mapStatuses(
+                  [
+                    "equipment_ordered",
+                    "equipment_delivered",
+                    "equipment_installed",
+                    "equipment_staff_trained",
+                  ],
+                  hospital
+                )}
+              </div>
             </div>
             <div>
-              {mapStatuses(
-                [
-                  "tech_trained",
-                  "tech_hospital_registration",
-                  "tech_patient_management",
-                  "tech_tele_icu_live",
-                ],
-                hospital
-              )}
+              <div>Technology</div>
+              <div className="text-black">
+                {mapStatuses(
+                  [
+                    "tech_trained",
+                    "tech_hospital_registration",
+                    "tech_patient_management",
+                    "tech_tele_icu_live",
+                  ],
+                  hospital
+                )}
+              </div>
             </div>
           </div>
         </div>
         <div className="bg-primary-100">
           <div className="px-6 py-4">
             <span>Go Live on:</span>
-            <span className="text-xl ml-2 font-bold">{hospital.launch_date || "TBD"}</span>
+            <span className="text-xl ml-2 font-bold">
+              {hospital.launch_date || "TBD"}
+            </span>
           </div>
         </div>
       </div>
diff --git a/components/common/Footer.jsx b/components/common/Footer.jsx
index 2995c6d..b050dff 100644
--- a/components/common/Footer.jsx
+++ b/components/common/Footer.jsx
@@ -1,29 +1,57 @@
-import { FiFacebook, FiTwitter, FiYoutube } from 'react-icons/fi';
+import { FiFacebook, FiTwitter, FiYoutube } from "react-icons/fi";
 
 const Footer = () => {
-    return (
-        <footer className="flex flex-col items-center justify-center w-full border-t">
-            <div className="w-5/6 my-4 items-center lg:grid grid-cols-2">
-                <div className="text-center text-sm text-gray-500 lg:text-left">Copyright © 2021 10 Bed ICU - All Rights Reserved.</div>
-                <div className="flex justify-center space-x-4 pt-2 lg:justify-start lg:pt-0">
-                    <div><a href="https://www.facebook.com/10bedICU/"><FiFacebook size={"1.5em"}/></a></div>
-                    <div><a href="https://twitter.com/10BedICU"><FiTwitter size={"1.5em"}/></a></div>
-                    <div><a href="https://www.youtube.com/channel/UCJwsY5kpy2cWDGEL05fWMeA"><FiYoutube size={"1.5em"}/></a></div>
-                </div>
-            </div>
+  return (
+    <footer className="flex flex-col items-center justify-center w-full border-t p-2">
+      <div className="my-4 items-center justify-between w-full flex flex-col md:flex-row">
+        <div className="">
+          <ul className="flex flex-wrap justify-center space-x-4 text-gray-600">
+            <li className="hover:text-blue-500">
+              <a href="https://10bedicu.org/">Home</a>
+            </li>
+            <li className="hover:text-blue-500">
+              <a href="https://10bedicu.org/tech-platform">Tech Platform</a>
+            </li>
+            <li className="hover:text-blue-500">
+              <a href="https://10bedicu.org/media">Media</a>
+            </li>
+            <li className="hover:text-blue-500">
+              <a href="https://10bedicu.org/donate-now">Donate Now</a>
+            </li>
+            <li className="hover:text-blue-500">
+              <a href="https://10bedicu.org/deployment">Deployment</a>
+            </li>
+            <li className="hover:text-blue-500">
+              <a href="https://10bedicu.org/our-team">Our Team</a>
+            </li>
+          </ul>
+        </div>
+        <div className="flex justify-center space-x-4 pt-2 lg:justify-start lg:pt-0">
+          <div>
+            <a href="https://www.facebook.com/10bedICU/">
+              <FiFacebook size={"1.5em"} />
+            </a>
+          </div>
+          <div>
+            <a href="https://twitter.com/10BedICU">
+              <FiTwitter size={"1.5em"} />
+            </a>
+          </div>
+          <div>
+            <a href="https://www.youtube.com/channel/UCJwsY5kpy2cWDGEL05fWMeA">
+              <FiYoutube size={"1.5em"} />
+            </a>
+          </div>
+        </div>
+      </div>
 
-            <div className="my-2 mb-6 lg:mt-2">
-                <ul className="flex justify-center space-x-4 text-gray-600">
-                    <li className="hover:text-blue-500"><a href="https://10bedicu.org/">Home</a></li>
-                    <li className="hover:text-blue-500"><a href="https://10bedicu.org/tech-platform">Tech Platform</a></li>
-                    <li className="hover:text-blue-500"><a href="https://10bedicu.org/media">Media</a></li>
-                    <li className="hover:text-blue-500"><a href="https://10bedicu.org/donate-now">Donate Now</a></li>
-                    <li className="hover:text-blue-500"><a href="https://10bedicu.org/deployment">Deployment</a></li>
-                    <li className="hover:text-blue-500"><a href="https://10bedicu.org/our-team">Our Team</a></li>    
-                </ul>
-            </div>
-        </footer>
-    );
-}
+      <div className="my-2 mb-6 lg:mt-2">
+        <div className="text-center text-sm text-gray-500 lg:text-left">
+          Copyright © 2021 10 Bed ICU - All Rights Reserved.
+        </div>
+      </div>
+    </footer>
+  );
+};
 
-export default Footer;
\ No newline at end of file
+export default Footer;