diff --git a/src/components/Locations.css b/src/components/Locations.css
new file mode 100644
index 0000000..a81c4da
--- /dev/null
+++ b/src/components/Locations.css
@@ -0,0 +1,10 @@
+.locations-card {
+    width: 40vw;
+    height: 45vh;
+    background-color: white;
+    margin: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
+ }
\ No newline at end of file
diff --git a/src/components/Locations.js b/src/components/Locations.js
new file mode 100644
index 0000000..0c09582
--- /dev/null
+++ b/src/components/Locations.js
@@ -0,0 +1,14 @@
+import React from 'react';
+
+import WorldMap from './WorldMap';
+import './Locations.css';
+
+function Locations({ show }) {
+
+    return (
+        <div className='locations-card'>
+            <WorldMap show={show} />
+        </div>
+    );
+}
+export default Locations;
\ No newline at end of file
diff --git a/src/components/TestAnalytics.js b/src/components/TestAnalytics.js
index 002a151..87b7216 100644
--- a/src/components/TestAnalytics.js
+++ b/src/components/TestAnalytics.js
@@ -8,7 +8,7 @@ import db from '../firebase';
 import './TestAnalytics.css';
 import TestAnalyticsGraph from './TestAnalyticsGraph';
 import TestAnalyticsPie from './TestAnalyticsPie';
-import WorldMap from './WorldMap';
+import Locations from './Locations';
 
 const styles = {
     menuList: (base) => ({
@@ -116,7 +116,8 @@ const TestAnalytics = () => {
                 {dailyResults && <TestAnalyticsGraph data={dailyResults} />}
             </div>
             <div className='container'>
-                <WorldMap />
+                <Locations />
+                <Locations />
             </div>
 
         </div>
diff --git a/src/components/TestAnalyticsGraph.css b/src/components/TestAnalyticsGraph.css
index 80e1a3d..27e950d 100644
--- a/src/components/TestAnalyticsGraph.css
+++ b/src/components/TestAnalyticsGraph.css
@@ -9,12 +9,17 @@
     height: 45vh;
     background-color: white;
     margin: 10px;
+    display: flex;
+    align-items: center;
+    justify-content: center;
+    flex-direction: column;
  }
 
  .graph-title {
     text-align: center;
     font-weight: 600;
-    padding: 15px;
+    padding: 5px;
+    bottom: -10;
  }
 
  .axis-grid line {
diff --git a/src/components/TestAnalyticsGraph.js b/src/components/TestAnalyticsGraph.js
index a0b282e..9321a5c 100644
--- a/src/components/TestAnalyticsGraph.js
+++ b/src/components/TestAnalyticsGraph.js
@@ -20,7 +20,7 @@ class TestAnalyticsGraph extends Component {
 
         data.reverse();
 
-        var margin = { top: 20, right: 20, bottom: 30, left: 50 },
+        var margin = { top: 60, right: 20, bottom: 30, left: 50 },
             width = 450 - margin.left - margin.right,
             height = 200 - margin.top - margin.bottom;
 
diff --git a/src/components/TestAnalyticsPie.css b/src/components/TestAnalyticsPie.css
index 4a30da5..6e12e8d 100644
--- a/src/components/TestAnalyticsPie.css
+++ b/src/components/TestAnalyticsPie.css
@@ -8,14 +8,12 @@
     width: 40vw;
     height: 45vh;
     background-color: white;
-    margin: 10px;
  }
 
  .graph-title {
     text-align: center;
     font-weight: 600;
     padding: 15px;
-    top: -10;
  }
 
  .title {