diff --git a/_includes/footer.html b/_includes/footer.html
index 22a764b8..c4a79c8d 100644
--- a/_includes/footer.html
+++ b/_includes/footer.html
@@ -1,33 +1,22 @@
 <footer>
-  <div class="footer-root container-sm">
-    <section class="footer-section" style="flex-grow: 0;">
-      <img src="assets/images/grin_mw_logo.svg" class="grin-logo-footer" alt="Description">
-    </section>
-    <section class="footer-section">
-      <strong><h4>Grin</h4></strong>
-      <div><a href="https://github.com/mimblewimble/grin/releases">Github</a></div>
-      <div><a href="https://download.wpsoftware.net/bitcoin/wizardry/mimblewimble.txt">Original Whitepaper</a></div>
-      <div><a href="https://download.wpsoftware.net/bitcoin/wizardry/mimblewimble.pdf">Andrew Poelstra's Whitepaper</a></div>
-      <div><a href="https://github.com/mimblewimble/grin/blob/master/SECURITY.md">Security and vulnerability policy</a></div>
-      <div><a href="/friends">Friends of Grin</a></div>
-      <div><a href="/visual">Logos</a></div>
-    </section>
-    <section class="footer-section">
-      <strong><h4>The Rabbit hole</h4></strong>
-      <div><a href="https://github.com/mimblewimble/grin/blob/master/doc/intro.md">Grin Introduction</a></div>
-      <div><a href="https://github.com/mimblewimble/grin/blob/master/doc/pow/pow.md">Cuckoo cycle</a></div>
-      <div><a href="https://github.com/mimblewimble/grin/blob/master/doc/grin4bitcoiners.md">Grin for Bitcoiners</a></div>
-    </section>
-    <section class="footer-section" style="flex-grow: 6;">
-      <strong><h4>Community</h4></strong>
-      <div><a href="https://gitter.im/grin_community/Lobby">Gitter</a></div>
-      <div><a href="https://grinnews.substack.com/">News</a></div>
-      <div><a href="https://www.grin-forum.org/">Forum</a></div>
-      <div><a href="https://twitter.com/grincouncil">Twitter</a></div>
-      <div><a href="https://launchpad.net/~mimblewimble">Mailing List</a></div>
-      <div><a href="https://github.com/mimblewimble/docs/wiki/News-and-Channels#communities">Community Groups</a></div>
-      <div><a href="https://github.com/mimblewimble/docs/wiki/Events">Community Events</a></div>
-      <div><a href="/page-contribution-howto">Improve this website</a></div>
-    </section>
+  <div class="footer-content">
+    <p>Grin was launched on January 15th, 2019.
+      It's very young and experimental. Use at your own risk!
+
+      <strong>Whitepapers</strong>
+      MimbleWimble, Tom Elvis Jedusor @ 19 July, 2016.
+      MimbleWimble, Andrew Poelstra @ e9f45ec.
+
+      Security and vulnerability policy
+
+      <a href="https://grin-tech.org">https://grin-tech.org</a>
+    </p>
+    <div class="footer-links">
+      <a href="https://grin-forum.org">Forum</a>
+      <a href="https://gitter.im/grin_community/Lobby">Gitter</a>
+      <a href="https://grinnews.substack.com/">News</a>
+      <a href="https://twitter.com/grinmw">Twitter</a>
+      <a href="https://github.com/mimblewimble/grin">Github</a>
+    </div>
   </div>
 </footer>
diff --git a/_includes/navigation.html b/_includes/navigation.html
index b71eba74..541c8623 100644
--- a/_includes/navigation.html
+++ b/_includes/navigation.html
@@ -1,107 +1,21 @@
 <nav>
-  <ul class="nav-logo">
-    <li><a href="/">Grin</a></li>
-  </ul>
-  <ul class="nav-root">
-    <li>
-      <a href="https://github.com/mimblewimble/grin/releases">Releases</a>
-    </li>
-    <li>
-      <a href="https://github.com/mimblewimble/docs/wiki">Wiki</a>
-    </li>
-    <li>
-      <span class="dropdown" href="https://www.grin-forum.org/">
-        Community
-        <nav>
-          <span class="dropdown-heading">Everyone.</span>
-          <a href="https://grinnews.substack.com/">News</a>
-          <a href="https://www.grin-forum.org/">Forum</a>
-          <a href="https://gitter.im/grin_community/Lobby">Chat</a>
-        </nav>
-      </span>
-    </li>
-    <li>
-      <span class="dropdown" href="https://www.grin-forum.org/">
-        Guides
-        <nav>
-          <span class="dropdown-heading">Learn to use Grin</span>
-          <a href="https://github.com/mimblewimble/docs/wiki/how-to-run-a-grin-node">Running a node</code></a>
-          <a href="https://github.com/mimblewimble/docs/wiki/how-to-use-the-grin-wallet">Using the wallet</a>
-          <a href="https://github.com/mimblewimble/docs/wiki/how-to-mine-grin">Running a miner</a>
-        </nav>
-      </span>
-    </li>
-    <li>
-      <span class="dropdown" href="https://www.grin-forum.org/">
-        Learn more
-        <nav>
-          <span class="dropdown-heading">The Rabbit hole</span>
-          <a href="https://github.com/mimblewimble/grin/blob/master/doc/intro.md">Grin Introduction</a>
-          <a href="https://github.com/mimblewimble/grin/blob/master/doc/pow/pow.md">Cuckoo cycle</a>
-          <a href="https://github.com/mimblewimble/grin/blob/master/doc/grin4bitcoiners.md">Grin for Bitcoiners</a>
-          <a href="https://github.com/mimblewimble/docs/wiki/Grin-Privacy-Primer">Privacy in Grin</a>
-          <a href="https://github.com/mimblewimble/docs/wiki/Monetary-Policy">Monetary Policy</a>
-          <a href="https://github.com/mimblewimble/docs/wiki/Community-projects">Community projects</a>
-          <a href="funding">Community funding</a>
-          <a href="friends">Friends of Grin</a>
-        </nav>
-      </span>
-    </li>
-    <!-- <li><a href="/dev">Documentation</a></li> -->
+  <div class="nav-logo">
+    <a href="." id="grin-logo">
+      <svg id="grin-logo-bare" width="61" height="61" viewBox="0 0 61 61" fill="none" xmlns="http://www.w3.org/2000/svg">
+        <path d="M43.341 20.2793C42.6915 18.8211 42.0862 15.94 40.4204 15.2994C38.2758 14.4747 36.9501 19.8734 36.6342 21.2375H36.3149C35.7742 18.9002 35.0485 15.5878 32.4824 14.85C31.2943 19.8399 33.7235 25.2229 35.9955 29.5411C38.4215 28.3818 39.6035 24.7512 39.8279 22.1956H40.1473L42.7023 29.8605C44.7578 29.2697 45.4729 27.2356 46.2151 25.3893C47.8084 21.4265 49.1453 16.5529 48.1317 12.295C45.0641 13.1637 44.1309 17.5503 43.341 20.2793ZM12.6813 30.4993C15.4263 29.1886 16.7325 25.0399 17.1525 22.1956H17.4719C17.7967 23.5666 18.665 27.1037 20.3781 27.3307C22.5607 27.6195 23.7051 22.7765 23.8593 21.2375H24.1787C24.8746 23.642 25.6079 26.769 28.0112 27.9443C28.8978 24.2204 27.8361 20.249 26.4744 16.7662C26.1243 15.8707 25.4054 13.4562 24.1707 13.4562C22.1478 13.4562 21.0105 18.7885 20.6656 20.2793H20.3462L17.7913 12.6144C13.297 14.7605 10.8557 26.1727 12.6813 30.4993ZM7.89066 34.3317C11.2259 48.8795 26.6098 57.1266 40.4667 50.9832C45.5099 48.7472 49.5104 44.7634 51.8169 39.7611C52.4128 38.4686 53.5834 36.1291 52.9008 34.4333C52.2212 32.7441 45.6297 35.5041 43.9827 36.225C43.7514 36.3278 43.5883 36.5411 43.5503 36.7915C43.4963 37.1457 43.5921 37.5066 43.8153 37.7874C44.0383 38.0681 44.3682 38.2431 44.7256 38.2706C45.9331 38.3635 47.4929 38.4836 47.4929 38.4836C42.4829 48.1813 28.9371 52.4692 19.3881 44.7215C17.2509 42.9877 15.3442 40.9274 14.061 38.4836C13.4404 37.3019 12.8649 35.7906 11.81 34.9797C10.7966 34.2004 9.25919 33.9335 7.89066 34.3317Z" fill="white" />
+      </svg>
+    </a>
+  </div>
+  <ul class="nav-list">
+    <li><a href="community">Community</a></li>
+    <li><a href="friends">Friends of Grin</a></li>
+    <li><a href="fund">General Fund</a></li>
+    <li><a href="https://github.com/mimblewimble/grin">GitHub</a></li>
   </ul>
-  <ul class="nav-hamburger">
-    <button class="hamburger" type="button">
-      <span class="hamburger-box">
-        <span class="hamburger-inner"></span>
-      </span>
+  <div id="hamburger" class="nav-hamburger">
+    <button class="nav-hamburger-btn">
+      <div class="nav-hamburger-line first"></div>
+      <div class="nav-hamburger-line second"></div>
     </button>
-  </ul>
-  <div>
   </div>
-  <ul class="nav-mobile">
-    <div class="nav-mobile-fade">
-      <span class="nav-mobile-heading">Grin</span>
-      <li>
-        <a href="/">Home</a>
-      </li>
-      <li>
-        <a href="https://github.com/mimblewimble/grin/blob/master/doc/intro.md">Introduction</a>
-      </li>
-      <li>
-        <a href="https://github.com/mimblewimble/grin/releases">Releases</a>
-      </li>
-      <li>
-        <a href="https://github.com/mimblewimble/docs/wiki">Wiki</a>
-      </li>
-      <li>
-        <a href="https://www.grin-forum.org/">Forum</a>
-      </li>
-      <span class="nav-mobile-heading">Guides</span>
-      <li>
-        <a href="https://github.com/mimblewimble/grin/blob/master/doc/build.md">Setup Grin</a>
-      </li>
-      <li>
-        <a href="https://github.com/mimblewimble/grin-miner/blob/master/README.md">Setup Grin Miner</a>
-      </li>
-      <span class="nav-mobile-heading">Learn more</span>
-      <li>
-        <a href="https://github.com/mimblewimble/grin/blob/master/doc/intro.md">Grin Introduction</a>
-      </li>
-      <li>
-        <a href="https://github.com/mimblewimble/grin/blob/master/doc/pow/pow.md">Cuckoo cycle</a>
-      </li>
-      <li>
-        <a href="https://github.com/mimblewimble/grin/blob/master/doc/grin4bitcoiners.md">Grin for Bitcoiners</a>
-      </li>
-      <li>
-        <a href="/friends">Friends of Grin</a>
-      </li>
-      <li>
-        <a href="https://github.com/mimblewimble/docs/wiki/Community-projects">Community projects</a>
-      </li>
-      <li>
-        <a href="/funding">Community funding</a>
-      </li>
-    </div>
-  </ul>
 </nav>
diff --git a/_layouts/default-black.html b/_layouts/default-black.html
new file mode 100644
index 00000000..1a7aad89
--- /dev/null
+++ b/_layouts/default-black.html
@@ -0,0 +1,66 @@
+<!DOCTYPE html>
+<html lang="en">
+  <head>
+    <title>{{ site.title }}</title>
+    <meta content='text/html; charset=utf-8' http-equiv='Content-Type'>
+    <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
+
+    <!-- GoogleFonts -->
+    <link href="https://fonts.googleapis.com/css?family=Space+Mono|Work+Sans:400,700,800,900&display=swap" rel="stylesheet">
+
+    <!-- Font Awesome -->
+    <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.2/css/all.css" integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns" crossorigin="anonymous">
+    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
+
+    <!-- CSS Main  -->
+    <link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/assets/css/main.css" />
+  </head>
+  <body class="black">
+    <div id="fullscreen-menu" class="nav-hamburger-fullscreen">
+      <a href="."><h2>Index</h2></a>
+      <a href="https://github.com/mimblewimble/grin/blob/master/doc/intro.md"><h2>Introduction</h2></a>
+      <a href="fund"><h2>The General Fund</h2></a>
+      <a href="community"><h2>Community Projects</h2></a>
+      <a href="friends"><h2>Friends of Grin</h2></a>
+      <a href="https://github.com/mimblewimble/grin"><h2>GitHub</h2></a>
+    </div>
+    <div class="full-header">
+      <div class="full-nav">
+        <a href="/" id="grin-logo-full">
+          <svg id="grin-logo-full-svg" width="61" height="61" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M50 100C77.6142 100 100 77.6142 100 50C100 22.3858 77.6142 0 50 0C22.3858 0 0 22.3858 0 50C0 77.6142 22.3858 100 50 100Z" fill="black" />
+            <path d="M49.8911 94.6322C74.5417 94.6322 94.525 74.6489 94.525 49.9983C94.525 25.3477 74.5417 5.36449 49.8911 5.36449C25.2405 5.36449 5.25726 25.3477 5.25726 49.9983C5.25726 74.6489 25.2405 94.6322 49.8911 94.6322Z" fill="#FEF102" />
+            <path d="M71.0509 33.2448C69.986 30.8542 68.9938 26.1311 66.2629 25.0809C62.7472 23.729 60.5739 32.5793 60.0561 34.8155H59.5326C58.6462 30.984 57.4566 25.5537 53.2498 24.3442C51.3022 32.5244 55.2844 41.349 59.009 48.4281C62.986 46.5275 64.9237 40.5757 65.2917 36.3862H65.8153L70.0038 48.9516C73.3734 47.9831 74.5457 44.6485 75.7625 41.6218C78.3745 35.1254 80.5661 27.1359 78.9044 20.1557C73.8755 21.5798 72.3457 28.7709 71.0509 33.2448ZM20.789 49.9988C25.289 47.8501 27.4304 41.049 28.1188 36.3862H28.6424C29.1749 38.6338 30.5984 44.4323 33.4068 44.8045C36.9848 45.2778 38.8608 37.3385 39.1136 34.8155H39.6372C40.778 38.7574 41.9801 43.8836 45.92 45.8103C47.3734 39.7055 45.633 33.195 43.4006 27.4856C42.8267 26.0175 41.6482 22.0594 39.6241 22.0594C36.3079 22.0594 34.4435 30.8008 33.878 33.2448H33.3545L29.166 20.6793C21.7984 24.1976 17.7963 42.9061 20.789 49.9988ZM12.9355 56.2815C18.4031 80.1303 43.6226 93.6502 66.3389 83.579C74.6064 79.9135 81.1646 73.3826 84.9457 65.1821C85.9227 63.0632 87.8416 59.2281 86.7227 56.448C85.6086 53.6789 74.8028 58.2035 72.1028 59.3852C71.7237 59.5538 71.4562 59.9035 71.3939 60.314C71.3054 60.8946 71.4624 61.4862 71.8284 61.9465C72.1939 62.4067 72.7347 62.6936 73.3206 62.7386C75.3002 62.891 77.8572 63.0878 77.8572 63.0878C69.6441 78.9858 47.4378 86.0151 31.7838 73.314C28.2801 70.4716 25.1544 67.0941 23.0508 63.0878C22.0335 61.1506 21.09 58.6731 19.3607 57.3438C17.6994 56.0663 15.179 55.6286 12.9355 56.2815Z" fill="black" />
+          </svg>
+        </a>
+      </div>
+    </div>
+    <header>
+      {% include navigation.html %}
+    </header>
+    {{ content }}
+    {% include footer.html %}
+    <script type="text/javascript">
+      var logo = document.getElementById('grin-logo-bare');
+      var fullLogo = document.getElementById('grin-logo-full-svg');
+      logo.addEventListener('mouseover', () => {
+        document.getElementById('grin-logo-full').style.opacity = '1';
+      });
+      logo.addEventListener('mouseout', () => {
+        document.getElementById('grin-logo-full').style.opacity = '0';
+      });
+      window.addEventListener('scroll', () => {
+        logo.style.transform = `rotate(${window.scrollY / 3}deg)`;
+        fullLogo.style.transform = `rotate(${window.scrollY / 3}deg)`;
+      });
+    </script>
+    <script type="text/javascript">
+      var hamburger = document.getElementById('hamburger');
+      var fullscreen = document.getElementById('fullscreen-menu');
+      hamburger.addEventListener('click', () => {
+        hamburger.classList.toggle('active');
+        fullscreen.classList.toggle('active');
+      });
+    </script>
+  </body>
+</html>
diff --git a/_layouts/default.html b/_layouts/default.html
old mode 100755
new mode 100644
index 1a7cb9a7..4e070a36
--- a/_layouts/default.html
+++ b/_layouts/default.html
@@ -3,14 +3,10 @@
   <head>
     <title>{{ site.title }}</title>
     <meta content='text/html; charset=utf-8' http-equiv='Content-Type'>
-    <meta http-equiv='X-UA-Compatible' content='IE=edge'>
     <meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
-    <!--[if lt IE 9]>
-      <script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
-    <![endif]-->
 
     <!-- GoogleFonts -->
-    <!-- <link href="https://fonts.googleapis.com/css?family=Space+Mono" rel="stylesheet"> -->
+    <link href="https://fonts.googleapis.com/css?family=Space+Mono|Work+Sans:400,700,800,900&display=swap" rel="stylesheet">
 
     <!-- Font Awesome -->
     <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.4.2/css/all.css" integrity="sha384-/rXc/GQVaYpyDdyxK+ecHPVYJSN9bmVFBvjA/9eOB+pb3F2w2N6fc5qB9Ew5yIns" crossorigin="anonymous">
@@ -18,48 +14,53 @@
 
     <!-- CSS Main  -->
     <link rel="stylesheet" type="text/css" href="{{ site.baseurl }}/assets/css/main.css" />
-
-    <!-- Katex -->
-    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.css" integrity="sha384-9eLZqc9ds8eNjO3TmqPeYcDj8n+Qfa4nuSiGYa6DjLNcv9BtN69ZIulL9+8CqC9Y" crossorigin="anonymous">
-    <script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/katex.min.js" integrity="sha384-K3vbOmF2BtaVai+Qk37uypf7VrgBubhQreNQe9aGsz9lB63dIFiQVlJbr92dw2Lx" crossorigin="anonymous"></script>
-    <script defer src="https://cdn.jsdelivr.net/npm/katex@0.10.0/dist/contrib/auto-render.min.js" integrity="sha384-kmZOZB5ObwgQnS/DuDg6TScgOiWWBiVt0plIRkZCmE6rDZGrEOQeHM5PcHi+nyqe" crossorigin="anonymous"></script>
   </head>
   <body>
-    <header class="container">
+    <div id="fullscreen-menu" class="nav-hamburger-fullscreen">
+      <a href="."><h2>Index</h2></a>
+      <a href="https://github.com/mimblewimble/grin/blob/master/doc/intro.md"><h2>Introduction</h2></a>
+      <a href="fund"><h2>The Genral Fund</h2></a>
+      <a href="community"><h2>Community Projects</h2></a>
+      <a href="friends"><h2>Friends of Grin</h2></a>
+      <a href="https://github.com/mimblewimble/grin"><h2>GitHub</h2></a>
+    </div>
+    <div class="full-header">
+      <div class="full-nav">
+        <a href="/" id="grin-logo-full">
+          <svg id="grin-logo-full-svg" width="61" height="61" viewBox="0 0 100 100" fill="none" xmlns="http://www.w3.org/2000/svg">
+            <path d="M50 100C77.6142 100 100 77.6142 100 50C100 22.3858 77.6142 0 50 0C22.3858 0 0 22.3858 0 50C0 77.6142 22.3858 100 50 100Z" fill="black" />
+            <path d="M49.8911 94.6322C74.5417 94.6322 94.525 74.6489 94.525 49.9983C94.525 25.3477 74.5417 5.36449 49.8911 5.36449C25.2405 5.36449 5.25726 25.3477 5.25726 49.9983C5.25726 74.6489 25.2405 94.6322 49.8911 94.6322Z" fill="#FEF102" />
+            <path d="M71.0509 33.2448C69.986 30.8542 68.9938 26.1311 66.2629 25.0809C62.7472 23.729 60.5739 32.5793 60.0561 34.8155H59.5326C58.6462 30.984 57.4566 25.5537 53.2498 24.3442C51.3022 32.5244 55.2844 41.349 59.009 48.4281C62.986 46.5275 64.9237 40.5757 65.2917 36.3862H65.8153L70.0038 48.9516C73.3734 47.9831 74.5457 44.6485 75.7625 41.6218C78.3745 35.1254 80.5661 27.1359 78.9044 20.1557C73.8755 21.5798 72.3457 28.7709 71.0509 33.2448ZM20.789 49.9988C25.289 47.8501 27.4304 41.049 28.1188 36.3862H28.6424C29.1749 38.6338 30.5984 44.4323 33.4068 44.8045C36.9848 45.2778 38.8608 37.3385 39.1136 34.8155H39.6372C40.778 38.7574 41.9801 43.8836 45.92 45.8103C47.3734 39.7055 45.633 33.195 43.4006 27.4856C42.8267 26.0175 41.6482 22.0594 39.6241 22.0594C36.3079 22.0594 34.4435 30.8008 33.878 33.2448H33.3545L29.166 20.6793C21.7984 24.1976 17.7963 42.9061 20.789 49.9988ZM12.9355 56.2815C18.4031 80.1303 43.6226 93.6502 66.3389 83.579C74.6064 79.9135 81.1646 73.3826 84.9457 65.1821C85.9227 63.0632 87.8416 59.2281 86.7227 56.448C85.6086 53.6789 74.8028 58.2035 72.1028 59.3852C71.7237 59.5538 71.4562 59.9035 71.3939 60.314C71.3054 60.8946 71.4624 61.4862 71.8284 61.9465C72.1939 62.4067 72.7347 62.6936 73.3206 62.7386C75.3002 62.891 77.8572 63.0878 77.8572 63.0878C69.6441 78.9858 47.4378 86.0151 31.7838 73.314C28.2801 70.4716 25.1544 67.0941 23.0508 63.0878C22.0335 61.1506 21.09 58.6731 19.3607 57.3438C17.6994 56.0663 15.179 55.6286 12.9355 56.2815Z" fill="black" />
+          </svg>
+        </a>
+      </div>
+    </div>
+    <header>
       {% include navigation.html %}
     </header>
     {{ content }}
     {% include footer.html %}
-  </body>
-  <script>
-    var hamburger = document.querySelector(".hamburger");
-    var navMobile = document.querySelector(".nav-mobile");
-    var navMobileFade = document.querySelector(".nav-mobile-fade");
-    hamburger.addEventListener("click", function() {
-      hamburger.classList.toggle("is-active");
-      hamburger.classList.toggle("hamburger--slider");
-      navMobile.classList.toggle("is-active");
-      navMobileFade.classList.toggle("is-active");
-    });
-    document.addEventListener("DOMContentLoaded", function() {
-      renderMathInElement(document.body, {
-        delimiters: [
-          { left: "$$", right: "$$", display: true },
-          { left: "\\[", right: "\\]", display: true },
-          { left: "$", right: "$", display: false },
-        ],
-        ignoredTags: [
-          "script", "noscript", "style", "textarea", "pre", "code",
-        ],
+    <script type="text/javascript">
+      var logo = document.getElementById('grin-logo-bare');
+      var fullLogo = document.getElementById('grin-logo-full-svg');
+      logo.addEventListener('mouseover', () => {
+        document.getElementById('grin-logo-full').style.opacity = '1';
+      });
+      logo.addEventListener('mouseout', () => {
+        document.getElementById('grin-logo-full').style.opacity = '0';
       });
-      var nodes = document.querySelectorAll('script[type="math/tex; mode=display"]');
-      for (var i = 0; i < nodes.length; i++) {
-        var tex = nodes[i].innerHTML;
-        var markup = "<div class=\"equation\">" +
-          katex.renderToString(tex, { displayMode: true }) +
-          "</div>";
-        nodes[i].outerHTML = markup;
-      }
-    });
-  </script>
+      window.addEventListener('scroll', () => {
+        logo.style.transform = `rotate(${window.scrollY / 3}deg)`;
+        fullLogo.style.transform = `rotate(${window.scrollY / 3}deg)`;
+      });
+    </script>
+    <script type="text/javascript">
+      var hamburger = document.getElementById('hamburger');
+      var fullscreen = document.getElementById('fullscreen-menu');
+      hamburger.addEventListener('click', () => {
+        hamburger.classList.toggle('active');
+        fullscreen.classList.toggle('active');
+      });
+    </script>
+  </body>
 </html>
diff --git a/_layouts/page.html b/_layouts/page.html
index 61bc708e..c162f653 100755
--- a/_layouts/page.html
+++ b/_layouts/page.html
@@ -2,6 +2,6 @@
 layout: default
 ---
 
-<main class="main-root">
+<main class="page white">
   {{ content }}
 </main>
diff --git a/_sass/_fonts.scss b/_sass/_fonts.scss
index 13561eac..b126594b 100644
--- a/_sass/_fonts.scss
+++ b/_sass/_fonts.scss
@@ -1,43 +1,43 @@
 @font-face {
-  font-family: "Inter UI";
-  src: url("../fonts/Inter-UI-Regular.woff2") format("woff2");
+  font-family: 'Inter';
+  src: url('../fonts/Inter.var.woff2') format('woff2');
   font-weight: 400;
 }
 @font-face {
-  font-family: "Inter UI";
-  src: url("../fonts/Inter-UI-Italic.woff2") format("woff2");
+  font-family: 'Inter';
+  src: url('../fonts/Inter.var.woff2') format('woff2');
   font-weight: 400;
   font-style: italic;
 }
 @font-face {
-  font-family: "Inter UI";
-  src: url("../fonts/Inter-UI-Medium.woff2") format("woff2");
+  font-family: 'Inter';
+  src: url('../fonts/Inter.var.woff2') format('woff2');
   font-weight: 500;
 }
 @font-face {
-  font-family: "Inter UI";
-  src: url("../fonts/Inter-UI-SemiBold.woff2") format("woff2");
+  font-family: 'Inter';
+  src: url('../fonts/Inter.var.woff2') format('woff2');
   font-weight: 600;
 }
 @font-face {
-  font-family: "Inter UI";
-  src: url("../fonts/Inter-UI-Bold.woff2") format("woff2");
+  font-family: 'Inter';
+  src: url('../fonts/Inter.var.woff2') format('woff2');
   font-weight: 700;
 }
 @font-face {
-  font-family: "Inter UI";
-  src: url("../fonts/Inter-UI-BoldItalic.woff2") format("woff2");
+  font-family: 'Inter';
+  src: url('../fonts/Inter.var.woff2') format('woff2');
   font-weight: 700;
   font-style: italic;
 }
 @font-face {
-  font-family: "Inter UI";
-  src: url("../fonts/Inter-UI-ExtraBold.woff2") format("woff2");
+  font-family: 'Inter';
+  src: url('../fonts/Inter.var.woff2') format('woff2');
   font-weight: 800;
 }
 @font-face {
-  font-family: "Inter UI";
-  src: url("../fonts/Inter-UI-ExtraBoldItalic.woff2") format("woff2");
+  font-family: 'Inter';
+  src: url('../fonts/Inter.var.woff2') format('woff2');
   font-weight: 800;
   font-style: italic;
 }
diff --git a/_sass/_hamburger.scss b/_sass/_hamburger.scss
deleted file mode 100644
index e3a422e5..00000000
--- a/_sass/_hamburger.scss
+++ /dev/null
@@ -1,961 +0,0 @@
-/*!
- * Hamburgers
- * @description Tasty CSS-animated hamburgers
- * @author Jonathan Suh @jonsuh
- * @site https://jonsuh.com/hamburgers
- * @link https://github.com/jonsuh/hamburgers
- */
-.hamburger {
-  z-index: 100;
-  outline: 0;
-  padding: 15px 15px;
-  display: inline-block;
-  cursor: pointer;
-  transition-property: opacity, filter;
-  transition-duration: 0.15s;
-  transition-timing-function: linear;
-  font: inherit;
-  color: inherit;
-  text-transform: none;
-  background-color: transparent;
-  border: 0;
-  margin: 0;
-  overflow: visible;
-}
-.hamburger:hover {
-  opacity: 0.7;
-}
-.hamburger.is-active:hover {
-  opacity: 0.7;
-}
-.hamburger.is-active .hamburger-inner,
-.hamburger.is-active .hamburger-inner::before,
-.hamburger.is-active .hamburger-inner::after {
-  background-color: #000;
-}
-
-.hamburger-box {
-  width: 25px;
-  height: 15px;
-  display: inline-block;
-  position: relative;
-}
-
-.hamburger-inner {
-  display: block;
-  top: 50%;
-  margin-top: -2px;
-}
-.hamburger-inner,
-.hamburger-inner::before,
-.hamburger-inner::after {
-  width: 25px;
-  height: 2px;
-  background-color: #000;
-  border-radius: 0px;
-  position: absolute;
-  transition-property: transform;
-  transition-duration: 0.15s;
-  transition-timing-function: ease;
-}
-.hamburger-inner::before,
-.hamburger-inner::after {
-  content: "";
-  display: block;
-}
-.hamburger-inner::before {
-  top: -6px;
-}
-.hamburger-inner::after {
-  bottom: -6px;
-}
-
-/*
-   * 3DX
-   */
-.hamburger--3dx .hamburger-box {
-  perspective: 80px;
-}
-
-.hamburger--3dx .hamburger-inner {
-  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),
-    background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-.hamburger--3dx .hamburger-inner::before,
-.hamburger--3dx .hamburger-inner::after {
-  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-
-.hamburger--3dx.is-active .hamburger-inner {
-  background-color: transparent !important;
-  transform: rotateY(180deg);
-}
-.hamburger--3dx.is-active .hamburger-inner::before {
-  transform: translate3d(0, 10px, 0) rotate(45deg);
-}
-.hamburger--3dx.is-active .hamburger-inner::after {
-  transform: translate3d(0, -10px, 0) rotate(-45deg);
-}
-
-/*
-   * 3DX Reverse
-   */
-.hamburger--3dx-r .hamburger-box {
-  perspective: 80px;
-}
-
-.hamburger--3dx-r .hamburger-inner {
-  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),
-    background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-.hamburger--3dx-r .hamburger-inner::before,
-.hamburger--3dx-r .hamburger-inner::after {
-  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-
-.hamburger--3dx-r.is-active .hamburger-inner {
-  background-color: transparent !important;
-  transform: rotateY(-180deg);
-}
-.hamburger--3dx-r.is-active .hamburger-inner::before {
-  transform: translate3d(0, 10px, 0) rotate(45deg);
-}
-.hamburger--3dx-r.is-active .hamburger-inner::after {
-  transform: translate3d(0, -10px, 0) rotate(-45deg);
-}
-
-/*
-   * 3DY
-   */
-.hamburger--3dy .hamburger-box {
-  perspective: 80px;
-}
-
-.hamburger--3dy .hamburger-inner {
-  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),
-    background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-.hamburger--3dy .hamburger-inner::before,
-.hamburger--3dy .hamburger-inner::after {
-  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-
-.hamburger--3dy.is-active .hamburger-inner {
-  background-color: transparent !important;
-  transform: rotateX(-180deg);
-}
-.hamburger--3dy.is-active .hamburger-inner::before {
-  transform: translate3d(0, 10px, 0) rotate(45deg);
-}
-.hamburger--3dy.is-active .hamburger-inner::after {
-  transform: translate3d(0, -10px, 0) rotate(-45deg);
-}
-
-/*
-   * 3DY Reverse
-   */
-.hamburger--3dy-r .hamburger-box {
-  perspective: 80px;
-}
-
-.hamburger--3dy-r .hamburger-inner {
-  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),
-    background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-.hamburger--3dy-r .hamburger-inner::before,
-.hamburger--3dy-r .hamburger-inner::after {
-  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-
-.hamburger--3dy-r.is-active .hamburger-inner {
-  background-color: transparent !important;
-  transform: rotateX(180deg);
-}
-.hamburger--3dy-r.is-active .hamburger-inner::before {
-  transform: translate3d(0, 10px, 0) rotate(45deg);
-}
-.hamburger--3dy-r.is-active .hamburger-inner::after {
-  transform: translate3d(0, -10px, 0) rotate(-45deg);
-}
-
-/*
-   * 3DXY
-   */
-.hamburger--3dxy .hamburger-box {
-  perspective: 80px;
-}
-
-.hamburger--3dxy .hamburger-inner {
-  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),
-    background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-.hamburger--3dxy .hamburger-inner::before,
-.hamburger--3dxy .hamburger-inner::after {
-  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-
-.hamburger--3dxy.is-active .hamburger-inner {
-  background-color: transparent !important;
-  transform: rotateX(180deg) rotateY(180deg);
-}
-.hamburger--3dxy.is-active .hamburger-inner::before {
-  transform: translate3d(0, 10px, 0) rotate(45deg);
-}
-.hamburger--3dxy.is-active .hamburger-inner::after {
-  transform: translate3d(0, -10px, 0) rotate(-45deg);
-}
-
-/*
-   * 3DXY Reverse
-   */
-.hamburger--3dxy-r .hamburger-box {
-  perspective: 80px;
-}
-
-.hamburger--3dxy-r .hamburger-inner {
-  transition: transform 0.15s cubic-bezier(0.645, 0.045, 0.355, 1),
-    background-color 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-.hamburger--3dxy-r .hamburger-inner::before,
-.hamburger--3dxy-r .hamburger-inner::after {
-  transition: transform 0s 0.1s cubic-bezier(0.645, 0.045, 0.355, 1);
-}
-
-.hamburger--3dxy-r.is-active .hamburger-inner {
-  background-color: transparent !important;
-  transform: rotateX(180deg) rotateY(180deg) rotateZ(-180deg);
-}
-.hamburger--3dxy-r.is-active .hamburger-inner::before {
-  transform: translate3d(0, 10px, 0) rotate(45deg);
-}
-.hamburger--3dxy-r.is-active .hamburger-inner::after {
-  transform: translate3d(0, -10px, 0) rotate(-45deg);
-}
-
-/*
-   * Arrow
-   */
-.hamburger--arrow.is-active .hamburger-inner::before {
-  transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1);
-}
-
-.hamburger--arrow.is-active .hamburger-inner::after {
-  transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1);
-}
-
-/*
-   * Arrow Right
-   */
-.hamburger--arrow-r.is-active .hamburger-inner::before {
-  transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1);
-}
-
-.hamburger--arrow-r.is-active .hamburger-inner::after {
-  transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1);
-}
-
-/*
-   * Arrow Alt
-   */
-.hamburger--arrowalt .hamburger-inner::before {
-  transition: top 0.1s 0.1s ease,
-    transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
-}
-
-.hamburger--arrowalt .hamburger-inner::after {
-  transition: bottom 0.1s 0.1s ease,
-    transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
-}
-
-.hamburger--arrowalt.is-active .hamburger-inner::before {
-  top: 0;
-  transform: translate3d(-8px, -10px, 0) rotate(-45deg) scale(0.7, 1);
-  transition: top 0.1s ease,
-    transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
-}
-
-.hamburger--arrowalt.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: translate3d(-8px, 10px, 0) rotate(45deg) scale(0.7, 1);
-  transition: bottom 0.1s ease,
-    transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
-}
-
-/*
-   * Arrow Alt Right
-   */
-.hamburger--arrowalt-r .hamburger-inner::before {
-  transition: top 0.1s 0.1s ease,
-    transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
-}
-
-.hamburger--arrowalt-r .hamburger-inner::after {
-  transition: bottom 0.1s 0.1s ease,
-    transform 0.1s cubic-bezier(0.165, 0.84, 0.44, 1);
-}
-
-.hamburger--arrowalt-r.is-active .hamburger-inner::before {
-  top: 0;
-  transform: translate3d(8px, -10px, 0) rotate(45deg) scale(0.7, 1);
-  transition: top 0.1s ease,
-    transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
-}
-
-.hamburger--arrowalt-r.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: translate3d(8px, 10px, 0) rotate(-45deg) scale(0.7, 1);
-  transition: bottom 0.1s ease,
-    transform 0.1s 0.1s cubic-bezier(0.895, 0.03, 0.685, 0.22);
-}
-
-/*
-   * Arrow Turn
-   */
-.hamburger--arrowturn.is-active .hamburger-inner {
-  transform: rotate(-180deg);
-}
-.hamburger--arrowturn.is-active .hamburger-inner::before {
-  transform: translate3d(8px, 0, 0) rotate(45deg) scale(0.7, 1);
-}
-.hamburger--arrowturn.is-active .hamburger-inner::after {
-  transform: translate3d(8px, 0, 0) rotate(-45deg) scale(0.7, 1);
-}
-
-/*
-   * Arrow Turn Right
-   */
-.hamburger--arrowturn-r.is-active .hamburger-inner {
-  transform: rotate(-180deg);
-}
-.hamburger--arrowturn-r.is-active .hamburger-inner::before {
-  transform: translate3d(-8px, 0, 0) rotate(-45deg) scale(0.7, 1);
-}
-.hamburger--arrowturn-r.is-active .hamburger-inner::after {
-  transform: translate3d(-8px, 0, 0) rotate(45deg) scale(0.7, 1);
-}
-
-/*
-   * Boring
-   */
-.hamburger--boring .hamburger-inner,
-.hamburger--boring .hamburger-inner::before,
-.hamburger--boring .hamburger-inner::after {
-  transition-property: none;
-}
-
-.hamburger--boring.is-active .hamburger-inner {
-  transform: rotate(45deg);
-}
-.hamburger--boring.is-active .hamburger-inner::before {
-  top: 0;
-  opacity: 0;
-}
-.hamburger--boring.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: rotate(-90deg);
-}
-
-/*
-   * Collapse
-   */
-.hamburger--collapse .hamburger-inner {
-  top: auto;
-  bottom: 0;
-  transition-duration: 0.13s;
-  transition-delay: 0.13s;
-  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--collapse .hamburger-inner::after {
-  top: -20px;
-  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),
-    opacity 0.1s linear;
-}
-.hamburger--collapse .hamburger-inner::before {
-  transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),
-    transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--collapse.is-active .hamburger-inner {
-  transform: translate3d(0, -10px, 0) rotate(-45deg);
-  transition-delay: 0.22s;
-  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-.hamburger--collapse.is-active .hamburger-inner::after {
-  top: 0;
-  opacity: 0;
-  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333),
-    opacity 0.1s 0.22s linear;
-}
-.hamburger--collapse.is-active .hamburger-inner::before {
-  top: 0;
-  transform: rotate(-90deg);
-  transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333),
-    transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-/*
-   * Collapse Reverse
-   */
-.hamburger--collapse-r .hamburger-inner {
-  top: auto;
-  bottom: 0;
-  transition-duration: 0.13s;
-  transition-delay: 0.13s;
-  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--collapse-r .hamburger-inner::after {
-  top: -20px;
-  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),
-    opacity 0.1s linear;
-}
-.hamburger--collapse-r .hamburger-inner::before {
-  transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),
-    transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--collapse-r.is-active .hamburger-inner {
-  transform: translate3d(0, -10px, 0) rotate(45deg);
-  transition-delay: 0.22s;
-  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-.hamburger--collapse-r.is-active .hamburger-inner::after {
-  top: 0;
-  opacity: 0;
-  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333),
-    opacity 0.1s 0.22s linear;
-}
-.hamburger--collapse-r.is-active .hamburger-inner::before {
-  top: 0;
-  transform: rotate(90deg);
-  transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333),
-    transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-/*
-   * Elastic
-   */
-.hamburger--elastic .hamburger-inner {
-  top: 2px;
-  transition-duration: 0.275s;
-  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
-}
-.hamburger--elastic .hamburger-inner::before {
-  top: 10px;
-  transition: opacity 0.125s 0.275s ease;
-}
-.hamburger--elastic .hamburger-inner::after {
-  top: 20px;
-  transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
-}
-
-.hamburger--elastic.is-active .hamburger-inner {
-  transform: translate3d(0, 10px, 0) rotate(135deg);
-  transition-delay: 0.075s;
-}
-.hamburger--elastic.is-active .hamburger-inner::before {
-  transition-delay: 0s;
-  opacity: 0;
-}
-.hamburger--elastic.is-active .hamburger-inner::after {
-  transform: translate3d(0, -20px, 0) rotate(-270deg);
-  transition-delay: 0.075s;
-}
-
-/*
-   * Elastic Reverse
-   */
-.hamburger--elastic-r .hamburger-inner {
-  top: 2px;
-  transition-duration: 0.275s;
-  transition-timing-function: cubic-bezier(0.68, -0.55, 0.265, 1.55);
-}
-.hamburger--elastic-r .hamburger-inner::before {
-  top: 10px;
-  transition: opacity 0.125s 0.275s ease;
-}
-.hamburger--elastic-r .hamburger-inner::after {
-  top: 20px;
-  transition: transform 0.275s cubic-bezier(0.68, -0.55, 0.265, 1.55);
-}
-
-.hamburger--elastic-r.is-active .hamburger-inner {
-  transform: translate3d(0, 10px, 0) rotate(-135deg);
-  transition-delay: 0.075s;
-}
-.hamburger--elastic-r.is-active .hamburger-inner::before {
-  transition-delay: 0s;
-  opacity: 0;
-}
-.hamburger--elastic-r.is-active .hamburger-inner::after {
-  transform: translate3d(0, -20px, 0) rotate(270deg);
-  transition-delay: 0.075s;
-}
-
-/*
-   * Emphatic
-   */
-.hamburger--emphatic {
-  overflow: hidden;
-}
-.hamburger--emphatic .hamburger-inner {
-  transition: background-color 0.125s 0.175s ease-in;
-}
-.hamburger--emphatic .hamburger-inner::before {
-  left: 0;
-  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335),
-    top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
-}
-.hamburger--emphatic .hamburger-inner::after {
-  top: 10px;
-  right: 0;
-  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335),
-    top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
-}
-.hamburger--emphatic.is-active .hamburger-inner {
-  transition-delay: 0s;
-  transition-timing-function: ease-out;
-  background-color: transparent !important;
-}
-.hamburger--emphatic.is-active .hamburger-inner::before {
-  left: -80px;
-  top: -80px;
-  transform: translate3d(80px, 80px, 0) rotate(45deg);
-  transition: left 0.125s ease-out, top 0.05s 0.125s linear,
-    transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
-}
-.hamburger--emphatic.is-active .hamburger-inner::after {
-  right: -80px;
-  top: -80px;
-  transform: translate3d(-80px, 80px, 0) rotate(-45deg);
-  transition: right 0.125s ease-out, top 0.05s 0.125s linear,
-    transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
-}
-
-/*
-   * Emphatic Reverse
-   */
-.hamburger--emphatic-r {
-  overflow: hidden;
-}
-.hamburger--emphatic-r .hamburger-inner {
-  transition: background-color 0.125s 0.175s ease-in;
-}
-.hamburger--emphatic-r .hamburger-inner::before {
-  left: 0;
-  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335),
-    top 0.05s 0.125s linear, left 0.125s 0.175s ease-in;
-}
-.hamburger--emphatic-r .hamburger-inner::after {
-  top: 10px;
-  right: 0;
-  transition: transform 0.125s cubic-bezier(0.6, 0.04, 0.98, 0.335),
-    top 0.05s 0.125s linear, right 0.125s 0.175s ease-in;
-}
-.hamburger--emphatic-r.is-active .hamburger-inner {
-  transition-delay: 0s;
-  transition-timing-function: ease-out;
-  background-color: transparent !important;
-}
-.hamburger--emphatic-r.is-active .hamburger-inner::before {
-  left: -80px;
-  top: 80px;
-  transform: translate3d(80px, -80px, 0) rotate(-45deg);
-  transition: left 0.125s ease-out, top 0.05s 0.125s linear,
-    transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
-}
-.hamburger--emphatic-r.is-active .hamburger-inner::after {
-  right: -80px;
-  top: 80px;
-  transform: translate3d(-80px, -80px, 0) rotate(45deg);
-  transition: right 0.125s ease-out, top 0.05s 0.125s linear,
-    transform 0.125s 0.175s cubic-bezier(0.075, 0.82, 0.165, 1);
-}
-
-/*
-   * Minus
-   */
-.hamburger--minus .hamburger-inner::before,
-.hamburger--minus .hamburger-inner::after {
-  transition: bottom 0.08s 0s ease-out, top 0.08s 0s ease-out, opacity 0s linear;
-}
-
-.hamburger--minus.is-active .hamburger-inner::before,
-.hamburger--minus.is-active .hamburger-inner::after {
-  opacity: 0;
-  transition: bottom 0.08s ease-out, top 0.08s ease-out, opacity 0s 0.08s linear;
-}
-
-.hamburger--minus.is-active .hamburger-inner::before {
-  top: 0;
-}
-
-.hamburger--minus.is-active .hamburger-inner::after {
-  bottom: 0;
-}
-
-/*
-   * Slider
-   */
-.hamburger--slider .hamburger-inner {
-  top: 2px;
-}
-.hamburger--slider .hamburger-inner::before {
-  top: 10px;
-  transition-property: transform, opacity;
-  transition-timing-function: ease;
-  transition-duration: 0.15s;
-}
-.hamburger--slider .hamburger-inner::after {
-  top: 20px;
-}
-
-.hamburger--slider.is-active .hamburger-inner {
-  transform: translate3d(0, 10px, 0) rotate(45deg);
-}
-.hamburger--slider.is-active .hamburger-inner::before {
-  transform: rotate(-45deg) translate3d(-5.71429px, -6px, 0);
-  opacity: 0;
-}
-.hamburger--slider.is-active .hamburger-inner::after {
-  transform: translate3d(0, -20px, 0) rotate(-90deg);
-}
-
-/*
-   * Slider Reverse
-   */
-.hamburger--slider-r .hamburger-inner {
-  top: 2px;
-}
-.hamburger--slider-r .hamburger-inner::before {
-  top: 10px;
-  transition-property: transform, opacity;
-  transition-timing-function: ease;
-  transition-duration: 0.15s;
-}
-.hamburger--slider-r .hamburger-inner::after {
-  top: 20px;
-}
-
-.hamburger--slider-r.is-active .hamburger-inner {
-  transform: translate3d(0, 10px, 0) rotate(-45deg);
-}
-.hamburger--slider-r.is-active .hamburger-inner::before {
-  transform: rotate(45deg) translate3d(5.71429px, -6px, 0);
-  opacity: 0;
-}
-.hamburger--slider-r.is-active .hamburger-inner::after {
-  transform: translate3d(0, -20px, 0) rotate(90deg);
-}
-
-/*
-   * Spin
-   */
-.hamburger--spin .hamburger-inner {
-  transition-duration: 0.22s;
-  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--spin .hamburger-inner::before {
-  transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
-}
-.hamburger--spin .hamburger-inner::after {
-  transition: bottom 0.1s 0.25s ease-in,
-    transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--spin.is-active .hamburger-inner {
-  transform: rotate(225deg);
-  transition-delay: 0.12s;
-  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-.hamburger--spin.is-active .hamburger-inner::before {
-  top: 0;
-  opacity: 0;
-  transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
-}
-.hamburger--spin.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: rotate(-90deg);
-  transition: bottom 0.1s ease-out,
-    transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-/*
-   * Spin Reverse
-   */
-.hamburger--spin-r .hamburger-inner {
-  transition-duration: 0.22s;
-  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--spin-r .hamburger-inner::before {
-  transition: top 0.1s 0.25s ease-in, opacity 0.1s ease-in;
-}
-.hamburger--spin-r .hamburger-inner::after {
-  transition: bottom 0.1s 0.25s ease-in,
-    transform 0.22s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--spin-r.is-active .hamburger-inner {
-  transform: rotate(-225deg);
-  transition-delay: 0.12s;
-  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-.hamburger--spin-r.is-active .hamburger-inner::before {
-  top: 0;
-  opacity: 0;
-  transition: top 0.1s ease-out, opacity 0.1s 0.12s ease-out;
-}
-.hamburger--spin-r.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: rotate(90deg);
-  transition: bottom 0.1s ease-out,
-    transform 0.22s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-/*
-   * Spring
-   */
-.hamburger--spring .hamburger-inner {
-  top: 2px;
-  transition: background-color 0s 0.13s linear;
-}
-.hamburger--spring .hamburger-inner::before {
-  top: 10px;
-  transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),
-    transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--spring .hamburger-inner::after {
-  top: 20px;
-  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),
-    transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--spring.is-active .hamburger-inner {
-  transition-delay: 0.22s;
-  background-color: transparent !important;
-}
-.hamburger--spring.is-active .hamburger-inner::before {
-  top: 0;
-  transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333),
-    transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
-  transform: translate3d(0, 10px, 0) rotate(45deg);
-}
-.hamburger--spring.is-active .hamburger-inner::after {
-  top: 0;
-  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333),
-    transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
-  transform: translate3d(0, 10px, 0) rotate(-45deg);
-}
-
-/*
-   * Spring Reverse
-   */
-.hamburger--spring-r .hamburger-inner {
-  top: auto;
-  bottom: 0;
-  transition-duration: 0.13s;
-  transition-delay: 0s;
-  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--spring-r .hamburger-inner::after {
-  top: -20px;
-  transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),
-    opacity 0s linear;
-}
-.hamburger--spring-r .hamburger-inner::before {
-  transition: top 0.1s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1),
-    transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--spring-r.is-active .hamburger-inner {
-  transform: translate3d(0, -10px, 0) rotate(-45deg);
-  transition-delay: 0.22s;
-  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-.hamburger--spring-r.is-active .hamburger-inner::after {
-  top: 0;
-  opacity: 0;
-  transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333),
-    opacity 0s 0.22s linear;
-}
-.hamburger--spring-r.is-active .hamburger-inner::before {
-  top: 0;
-  transform: rotate(90deg);
-  transition: top 0.1s 0.15s cubic-bezier(0.33333, 0, 0.66667, 0.33333),
-    transform 0.13s 0.22s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-/*
-   * Stand
-   */
-.hamburger--stand .hamburger-inner {
-  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19),
-    background-color 0s 0.075s linear;
-}
-.hamburger--stand .hamburger-inner::before {
-  transition: top 0.075s 0.075s ease-in,
-    transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--stand .hamburger-inner::after {
-  transition: bottom 0.075s 0.075s ease-in,
-    transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--stand.is-active .hamburger-inner {
-  transform: rotate(90deg);
-  background-color: transparent !important;
-  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1),
-    background-color 0s 0.15s linear;
-}
-.hamburger--stand.is-active .hamburger-inner::before {
-  top: 0;
-  transform: rotate(-45deg);
-  transition: top 0.075s 0.1s ease-out,
-    transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-.hamburger--stand.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: rotate(45deg);
-  transition: bottom 0.075s 0.1s ease-out,
-    transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-/*
-   * Stand Reverse
-   */
-.hamburger--stand-r .hamburger-inner {
-  transition: transform 0.075s 0.15s cubic-bezier(0.55, 0.055, 0.675, 0.19),
-    background-color 0s 0.075s linear;
-}
-.hamburger--stand-r .hamburger-inner::before {
-  transition: top 0.075s 0.075s ease-in,
-    transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--stand-r .hamburger-inner::after {
-  transition: bottom 0.075s 0.075s ease-in,
-    transform 0.075s 0s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--stand-r.is-active .hamburger-inner {
-  transform: rotate(-90deg);
-  background-color: transparent !important;
-  transition: transform 0.075s 0s cubic-bezier(0.215, 0.61, 0.355, 1),
-    background-color 0s 0.15s linear;
-}
-.hamburger--stand-r.is-active .hamburger-inner::before {
-  top: 0;
-  transform: rotate(-45deg);
-  transition: top 0.075s 0.1s ease-out,
-    transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-.hamburger--stand-r.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: rotate(45deg);
-  transition: bottom 0.075s 0.1s ease-out,
-    transform 0.075s 0.15s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-/*
-   * Squeeze
-   */
-.hamburger--squeeze .hamburger-inner {
-  transition-duration: 0.075s;
-  transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-.hamburger--squeeze .hamburger-inner::before {
-  transition: top 0.075s 0.12s ease, opacity 0.075s ease;
-}
-.hamburger--squeeze .hamburger-inner::after {
-  transition: bottom 0.075s 0.12s ease,
-    transform 0.075s cubic-bezier(0.55, 0.055, 0.675, 0.19);
-}
-
-.hamburger--squeeze.is-active .hamburger-inner {
-  transform: rotate(45deg);
-  transition-delay: 0.12s;
-  transition-timing-function: cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-.hamburger--squeeze.is-active .hamburger-inner::before {
-  top: 0;
-  opacity: 0;
-  transition: top 0.075s ease, opacity 0.075s 0.12s ease;
-}
-.hamburger--squeeze.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: rotate(-90deg);
-  transition: bottom 0.075s ease,
-    transform 0.075s 0.12s cubic-bezier(0.215, 0.61, 0.355, 1);
-}
-
-/*
-   * Vortex
-   */
-.hamburger--vortex .hamburger-inner {
-  transition-duration: 0.2s;
-  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
-}
-.hamburger--vortex .hamburger-inner::before,
-.hamburger--vortex .hamburger-inner::after {
-  transition-duration: 0s;
-  transition-delay: 0.1s;
-  transition-timing-function: linear;
-}
-.hamburger--vortex .hamburger-inner::before {
-  transition-property: top, opacity;
-}
-.hamburger--vortex .hamburger-inner::after {
-  transition-property: bottom, transform;
-}
-
-.hamburger--vortex.is-active .hamburger-inner {
-  transform: rotate(765deg);
-  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
-}
-.hamburger--vortex.is-active .hamburger-inner::before,
-.hamburger--vortex.is-active .hamburger-inner::after {
-  transition-delay: 0s;
-}
-.hamburger--vortex.is-active .hamburger-inner::before {
-  top: 0;
-  opacity: 0;
-}
-.hamburger--vortex.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: rotate(90deg);
-}
-
-/*
-   * Vortex Reverse
-   */
-.hamburger--vortex-r .hamburger-inner {
-  transition-duration: 0.2s;
-  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
-}
-.hamburger--vortex-r .hamburger-inner::before,
-.hamburger--vortex-r .hamburger-inner::after {
-  transition-duration: 0s;
-  transition-delay: 0.1s;
-  transition-timing-function: linear;
-}
-.hamburger--vortex-r .hamburger-inner::before {
-  transition-property: top, opacity;
-}
-.hamburger--vortex-r .hamburger-inner::after {
-  transition-property: bottom, transform;
-}
-
-.hamburger--vortex-r.is-active .hamburger-inner {
-  transform: rotate(-765deg);
-  transition-timing-function: cubic-bezier(0.19, 1, 0.22, 1);
-}
-.hamburger--vortex-r.is-active .hamburger-inner::before,
-.hamburger--vortex-r.is-active .hamburger-inner::after {
-  transition-delay: 0s;
-}
-.hamburger--vortex-r.is-active .hamburger-inner::before {
-  top: 0;
-  opacity: 0;
-}
-.hamburger--vortex-r.is-active .hamburger-inner::after {
-  bottom: 0;
-  transform: rotate(-90deg);
-}
diff --git a/_sass/_markdown.scss b/_sass/_markdown.scss
index 63e05a3e..bebf7579 100644
--- a/_sass/_markdown.scss
+++ b/_sass/_markdown.scss
@@ -1,43 +1,43 @@
-h1 {
-  font-size: 44px;
-  font-family: 'Inter UI';
-  font-weight: 600;
-  margin-bottom: $tiny;
-  line-height: 1.1em;
-}
-h2 {
-  font-size: 32px;
-  font-family: 'Inter UI';
-  font-weight: 600;
-  margin-bottom: 8px;
-  line-height: 1.1em;
-}
-h3 {
-  font-size: 24px;
-  font-family: 'Inter UI';
-  font-weight: 600;
-  margin-bottom: 8px;
-  line-height: 1.3em;
-}
-h4 {
-  font-size: 19px;
-  margin-bottom: 8px;
-  line-height: 1.3em !important;
-}
-p {
-  font-size: $regular;
-  line-height: 1.6em;
-  margin-bottom: 1.6em;
-  &:last-child {
-    margin-bottom: 0;
-  }
-}
-em, i {
-  font-style: italic;
-}
-strong, b {
-  font-weight: bold;
-}
+// h1 {
+//   font-size: 44px;
+//   font-family: 'Inter UI';
+//   font-weight: 600;
+//   margin-bottom: $tiny;
+//   line-height: 1.1em;
+// }
+// h2 {
+//   font-size: 32px;
+//   font-family: 'Inter UI';
+//   font-weight: 600;
+//   margin-bottom: 8px;
+//   line-height: 1.1em;
+// }
+// h3 {
+//   font-size: 24px;
+//   font-family: 'Inter UI';
+//   font-weight: 600;
+//   margin-bottom: 8px;
+//   line-height: 1.3em;
+// }
+// h4 {
+//   font-size: 19px;
+//   margin-bottom: 8px;
+//   line-height: 1.3em !important;
+// }
+// p {
+//   font-size: $regular;
+//   line-height: 1.6em;
+//   margin-bottom: 1.6em;
+//   &:last-child {
+//     margin-bottom: 0;
+//   }
+// }
+// em, i {
+//   font-style: italic;
+// }
+// strong, b {
+//   font-weight: bold;
+// }
 table {
   margin-bottom: 1.6em;
 }
@@ -48,6 +48,7 @@ th {
 td {
   border: 1px solid #222;
   padding: 8px 12px;
+  line-height: 1.5em;
 }
 hr {
   border-top: 0;
@@ -57,97 +58,98 @@ hr {
   display: block;
   margin: 16px 0 16px 0;
   width: 100%;
-}
-blockquote {
-  border-left: 2px solid black;
-  padding-left: 16px;
-  font-style: italic;
-  margin-bottom: 1.6em;
-}
-blockquote p:before {
-  content: '“';
-}
-blockquote p:after {
-  content: '”';
-}
-img {
-  max-width: 100%;
-  vertical-align: middle;
-}
-iframe {
-  margin-bottom: 1.6em;
-  max-width: 100%;
-  max-height: 281px;
-  vertical-align: middle;
-}
-pre {
-  background-color: #151515;
-  border-radius: 4px;
-  color: #eee;
-  font-family: monospace;
-  font-size: 13px;
-  margin-bottom: 1.9em;
-  padding: $small;
-  overflow-x: auto;
-  /* overflow-x: hidden; */
-}
-pre > code {
-  position: inherit;
-  background-color: transparent;
-  border-radius: 0;
-  font-family: monospace;
-  font-size: 13px;
-  padding: 0;
-  top: 0;
-  line-height: 18px;
-}
-code {
-  position: relative;
-  background-color: #222;
-  border-radius: 4px;
-  color: #eee;
-  font-family: monospace;
-  font-size: 13px;
-  padding: 2px 4px;
-  top: -1px;
-}
-code.inverted {
-  background-color: #e9e9e9;
-  color: black;
-}
-kbd {
-  background-color: #fafbfc;
-  border: solid 1px #d1d5da;
-  border-bottom-color: #c6cbd1;
-  border-radius: 3px;
-  box-shadow: inset 0 -1px 0 #c6cbd1;
-  color: #444d56;
-  display: inline;
-  font-family: monospace;
-  font-size: 11px;
-  padding: 2px 4px;
-  vertical-align: middle;
-}
-ol {
-  list-style-type: decimal;
-  margin-bottom: 1.5em;
-  padding-left: 1.6em;
-}
-ul {
-  list-style-type: disc;
-  margin-bottom: 1.5em;
-  padding-left: 1.6em;
-}
-li {
-  line-height: 26px;
-  margin-bottom: 4px;
-}
-p + ol {
-  margin-top: -8px;
-}
-p + ul {
-  margin-top: -8px;
-}
-.katex-display {
-  margin: 1.6em 0 !important;
-}
+  line-height: 1.5em;
+}
+// blockquote {
+//   border-left: 2px solid black;
+//   padding-left: 16px;
+//   font-style: italic;
+//   margin-bottom: 1.6em;
+// }
+// blockquote p:before {
+//   content: '“';
+// }
+// blockquote p:after {
+//   content: '”';
+// }
+// img {
+//   max-width: 100%;
+//   vertical-align: middle;
+// }
+// iframe {
+//   margin-bottom: 1.6em;
+//   max-width: 100%;
+//   max-height: 281px;
+//   vertical-align: middle;
+// }
+// pre {
+//   background-color: #151515;
+//   border-radius: 4px;
+//   color: #eee;
+//   font-family: monospace;
+//   font-size: 13px;
+//   margin-bottom: 1.9em;
+//   padding: $small;
+//   overflow-x: auto;
+//   /* overflow-x: hidden; */
+// }
+// pre > code {
+//   position: inherit;
+//   background-color: transparent;
+//   border-radius: 0;
+//   font-family: monospace;
+//   font-size: 13px;
+//   padding: 0;
+//   top: 0;
+//   line-height: 18px;
+// }
+// code {
+//   position: relative;
+//   background-color: #222;
+//   border-radius: 4px;
+//   color: #eee;
+//   font-family: monospace;
+//   font-size: 13px;
+//   padding: 2px 4px;
+//   top: -1px;
+// }
+// code.inverted {
+//   background-color: #e9e9e9;
+//   color: black;
+// }
+// kbd {
+//   background-color: #fafbfc;
+//   border: solid 1px #d1d5da;
+//   border-bottom-color: #c6cbd1;
+//   border-radius: 3px;
+//   box-shadow: inset 0 -1px 0 #c6cbd1;
+//   color: #444d56;
+//   display: inline;
+//   font-family: monospace;
+//   font-size: 11px;
+//   padding: 2px 4px;
+//   vertical-align: middle;
+// }
+// ol {
+//   list-style-type: decimal;
+//   margin-bottom: 1.5em;
+//   padding-left: 1.6em;
+// }
+// ul {
+//   list-style-type: disc;
+//   margin-bottom: 1.5em;
+//   padding-left: 1.6em;
+// }
+// li {
+//   line-height: 26px;
+//   margin-bottom: 4px;
+// }
+// p + ol {
+//   margin-top: -8px;
+// }
+// p + ul {
+//   margin-top: -8px;
+// }
+// .katex-display {
+//   margin: 1.6em 0 !important;
+// }
diff --git a/_sass/_variables.scss b/_sass/_variables.scss
index e8a3dcea..c9ab85f7 100755
--- a/_sass/_variables.scss
+++ b/_sass/_variables.scss
@@ -1,32 +1,32 @@
+// //
+// // VARIABLES
+// //
 //
-// VARIABLES
+// // Mobile breakpoints
+// @mixin mobile {
+//   @media screen and (max-width: 767px) {
+//     @content;
+//   }
+// }
+// @mixin tablet {
+//   @media screen and (min-width: 768px) {
+//     @content;
+//   }
+// }
 //
-
-// Mobile breakpoints
-@mixin mobile {
-  @media screen and (max-width: 767px) {
-    @content;
-  }
-}
-@mixin tablet {
-  @media screen and (min-width: 768px) {
-    @content;
-  }
-}
-
-$smiley-yellow: #fef102;
-$smiley-black: black;
-$almost-black: #0b0b0b;
-$grey: #6d6d6d;
-$light-green: #22c335;
-$tiny: 8px;
-$small: 16px;
-$base: 24px;
-$large: 48px;
-$xlarge: 64px;
-
-$h1: 56px;
-$h2: 36px;
-$h3: 28px;
-$flarge: 24px;
-$regular: 16px;
+// $smiley-yellow: #fef102;
+// $smiley-black: black;
+// $almost-black: #0b0b0b;
+// $grey: #6d6d6d;
+// $light-green: #22c335;
+// $tiny: 8px;
+// $small: 16px;
+// $base: 24px;
+// $large: 48px;
+// $xlarge: 64px;
+//
+// $h1: 56px;
+// $h2: 36px;
+// $h3: 28px;
+// $flarge: 24px;
+// $regular: 16px;
diff --git a/_sass/community.scss b/_sass/community.scss
new file mode 100644
index 00000000..4e5584db
--- /dev/null
+++ b/_sass/community.scss
@@ -0,0 +1,45 @@
+.community {
+  background-color: #f2f2f2;
+  padding: 128px 16px 64px 16px;
+  max-width: 700px;
+  margin: 0 auto;
+  a {
+    border-bottom: 1px solid white;
+  }
+  h2 {
+    text-align: center;
+  }
+}
+.community-subheading {
+  line-height: 1.4em;
+  text-align: center;
+}
+.community-content {
+  margin-top: 24px;
+  background-color: white;
+}
+.community-row {
+  padding: 20px;
+  display: flex;
+  border-bottom: 1px solid #DADADA;
+}
+.community-row-img {
+  width: 80px;
+  margin-right: 16px;
+}
+.community-row-content {
+  margin-top: 4px;
+}
+.community-row-heading {
+  font-size: 18px;
+  font-weight: bold;
+  margin-bottom: 4px;
+}
+.community-row-desc {
+  line-height: 1.4em;
+  margin-bottom: 8px;
+}
+.community-row-category {
+  color: #6F6F6F;
+  font-size: 12px;
+}
diff --git a/_sass/footer.scss b/_sass/footer.scss
index 68887470..44e8f267 100644
--- a/_sass/footer.scss
+++ b/_sass/footer.scss
@@ -1,43 +1,44 @@
 footer {
-  background-color: #f2f2f2;
-  padding: $large;
-  display: flex;
-}
-.footer-root {
-  flex-wrap: wrap;
-  display: flex;
+  background-color: #101010;
+  color: white;
+  font-family: 'Courier', monospace;
+  font-size: 13px;
+  line-height: 1.5em;
+  a {
+    color: white;
+    border-bottom: 1px solid white;
+  }
+  p {
+    flex-grow: 1;
+  }
 }
-.grin-logo-footer {
-  height: 64px;
+.footer-content {
   display: flex;
-  position: relative;
-  top: -$tiny;
+  width: 700px;
+  margin: 0 auto;
+  padding: 64px 16px;
 }
-.footer-section {
-  min-width: 150px;
+.footer-links {
   display: flex;
-  flex-grow: 10;
   flex-direction: column;
-  margin-bottom: $small;
-}
-.footer-section a {
-  color: #6d6d6d;
-  border: 0;
-  line-height: 24px;
-  &:hover {
-    color: black;
+  align-items: flex-end;
+  a {
+    border: 0;
   }
 }
-.footer-section div {
-  margin-bottom: 4px;
-}
 
 @media (max-width: 768px) {
   footer {
-    padding: $base;
+    padding: 32px 16px;
   }
-  .footer-root {
+  .footer-content {
     flex-direction: column;
-    flex-grow: 0;
+    max-width: 100%;
+    padding-right: 0;
+    padding-left: 0;
+  }
+  .footer-links {
+    margin-top: 48px;
+    align-items: flex-start;
   }
 }
diff --git a/_sass/friends.scss b/_sass/friends.scss
index f24c5ada..ca8a1e4f 100644
--- a/_sass/friends.scss
+++ b/_sass/friends.scss
@@ -1,43 +1,89 @@
-.companies {
-  border-radius: 4px;
-  padding: $small 0 3px $small;
-  border: 1px solid #ddd;
-  align-items: stretch;
-  display: flex;
-  flex-wrap: wrap;
-  justify-content: center;
-  margin-top: $small;
-  margin-bottom: $base;
+.friends {
+  background-color: #f2f2f2;
 }
-.companies a {
-  align-items: center;
-  background-color: #080808;
-  border: 1px solid #f2f2f2;
-  border-bottom: 0;
-  box-shadow: 0 10px 45px -12px rgba(93, 90, 50, 0.25), 0 18px 36px -18px rgba(0, 0, 0, .3);
-  border-radius: 4px;
-  cursor: pointer;
-  display: flex;
-  height: 115px;
-  margin: 0 16px 16px 0;
-  transition: all .15s ease;
-  width: 115px;
-  border: 0;
-  &:hover {
-    // box-shadow: 0 15px 55px -12px rgba(93, 90, 50, 0.25), 0 18px 36px -18px rgba(0, 0, 0, .3);
-    transform: translateY(-2px);
+.friends-heading {
+  text-align: center;
+  padding-top: 108px;
+  padding-bottom: 48px;
+  border-bottom: 1px solid #dadada;
+  background-color: white;
+  p {
+    max-width: 600px;
+    color: #666;
+    font-size: 15px;
+    margin: 0 auto;
   }
 }
-.companies a img {
-  border-radius: 4px;
-  padding: 8px;
-  vertical-align: top;
-  width: 115px;
+.hall-of-fame {
+  max-width: 750px;
+  margin: 0 auto;
+  padding: 64px 16px;
+  h2 {
+    text-align: center;
+  }
 }
-.companies a img.no-frame {
-  padding: 0;
+.hall-of-fame-subheading {
+  display: block;
+  text-align: center;
+  color: #666;
+}
+.hall-of-fame-content {
+  margin-top: 24px;
+  background-color: white;
+  // max-width: 650px;
+}
+.comp-and-ind {
+  overflow: hidden;
+  background-color: #000;
+  padding: 64px 0;
+  a {
+    border-bottom: 0;
+  }
+  h2 {
+    text-align: center;
+    color: white;
+  }
+  img {
+    -webkit-filter: grayscale(100%);
+    filter: grayscale(100%);
+    width: 120px;
+    margin: 0 16px 16px 16px;
+    transition: all .2s ease;
+    &:hover {
+      -webkit-filter: grayscale(0%);
+      filter: grayscale(0%);
+    }
+  }
+  svg {
+    -webkit-filter: grayscale(100%);
+    filter: grayscale(100%);
+    margin: 0 16px 16px 16px;
+    transition: all .2s ease;
+    &:hover {
+      -webkit-filter: grayscale(0%);
+      filter: grayscale(0%);
+    }
+  }
+}
+.scroller {
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  flex-wrap: wrap;
+  margin: 64px 0 48px 0;
+}
+.individuals {
+  display: flex;
+  justify-content: center;
+  align-items: center;
+  white-space: pre-line;
+  text-align: center;
+  line-height: 1.6em;
+  color: white;
+  font-family: 'Courier', monospace;
 }
 
+// React leaderboard styling
 #leaderboard {}
 .leaderboard-loading {
   border-radius: 4px;
@@ -50,13 +96,13 @@
   margin-top: 16px;
   border-radius: 4px;
   border: 1px solid #ddd;
-  margin-bottom: $base;
+  margin-bottom: 24px;
   display: flex;
 }
 .leaderboard-row {
   flex: 1 0 100%;
   flex-wrap: wrap;
-  padding: $small;
+  padding: 16px;
   border-bottom: 1px solid #ddd;
   display: flex;
   flex-direction: row;
@@ -87,35 +133,36 @@
   width: 115px;
 }
 .leaderboard-row .header {
-  flex: 1 0 46%;
+  flex: 1 0 50%;
   display: flex;
   align-items: center;
   padding-right: 25px;
 }
 .leaderboard-row .header-info {
+  .total {
+    margin-top: 6px;
+    color: #101010;
+  }
 }
 .leaderboard-row .heading {
   display: block;
 }
 .leaderboard-row .heading a {
+  font-family: 'Work Sans', sans-serif;
   border: 0;
+  font-size: 18px;
   font-weight: 700;
-  line-height: 1.6em;
-  // transition: all .15s ease;
-  &:hover {
-    border-bottom: 2px solid black;
-    // color: #fef136;
-    // font-weight: 600;
-  }
+  line-height: 1.4em;
 }
 .leaderboard-row .desc {
   line-height: 1.3em;
   color: #6d6d6d;
+  margin-top: 3px;
   font-size: 13px;
 }
 .leaderboard-row .info {
   display: flex;
-  flex: 1 0 54%;
+  flex: 1 0 40%;
   flex-wrap: wrap;
   padding-bottom: 0;
 }
@@ -125,15 +172,15 @@
   border-radius: 4px;
   flex: 1 0 100%;
   flex-wrap: wrap;
-  padding: $small;
-  margin-top: $small;
+  padding: 16px;
+  margin-top: 16px;
   border: 1px solid #ddd;
   // display: flex;
   &.hide {
     display: none;
   }
   & a {
-    margin-bottom: $tiny;
+    margin-bottom: 8px;
     flex: 1 0 100%;
     border: 0;
   }
@@ -147,7 +194,7 @@
   }
 }
 .leaderboard-row .donation {
-  padding-bottom: $tiny;
+  padding-bottom: 8px;
   line-height: 1.4em;
   &:last-child {
     padding-bottom: 0;
@@ -167,7 +214,7 @@
 }
 .leaderboard-row .data {
   flex: 1;
-  padding-right: $small;
+  padding-right: 16px;
 }
 .leaderboard-row .donation-number {
   font-weight: 600;
@@ -176,8 +223,7 @@
   background: transparent;
   outline: 0;
   padding: 0;
-  font-size: $small;
-  font-family: 'Inter UI';
+  font-size: 16px;
   position: relative;
   top: -2px;
   & svg {
@@ -192,7 +238,7 @@
   justify-content: center;
   align-items: center;
   flex: 1 0 100%;
-  padding: $base;
+  padding: 24px;
   border-bottom: 1px solid #ddd;
   font-size: 15px;
   font-weight: 500;
@@ -207,7 +253,7 @@
   display: flex;
   align-items: center;
   justify-content: center;
-  margin-bottom: $base;
+  margin-bottom: 24px;
 }
 #friends-show-more-btn {
   border-radius: 4px;
@@ -216,7 +262,7 @@
   font-family: 'Inter UI';
   font-size: 16px;
   cursor: pointer;
-  padding: $tiny $small;
+  padding: 8px 16px;
   color: #999;
   transition: all .15s ease;
   box-shadow: 0 3px 6px rgba(0, 0, 0, 0.08);
@@ -230,14 +276,14 @@
 .individuals {
   display: flex;
   flex-wrap: wrap;
-  margin-bottom: $base;
+  margin-bottom: 24px;
   // justify-content: center;
 }
 .individual {
   border-radius: 25px;
   background-color: #f1f1f1;
-  padding-right: $small;
-  margin: 0 $tiny $tiny 0;
+  padding-right: 16px;
+  margin: 0 8px 8px 0;
   // display:
 }
 .individual img {
@@ -254,6 +300,9 @@
   vertical-align: middle;
 }
 @media (max-width: 767px) {
+  .friends-heading {
+    padding: 32px 16px 32px 16px;
+  }
   .leaderboard-row .logo {
     width: 65px;
     height: 65px;
@@ -262,7 +311,7 @@
     width: 65px;
   }
   .leaderboard-row .info {
-    margin-top: 12px;
+    margin-top: 16px;
   }
   .leaderboard-row .header {
     flex: 1 0 100%;
diff --git a/_sass/fund.scss b/_sass/fund.scss
new file mode 100644
index 00000000..795ee2fc
--- /dev/null
+++ b/_sass/fund.scss
@@ -0,0 +1,56 @@
+.fund {
+  padding: 128px 16px 0 16px;
+  max-width: 700px;
+  margin: 0 auto;
+  a {
+    border-bottom: 1px solid white;
+  }
+}
+.fund-heading {
+  display: block;
+  span {
+    display: block;
+    text-align: center;
+  }
+  h1 {
+    text-align: center;
+    font-size: 72px;
+    font-weight: 800;
+    margin: 4px 0 16px 0;
+  }
+  small {
+    display: block;
+    text-align: center;
+    opacity: 0.65;
+  }
+}
+.fund-donation-type {
+  font-weight: 900;
+  font-size: 11px;
+  display: block;
+  margin-bottom: 3px;
+}
+.fund-address {
+  display: inline-block;
+  margin-bottom: 16px;
+  border-bottom: 1px solid white;
+  padding-bottom: 2px;
+  font-family: 'Courier', monospace;
+  word-break: break-word;
+}
+.fund-closed {
+  display: inline-block;
+  margin-bottom: 16px;
+  line-height: 1.4em;
+}
+
+@media (max-width: 768px) {
+  .fund-heading {
+    h1 {
+      text-align: center;
+      font-size: 56px;
+      font-weight: 800;
+      margin: 4px 0 16px 0;
+    }
+  }
+}
diff --git a/_sass/index.scss b/_sass/index.scss
index e9eac352..f1b6af16 100644
--- a/_sass/index.scss
+++ b/_sass/index.scss
@@ -1,401 +1,159 @@
-main {
-}
-main > header {
-  align-items: center;
-  display: flex;
-  flex-grow: 1;
-  justify-content: center;
-}
-hr {
-  border-bottom-width: 1px;
-  border-bottom-style: dotted;
-  border-left: 0;
-  border-right: 0;
-  border-top: 0;
-  margin: $base 0;
-}
-#intro {
-  display: flex;
-  flex-direction: column;
-  // margin-top: -77px;
-  min-height: 100vh;
-}
-#splash {
-  align-items: center;
-  display: flex;
-  flex-wrap: wrap;
-  flex-grow: 1;
-  justify-content: center;
-}
-.intro {
-  flex-grow: 5
-}
-.intro-logo {
-  justify-content: center;
-  flex-grow: 9;
-  display: flex;
-  align-items: center;
-}
-.intro h1 {
-  font-size: 46px;
-  margin-bottom: 7px;
-  letter-spacing: -0.03em;
-}
-.intro-buttons {
-  margin-top: $small;
-  display: flex;
-  flex-direction: row;
-}
-.intro-button {
-  background: black;
-  box-shadow: 0 4px 6px rgba(50,50,93,.11), 0 1px 3px rgba(0,0,0,.08);
-  border-radius: 4px;
-  border: 0;
+.section-1 {
+  background-color: #101010;
+  height: calc(100vh - 48px);
+  width: 100%;
   color: white;
-  cursor: pointer;
-  display: inline-block;
-  font-family: "Inter UI";
-  font-size: 16px;
-  flex-grow: 0;
-  padding: 10px 15px;
-  margin-right: 20px;
-  outline: 0;
-  transition: all .15s ease;
-  white-space: nowrap;
-  &:hover {
-    -webkit-transform: translateY(-1px);
-    -webkit-box-shadow: 0 13px 27px -5px rgba(50,50,93,.25), 0 8px 16px -8px rgba(0,0,0,.3);
-    -webkit-box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08);
-    box-shadow: 0 13px 27px -5px rgba(50,50,93,.25), 0 8px 16px -8px rgba(0,0,0,.3);
-    box-shadow: 0 7px 14px rgba(50,50,93,.1), 0 3px 6px rgba(0,0,0,.08);
-    transform: translateY(-1px);
-  }
-}
-.intro p {
-  font-size: 21px;
-  line-height: 30px;
-}
-.grin-logo {
-  width: 320px;
-}
-#status {
-  align-items: center;
-  background-color: white;
-  color: black;
   display: flex;
-  flex-wrap: wrap;
-  padding: $base $small 28px $small;
   justify-content: center;
+  align-items: center;
+  flex-direction: column;
 }
-.status-text {
-  background: $light-green;
-  border-radius: 4px;
-  color: white;
-  font-family: monospace;
-  font-size: 13px;
-  font-weight: 700;
-  min-width: 100px;
-  padding: $tiny;
-}
-.status-message {
-  font-size: 14px;
-  line-height: 1.6em;
-  margin: 12px $small 12px $small;
+.section-1-intro {
+  width: 342px;
   text-align: center;
 }
-#primary {
-  background-color: #0b0b0b;
-  color: white;
-}
-#primary div {
-  max-width: 900px;
+.section-1-grin {
+  font-family: 'Work Sans', sans-serif;
+  font-size: 26px;
+  font-weight: 800;
 }
-#primary p {
-  margin-bottom: 16px;
-  font-size: 17px;
+.section-1-v {
+  font-family: 'Space Mono', monospace;
+  font-size: 22px;
+  letter-spacing: -5px;
 }
-#primary hr {
-  border-color: grey !important;
-  margin-bottom: 0 !important;
+.section-1-version {
+  font-family: 'Space Mono', monospace;
+  font-size: 22px;
+  letter-spacing: -4px;
 }
-.primary-root {
-  padding: $large;
-  margin: 0 auto;
+.section-1-text {
+  font-family: 'Courier', monospace;
+  font-size: 12px;
+  margin-top: 10px;
+  line-height: 1.3em;
+  opacity: 0.78;
 }
-.pitch {
-  margin-bottom: $base;
+.section-1-star {
+  font-size: 18px;
+  font-family: 'Times New Roman', serif;
+  position: relative;
+  bottom: -64px;
 }
-.properties {
+.section-1-lights {
+  position: relative;
   display: flex;
-  flex-wrap: wrap;
+  transform: translateY(-50%);
+  max-width: 700px;
+  max-height: 500px;
+  margin: 0 auto -108px auto;
+  vertical-align: top;
 }
-.properties img {
-  height: 80px;
-  margin-right: $tiny;
-  width: 80px;
+
+.section-2 {
+  width: 600px;
+  max-width: 100%;
+  margin: 0 auto;
+  p {
+    font-family: 'Inter';
+    font-size: 21px;
+    line-height: 1.5em;
+    margin-top: 18px;
+  }
 }
-.property {
-  flex: 1;
-  margin-top: $base;
-  min-width: 200px;
+.section-2-title {
+  font-family: 'Work Sans', sans-serif;
+  font-size: 16px;
+  font-weight: 900;
 }
-.property-title {
-  align-items: center;
+.section-2-cash {
+  max-width: 1070px;
+  mix-blend-mode: difference;
   display: flex;
-}
-.property p {
-  margin-bottom: 0 !important;
-  padding: $tiny $tiny 0 0 ;
-}
-#secondary {
-  padding: $large $large;
   margin: 0 auto;
-  max-width: 900px;
+  border-radius: 5px;
+  transform: translateY(50%);
+  vertical-align: top;
 }
-#secondary hr {
-  border-bottom-color: #d0d0d0;
+
+.section-3 {
+  background-color: #101010;
+  padding-top: 224px;
+  color: white;
 }
-.info {
+.section-3-content {
+  max-width: 600px;
   display: flex;
-  flex-wrap: wrap;
-  padding-bottom: 2px;
-  // margin-bottom: 4px;
-  // padding-top: $tiny;
-}
-.info h2 {
-  margin-bottom: 14px;
-}
-.info a {
-  display: block;
-  border: 0;
-  // display: flex;
-  align-items: stretch;
-  flex: 1;
-  margin: 0 $small 18px 0;
-  // margin-bottom: $small;
-  // margin-right: $small;
-  // margin: 0 $tiny;
-  min-width: 200px;
-  &:last-child {
-    margin-right: 0;
-  }
-}
-.info-box {
-  border-radius: 4px;
-  border: 1px solid #f2f2f2;
-  box-shadow: 0 10px 45px -12px rgba(93, 90, 50, 0.25), 0 18px 36px -18px rgba(0, 0, 0, .3);
-  padding: $small;
-  transition: all .15s ease;
-  &:hover {
-    box-shadow: 0 15px 55px -12px rgba(93, 90, 50, 0.25), 0 18px 36px -18px rgba(0, 0, 0, .3);
-    transform: translateY(-2px);
+  margin: 0 auto;
+  ul {
+    list-style-type: none !important;
   }
-  &:hover > .info-learn-more:after {
-    margin-left: 10px;
+  li {
+    margin-left: 0;
   }
 }
-.info-learn-more {
-  color: #151515;
-  font-size: 14px;
-  font-weight: 700;
-  &:after {
-    content: "\2192";
-    margin-left: 6px;
-    transition: all .15s ease;
-  }
+.section-3-read-more {
+  font-family: 'Times New Roman', serif;
+  font-style: italic;
+  font-size: 24px;
+  flex-basis: 70%;
 }
-.info-banner {
-  align-items: center;
-  border-radius: 4px;
-  box-shadow: 0 10px 45px -12px rgba(93, 90, 50, 0.25), 0 18px 36px -18px rgba(0, 0, 0, .3);
-  display: flex;
-  height: 220px;
-  justify-content: center;
-  // margin: 0 $tiny 4px $tiny;
-  transition: all .15s ease;
-  &:hover {
-    box-shadow: 0 15px 55px -12px rgba(93, 90, 50, 0.25), 0 18px 36px -18px rgba(0, 0, 0, .3);
-    transform: translateY(-2px);
-  }
-  &:hover > img {
-    opacity: 1;
-  }
-  &:hover > h1 {
-    opacity: .4;
+.section-3-link {
+  font-size: 22px;
+  margin-bottom: 6px;
+  a {
+    color: white;
   }
-}
-.info-banner-text {
-  color: white;
-  line-height: 1.2em;
-  margin-bottom: 0 !important;
-  padding: $small $base;
-  text-align: center;
-  transition: all .15s ease;
-}
-.info-grin-logo {
-  height: 220px;
-  opacity: .18;
-  position: absolute;
-  transition: all .15s ease;
-}
-.funding p {
-  margin-bottom: 12px;
-}
-.funding-progress-container {
-  background-color: #eaeaea;
-  border:1px solid #eaeaea;
-  border-radius: 10px;
-  height: 6px;
-  margin-bottom: 10px;
-  position: relative;
-  top: -6px;
-  width: 100%;
-  z-index: 0;
-}
-.funding-progress {
-  border-radius: 10px;
-  background-color: #151515;
-  border:1px solid #151515;
-  margin-top: 10px;
-  position: relative;
-  height: 6px;
-  z-index: 10;
-}
-.funding-amount {
-  font-family: monospace;
-}
-.funding-button {
-  border: 2px solid $smiley-yellow;
-  border-radius: 4px;
-  background: $smiley-yellow;
-  color: black;
-  cursor: pointer;
-  display: inline-block;
-  font-family: "Inter UI";
-  font-size: 14px;
-  font-weight: 700;
-  flex-grow: 0;
-  margin-right: $tiny;
-  margin-bottom: 12px;
-  outline: 0;
-  padding: $tiny 13px;
-  transition: all .15s ease;
-  &:hover {
-    // background: $;
-    // border-color: #222;
-    color: black;
-    transform: translateY(-1px);
+  p {
+    font-family: 'Times New Roman';
+    display: inline;
   }
-}
-.funding-friends {
-  background: #151515;
-  border: 2px solid #151515;
-  border-radius: 4px;
-  color: white;
-  cursor: pointer;
-  display: inline-block;
-  flex-grow: 0;
-  font-family: "Inter UI";
-  font-size: 14px;
-  font-weight: 700;
-  outline: 0;
-  padding: $tiny 13px;
-  margin-right: $tiny;
-  margin-bottom: 12px;
-  transition: all .15s ease;
-  &:hover {
-    background-color: black;
-    color: white;
-    transform: translateY(-1px);
+  span {
+    border-bottom: 1px solid white;
   }
 }
-.funding-swag {
-  background: white;
-  border: 2px solid #151515;
-  border-radius: 4px;
-  color: black;
-  cursor: pointer;
-  display: inline-block;
-  flex-grow: 0;
-  font-family: "Inter UI";
-  font-size: 14px;
-  font-weight: 700;
-  outline: 0;
-  padding: $tiny 14px;
-  margin-right: $tiny;
-  transition: all .15s ease;
-  &:hover {
-    background-color: #151515;
-    color: white;
-    transform: translateY(-1px);
+.section-3-text {
+  font-family: 'Inter';
+  line-height: 1.6em;
+  margin-top: 32px;
+  a {
+    border-bottom: 1px solid white;
   }
-}
-.dev-intro {
-  align-items: center;
-  background-color: black;
-  display: flex;
-  justify-content: center;
-}
-.dev-intro span {
-  color: white;
-  flex-grow: 0;
-  font-family: monospace;
-  font-weight: 700;
+  // opacity: 0.8;
 }
 
-@media (min-width: 768px) {
-  #intro {
-    margin-top: -77px;
-  }
-}
-@media (max-width: 767px) {
-  #intro {
-    margin-top: -36px;
+@media (max-width: 1070px) {
+  .section-2-cash {
+    max-width: 100%;
+    padding: 0 16px;
   }
-  #status {
-    padding-bottom: $small;
+  .section-3 {
+    padding: 18% 16px 16px 16px;
   }
-  .intro-button {
-    margin: 0 10px;
+}
+@media (max-width: 768px) {
+  .section-1-lights {
+    max-width: 100%;
+    padding: 0 16px;
   }
-  .primary-root {
-    padding: 32px;
+  .section-2 {
+    padding: 24px 16px 16px 16px;
   }
-  #secondary {
-    padding: 32px;
+  .section-2-cash {
+    max-width: 100%;
+    padding: 0 16px;
   }
-  #splash {
-    flex-direction: column;
+  .section-3 {
+    padding: 18% 16px 16px 16px;
   }
-  .intro {
-    align-items: center;
-    display: flex;
+  .section-3-content {
     flex-direction: column;
-    flex-grow: 1;
-    text-align: center;
-  }
-  .intro-logo {
-    align-items: flex-end;
-    flex-grow: 1;
   }
-  .grin-logo {
-    width: 280px;
-  }
-  .info {
-    display: block;
-  }
-  .info a {
-    margin: 0 0 20px 0;
-  }
-}
-@media (max-width: 480px) {
-  #intro {
-    margin-top: 0;
-  }
-  .intro-text h1 {
-    font-size: 42px;
+  .section-3-read-more {
+    margin-left: 10px;
+    margin-bottom: 18px;
   }
-  .info-banner-text {
-    font-size: 44px;
+  .section-3-link {
+    font-size: 19px;
   }
 }
diff --git a/_sass/navigation.scss b/_sass/navigation.scss
index 782d3764..f024fb7b 100644
--- a/_sass/navigation.scss
+++ b/_sass/navigation.scss
@@ -1,198 +1,148 @@
-header > nav {
+header {
+  position: fixed;
+  top: 0;
+  left: 0;
+  right: 0;
+  max-width: 1140px;
+  margin: 0 auto;
   display: flex;
-  flex-direction: row;
-}
-nav ul {
-  margin-bottom: 0;
-}
-nav a {
-}
-.nav-logo {
-  font-weight: 700;
-}
-.nav-logo {
-  padding-left: $base;
+  align-items: center;
+  mix-blend-mode: difference;
+  z-index: 1000;
+  a {
+    font-family: 'Courier', monospace;
+    color: white;
+    font-size: 13px;
+    font-weight: normal;
+    border: 0;
+  }
 }
-.nav-logo li {
+nav {
   display: flex;
-  height: 64px;
-  width: 100px;
-  // justify-content: center;
+  flex-grow: 1;
   align-items: center;
+  margin: 24px 16px 0 16px;
 }
-.nav-logo a {
-  font-size: 24px;
-  border: 0 !important;
-}
-.nav-root {
+.nav-logo {
   flex-grow: 1;
-  align-items: stretch;
-  list-style: none;
-  text-align: right;
-  display: flex;
-  flex-direction: row;
-  justify-content: flex-end;
-}
-.nav-root li {
-  padding: $base $small $base 0;
-  z-index: 100;
-  &:last-child {
-    padding: $base 26px $base 0;
+  &:hover ~ #grin-logo-full {
+    visibility: visible;
   }
 }
-.nav-root li > a {
-  border-bottom: 0;
-  &:hover {
-    border-bottom: 2px solid black;
-  }
-}
-.nav-hamburger {
-  display: none;
-}
-.nav-hamburger.is-active {
-  background-color: white;
-}
-.hamburger {
-  padding: $base;
-}
-.hamburger.is-active {
-  z-index: 1000;
-  position: fixed;
-}
-.hamburger.is-active .hamburger-inner {
-  background-color: white;
-}
-.hamburger.is-active .hamburger-inner:after {
-  background-color: white;
-}
-.nav-mobile {
-  visibility: hidden;
+.full-header {
   top: 0;
   left: 0;
   right: 0;
-  bottom: 0;
-  background-color: black;
   position: fixed;
-  color: white;
-  padding: 26px;
-  list-style: none;
-  height: 100%;
-  width: 100%;
-  font-weight: 700;
-  overflow-y: scroll;
-  // display: flex;
-  // justify-content: center;
-  // align-items: center;
-  // flex-direction: column;
-  z-index: 500;
+  max-width: 1140px;
+  margin: 0 auto;
+  z-index: 100000;
+  pointer-events: none;
 }
-.nav-mobile.is-active {
-  visibility: visible;
+.full-nav {
+  margin: 24px 16px 0 16px;
 }
-.nav-mobile-fade {
+#grin-logo {
+  display: inline-block;
   position: relative;
-  opacity: 0;
-  bottom: -15px;
-  transition: bottom .3s ease, color .15s ease, opacity .35s ease;
 }
-.nav-mobile-fade.is-active {
-  opacity: 1;
-  bottom: 0;
+#grin-logo-bare {
+  transition: all .1s ease;
+  transform: rotate(0deg);
 }
-.nav-mobile li {
-  display: block;
-  // text-align: center;
-  // line-height: 1.1em;
-  margin-bottom: $tiny;
-}
-.nav-mobile li a {
-  font-size: $h3;
-  line-height: 1.1em;
-  transition: bottom .35s ease, color .15s ease, opacity .35s ease;
-  border-bottom: 0;
+#grin-logo-full {
+  display: inline-block;
+  border: 0;
+  opacity: 0;
   &:hover {
-    color: #fef102;
+    opacity: 1;
   }
 }
-.nav-mobile-heading {
-  font-weight: 700;
-  display: block;
-  font-size: $h3;
-  color: $grey;
-  margin: 20px 0 $tiny 0;
-  &:first-child {
-    margin-top: 0;
-  }
-}
-.nav-mobile-secondary {
-  list-style-type: circle;
-  padding-left: 0;
+#grin-logo-full-svg {
+  transition: all .1s ease;
+  transform: rotate(0deg);
 }
-.dropdown {
-  cursor: pointer;
-  display: block;
-  position: relative;
-  &:hover > nav {
-    display: block;
+.nav-list {
+  display: flex;
+  margin: 12px 0 0 0;
+  li {
+    margin-right: 24px;
   }
 }
-.dropdown nav {
-  background-color: white;
-  white-space: nowrap;
+.nav-hamburger {
   display: none;
-  position: absolute;
-  top: $small;
-  right: 0;
-  margin-top: $small;
-  border-radius: 4px;
-  border: 1px solid #f2f2f2;
-  padding: $tiny 0;
-  box-shadow: 0 10px 45px -12px rgba(93, 90, 50, 0.25), 0 18px 36px -18px rgba(0, 0, 0, 0.3);
-  transition: all .15s ease;
-  min-width: 100px;
-  &::after {
-    content: "";
-    border-color: transparent;
-    border-width: .5rem;
-    top: -$small;
-    margin: 0;
-    left: 0;
-    right: 0;
-    position: absolute;
-    border-width: 12px;
-    border-style: solid;
+  &.active {
+    .nav-hamburger-line.first {
+      transform: translateY(6px) rotate(45deg);
+    }
+    .nav-hamburger-line.second {
+      transform: translateY(-2px) rotate(-45deg);
+    }
   }
 }
-.dropdown-heading {
-  color: $grey;
-  font-size: 12px;
-  padding: 0 18px 4px $small;
+.nav-hamburger-btn {
+  cursor: pointer;
+  border: 0;
+  background-color: transparent;
+  padding: 16px;
+  outline: 0;
+}
+.nav-hamburger-line {
+  width: 24px;
+  height: 2px;
+  background-color: white;
+  margin: 6px 0;
+  transform: rotate(0deg);
+  transition: all .25s;
 }
-.dropdown nav a {
+.nav-hamburger-fullscreen {
+  display: none;
+  opacity: 0;
   background-color: white;
-  word-break: break-all;
-  display: block;
-  border-bottom: 0;
-  white-space: nowrap;
-  padding: 4px $small 4px 18px;
-  &:hover {
-    background-color: #f2f2f2;
+  pointer-events: none;
+  top: 0;
+  right: 0;
+  bottom: 0;
+  left: 0;
+  z-index: 1;
+  position: fixed;
+  overflow: hidden;
+  transition: opacity .25s;
+  display: flex;
+  flex-direction: column;
+  // justify-content: center;
+  padding: 128px 24px 0 24px;
+  a {
+    border-bottom: 0;
+    padding-bottom: 0;
+  }
+  h2 {
+    margin: 12px 0;
+    font-size: 28px;
+  }
+  &.active {
+    opacity: 1;
+    pointer-events: all;
   }
 }
 
-@media (max-width: 767px) {
-  .nav-root {
+@media (max-width: 768px) {
+  header {
+    max-width: 100%;
+  }
+  nav {
+    margin: 16px;
+  }
+  .full-nav {
+    margin: 16px;
+  }
+  .nav-list {
     display: none;
   }
   .nav-hamburger {
-    display: flex;
-    justify-content: flex-end;
-    align-items: center;
-    flex-grow: 1;
+    display: block;
   }
-}
-@media (min-width: 768px) {
-  .nav-mobile {
-    visibility: hidden !important;
+  .nav-hamburger-fullscreen {
+    display: flex;
   }
 }
diff --git a/_sass/visual.scss b/_sass/visual.scss
index 80b9ab3a..e69de29b 100644
--- a/_sass/visual.scss
+++ b/_sass/visual.scss
@@ -1,32 +0,0 @@
-.visual-text {
-  display: block;
-  font-size: 56px;
-  font-weight: 800;
-  padding: $base;
-}
-.visual-logos {
-  display: flex;
-  flex-direction: row;
-  flex-wrap: wrap;
-  justify-content: center;
-}
-.visual-box {
-  flex-grow: 1;
-  width: 200px;
-  height: 200px;
-  padding: 1px;
-  display: flex;
-  align-items: center;
-  justify-content: center;
-}
-.visual-box img {
-  height: 200px;
-  width: 200px;
-}
-.visual-box h1 {
-}
-.banner {
-  display: flex;
-  justify-content: center;
-  align-items: center;
-}
diff --git a/assets/css/main.scss b/assets/css/main.scss
index 20bab526..041269af 100644
--- a/assets/css/main.scss
+++ b/assets/css/main.scss
@@ -2,92 +2,119 @@
 ---
 
 @import 'reset';
-@import 'variables';
-@import 'hamburger';
-@import 'markdown';
 @import 'fonts';
+@import 'index';
 @import 'navigation';
 @import 'footer';
-@import 'index';
-@import 'visual';
+@import 'fund';
 @import 'friends';
+@import 'markdown';
+@import 'community';
 @charset 'utf-8';
 html, body {
-  font-family: 'Inter UI';
+  display: flex;
+  flex-direction: column;
+  font-family: 'Inter';
   background-color: white;
-  color: block;
-  margin: 0 auto;
-  font-size: $regular;
+  width: 100%;
+  min-height: 100vh;
+  font-size: 13px;
+  font-feature-settings: 'cv10' 1, 'zero' 1, 'ss01' 1;
+  &.black {
+    background-color: #101010;
+  }
 }
 a {
-  border-bottom-width: 2px;
-  border-bottom-style: solid;
-  border-bottom-color: #000;
   text-decoration: none;
+  border-bottom: 1px solid black;
+  padding-bottom: 1px;
   color: inherit;
-  &:hover {
-    border-color: transparent;
-  }
 }
 strong {
   font-weight: 700;
 }
+p {
+  line-height: 1.5em;
+  white-space: pre-line;
+  margin-bottom: 24px;
+}
 * {
   box-sizing: border-box;
 }
-// h1 {
-//   font-size: 56px;
-//   font-weight: 700;
-//   margin-bottom: 8px;
-// }
-// h2 {
-//   font-size: 36px;
-//   font-weight: 700;
-//   margin-bottom: 8px;
-// }
-// h3 {
-//   font-size: 28px;
-//   margin-bottom: 8px;
-// }
-h4 {
-  font-size: 19px;
+h1 {
+  font-size: 48px;
+  font-weight: 800;
+  margin-bottom: 12px;
+  font-family: 'Work Sans', sans-serif;
+}
+h2 {
+  font-size: 36px;
+  font-weight: 700;
+  margin-bottom: 12px;
+  font-family: 'Work Sans', sans-serif;
+}
+h3 {
+  font-size: 24px;
+  font-weight: 700;
   margin-bottom: 8px;
+  margin-top: 4px;
+  font-family: 'Work Sans', sans-serif;
+}
+ul {
+  line-height: 1.4em;
+  margin-bottom: 24px;
+  list-style-type: disc;
+  list-style-position: outside;
+}
+ol {
+  line-height: 1.4em;
+  margin-bottom: 24px;
+  list-style-type: decimal;
+  list-style-position: outside;
 }
-// p {
-//   line-height: 1.6em;
-//   margin-bottom: $small;
-//
-// }
 li {
-  line-height: 1.6em;
-  // margin-bottom: 2px;
+  margin-left: 16px;
+  margin-bottom: 12px;
+  ul {
+    margin-top: 12px;
+  }
+  p {
+    margin-bottom: 16px;
+  }
 }
-.fab {
-  font-size: 15px;
-  font-family: "Font Awesome 5 Brands";
-  padding-left: 2px;
+
+.medium {
+  font-weight: 550;
 }
-.fa-github:before {
-  content: "\f09b";
+.justify-center {
+  display: flex;
+  justify-content: center;
 }
-.container {
-  max-width: 1040px;
-  width: 100%;
-  margin: 0 auto;
+.align-center {
+  display: flex;
+  align-items: center;
 }
-.container-sm {
-  max-width: 900px;
+.site {
   width: 100%;
-  margin: 0 auto;
+  min-height: 100%;
+  background-color: white;
+  flex-grow: 1;
+  &.pad {
+    padding-top: 80px;
+  }
+  &.black {
+    background-color: #101010;
+    color: white;
+  }
+  &.grey {
+    background-color: #f2f2f2;
+  }
 }
-.main-root {
-  padding: 48px 48px;
-  max-width: 900px;
+.page {
+  padding: 128px 16px 64px 16px;
+  max-width: 700px;
   margin: 0 auto;
 }
 
-@media (max-width: 767px) {
-  .main-root {
-    padding: 32px;
-  }
+@media (max-width: 768px) {
 }
diff --git a/assets/fonts/Inter-upright.var.woff2 b/assets/fonts/Inter-upright.var.woff2
new file mode 100644
index 00000000..37d99007
Binary files /dev/null and b/assets/fonts/Inter-upright.var.woff2 differ
diff --git a/assets/fonts/Inter.var.woff2 b/assets/fonts/Inter.var.woff2
new file mode 100644
index 00000000..1c914525
Binary files /dev/null and b/assets/fonts/Inter.var.woff2 differ
diff --git a/assets/images/cash.png b/assets/images/cash.png
new file mode 100644
index 00000000..f6e62275
Binary files /dev/null and b/assets/images/cash.png differ
diff --git a/assets/images/img1@3x.png b/assets/images/img1@3x.png
new file mode 100644
index 00000000..79d1e849
Binary files /dev/null and b/assets/images/img1@3x.png differ
diff --git a/assets/images/ironbelly.png b/assets/images/ironbelly.png
new file mode 100644
index 00000000..94456c18
Binary files /dev/null and b/assets/images/ironbelly.png differ
diff --git a/community.html b/community.html
new file mode 100644
index 00000000..8199069c
--- /dev/null
+++ b/community.html
@@ -0,0 +1,23 @@
+---
+layout: default
+---
+
+<main class="site pad grey">
+  <div class="community">
+    <h2>Community Projects</h2>
+    <div class="community-subheading">
+      Grin does not endorse nor support any of the listed projects.<br>
+      We only list community projects, use at your own risk.
+    </div>
+    <div class="community-content">
+      <div class="community-row">
+        <img class="community-row-img" src="assets/images/ironbelly.png" />
+        <div class="community-row-content">
+          <div class="community-row-heading">Ironbelly</div>
+          <div class="community-row-desc">Grin mobile wallet you’ve deserved.</div>
+          <div class="community-row-category">iOS and Android app</div>
+        </div>
+      </div>
+    </div>
+  </div>
+</main>
diff --git a/friends.html b/friends.html
index 75dd710a..149e1fee 100644
--- a/friends.html
+++ b/friends.html
@@ -1,336 +1,209 @@
 ---
-layout: page
+layout: default
 ---
 
-<h1>Friends of Grin</h1>
-<p>
-  The following companies, institutions, or individuals have generously donated
-  financial resources to the Grin project under our
-  <a href="/funding">community funding model</a>. We're grateful for their
-  support, and are proud to display their logos or names as supporters of Grin.
-</p>
-
-<h2>Hall of Fame</h2>
-<p>
-  Please note: This section has just been introduced and is a <b><em>work in progress</em></b>.
-  Data to populate donation amounts is obtained from our recently created <a
-    href="https://github.com/mimblewimble/grin-pm/blob/master/financials/income_log.csv">income log</a>.
-  We are trying to retroactively populate this log with your donations, but this might take us some time.
-  We welcome help from supporters and the wider community to achieve this.
-</p>
-<section id="leaderboard">
-  <div class="leaderboard-content">
-    <div class="leaderboard-row">
-      <div class="leaderboard-loading">
-      </div>
-    </div>
-    <br />
-    <div class="leaderboard-row">
-      <div class="leaderboard-loading">
-      </div>
-    </div>
-    <br />
-    <div class="leaderboard-row">
-      <div class="leaderboard-loading">
-      </div>
-    </div>
-    <br />
-    <div class="leaderboard-row">
-      <div class="leaderboard-loading">
+<main class="site pad">
+  <div class="friends">
+    <div class="friends-heading">
+      <h1>Friends of Grin</h1>
+      <p>The following companies, institutions, or individuals have generously donated financial resources to the Grin project under our community funding model. We're grateful for their support, and are proud to display their logos or names as supporters of Grin.</p>
+    </div>
+    <div class="hall-of-fame">
+      <h2>Hall of Fame</h2>
+      <span class="hall-of-fame-subheading">Grin's biggest supporters.</span>
+      <section id="leaderboard" class="hall-of-fame-content">
+        <div class="leaderboard-content">
+          <div class="leaderboard-row">
+            <div class="leaderboard-loading">
+            </div>
+          </div>
+          <br />
+          <div class="leaderboard-row">
+            <div class="leaderboard-loading">
+            </div>
+          </div>
+          <br />
+          <div class="leaderboard-row">
+            <div class="leaderboard-loading">
+            </div>
+          </div>
+          <br />
+          <div class="leaderboard-row">
+            <div class="leaderboard-loading">
+            </div>
+          </div>
+          <br />
+          <div class="leaderboard-row">
+            <div class="leaderboard-loading">
+            </div>
+          </div>
+        </div>
+      </section>
+    </div>
+    <div class="comp-and-ind">
+      <h2>Companies & Individuals</h2>
+      <div class="scroller">
+        <a href="https://www.bitonic.nl/">
+          <img src="assets/images/logos/bitonic-white.png" title="Bitonic">
+        </a>
+        <a href="https://www.kryptonite1.co/">
+          <img src="assets/images/logos/kr1_med.png" title="KR1">
+        </a>
+        <a href="https://www.tmgox.com/">
+          <img src="assets/images/logos/tmgox-logo.jpg" title="TMGOX">
+        </a>
+        <a href="https://gpu.one/">
+          <img src="assets/images/logos/gpuOne-white.png" title="GPU.one">
+        </a>
+        <a href="https://www.megapool.info/">
+          <img class="no-frame" src="assets/images/logos/Mega-Pool-Logo-trans.png" title="Mega Pool">
+        </a>
+        <a href="https://www.grinmint.com/">
+          <img src="assets/images/logos/grinmint_logo_square.svg" title="Grinmint by BlockCypher">
+        </a>
+        <a href="https://kyokan.io/">
+          <img src="assets/images/logos/kyokan_teal_white.png" title="Kyokan">
+        </a>
+        <a href="http://innosilicon.com/">
+          <img src="assets/images/logos/Innosilicon.png" title="Innosilicon">
+        </a>
+        <a href="https://galleon.exchange/">
+          <img src="assets/images/logos/galleon.png" title="Galleon">
+        </a>
+        <a href="https://mining.luxor.tech">
+          <img class="no-frame" src="assets/images/logos/luxor_logo.png" title="Luxor">
+        </a>
+        <a href="https://beam-mw.com/">
+          <img src="assets/images/logos/beam_logo.png" title="Beam">
+        </a>
+        <a href="https://continue.capital/">
+          <img src="assets/images/logos/continuecapital.png" title="Continue Capital">
+        </a>
+        <a href="http://cyphercapital.net/">
+          <img src="assets/images/logos/cypher_capital.png" title="Cypher Capital">
+        </a>
+        <a href="https://hashrabbit.co/">
+          <img src="assets/images/logos/hashrabbit.png" title="Cypher Capital">
+        </a>
+        <a href="https://lemniscap.com/">
+          <img src="assets/images/logos/lemniscap.png" title="Lemniscap">
+        </a>
+        <a href="#">
+          <img class="no-frame" src="assets/images/logos/chanceventures.png" title="Chance Ventures">
+        </a>
+        <a href="https://www.wings.ai/">
+          <img class="no-frame" src="assets/images/logos/wingsai-grey.png" title="Wings">
+        </a>
+        <a href="https://www.cgs.group/">
+          <img src="assets/images/logos/cgs-logo-white.svg" title="CGS Group">
+        </a>
+        <a href="https://www.coingecko.com/en/coins/grin">
+          <img class="no-frame" src="assets/images/logos/CoinGecko-WhiteText-small.png" title="CoinGecko">
+        </a>
+        <a href="https://hashoutliers.com">
+          <img class="no-frame" src="assets/images/logos/Outliers-256x.png" title="Outliers">
+        </a>
+        <a href="https://www.bhex.com/">
+          <img class="no-frame" src="assets/images/logos/bhex-384x.png" title="Blue Helix Exchange(BHEX)">
+        </a>
+        <a href="https://www.sparkpool.com/">
+          <img class="no-frame" src="assets/images/logos/Sparkpool-660x.png" title="SparkPool">
+        </a>
+        <a href="https://qtum.org/">
+          <img class="no-frame" src="assets/images/logos/qtum.png" title="Qtum">
+        </a>
+        <a href="https://bit.fish/">
+          <img src="assets/images/logos/bitfish.png" title="bitfish">
+        </a>
+        <a href="https://bminer.me/">
+          <img class="no-frame" src="assets/images/logos/bminer-white-only.png" title="bminer">
+        </a>
+        <a href="https://prokapi.com/">
+          <img src="assets/images/logos/prokapi-white.png" title="Prokapi">
+        </a>
+        <a href="https://hashtagchain.com/">
+          <img class="no-frame" src="assets/images/logos/hashtag-capital.png" title="Hashtag Capital">
+        </a>
+        <a href="https://www.f2pool.com/">
+          <img src="assets/images/logos/f2pool.png" title="F2Pool">
+        </a>
+        <a href="https://www.minerbabe.com/">
+          <img class="no-frame" src="assets/images/logos/minerbabe-white.png" title="Minerbabe">
+        </a>
+        <a href="https://0301.farm/">
+          <img class="no-frame" src="assets/images/logos/0301-transparent.png" title="0301 - Mining Farm">
+        </a>
+        <a href="https://2miners.com">
+          <img class="no-frame" src="assets/images/logos/logo-2miners-red.svg" title="2Miners">
+        </a>
+        <a href="https://poloniex.com">
+          <img class="no-frame" src="assets/images/logos/poloniex.png" title="Poloniex">
+        </a>
+        <a href="https://www.grinamsterdam.com/">
+          <img class="no-frame" src="assets/images/logos/grin_amsterdam_logo_white.png" title="Grin Amsterdam">
+        </a>
+        <a href="https://www.exsilico.com/">
+          <img class="no-frame" src="assets/images/logos/exsilico.png" title="exsilico">
+        </a>
+        <a href="https://www.gate.io/">
+          <img class="no-frame" src="assets/images/logos/gateio_logo.png" title="Gate.io">
+        </a>
       </div>
-    </div>
-    <br />
-    <div class="leaderboard-row">
-      <div class="leaderboard-loading">
+      <div class="individuals">
+        Redouan Ahaloui
+        Aurel
+        Leonid Beder
+        Roy Blankman
+        Ivan Brightly
+        Guy Corem
+        Chance Du
+        Adonis Ferreira
+        fengqingyang
+        Roderik van der Graaf
+        PANDA
+        Poseidon Ho
+        hwph
+        Michalis Kargakis
+        Baek Kyoum Kim
+        Sehwan Kim (misskiwi)
+        Mitchell Krawiec-Thayer Ph.D. (Isthmus)
+        John Lee (jl2fa)
+        Jie Liu
+        Jameson Lopp
+        juelianshana
+        Chris McCann
+        Jack Misteli Jean-Guillaume
+        Bart Mol
+        Yan Pritzker
+        Hendrik Richter
+        Niels de Ruiter
+        Alex (X) Sherman
+        Daisuke Shosaki
+        Max Tannahill
+        Tensor Turbulence
+        Qi Tian
+        Aaron Ting
+        Shaishav Todi
+        Xiake Coin
+        Alexander Zaidelson
       </div>
     </div>
   </div>
-</section>
-
-<h2>Companies</h2>
-<!-- Temporary black div until we convert to black on white logos -->
-<section class="companies">
-  <a href="https://www.bitonic.nl/">
-    <img src="assets/images/logos/bitonic-white.png" title="Bitonic">
-  </a>
-  <a href="https://www.kryptonite1.co/">
-    <img src="assets/images/logos/kr1_med.png" title="KR1">
-  </a>
-  <a href="https://www.tmgox.com/">
-    <img src="assets/images/logos/tmgox-logo.jpg" title="TMGOX">
-  </a>
-  <a href="https://gpu.one/">
-    <img src="assets/images/logos/gpuOne-white.png" title="GPU.one">
-  </a>
-  <a href="https://www.megapool.info/">
-    <img class="no-frame" src="assets/images/logos/Mega-Pool-Logo-trans.png" title="Mega Pool">
-  </a>
-  <a href="https://www.grinmint.com/">
-    <img src="assets/images/logos/grinmint_logo_square.svg" title="Grinmint by BlockCypher">
-  </a>
-  <a href="https://kyokan.io/">
-    <img src="assets/images/logos/kyokan_teal_white.png" title="Kyokan">
-  </a>
-  <a href="http://innosilicon.com/">
-    <img src="assets/images/logos/Innosilicon.png" title="Innosilicon">
-  </a>
-  <a href="https://galleon.exchange/">
-    <img src="assets/images/logos/galleon.png" title="Galleon">
-  </a>
-  <a href="https://mining.luxor.tech">
-    <img class="no-frame" src="assets/images/logos/luxor_logo.png" title="Luxor">
-  </a>
-  <a href="https://beam-mw.com/">
-    <img src="assets/images/logos/beam_logo.png" title="Beam">
-  </a>
-  <a href="https://continue.capital/">
-    <img src="assets/images/logos/continuecapital.png" title="Continue Capital">
-  </a>
-  <a href="http://cyphercapital.net/">
-    <img src="assets/images/logos/cypher_capital.png" title="Cypher Capital">
-  </a>
-  <a href="https://hashrabbit.co/">
-    <img src="assets/images/logos/hashrabbit.png" title="Cypher Capital">
-  </a>
-  <a href="https://lemniscap.com/">
-    <img src="assets/images/logos/lemniscap.png" title="Lemniscap">
-  </a>
-  <a href="#">
-    <img class="no-frame" src="assets/images/logos/chanceventures.png" title="Chance Ventures">
-  </a>
-  <a href="https://www.wings.ai/">
-    <img class="no-frame" src="assets/images/logos/wingsai-grey.png" title="Wings">
-  </a>
-  <a href="https://www.cgs.group/">
-    <img src="assets/images/logos/cgs-logo-white.svg" title="CGS Group">
-  </a>
-  <a href="https://www.coingecko.com/en/coins/grin">
-    <img class="no-frame" src="assets/images/logos/CoinGecko-WhiteText-small.png" title="CoinGecko">
-  </a>
-  <a href="https://hashoutliers.com">
-    <img class="no-frame" src="assets/images/logos/Outliers-256x.png" title="Outliers">
-  </a>
-  <a href="https://www.bhex.com/">
-    <img class="no-frame" src="assets/images/logos/bhex-384x.png" title="Blue Helix Exchange(BHEX)">
-  </a>
-  <a href="https://www.sparkpool.com/">
-    <img class="no-frame" src="assets/images/logos/Sparkpool-660x.png" title="SparkPool">
-  </a>
-  <a href="https://qtum.org/">
-    <img class="no-frame" src="assets/images/logos/qtum.png" title="Qtum">
-  </a>
-  <a href="https://bit.fish/">
-    <img src="assets/images/logos/bitfish.png" title="bitfish">
-  </a>
-  <a href="https://bminer.me/">
-    <img class="no-frame" src="assets/images/logos/bminer-white-only.png" title="bminer">
-  </a>
-  <a href="https://prokapi.com/">
-    <img src="assets/images/logos/prokapi-white.png" title="Prokapi">
-  </a>
-  <a href="https://hashtagchain.com/">
-    <img class="no-frame" src="assets/images/logos/hashtag-capital.png" title="Hashtag Capital">
-  </a>
-  <a href="https://www.f2pool.com/">
-    <img src="assets/images/logos/f2pool.png" title="F2Pool">
-  </a>
-  <a href="https://www.minerbabe.com/">
-    <img class="no-frame" src="assets/images/logos/minerbabe-white.png" title="Minerbabe">
-  </a>
-  <a href="https://0301.farm/">
-    <img class="no-frame" src="assets/images/logos/0301-transparent.png" title="0301 - Mining Farm">
-  </a>
-  <a href="https://2miners.com">
-    <img class="no-frame" src="assets/images/logos/logo-2miners-red.svg" title="2Miners">
-  </a>
-  <a href="https://poloniex.com">
-    <img class="no-frame" src="assets/images/logos/poloniex.png" title="Poloniex">
-  </a>
-  <a href="https://www.grinamsterdam.com/">
-    <img class="no-frame" src="assets/images/logos/grin_amsterdam_logo_white.png" title="Grin Amsterdam">
-  </a>
-  <a href="https://www.exsilico.com/">
-    <img class="no-frame" src="assets/images/logos/exsilico.png" title="exsilico">
-  </a>
-  <a href="https://www.gate.io/">
-    <img class="no-frame" src="assets/images/logos/gateio_logo.png" title="Gate.io">
-  </a>
-</section>
-
-<!-- TODO: add default profile image -->
-<article markdown="1" class="post-content">
-  <h2>Individuals</h2>
-  <em>In alphabetical order:</em><br /><br />
-  <div class="individuals">
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Redouan Ahaloui</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Aurel</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Leonid Beder</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Roy Blankman</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Ivan Brightly</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Guy Corem</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Chance Du</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Adonis Ferreira</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>fengqingyang</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Roderik van der Graaf</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>PANDA</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Poseidon Ho</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>hwph</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Michalis Kargakis</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Baek Kyoum Kim</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Sehwan Kim (misskiwi)</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Mitchell Krawiec-Thayer Ph.D. (Isthmus)</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>John Lee (jl2fa)</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Jie Liu</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Jameson Lopp</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>juelianshana</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Chris McCann</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Jack Misteli Jean-Guillaume</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Bart Mol</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Yan Pritzker</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Hendrik Richter</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Niels de Ruiter</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Alex (X) Sherman</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Daisuke Shosaki</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Max Tannahill</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Tensor Turbulence</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Qi Tian</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Aaron Ting</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Shaishav Todi</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Xiake Coin</span>
-    </div>
-    <div class="individual">
-      <img src="assets/images/grin-logo.png" />
-      <span>Alexander Zaidelson</span>
-    </div>
-  </div>
-
-  <h2>Anonymous Supporters</h2>
-  <p>We'd also like to explicitly thank everyone who's donated to one of Grin's campaigns but chosen to remain
-    anonymous. We're working to protect that choice!</p>
-
-  <h2>Minimum amounts</h2>
-  <p>100 USD in crypto-equivalent in order to be listed in the individuals section, 1,000 USD in the companies section,
-    and 25,000 USD in the Hall of Fame.</p>
-
-  <h2>See something wrong?</h2>
-  <p>This page is a work in progress. We are doing our best to keep information up to date, but there's a good chance
-    bugs will slip in. For any corrections, please contact daniel.lehnberg@protonmail.com.</p>
-</article>
-
+</main>
 
 <script crossorigin src="https://unpkg.com/papaparse@4.6.3/papaparse.min.js"></script>
-<script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
-<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script>
-<!-- <script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
-<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script> -->
+<!-- <script crossorigin src="https://unpkg.com/react@16/umd/react.development.js"></script>
+<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.development.js"></script> -->
+<script crossorigin src="https://unpkg.com/react@16/umd/react.production.min.js"></script>
+<script crossorigin src="https://unpkg.com/react-dom@16/umd/react-dom.production.min.js"></script>
 <script src="https://unpkg.com/babel-standalone@6/babel.min.js"></script>
 <script type="text/babel">
-  function numberWithCommas(x) {
-    return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
+  function formatNumber(x) {
+    if (typeof x === 'number') {
+      return x.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ',');
+    }
+    console.error('Expected `x` to be a number but got `' + x + '`');
+    return x;
   }
 
   function parseCsv(csv) {
@@ -356,7 +229,7 @@ <h2>See something wrong?</h2>
 
     // Url to .csv files
     const incomeUrl = 'https://raw.githubusercontent.com/mimblewimble/grin-pm/master/financials/income_log.csv';
-    const entitiesUrl = '/assets/csv/entities.csv';
+    const entitiesUrl = 'assets/csv/entities.csv';
     const miscUrl = 'https://raw.githubusercontent.com/mimblewimble/grin-pm/master/financials/misc_support.csv';
 
     React.useEffect(() => {
@@ -384,14 +257,19 @@ <h2>See something wrong?</h2>
 
         // Add helper properties `total`, `numberOfDonations`, `lastDonation`
         // that are displayed on leaderboard
-        return entities.map((o) => {
-          return Object.assign({}, o, {
-            total: (o.donations && o.donations.reduce((acc, cur) => acc + parseInt(cur.USD_equivalent), 0)) || 0,
-            numberOfDonations: (o.donations) ? o.donations.length : 0,
-            lastDonation: (o.donations) ? Math.max.apply(null, o.donations.map((d) => d.date)).toString() : null,
-          });
-          // Threshold for leaderboard is set here
-        }).filter((o) => o.total >= 25000).sort(function(a, b) { return a.total - b.total }).reverse().map(function(o, i) { o.rank = i + 1; return o; });
+        return entities
+          .map((o) => {
+            return Object.assign({}, o, {
+              total: (o.donations && o.donations.reduce((acc, cur) => acc + parseInt(cur.USD_equivalent), 0)) || 0,
+              numberOfDonations: (o.donations) ? o.donations.length : 0,
+              lastDonation: (o.donations) ? Math.max.apply(null, o.donations.map((d) => d.date)).toString() : null,
+            });
+            // Threshold for leaderboard is set here
+          })
+          .filter((o) => o.total >= 25000)
+          .sort(function(a, b) { return a.total - b.total })
+          .reverse()
+          .map(function(o, i) { o.rank = i + 1; return o; });
       }).then((res) => {
         if (res.length) {
           setLeaderboard(res);
@@ -447,15 +325,15 @@ <h2>See something wrong?</h2>
     return (
       <React.Fragment>
         <div className="leaderboard-content">
-          {(props.leaderboard[0] === null) ? (
+          {/* (props.leaderboard[0] === null) ? (
             Array.apply(null, Array(10)).map((_, i) => {
               return (
                 <a key={i} className="empty" href="/funding">
-                  {i + 1}. Donate to take this spot!
+                  {i + 1}. Empty slot.
                 </a>
               );
             })
-          ) : null}
+          ) : null */}
           {(props.leaderboard[0] !== null) ? (
             props.leaderboard.slice(0, itemsToShow).map((data, i) => {
               return (
@@ -463,15 +341,15 @@ <h2>See something wrong?</h2>
               )
             })
           ) : null}
-          {(props.leaderboard[0] !== null && props.leaderboard.length < 10) ? (
+          {/* (props.leaderboard[0] !== null && props.leaderboard.length < 10) ? (
             Array.apply(null, Array(10 - props.leaderboard.length)).map((_, i) => {
               return (
                 <a key={i} className="empty" href="/funding">
-                  {props.leaderboard.length + i + 1}. Donate to take this spot!
+                  {props.leaderboard.length + i + 1}. Empty slot.
                 </a>
               );
             })
-          ) : null}
+          ) : null */}
         </div>
         {(props.leaderboard.length > itemsToShow) ? (
           <div className="friends-show-more">
@@ -503,13 +381,10 @@ <h2>See something wrong?</h2>
                 <a href={props.data.href}>{props.data.name}</a>
               </span>
               <span className="desc">{props.data.description}</span>
+              <div className="total">{'Σ $' + formatNumber(props.data.total)}</div>
             </div>
           </div>
           <div className="info">
-            <div className="data">
-              <span className="subheading">Total</span>
-              <span>{'$' + numberWithCommas(props.data.total)}</span>
-            </div>
             <div className="data">
               <span className="subheading"># donations</span>
               <button
@@ -531,7 +406,7 @@ <h2>See something wrong?</h2>
             <div className="donations">
               {props.data.donations.map((donation) => (
                 <div className="donation" key={donation.income_id + donation.source}>
-                  <strong>{'$' + numberWithCommas(parseInt(donation.USD_equivalent)) + ' '}</strong>
+                  <strong>{'$' + formatNumber(parseInt(donation.USD_equivalent)) + ' '}</strong>
                   ({donation.amount + ' ' + donation.currency}){': '}
                   {(donation.url && donation.url !== '-') ? (
                     <a href={donation.url}>{donation.comment}</a>
diff --git a/fund.html b/fund.html
new file mode 100644
index 00000000..73d98e07
--- /dev/null
+++ b/fund.html
@@ -0,0 +1,43 @@
+---
+layout: default-black
+---
+
+<main class="site black pad">
+  <div class="fund">
+    <div class="fund-heading">
+      <span>GRIN GENERAL FUND</span>
+      <h1>$855,042</h1>
+      <small>70.77 BTC + 0 GRIN</small>
+    </div>
+    <p>
+      The General Fund is for Grin’s ongoing projects and ever-expanding needs. Donations into this fund are always welcome and appreciated.
+
+      Donate to the General Fund to show up on the <a href="/friends">Friends of Grin</a> page.
+    </p>
+    <h3>Donate</h3>
+    <small class="fund-donation-type">GRIN DONATION ADDRESS</small>
+    <a href="https://council-donations.yeastplume.org/" class="fund-address">https://council-donations.yeastplume.org</a>
+    <small class="fund-donation-type">BITCOIN LEGACY</small>
+    <a href="https://live.blockcypher.com/btc/address/3ChVP627KU5w4zu2rieFPF3wGXWQgmhvrs/" class="fund-address">3ChVP627KU5w4zu2rieFPF3wGXWQgmhvrs</a>
+    <small class="fund-donation-type">BITCOIN SEGWIT</small>
+    <a href="https://blockchair.com/bitcoin/address/bc1qdgs8vkpzr256qjlzlfht72z3mhcrdrt6wj2rfjw39j8us24gz8uq78qj65" class="fund-address">bc1qdgs8vkpzr256qjlzlfht72z3mhcrdrt6wj2rfjw39j8us24gz8uq78qj65</a>
+    <p>Note that the Bitcoin Segwit address is a Bech32 address. Please ensure your wallet supports sending to a Bech32 address before you use it. Many wallets and exchanges now support it, you can check adoption here.</p>
+    <small class="fund-donation-type">ETHEREUM</small>
+    <span class="fund-closed">Ethereum donations are suspended temporarily, and will be operational again as soon as possible.</span>
+    <small class="fund-donation-type">ZCASH</small>
+    <span class="fund-closed">Zcash donations are suspended temporarily, and will be operational again as soon as possible.</span>
+    <p>Funds donated in Ethereum and Zcash will be converted to Bitcoin shortly after for simplicity of accounting.</p>
+
+    <h3>What is the General Fund?</h3>
+    <p>This is the general development fund intended to cover costs related to Grin’s ongoing development. While the team may not have visibility on every particular need that will arise, all donated funds will be used towards Grin’s development or promotion.
+
+This fund is managed entirely by the Grin Technical Council, and all spending decisions will be made public. The funds are kept in a 3/5 Multisig wallet, meaning no spending can occur without at least 3 council members actively signing the transaction.
+
+Some examples of where proceeds of this fund might be allocated (by no means exhaustive and subject to change):</p>
+
+    <h3>Further Information</h3>
+    <p>The Grin project is strictly non-profit. Please refer back to our Funding overview page for details on our fundraising appoach and our inclusive development philosophy.
+
+As always, anyone donating to this fund can optionally have themselves listed on the <a href="friends">Friends of Grin</a> page.</p>
+  </div>
+</main>
diff --git a/funding.md b/funding.md
index 9aa0ba8a..f65339a6 100644
--- a/funding.md
+++ b/funding.md
@@ -2,19 +2,20 @@
 layout: page
 ---
 
-# Community Funding
+## Community Funding
 
-## Current Campaigns
+Grin is an open source projects and relies on the community for donations.
 
-### [General Funding for Grin's Development](general_funding)
+<!-- ### Current Campaigns -->
 
-Status: Always Open
+### Grin Genral Fund
+Status: Always Open. [Link](/fund)
 
-## Past campaigns
+### Past campaigns
 
 You can view all of our past campaigns [here](campaigns).
 
-# Grin's Community Funding Principles
+## Grin's Community Funding Principles
 
 [Grin](https://grin-tech.org) is currently being created by a group of developers dedicated to the realisation of a reliable and functional MimbleWimble blockchain. We are building it because we're excited about MimbleWimble technology and the possibilities that it will one day offer.
 
@@ -30,13 +31,13 @@ Thus far, Grin's development has been mostly a part-time effort, with volunteers
 
 To keep Grin open and free from controlling influences, the project will attempt to rely 100% on community donations for its funding needs. We ask any person, corporate entity or institution who sees potential in Grin/MimbleWimble technology to consider donating to the project, and we hope that the vibrant cryptocurrency community will help Grin in achieving its goal of providing a reliable, scalable and privacy-driven blockchain implementation that truly belongs to everyone.
 
-# Friends of Grin
+## Friends of Grin
 
 We believe that any donors, large or small, should be given recognition for their contribution. Any individual donor who wishes to be listed on our [Friends of Grin](friends) page will be listed, and any corporate or institutional Donors making a significant contribution to Grin's development will have their logo displayed (if desired).
 
 We are also happy to accept recurring sponsorships and acknowledge your support prominently on our Friends of Grin page. However, as per our pledges above, we cannot accept sponsorships or donations predicated on being able to unduly influence Grin's direction.
 
-# Donation Format
+## Donation Format
 
 As in all things Grin, we want to ensure that the funding process remains as transparent as all other aspects of the project. To this end, Grin will actively seek community funding via:
 
@@ -57,7 +58,7 @@ In the event that campaign funds aren't or can't be used for their intended purp
 
 Donors and sponsors should understand that the funds donated may not always go to the exact cause they've donated to due to eventualities such as the ones listed above, but they will always go towards the advancement of Grin.
 
-# Developer Funding Campaigns
+## Developer Funding Campaigns
 
 Campaigns which go towards funding developer time will be subject to additional rules:
 
@@ -66,6 +67,6 @@ Campaigns which go towards funding developer time will be subject to additional
 - Campaign amounts will be listed as per their local fiat rates.
 - Developers will provide weekly updates on progress via a method of their choosing (linked from the funding page).
 
-# Disclaimer
+## Disclaimer
 
 The Grin project is still very young and is still experimenting with the details of its funding model. Some or all of the details above, and even our overall approach may change as the project evolves, however we will always strive to ensure that our funding model reflects the principles of openness and fairness on which the project was founded.
diff --git a/general_funding.md b/general_funding.md
deleted file mode 100644
index c24fa620..00000000
--- a/general_funding.md
+++ /dev/null
@@ -1,65 +0,0 @@
----
-layout: page
----
-
-# Grin General Fund
-
-This is a general fund for the Grin project's ongoing and ever-expanding needs. Donations into this fund are always welcome, very appreciated, and a quick and easy way to get yourself or your company on to the hallowed [friends of grin](friends) page.
-
-## Funding status
-
-Status: Always Open
-
-As of Aug 22, 2019
-
-* 3156.702362010 ツ on council-donations.yeastplume.org
-* 71.78869617 BTC
-
-## Grin donation address
-
-- Direct HTTPS sends: [https://council-donations.yeastplume.org](https://council-donations.yeastplume.org)
-
-## Bitcoin donation address
-
-- bitcoin legacy [3ChVP627KU5w4zu2rieFPF3wGXWQgmhvrs](https://live.blockcypher.com/btc/address/3ChVP627KU5w4zu2rieFPF3wGXWQgmhvrs/)
-- bitcoin segwit [bc1qdgs8vkpzr256qjlzlfht72z3mhcrdrt6wj2rfjw39j8us24gz8uq78qj65](https://blockchair.com/bitcoin/address/bc1qdgs8vkpzr256qjlzlfht72z3mhcrdrt6wj2rfjw39j8us24gz8uq78qj65).
-
-Please note the 2nd address is a [Bech32 address](https://en.bitcoin.it/wiki/Bech32_adoption), so please ensure your wallet supports sending to a Bech32 address to use it. Many wallets and exchanges now support this, and you can [check adoption here](https://en.bitcoin.it/wiki/Bech32_adoption).
-
-### Please verify the donation addresses as shown above in your browser matches the source for this page on [mimblewimble/site](https://github.com/mimblewimble/site/blob/master/general_funding.md).
-
-## Ethereum donation address
-
-- eth address [0x0809D0C59248a83B9718fcbFE965BA17bd0bB713](https://etherscan.io/address/0x0809D0C59248a83B9718fcbFE965BA17bd0bB713)
-
-Funds donated in Ethereum will be converted to Bitcoin shortly after for simplicity of accounting.
-
-## Zcash donation address
-
-_Zcash donations are suspended temporarily, and will be operational again ASAP._
-
-[//]: <> - t-address [t1QGYYXan3HHEuiPEfccKnUuWEP4CsVvPA5](https://explorer.zcha.in/accounts/t1QGYYXan3HHEuiPEfccKnUuWEP4CsVvPA5){:.address-link}
-
-Funds donated in Zcash will be converted to Bitcoin shortly after for simplicity of accounting.
-
-## What is this fund
-
-This is the general development fund intended to cover costs related to Grin's ongoing development. While the team may not have visibility on every particular need that will arise, all donated funds will be used towards Grin's development or promotion.
-
-This fund is managed entirely by the Grin Technical Council, and all spending decisions will be made public. The funds are kept in a 3/5 Multisig wallet, meaning no spending can occur without at least 3 council members actively signing the transaction.
-
-Some examples of where proceeds of this fund might be allocated (by no means exhaustive and subject to change):
-
-- Professional security audits
-- Service fees related to build and deployment infrastructure
-- Website design and/or development or other marketing materials
-- Presence at conferences
-- Contributing to developer campaigns or other specific development work if required
-- Contributions toward open Grin ASIC design
-- Legal support as and when needed
-
-## Further Information
-
-The Grin project is strictly non-profit. Please refer back to our [Funding overview page](funding) for details on our fundraising appoach and our inclusive development philosophy.
-
-As always, anyone donating to this fund can optionally have themselves listed on the [Friends of Grin Page](friends).
diff --git a/index.html b/index.html
index 195fbda7..96859148 100644
--- a/index.html
+++ b/index.html
@@ -2,120 +2,57 @@
 layout: default
 ---
 
-<main>
-  <section id="intro">
-    <header id="splash" class="container">
-      <div class="intro-logo">
-        <img src="assets/images/grin_mw_logo.svg" class="grin-logo" alt="Description">
+<main class="site">
+  <section class="section-1">
+    <div class="section-1-intro">
+      <div>
+        <span class="section-1-grin">GRiN</span>
+        <span class="section-1-v">v</span>
+        <span class="section-1-version">2.0.0</span>
       </div>
-      <div class="intro">
-        <div class="intro-text">
-          <h1>Meet Grin.</h1>
-          <p>
-            The private and lightweight<br />
-            mimblewimble blockchain.
-          </p>
-        </div>
-        <div class="intro-buttons">
-          <a class="intro-button" href="https://github.com/mimblewimble/docs/wiki/Getting-Started-With-Grin%3A-Links-and-Resources">
-            Get started
-          </a>
-          <a class="intro-button" href="https://github.com/mimblewimble/grin">
-            Github
-            <i class="fab fa-github"></i>
-          </a>
-          <!-- <button class="intro-button" type="button">
+      <p class="section-1-text">Electronic transactions for all.
+        Without censorship or restrictions.
 
-          </button> -->
-        </div>
-      </div>
-    </header>
-    <section id="status">
-      <span class="status-text">
-        Currently Live: mainnet
-      </span>
-      <span class="status-message">
-        Grin was launched on <a href="https://github.com/mimblewimble/grin/commit/8fc489a80868fcf12fcdbc0551528bb73fc891a0">Jan. 15th 2019</a>. It's very young and experimental. Use at your own risk!
-      </span>
-    </section>
-  </section>
-  <section id="primary">
-    <div class="primary-root">
-      <div class="pitch container">
-        <h2>What's Grin?</h2>
-        <p>Electronic transactions for all. Without censorship or restrictions.</p>
-        <p>Grin empowers anyone to transact or save modern money without the fear of external control or oppression. Grin is designed for the decades to come, not just tomorrow. Grin wants to be usable by everyone, regardless of borders, culture, skills or access.</p>
-      </div>
-      <hr class="primary-hr">
-      <div class="properties container">
-        <section class="property">
-          <div class="property-title">
-            <img src="assets/images/privacy.svg">
-            <h3>Private</h3>
-          </div>
-          <p>Grin has no amounts and no addresses. Transactions can be trivially aggregated. To hide where a newly created transaction comes from, it gets relayed privately (a "random walk") among peers before it is publicly announced.</p>
-        </section>
-        <section class="property">
-          <div class="property-title">
-            <img src="assets/images/scale.svg">
-            <h3>Scalable</h3>
-          </div>
-          <p>MimbleWimble leverages cryptography to allow most of the past transaction data to be removed. This guarantees Grin won't collapse under its own weight in the long term.</p>
-        </section>
-        <section class="property">
-          <div class="property-title">
-            <img src="assets/images/nodes.svg">
-            <h3>Open</h3>
-          </div>
-          <p>Grin is developed openly, by developers distributed all over the world. It's not controlled by any company, foundation or individual. The coin distribution is designed to be as fair (but not gratis) as is known to be possible.</p>
-        </section>
-      </div>
+        Grin is designed for the decades to come, not just tomorrow. Grin wants to be usable by everyone — regardless of borders, culture, skills or access.
+      </p>
+      <span class="section-1-star">*</span>
     </div>
   </section>
-  <section id="secondary">
-    <!-- <hr></hr> -->
-    <section class="funding">
-      <h2>Funding</h2>
-      <p>Grin is launched fairly — free of ICO, pre-mine or founder’s reward. We rely on donations to keep working on the project. Support the movement by purchasing some swag or making a donation.</p>
-      <!-- <span class="funding-amount">€440 of €55,000 Target</span>
-      <div class="funding-progress" style="width: 50%;"></div> -->
-      <!-- <div class="funding-progress-container"></div> -->
-      <a href="funding" class="funding-button">Donate to Grin</a>
-      <a href="/friends" class="funding-friends">Friends of Grin</a>
-      <a href="https://tmgox.com/" class="funding-swag">Buy Swag</a>
-      <hr>
-    </section>
-    <section class="funding">
-      <h2>Patrons</h2>
-      <p>If you’re an individual, company or institution excited about the potential of Grin or MimbleWimble, we humbly ask if you’d consider making a financial contribution to the project’s development. We’re experimenting with a 100% community-driven funding model.</p>
-      <p>We sincerely thank all our past patrons for their support.</p>
-    </section>
-    <hr>
-    <section class="info">
-      <div class="container">
-        <h2>Contribute</h2>
-      </div>
-      <a href="https://github.com/mimblewimble/docs/wiki/Getting-Started-With-Grin%3A-Links-and-Resources">
-        <div class="info-box">
-          <h4>mainnet, Onwards!</h4>
-          <p>Grin mainnet was launched on Jan. 15 2019.</p>
-          <p>Get started here!</p>
-          <span class="info-learn-more">Learn more</span>
-        </div>
-      </a>
-      <a href="https://github.com/mimblewimble/grin/blob/master/doc/build.md">
-        <div class="info-box">
-          <h4>floonet, Upwards!</h4>
-          <p>Grin floonet is our official testnet. We need your help testing: either compile from the source or download the grin binary and join us.</p>
-          <span class="info-learn-more">Learn more</span>
-        </div>
-      </a>
-    </section>
-    <a href="https://github.com/mimblewimble">
-      <div class="info-banner" style="background-color: black;">
-        <h1 class="info-banner-text">Help make Grin better.</h1>
-        <img src="assets/images/grin-logo-inverted-eyes.svg" class="info-grin-logo" alt="Description">
+  <img class="section-1-lights" src="assets/images/img1@3x.png" />
+  <section class="section-2">
+    <span class="section-2-title">GRiN — THE MIMBLEWIMBLE BLOCKCHAIN</span>
+    <p>
+      <span class="medium">Grin is a privacy-protecting digital currency</span> built openly by developers distributed all over the world.
+
+      <span class="medium">Grin has no amounts and no addresses.</span> Transactions can be trivially aggregated. To hide where a newly created transaction comes from, it gets relayed privately among peers before it is publicly announced.
+
+      <span class="medium">Grin is not controlled by any company, foundation or individual.</span> The coin distribution is designed to be as fair as is known to be possible, with an emission of 1 GRIN per second.
+
+      <span class="medium">MimbleWimble</span> leverages cryptography to allow most of the past transaction data to be removed. This guarantees Grin won't collapse under its own weight in the long term.
+    </p>
+  </section>
+  <img class="section-2-cash" src="assets/images/cash.png" />
+  <section class="section-3">
+    <div class="section-3-content">
+      <div class="section-3-read-more">Read more</div>
+      <div>
+        <ul>
+          <li class="section-3-link">
+            <p>“</p><a href="https://github.com/mimblewimble/grin/blob/master/doc/intro.md"><span>Introduction to MimbleWimble</span></a><p>” →</p>
+          </li>
+          <li class="section-3-link">
+            <p>“</p><a href="fund"><span>Grin General Fund</span></a><p>” →</p>
+          </li>
+          <li class="section-3-link">
+            <p>“</p><a href="community"><span>Community Projects</span></a><p>” →</p>
+          </li>
+        </ul>
+        <div class="section-3-text">
+          Grin is launched fairly — free of ICO,
+          pre-mine or founder’s reward. We rely on donations to keep working on
+          the project. Support the movement by purchasing some <a href="https://tmgox.com/">merch</a> or making a
+          <a href="fund">donation</a>.</div>
       </div>
-    </a>
+    </div>
   </section>
 </main>