diff --git a/static/scripts/functions.js b/static/scripts/functions.js
index f3ca302022f35bbcb8098abe08b95daa85d5a585..318dffc01035dbba64e73d60d6fa779ff15518d0 100644
--- a/static/scripts/functions.js
+++ b/static/scripts/functions.js
@@ -71,8 +71,9 @@ function countTo(start, end, element, withPercent, intervalLength){
 /* HOME PAGE */
 
 if (window.location.href.endsWith("mit/") || window.location.href.indexOf("index") > -1) {
-    document.querySelector('header').style.height = '50vh'
-    document.querySelector('.header-title').style.font_size = 'calc(2.5*(1.475rem + 2.7vw))'
+    document.querySelector('#home-header-container').style.height = '50vh'
+    document.querySelector('#home-header').style.font_size = 'calc(2.5*(1.475rem + 2.7vw))'
+    document.querySelector('#home-lead').style.color = '#fff'
     
     setTimeout(function() {
         // count up/down for statistics and set intervals to end at same time
diff --git a/static/style.css b/static/style.css
index 3f561f4f86d534574a003ae21fcae77b2e4e1e79..9ae5aa0df84be89287812cce1a613d57884aae46 100644
--- a/static/style.css
+++ b/static/style.css
@@ -32,7 +32,7 @@ h1, .gradient-header {
 }
 
 .header-title {
-  animation: animated-gradient 8s infinite alternate-reverse;   
+  animation: animated-gradient 8s infinite alternate-reverse;  
 }
 
 .subheader-title {
@@ -41,11 +41,28 @@ h1, .gradient-header {
   margin-left:6px
 }
 
-header {
+#home-header-container {
+  height:100vh;
   transition-property: height;
   transition-duration: 1s;
   transition-timing-function: ease-in-out;
-  transition-delay: 1.1s;
+  transition-delay: 2s;
+}
+
+#home-header {
+  font-size: calc(3*(1.475rem + 2.7vw));
+  transition-property: font-size;
+  transition-duration: 1s;
+  transition-timing-function: ease-in-out;
+  transition-delay: 2s;
+}
+
+#home-lead {
+  color:rgba(255, 255, 255, 0);
+  transition-property: color;
+  transition-duration: 1s;
+  transition-timing-function: ease-in-out;
+  transition-delay: 0.8s;
 }
 
 /* body */
diff --git a/wiki/pages/home.html b/wiki/pages/home.html
index 122cf666bc6814bfd89ce2e630a61948e6d460e5..0f103887663141284d7e5a865f96fb42722142ee 100644
--- a/wiki/pages/home.html
+++ b/wiki/pages/home.html
@@ -1,7 +1,15 @@
 {% extends "layout.html" %}
 
-{% block title %}CAR-P Diem{% endblock %}
-{% block lead %}<b>Fighting cancer cachexia with engineered macrophages.</b>{% endblock %}
+<header id='home-header-container' class="bg-hero py-5 mb-5">
+  <div class="container h-100">
+    <div class="row h-100 align-items-center">
+      <div class="col-lg-12">
+        <h1 id='home-header' class="display-4 header-title mt-5 mb-2">CAR-P Diem</h1>
+        <p id='home-lead' class="lead mb-5 subheader-title">Fighting cancer cachexia with engineered macrophages.</p>
+      </div>
+    </div>
+  </div>
+</header> 
 
 {% block page_content %}