diff --git a/_layouts/docs.html b/_layouts/docs.html
index 92912c2a..309f6fee 100755
--- a/_layouts/docs.html
+++ b/_layouts/docs.html
@@ -102,8 +102,6 @@
         add({{ document.title | jsonify }}, {{document.url | jsonify }}, {% if document.indent == true %}true{% else %}false{% endif %}, {% if document.url == page.url %}true{% else %}false{% endif %});
     {% endfor %}
 
-        console.log('menu', menu);
-
         function getEntry(item) {
             var itemDom = document.createElement('li');
 
@@ -116,6 +114,36 @@
 
             return itemDom;
         }
+
+        function addArrow(itemDom) {
+            var arrowDom = document.createElement('a');
+            arrowDom.classList.add('arrow');
+            arrowDom.onclick = function(itemDom) {
+                return function () {
+                    var fullHeight = 59 + 16 + itemDom.lastChild.clientHeight + 'px';
+                    itemDom.classList.toggle('open');
+                    if (itemDom.classList.contains('open')) {
+                        itemDom.style.height = fullHeight;
+                    } else {
+                        if (itemDom.style.height === 'auto') {
+                            itemDom.style.height = fullHeight;
+                        }
+                        setTimeout(function () { itemDom.style.height = '59px'; }, 10);
+                    }
+                    window.itemDom = itemDom;
+
+                    return false;
+                };
+            }(itemDom);
+            itemDom.appendChild(arrowDom);
+
+            if ((item.current && item.children) || item.childCurrent) {
+                itemDom.classList.add('open');
+                itemDom.style.height = 'auto';
+            } else {
+                itemDom.style.height = '59px';
+            }
+        }
         
         var menuDom = document.getElementById('docs-ul');
         for (var i = 0; i < menu.length; i++) {
@@ -127,6 +155,7 @@
             }
             
             if (item.children) {
+                addArrow(itemDom);
                 itemDom.classList.add('children');
                 var children = document.createElement('ul');
                 for (var j = 0; j < item.children.length; j++) {
diff --git a/css/docs.scss b/css/docs.scss
index afcae3f0..63d4a440 100644
--- a/css/docs.scss
+++ b/css/docs.scss
@@ -12,20 +12,29 @@ a:hover {
   text-decoration: none;
 }
 
+ul {
+  list-style-type: square;
+
+  ul {
+    list-style-type: disc;
+  }
+}
+
 h1,
 h2,
 h3,
 h4,
 h5,
 h6 {
-  font-family: Avenir;
-  font-weight: 900;
+  font-family: $header-font;
+  font-weight: normal;
 }
 
 h1 {
   font-size: 32px;
-  line-height: 0.81;
+  line-height: 1.2;
   margin-top: 50px;
+  font-weight: 900;
 }
 
 h2 {
@@ -50,7 +59,7 @@ select {
   -moz-appearance: none;
   appearance: none;
   color: #505a72;
-  font-family: Avenir-Roman;
+  font-family: $body-font;
   font-size: 14px;
   background-image: url(/images/arrow-down.svg);
   background-repeat: no-repeat;
@@ -77,7 +86,7 @@ a {
 }
 
 p {
-  font-family: Avenir-Roman;
+  font-family: $body-font;
   font-size: 14px;
   line-height: 1.79;
 }
@@ -152,6 +161,7 @@ pre > code {
     line-height: 40px;
     margin: 0;
     display: inline-block;
+    font-weight: normal;
   }
 
   .versions {
@@ -169,7 +179,7 @@ pre > code {
 
       & > div::after {
         content: "Latest";
-        font-family: Avenir-Roman;
+        font-family: $body-font;
         font-size: 14px;
         line-height: 1.79;
         color: #505a72;
@@ -206,6 +216,11 @@ pre > code {
     position: sticky;
     padding-top: 30px;
     margin-bottom: 20px;
+
+    & > li {
+      transition: height 0.3s ease-in-out;
+      overflow: hidden;
+    }
   }
 
   ul {
@@ -215,7 +230,7 @@ pre > code {
 
     li {
       padding-left: 0px;
-      font-family: Avenir-Roman;
+      font-family: $body-font;
       font-size: 18px;
       line-height: 3.22;
       color: #505a72;
@@ -231,13 +246,30 @@ pre > code {
 
       a {
         color: #505a72;
-        display: block;
+        display: inline-block;
       }
 
-      &.children > a {
-        background-image: url(/images/arrow-up.svg);
+      & > a.arrow {
+        background-image: url(/images/arrow-down.svg);
         background-repeat: no-repeat;
-        background-position: right 15px center;
+        background-position: center;
+        width: 20px;
+        height: 20px;
+        float: right;
+        margin-top: 18px;
+        margin-right: 8px;
+        display: none;
+        cursor: pointer;
+        transition: transform 0.3s ease-in-out;
+      }
+
+      &.open > a.arrow {
+        // background-image: url(/images/arrow-up.svg);
+        transform: rotateX(180deg);
+      }
+
+      &.children > a.arrow {
+        display: inline-block;
       }
 
       ul {
@@ -255,7 +287,7 @@ pre > code {
 
 #edit {
   float: right;
-  font-family: Avenir-Roman;
+  font-family: $body-font;
   font-size: 14px;
   line-height: 1.79;
   color: #3bbdc4;
@@ -282,15 +314,18 @@ pre > code {
 
 .alert {
   padding: 20px;
-  color: white;
   margin-bottom: 15px;
   margin-top: 100px;
+  border-radius: 4px;
+  border: 1px solid #000;
 
   &.master {
-    background-color: #f44336;
+    border-color: #f44336;
+    color: #f44336;
   }
 
   &.old {
-    background-color: #2196f3;
+    border-color: #2196f3;
+    color: #2196f3;
   }
 }
diff --git a/css/index.scss b/css/index.scss
index 5b271ae6..4abef28f 100644
--- a/css/index.scss
+++ b/css/index.scss
@@ -24,7 +24,8 @@
     align-items: center;
 
     h1 {
-      line-height: 1.15;
+      line-height: 1.2;
+      font-weight: 900;
     }
 
     p {
@@ -54,6 +55,7 @@
 
   h2 {
     margin-top: 100px;
+    font-weight: 900;
   }
 
   a {
@@ -103,6 +105,7 @@
   h2 {
     margin-top: 55px;
     margin-bottom: 30px;
+    font-weight: 900;
   }
 
   img {
@@ -138,6 +141,7 @@
   h2 {
     margin-top: 100px;
     margin-bottom: 30px;
+    font-weight: 900;
   }
 
   p {
@@ -163,14 +167,6 @@
       line-height: 1.56;
       margin-bottom: 20px;
     }
-
-    // @media (max-width: $md-width) {
-    //   padding: 60px 40px 90px;
-    // }
-
-    // @media (max-width: $sm-width) {
-    //   padding: 60px 20px 60px;
-    // }
   }
 }
 
@@ -200,6 +196,7 @@
   h2 {
     margin-bottom: 35px;
     line-height: 1.25;
+    font-weight: 900;
   }
 
   p {
@@ -226,6 +223,7 @@
       line-height: 1.67;
       margin-top: 50px;
       margin-bottom: 35px;
+      font-weight: 900;
     }
 
     p {
@@ -261,6 +259,7 @@
     line-height: 1;
     margin-top: 100px;
     margin-bottom: 40px;
+    font-weight: 900;
   }
 
   p {
diff --git a/css/main.scss b/css/main.scss
index 111cee28..8e6ad576 100644
--- a/css/main.scss
+++ b/css/main.scss
@@ -29,12 +29,19 @@
   font-style: normal;
 }
 
+@font-face {
+  font-family: $header-font;
+  src: url("../fonts/Avenir-Heavy.woff") format("woff");
+  font-weight: normal;
+  font-style: normal;
+}
+
 h1,
 h2,
 h3,
 h4 {
   font-family: $header-font;
-  font-weight: 900;
+  font-weight: normal;
 }
 
 h1 {
@@ -108,7 +115,7 @@ body {
   background-color: $dark-background-color;
   clear: both;
   padding: 30px 0;
-  $header-height: 40px;
+  $header-height: 34px;
   height: $header-height;
 
   & > div {
@@ -121,6 +128,10 @@ body {
     display: block;
   }
 
+  .logo img {
+    height: $header-height;
+  }
+
   .hamburger-controls {
     position: absolute;
     right: 30px;
diff --git a/fonts/Avenir-Heavy.woff b/fonts/Avenir-Heavy.woff
new file mode 100644
index 00000000..d58d6a20
Binary files /dev/null and b/fonts/Avenir-Heavy.woff differ
diff --git a/index.html b/index.html
index 0cdf9e97..17d00e1b 100644
--- a/index.html
+++ b/index.html
@@ -104,7 +104,7 @@ stylesheet: index
         </p>
       </div>
       <div class="col-4_md-6_sm-12 feature">
-        <h3>Advanced Workload scheduling.</h3>
+        <h3>Advanced workload scheduling.</h3>
         <p>
           Crossplane includes an extensible workload scheduler that can factor
           availability, reliability, cost, and performance while deploying workloads and
@@ -190,7 +190,7 @@ stylesheet: index
         <div class="signature">
           <div class="name">Sid Sijbrandij</div>
           <div class="title">CEO and Co-Founder of GitLab</div>
-          <img src="/images/gitlab.svg" />
+          <a href="https://gitlab.com"><img src="/images/gitlab.svg" /></a>
         </div>
       </div>
       <div class="testimonial col-4_md-6_sm-12">
@@ -199,7 +199,7 @@ stylesheet: index
           <div class="signature">
             <div class="name">Spencer Kimball</div>
             <div class="title">CEO and Founder of Cockroach Labs</div>
-            <img src="/images/cockroachlabs.svg" />
+            <a href="https://www.cockroachlabs.com/"><img src="/images/cockroachlabs.svg" /></a>
           </div>
         </div>
         <div class="testimonial col-4_md-6_sm-12">
@@ -208,7 +208,7 @@ stylesheet: index
             <div class="signature">
               <div class="name">Bassam Tabbara</div>
               <div class="title">CEO and Founder of Upbound</div>
-              <img src="/images/upbound.svg" />
+              <a href="https://upbound.io"><img src="/images/upbound.svg" /></a>
             </div>
           </div>
     </div>