diff --git a/package-lock.json b/package-lock.json
index 03cedc7..c5c1ef1 100644
--- a/package-lock.json
+++ b/package-lock.json
@@ -1,11 +1,11 @@
 {
-  "name": "smi-dashboard",
+  "name": "hpos-dashboard",
   "version": "0.1.0",
   "lockfileVersion": 2,
   "requires": true,
   "packages": {
     "": {
-      "name": "smi-dashboard",
+      "name": "hpos-dashboard",
       "version": "0.1.0",
       "dependencies": {
         "@testing-library/jest-dom": "^5.16.5",
@@ -16,6 +16,7 @@
         "firebase": "^9.23.0",
         "react": "^18.2.0",
         "react-dom": "^18.2.0",
+        "react-flip-numbers": "^3.0.8",
         "react-scripts": "5.0.1",
         "web-vitals": "^2.1.4"
       }
@@ -15825,6 +15826,19 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz",
       "integrity": "sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg=="
     },
+    "node_modules/react-flip-numbers": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/react-flip-numbers/-/react-flip-numbers-3.0.8.tgz",
+      "integrity": "sha512-iEh4WScZFiGYkIWw3ATA352+XVWBsiKLg97CQHGXvpBetJFYazaYWMqv/mR2fGHdoDLA/2uES74e2wdEgy69BQ==",
+      "dependencies": {
+        "react-simple-animate": "^3.0.1"
+      },
+      "peerDependencies": {
+        "react": "^16.8.0 || ^17 || ^18",
+        "react-dom": "^16.8.0 || ^17 || ^18",
+        "react-simple-animate": "^3.0.1"
+      }
+    },
     "node_modules/react-is": {
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
@@ -15910,6 +15924,14 @@
         }
       }
     },
+    "node_modules/react-simple-animate": {
+      "version": "3.5.2",
+      "resolved": "https://registry.npmjs.org/react-simple-animate/-/react-simple-animate-3.5.2.tgz",
+      "integrity": "sha512-xLE65euP920QMTOmv5haPlml+hmOPDkbIr5WeF7ADIXWBYt5kW/vwpNfWg8EKMab8aeDxIZ6QjffVh8v2dUyhg==",
+      "peerDependencies": {
+        "react-dom": "^16.8.0 || ^17 || ^18"
+      }
+    },
     "node_modules/read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
@@ -30025,6 +30047,14 @@
       "resolved": "https://registry.npmjs.org/react-error-overlay/-/react-error-overlay-6.0.11.tgz",
       "integrity": "sha512-/6UZ2qgEyH2aqzYZgQPxEnz33NJ2gNsnHA2o5+o4wW9bLM/JYQitNP9xPhsXwC08hMMovfGe/8retsdDsczPRg=="
     },
+    "react-flip-numbers": {
+      "version": "3.0.8",
+      "resolved": "https://registry.npmjs.org/react-flip-numbers/-/react-flip-numbers-3.0.8.tgz",
+      "integrity": "sha512-iEh4WScZFiGYkIWw3ATA352+XVWBsiKLg97CQHGXvpBetJFYazaYWMqv/mR2fGHdoDLA/2uES74e2wdEgy69BQ==",
+      "requires": {
+        "react-simple-animate": "^3.0.1"
+      }
+    },
     "react-is": {
       "version": "17.0.2",
       "resolved": "https://registry.npmjs.org/react-is/-/react-is-17.0.2.tgz",
@@ -30090,6 +30120,12 @@
         "workbox-webpack-plugin": "^6.4.1"
       }
     },
+    "react-simple-animate": {
+      "version": "3.5.2",
+      "resolved": "https://registry.npmjs.org/react-simple-animate/-/react-simple-animate-3.5.2.tgz",
+      "integrity": "sha512-xLE65euP920QMTOmv5haPlml+hmOPDkbIr5WeF7ADIXWBYt5kW/vwpNfWg8EKMab8aeDxIZ6QjffVh8v2dUyhg==",
+      "requires": {}
+    },
     "read-cache": {
       "version": "1.0.0",
       "resolved": "https://registry.npmjs.org/read-cache/-/read-cache-1.0.0.tgz",
diff --git a/package.json b/package.json
index 5f1967b..4a20cf9 100644
--- a/package.json
+++ b/package.json
@@ -11,6 +11,7 @@
     "firebase": "^9.23.0",
     "react": "^18.2.0",
     "react-dom": "^18.2.0",
+    "react-flip-numbers": "^3.0.8",
     "react-scripts": "5.0.1",
     "web-vitals": "^2.1.4"
   },
diff --git a/public/manifest.json b/public/manifest.json
index 080d6c7..caa9baa 100644
--- a/public/manifest.json
+++ b/public/manifest.json
@@ -1,19 +1,19 @@
 {
-  "short_name": "React App",
-  "name": "Create React App Sample",
+  "short_name": "HPOS Dashboard",
+  "name": "HPOS Sickel Cell Test Dashboard",
   "icons": [
     {
-      "src": "favicon.ico",
+      "src": "logo.png",
       "sizes": "64x64 32x32 24x24 16x16",
       "type": "image/x-icon"
     },
     {
-      "src": "logo192.png",
+      "src": "logo.png",
       "type": "image/png",
       "sizes": "192x192"
     },
     {
-      "src": "logo512.png",
+      "src": "logo.png",
       "type": "image/png",
       "sizes": "512x512"
     }
diff --git a/src/App.css b/src/App.css
index 4a22498..fe388ae 100644
--- a/src/App.css
+++ b/src/App.css
@@ -37,16 +37,23 @@ body {
 }
 
 .dashboard-title {
+  width: 100%;
   font-family: Arial Black;
   text-align: center;
   align-self: center;
+  justify-content: center;
+  align-items: center;
+  display: inline-flex;
+  flex-direction: row;
   font-size: xx-large;
   background-color: rgb(215, 192, 252);
 }
 
 .last-update {
+  width: 100%;
   font-size: small;
   text-align: end;
+  font-weight: 500;
 }
 
 .developer {
@@ -62,6 +69,28 @@ body {
   width: 1em;
 }
 
+.gov-logo {
+  width: 1em;
+}
+
+.title-text {
+  margin: 0 1em 0 1em;
+  font-size: medium;
+}
+
+.numeric-card {
+  height: 30vh;
+  width: 28vw;
+  padding: 20px;
+  box-shadow: 5px 10px 8px 10px #888888;
+  border-radius: 15px;
+  margin: 20px;
+  justify-content: center;
+  display: flex;
+  flex-direction: column;
+  align-items: center;
+}
+
 @media screen and (min-width: 320px) {
   .numeric-card {
     height: 200px;
@@ -172,7 +201,7 @@ body {
 
   .card-title {
     color: black;
-    font-size: 1em;
+    font-size: 2em;
     font-weight: 600;
     font-family: sans-serif;
   }
@@ -201,6 +230,10 @@ body {
     font-size: xx-large;
     background-color: rgb(215, 192, 252);
   }
+
+  .title-text {
+    font-size: x-large;
+  }
 }
 
 @media screen and (min-width: 1200px) {
@@ -219,14 +252,14 @@ body {
 
   .card-title {
     color: black;
-    font-size: 1em;
+    font-size: 2em;
     font-weight: 600;
     font-family: sans-serif;
   }
 
   .card-data {
     color: black;
-    font-size: 4em;
+    font-size: 6em;
     font-family: sans-serif;
   }
 
@@ -243,17 +276,30 @@ body {
   }
 
   .dashboard-title {
+    height: 10vh;
     text-align: center;
     align-self: center;
     font-size: xx-large;
     background-color: rgb(215, 192, 252);
   }
+
+  .title-text {
+    font-size: xx-large;
+  }
+
+  .nscm-logo {
+    width: 2.5em;
+  }
+  
+  .gov-logo {
+    width: 2.5em;
+  }
 }
 
 @media screen and (min-width: 2560px) {
   .numeric-card {
-    height: 200px;
-    width: 300px;
+    height: 30vh;
+    width: 28vw;
     padding: 20px;
     box-shadow: 5px 10px 8px 10px #888888;
     border-radius: 15px;
@@ -266,14 +312,14 @@ body {
 
   .card-title {
     color: black;
-    font-size: 1em;
+    font-size: 6em;
     font-weight: 600;
     font-family: sans-serif;
   }
 
   .card-data {
     color: black;
-    font-size: 4em;
+    font-size: 18em;
     font-family: sans-serif;
   }
 
@@ -292,9 +338,20 @@ body {
   .dashboard-title {
     text-align: center;
     align-self: center;
-    font-size: xx-large;
     background-color: rgb(215, 192, 252);
   }
+
+  .title-text {
+    font-size: 2vw;
+  }
+
+  .nscm-logo {
+    width: 5em;
+  }
+  
+  .gov-logo {
+    width: 5em;
+  }
 }
 
 div.chart {
diff --git a/src/App.js b/src/App.js
index 0985b82..0841d77 100644
--- a/src/App.js
+++ b/src/App.js
@@ -1,10 +1,6 @@
 import logo from './logo.png';
 import './App.css';
 import React, { useEffect, useState } from 'react';
-import BarChart from './BarChart';
-import TestResultChart from './TestResultChart';
-import GenderChart from './GenderChart';
-import RegistraionChart from './RegistraionChart';
 
 import { initializeApp } from "firebase/app";
 import { getAnalytics } from "firebase/analytics";
@@ -84,7 +80,7 @@ function App() {
       setPositives(traitCount + diseaseCount);
       setTraits(traitCount);
       setDiseases(diseaseCount);
-      setLastUpdate(lastUpdate);
+      setLastUpdate(Date.now());
     });
   }, []);
 
@@ -104,10 +100,13 @@ function App() {
   return (
     <div>
       <div class='dashboard-title'>
-        <img className="nscm-logo" src={require('./logo_nobg.png')} /> HPOS Sickel Cell Test Dashboard
+        <img className="nscm-logo" src={require('./logo_nobg.png')} />
+         <div className='title-text'>HPOS Sickel Cell Test Dashboard</div>
+         <img className="gov-logo" src={require('./gov_logo2.png')} />
+        <img className="gov-logo" src={require('./gov_logo3.png')} />
       </div>
       <div className='last-update'>
-        Updated At: {Date(lastUpdate).toString()}
+        Updated At: {Date(lastUpdate).toLocaleString()}
       </div>
       <div className='cards-container'>
         <div className='cards-row'>
diff --git a/src/gov_logo2.png b/src/gov_logo2.png
new file mode 100644
index 0000000..2e55fa9
Binary files /dev/null and b/src/gov_logo2.png differ
diff --git a/src/gov_logo3.png b/src/gov_logo3.png
new file mode 100644
index 0000000..3e286f5
Binary files /dev/null and b/src/gov_logo3.png differ