diff --git a/src/components/Hero.vue b/src/components/Hero.vue
index 0f975ff..4a353c1 100644
--- a/src/components/Hero.vue
+++ b/src/components/Hero.vue
@@ -42,7 +42,9 @@ export default {
 }
 
 #tagline {
-  font-size: 32px;
+  font-size: 40px;
+  margin-bottom: 20px;
+  text-align: center;
 }
 
 .hero-copy {
@@ -55,6 +57,9 @@ export default {
   align-items: center;
   flex-wrap: wrap;
   margin: 20px 0;
+  max-width: 900px;
+  margin-left: auto;
+  margin-right: auto;
 }
 
 #description {
diff --git a/src/components/PromiseCard.vue b/src/components/PromiseCard.vue
index 284231a..5c00cc7 100644
--- a/src/components/PromiseCard.vue
+++ b/src/components/PromiseCard.vue
@@ -41,10 +41,13 @@ a {
   color: white;
   position: relative;
   margin: 10px auto;
+  border-radius: 8px;
+  padding: 15px;
+  transition: box-shadow 0.3s;
 }
 
 .promise-card:hover {
-  box-shadow: 1px 2px 13px 0px rgb(132, 131, 131);
+  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
 }
 
 header {
diff --git a/src/components/PromiseStats.vue b/src/components/PromiseStats.vue
index 6df339b..cc9c9bc 100644
--- a/src/components/PromiseStats.vue
+++ b/src/components/PromiseStats.vue
@@ -2,18 +2,18 @@
     <el-card id="Promise_stats" header="Promise Statistics">
       <h2>{{ totalPromises }} promise {{ totalPromises === 1 ? '' : 's' }} made</h2>
       <el-row v-for="(value, key) in stats" :key="key">
-          <el-col :span="14">
+          <el-col :span="8">
             {{ key }}
           </el-col>
-          <!-- <el-col :span="8">
+          <el-col :span="10">
             <el-progress
               :show-text="false"
               :stroke-width="10"
               color="darkslategrey"
-              :percentage="Math.round( (value/totalPromises)*100 )">
-            </el-progress>
-          </el-col> -->
-          <el-col :span="10">
+              :percentage="Math.round((value/totalPromises)*100)"
+            />
+          </el-col>
+          <el-col :span="6">
             <b>{{ value }}</b>
           </el-col>
 
diff --git a/src/views/Home.vue b/src/views/Home.vue
index b38ef82..ec25f73 100644
--- a/src/views/Home.vue
+++ b/src/views/Home.vue
@@ -59,7 +59,8 @@ main {
   margin: 0 auto;
   padding: 40px;
   border-radius: 10px;
-  background: #d9edf7;
+  background: linear-gradient(135deg, #d9edf7, #fff);
+  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
 }
 
 .el-button {