diff --git a/pages/_/marketing-candidate/download.js b/pages/_/marketing-candidate/download.js
index 4df5a49e..77497442 100644
--- a/pages/_/marketing-candidate/download.js
+++ b/pages/_/marketing-candidate/download.js
@@ -1,7 +1,6 @@
 import * as React from "react";
 import * as Constants from "~/common/constants";
 import * as Actions from "~/common/actions";
-import * as System from "~/components/system";
 
 import { css } from "@emotion/react";
 
@@ -17,11 +16,14 @@ const STYLES_ROOT = css`
 
 const STYLES_H1 = css`
   font-size: ${Constants.typescale.lvl5};
+  font-family: ${Constants.font.medium};
+  font-weight: 400;
   line-height: 1.3;
   padding: 0px 0px 24px 0px;
   letter-spacing: -0.021rem;
   width: 100%;
   color: ${Constants.system.slate};
+
   @media (max-width: ${Constants.sizes.tablet}px) {
     font-size: ${Constants.typescale.lvl5};
     padding: 0px 0px 16px 0px;
@@ -34,9 +36,11 @@ const STYLES_H1 = css`
 
 const STYLES_H3 = css`
   font-size: ${Constants.typescale.lvl2};
+  font-family: ${Constants.font.text};
+  font-weight: 400;
   line-height: 1.5;
   letter-spacing: -0.014rem;
-  padding: 0 0 24px 0;
+  padding: 0 0 8px 0;
   color: ${Constants.system.slate};
 
   @media (max-width: ${Constants.sizes.tablet}px) {
@@ -48,17 +52,18 @@ const STYLES_H3 = css`
   }
 `;
 
-const STYLES_TEXT_BLOCK = css`
+const STYLES_BLOCK = css`
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   max-width: 56vw;
   width: 100%;
   align-self: center;
+  margin-bottom: 16px;
 
   @media (max-width: ${Constants.sizes.mobile}px) {
     width: 100%;
-    right: 24px;
+    max-width: 100vw;
   }
 `;
 
@@ -125,7 +130,7 @@ const STYLES_LINK_WHITE = css`
 
 const STYLES_SECTION_HERO = css`
   width: 100vw;
-  padding: 30vh 88px 88px 88px;
+  padding: 16vh 88px 88px 88px;
   display: flex;
   flex-direction: column;
   justify-content: center;
@@ -153,6 +158,26 @@ const STYLES_SECTION_WRAPPER = css`
   }
 `;
 
+const STYLES_TABLE = css`
+  width: 100%;
+  font-size: ${Constants.typescale.lvl0};
+  border-collapse: collapse;
+  text-align: left;
+`;
+
+const STYLES_TABLE_ROW = css`
+  font-family: ${Constants.font.text};
+`;
+
+const STYLES_TABLE_TOP_ROW = css`
+  font-family: ${Constants.font.semiBold};
+`;
+
+const STYLES_TABLE_ITEM = css`
+  border: 1px solid rgba(229, 229, 229, 0.75);
+  padding: 12px;
+`;
+
 export const getServerSideProps = async (context) => {
   return {
     props: { ...context.query },
@@ -178,11 +203,11 @@ export default class IndexPage extends React.Component {
         <WebsitePrototypeHeader color="dark" />
         <div css={STYLES_ROOT}>
           <div css={STYLES_SECTION_HERO}>
-            <div css={STYLES_TEXT_BLOCK}>
+            <div css={STYLES_BLOCK}>
               <h1 css={STYLES_H1}>Slate Chrome Extensions</h1>
               <h3 css={STYLES_H3}>Take any image on the web and save it to Slate right from your browser tab.</h3>
               <a src="/">
-                <button css={STYLES_BUTTON_PRIMARY}>Get Chrome Extension</button>
+                <button css={STYLES_BUTTON_PRIMARY}>Get Chrome extension</button>
               </a>
               <p css={STYLES_ANNOTATION}>
                 Currently avaible for{" "}
@@ -191,6 +216,8 @@ export default class IndexPage extends React.Component {
                 </a>
                 .
               </p>
+            </div>
+            <div css={STYLES_BLOCK}>
               <img
                 css={STYLES_IMG}
                 src="https://slate.textile.io/ipfs/bafybeibwppu23j5wgshqvm5qyqv3c6pmhp3y5irdwn3ivvnnrpexiguzbi"
@@ -199,53 +226,35 @@ export default class IndexPage extends React.Component {
             </div>
           </div>
           <div css={STYLES_SECTION_WRAPPER}>
-            <div css={STYLES_TEXT_BLOCK}>
+            <div css={STYLES_BLOCK}>
               <h1 css={STYLES_H1}>Releases</h1>
               <h3 css={STYLES_H3}>Slate is built in public and all past releases are always avaible for download.</h3>
-              <System.Table
-                data={{
-                  columns: [
-                    { key: "a", name: "Version", width: "15%" },
-
-                    { key: "b", name: "Product", width: "20%" },
-
-                    { key: "c", name: "Date", width: "20%" },
-
-                    {
-                      key: "d",
-                      name: "Download link",
-                      copyable: true,
-                      width: "45%",
-                    },
-                  ],
-
-                  rows: [
-                    {
-                      id: 1,
-
-                      a: "v1.0",
-
-                      b: "Chrome Extension",
-
-                      c: "2020-09-07",
-
-                      d: "Download",
-                    },
-
-                    {
-                      id: 2,
-
-                      a: "v1.0",
-
-                      b: "Design System",
-
-                      c: "2020-09-07",
-
-                      d: "Download",
-                    },
-                  ],
-                }}
-              />
+            </div>
+            <div css={STYLES_BLOCK}>
+              <table css={STYLES_TABLE}>
+                <tr css={STYLES_TABLE_TOP_ROW}>
+                  <th css={STYLES_TABLE_ITEM}>Version</th>
+                  <th css={STYLES_TABLE_ITEM}>Product</th>
+                  <th css={STYLES_TABLE_ITEM}>Date</th>
+                  <th css={STYLES_TABLE_ITEM}>Download</th>
+                </tr>
+                <tr css={STYLES_TABLE_ROW}>
+                  <td css={STYLES_TABLE_ITEM}>0.1.0</td>
+                  <td css={STYLES_TABLE_ITEM}>Chrome Extension</td>
+                  <td css={STYLES_TABLE_ITEM}>2020-09-07</td>
+                  <td css={STYLES_TABLE_ITEM}>
+                    <a href="../public/static/favicon-96x96.png" download>
+                      Download
+                    </a>
+                  </td>
+                </tr>
+                <tr css={STYLES_TABLE_ROW}>
+                  <td css={STYLES_TABLE_ITEM}>0.1.0</td>
+                  <td css={STYLES_TABLE_ITEM}>Design system</td>
+                  <td css={STYLES_TABLE_ITEM}>2020-09-07</td>
+                  <td css={STYLES_TABLE_ITEM}>Download</td>
+                </tr>
+              </table>
             </div>
           </div>
         </div>
diff --git a/pages/index.js b/pages/index.js
index 84df6715..b19d14af 100644
--- a/pages/index.js
+++ b/pages/index.js
@@ -14,138 +14,111 @@ const USER_SLATES = [
     name: "Urban gardens",
     url: "https://slate.host/gndclouds/urban-gardens",
     username: "gndclouds",
-    preview:
-      "https://slate.textile.io/ipfs/bafybeiff7y4kz4e2z4nfso4nsgdbkfsyroa62jvvldoxafuaf34m7lticu",
+    preview: "https://slate.textile.io/ipfs/bafybeiff7y4kz4e2z4nfso4nsgdbkfsyroa62jvvldoxafuaf34m7lticu",
   },
   {
     name: "Shapes and Letters",
     url: "https://slate.host/haris/shapes-and-letters",
     username: "haris",
-    preview:
-      "https://slate.textile.io/ipfs/bafybeifgxtl7mq5djnorxedzi35hkizjmbjvdy3nnoitd3xvdnqpmruxbm",
+    preview: "https://slate.textile.io/ipfs/bafybeifgxtl7mq5djnorxedzi35hkizjmbjvdy3nnoitd3xvdnqpmruxbm",
   },
   {
     name: "Mountains",
     url: "https://slate.host/jason/mountains",
     username: "jason",
-    preview:
-      "https://slate.textile.io/ipfs/bafkreies6uykgocrkunrsndxfubntyqvfqzo5wuwyos42vak6d4qnvtdn4",
+    preview: "https://slate.textile.io/ipfs/bafkreies6uykgocrkunrsndxfubntyqvfqzo5wuwyos42vak6d4qnvtdn4",
   },
   {
     name: "Loom",
     url: "https://slate.host/tara/loom",
     username: "tara",
-    preview:
-      "https://slate.textile.io/ipfs/bafybeifl5xzy4vjctrsr3jywdlv5ceq3hpaadhcii2ekjx2gljyagveqna",
+    preview: "https://slate.textile.io/ipfs/bafybeifl5xzy4vjctrsr3jywdlv5ceq3hpaadhcii2ekjx2gljyagveqna",
   },
   {
     name: "Brand",
     url: "https://slate.host/slate/brand",
     username: "slate",
-    preview:
-      "https://slate.textile.io/ipfs/bafybeiaerbu2nivrgncqtwgwom27caji25netswvjbo6tcmbka47ucmupa",
+    preview: "https://slate.textile.io/ipfs/bafybeiaerbu2nivrgncqtwgwom27caji25netswvjbo6tcmbka47ucmupa",
   },
   {
     name: "Montreal underground",
     url: "https://slate.host/tcosta/montreal-underground",
     username: "tcosta",
-    preview:
-      "https://slate.textile.io/ipfs/bafybeieblkyt6d7wg4xmltshvxm6w7tz4c3zjpjuu4yfhiak36debqccda",
+    preview: "https://slate.textile.io/ipfs/bafybeieblkyt6d7wg4xmltshvxm6w7tz4c3zjpjuu4yfhiak36debqccda",
   },
   {
     name: "Monet",
     url: "https://slate.host/slate/monet",
     username: "slate",
-    preview:
-      "https://slate.textile.io/ipfs/bafkreieb4yfiamtipapmhoihl547lxeod2vfku67dimrhmab5tcglr5bli",
+    preview: "https://slate.textile.io/ipfs/bafkreieb4yfiamtipapmhoihl547lxeod2vfku67dimrhmab5tcglr5bli",
   },
   {
     name: "Books",
     url: "https://slate.host/haris/books",
     username: "haris",
-    preview:
-      "https://slate.textile.io/ipfs/bafkreihe7ismqfyytekj6yvbv6mpbc5de3gozk6n7a47smodbcsnrhbpri",
+    preview: "https://slate.textile.io/ipfs/bafkreihe7ismqfyytekj6yvbv6mpbc5de3gozk6n7a47smodbcsnrhbpri",
   },
   {
     name: "Papers",
     url: "https://slate.host/slate/papers",
     username: "slate",
-    preview:
-      "https://slate.textile.io/ipfs/bafkreif7l2vxkvdyrydcjwjjrrmqq73id3tdrdkf3z54tp2fotc75wkdwm",
+    preview: "https://slate.textile.io/ipfs/bafkreif7l2vxkvdyrydcjwjjrrmqq73id3tdrdkf3z54tp2fotc75wkdwm",
   },
 ];
 
 const ASSET_HERO = {
-  src:
-    "https://slate.textile.io/ipfs/bafybeidfr2x5ftxzixjxtrgiqm6iuotzip25tlrpase226jog3tqenqd4a",
+  src: "https://slate.textile.io/ipfs/bafybeidfr2x5ftxzixjxtrgiqm6iuotzip25tlrpase226jog3tqenqd4a",
   backgroundImage: `https://slate.textile.io/ipfs/bafybeict43te7wcy7pdw3v45dwwedwxw7yjthbytdsja6dpsiqkgil7iey`,
 };
 
 const ASSET_HERO_COLLABORATE = {
-  src:
-    "https://slate.textile.io/ipfs/bafybeih63zq5f7htbhkmrog447ybytyid2yi6fix4k6z3pbegxpcq2r2qa",
-  backgroundImage:
-    "https://slate.textile.io/ipfs/bafkreiagwjqvmisseb6voj7cwd3lhjudigkel63hqg6efpqjmhlfv5ucj4",
+  src: "https://slate.textile.io/ipfs/bafybeih63zq5f7htbhkmrog447ybytyid2yi6fix4k6z3pbegxpcq2r2qa",
+  backgroundImage: "https://slate.textile.io/ipfs/bafkreiagwjqvmisseb6voj7cwd3lhjudigkel63hqg6efpqjmhlfv5ucj4",
 };
 
 const ASSETS_SMALL = [
   {
-    src:
-      "https://slate.textile.io/ipfs/bafybeiawzns4vxqp3llkzmc4shvytzpurysh26yj3aljde4d4fsgf7wlze",
-    backgroundImage:
-      "https://slate.textile.io/ipfs/bafybeihez3rtyqqftx7mkyktwozyqjkwdtk2kglxqjc4zspah26bva3yk4",
+    src: "https://slate.textile.io/ipfs/bafybeiawzns4vxqp3llkzmc4shvytzpurysh26yj3aljde4d4fsgf7wlze",
+    backgroundImage: "https://slate.textile.io/ipfs/bafybeihez3rtyqqftx7mkyktwozyqjkwdtk2kglxqjc4zspah26bva3yk4",
   },
   {
-    src:
-      "https://slate.textile.io/ipfs/bafybeiczug4d6uyr4pkejdwirkeffbzkkzrbaprxvreid6iitw3pmjzq3q",
-    backgroundImage:
-      "https://slate.textile.io/ipfs/bafybeidnt2l3lslxi7ofkxs5ffncsh4fw5h2ohbukxumngrqj5pdrooaou",
+    src: "https://slate.textile.io/ipfs/bafybeiczug4d6uyr4pkejdwirkeffbzkkzrbaprxvreid6iitw3pmjzq3q",
+    backgroundImage: "https://slate.textile.io/ipfs/bafybeidnt2l3lslxi7ofkxs5ffncsh4fw5h2ohbukxumngrqj5pdrooaou",
   },
   {
-    src:
-      "https://slate.textile.io/ipfs/bafkreid7wl4443p764ozdlqtodh7dmsej6ffayp4tc3lr3hil2qkclrohi",
-    backgroundImage:
-      "https://slate.textile.io/ipfs/bafkreibb3onijljnmonrbs7qguimjf5qwbnkx3m33pouxbtar2yb7hupti",
+    src: "https://slate.textile.io/ipfs/bafkreid7wl4443p764ozdlqtodh7dmsej6ffayp4tc3lr3hil2qkclrohi",
+    backgroundImage: "https://slate.textile.io/ipfs/bafkreibb3onijljnmonrbs7qguimjf5qwbnkx3m33pouxbtar2yb7hupti",
   },
   {
-    src:
-      "https://slate.textile.io/ipfs/bafybeicjovnsnhvt7xwjw3igdwwpb4ms2m23fayoydj3oevrwyi7dzjtga",
-    backgroundImage:
-      "https://slate.textile.io/ipfs/bafkreiefuyyk6dcjhyk3hl2httqvdlnl3mo6wrfzgmponexrc75jop757y",
+    src: "https://slate.textile.io/ipfs/bafybeicjovnsnhvt7xwjw3igdwwpb4ms2m23fayoydj3oevrwyi7dzjtga",
+    backgroundImage: "https://slate.textile.io/ipfs/bafkreiefuyyk6dcjhyk3hl2httqvdlnl3mo6wrfzgmponexrc75jop757y",
   },
 ];
 
 const ASSETS_MEDIUM = [
   {
     title: "Create moodboards",
-    src:
-      "https://slate.textile.io/ipfs/bafybeib46kplzcylnzviaojgbogua52wyrzbvnj6uulvo4zwrxm4hnxeqe",
-    backgroundImage:
-      "https://slate.textile.io/ipfs/bafybeicoaponp2nv3ikpsjgcgu7pio6aercflsvsiyxrpaonza7ncg73dq",
+    src: "https://slate.textile.io/ipfs/bafybeib46kplzcylnzviaojgbogua52wyrzbvnj6uulvo4zwrxm4hnxeqe",
+    backgroundImage: "https://slate.textile.io/ipfs/bafybeicoaponp2nv3ikpsjgcgu7pio6aercflsvsiyxrpaonza7ncg73dq",
   },
 
   {
     title: "Organize research",
-    src:
-      "https://slate.textile.io/ipfs/bafybeigstyjfpzazdlmgkfuhw4yxrneux3opvbls7nmv6gq7dbnhmy6xwy",
-    backgroundImage:
-      "https://slate.textile.io/ipfs/bafybeie4p45yfvbjdzc2rgw67e7crcltpu7o544xtugs3wyv3qh3t3oegi",
+    src: "https://slate.textile.io/ipfs/bafybeigstyjfpzazdlmgkfuhw4yxrneux3opvbls7nmv6gq7dbnhmy6xwy",
+    backgroundImage: "https://slate.textile.io/ipfs/bafybeie4p45yfvbjdzc2rgw67e7crcltpu7o544xtugs3wyv3qh3t3oegi",
   },
 
   {
     title: "Share presentations",
-    src:
-      "https://slate.textile.io/ipfs/bafybeiampkmsxeihxnuz2hkgbhtzosgkwghslpwm7dsrxrzlqwa7tvzreq",
-    backgroundImage:
-      "https://slate.textile.io/ipfs/bafkreiglefskwq7bpa3aazihegawd4qwxockl6shipnps7zlokrbnu4f7u",
+    src: "https://slate.textile.io/ipfs/bafybeiampkmsxeihxnuz2hkgbhtzosgkwghslpwm7dsrxrzlqwa7tvzreq",
+    backgroundImage: "https://slate.textile.io/ipfs/bafkreiglefskwq7bpa3aazihegawd4qwxockl6shipnps7zlokrbnu4f7u",
   },
 ];
 
 const ASSET_CHROME_EXTENSION =
   "https://slate.textile.io/ipfs/bafybeibwppu23j5wgshqvm5qyqv3c6pmhp3y5irdwn3ivvnnrpexiguzbi";
 
-const ASSET_SLATE_CUBE =
-  "https://slate.textile.io/ipfs/bafybeiaex6rorqtumulc4x3u4sbl5pdbn5sx45mvm6uvbebu4cxgk3okjy";
+const ASSET_SLATE_CUBE = "https://slate.textile.io/ipfs/bafybeiaex6rorqtumulc4x3u4sbl5pdbn5sx45mvm6uvbebu4cxgk3okjy";
 
 const STYLES_ROOT = css`
   display: flex;
@@ -165,6 +138,8 @@ const STYLES_LINK = css`
 
 const STYLES_H1 = css`
   font-size: ${Constants.typescale.lvl5};
+  font-family: ${Constants.font.medium};
+  font-weight: 400;
   line-height: 1.3;
   padding: 0px 0px 24px 0px;
   letter-spacing: -0.021rem;
@@ -183,6 +158,8 @@ const STYLES_H1 = css`
 
 const STYLES_H2 = css`
   font-size: ${Constants.typescale.lvl3};
+  font-family: ${Constants.font.medium};
+  font-weight: 400;
   line-height: 1.3;
   letter-spacing: -0.019rem;
   padding: 0 0 24px 0;
@@ -201,6 +178,8 @@ const STYLES_H2 = css`
 
 const STYLES_H3 = css`
   font-size: ${Constants.typescale.lvl2};
+  font-family: ${Constants.font.medium};
+  font-weight: 400;
   line-height: 1.5;
   letter-spacing: -0.014rem;
   padding: 0 0 8px 0;
@@ -269,16 +248,17 @@ const STYLES_FILETYPE = css`
   flex-wrap: wrap;
   width: 100%;
   @media (max-width: ${Constants.sizes.mobile}px) {
-    display: block;
+    display: flex;
+    flex-wrap: wrap;
   }
 `;
 
 const STYLES_FILETYPE_GRID_ITEM = css`
   padding: 0 24px 24px 0;
-  width: 50%;
+  width: 25%;
 
   @media (max-width: ${Constants.sizes.mobile}px) {
-    width: 100%;
+    width: 50%;
     padding: 0 0 24px 0;
   }
 `;
@@ -314,10 +294,13 @@ const STYLES_VIDEO_MEDIUM = css`
   margin: 24px auto 96px auto;
   border-radius: 4px;
   width: 100%;
+  max-width: 56vw;
   box-shadow: 0px 10px 50px 20px rgba(0, 0, 0, 0.1);
 
   @media (max-width: ${Constants.sizes.tablet}px) {
     margin: 16px auto 64px auto;
+    width: 100%;
+    max-width: 100vw;
   }
 
   @media (max-width: ${Constants.sizes.mobile}px) {
@@ -369,10 +352,11 @@ const STYLES_TEXT_BLOCK = css`
   max-width: 56vw;
   width: 100%;
   align-self: center;
+  margin-bottom: 16px;
 
   @media (max-width: ${Constants.sizes.mobile}px) {
-    width: 88%;
-    right: 24px;
+    width: 100%;
+    max-width: 100vw;
   }
 `;
 
@@ -486,6 +470,8 @@ const STYLES_SLATE_CARD_TEXT = css`
 const STYLES_SLATE_CARD_TITLE = css`
   padding: 12px;
   font-size: ${Constants.typescale.lvl1};
+  letter-spacing: -0.021rem;
+  font-weight: 400;
   text-align: left;
   width: 100%;
 
@@ -497,6 +483,8 @@ const STYLES_SLATE_CARD_TITLE = css`
 
 const STYLES_SLATE_CARD_CTA_TITLE = css`
   font-size: ${Constants.typescale.lvl5};
+  font-family: ${Constants.font.medium};
+  font-weight: 400;
   text-align: left;
   line-height: 1.25;
   padding: 12px;
@@ -597,16 +585,11 @@ export default class IndexPage extends React.Component {
 
   render() {
     const title = `Slate`;
-    const description =
-      "Welcome to the future of file sharing. Powered by Textile, Filecoin, and IPFS.";
+    const description = "Welcome to the future of file sharing. Powered by Textile, Filecoin, and IPFS.";
     const url = "https://slate.host";
 
     return (
-      <WebsitePrototypeWrapper
-        title={title}
-        description={description}
-        url={url}
-      >
+      <WebsitePrototypeWrapper title={title} description={description} url={url}>
         <WebsitePrototypeHeader />
         <div css={STYLES_ROOT}>
           <div css={STYLES_SECTION_HERO}>
@@ -617,11 +600,8 @@ export default class IndexPage extends React.Component {
               </h1>
 
               <div css={STYLES_ACTIONS_RIGHT}>
-                <div
-                  css={STYLES_BUTTON_PRIMARY}
-                  onClick={() => window.open("/_")}
-                >
-                  Use Slate
+                <div css={STYLES_BUTTON_PRIMARY} onClick={() => window.open("/_")}>
+                  Use slate
                 </div>
               </div>
             </div>
@@ -645,11 +625,7 @@ export default class IndexPage extends React.Component {
                 Slate{" "}
                 <span css={STYLES_HIGHLIGHT}>
                   is a{" "}
-                  <a
-                    css={STYLES_LINK}
-                    href={"https://github.com/filecoin-project/slate"}
-                    target="_blank"
-                  >
+                  <a css={STYLES_LINK} href={"https://github.com/filecoin-project/slate"} target="_blank">
                     fully open-source
                   </a>{" "}
                   file sharing network designed for research and collaboration.
@@ -658,29 +634,19 @@ export default class IndexPage extends React.Component {
                 <br />
                 <span css={STYLES_HIGHLIGHT}>Store</span> your data,
                 <br />
-                <span css={STYLES_HIGHLIGHT}>organize</span> it any way you
-                like, <br />
-                <span css={STYLES_HIGHLIGHT}>and share</span> it with the world
-                securely.
+                <span css={STYLES_HIGHLIGHT}>organize</span> it any way you like, <br />
+                <span css={STYLES_HIGHLIGHT}>and share</span> it with the world securely.
                 <br />
                 <br />
               </h2>
               <h3 css={STYLES_H3}>Powered by</h3>
               <h2 css={STYLES_H2}>
                 <span css={STYLES_HIGHLIGHT}>
-                  <a
-                    href="https://textile.io"
-                    css={STYLES_LINK}
-                    target="_blank"
-                  >
+                  <a href="https://textile.io" css={STYLES_LINK} target="_blank">
                     Textile
                   </a>{" "}
                   <br />
-                  <a
-                    href="https://filecoin.io"
-                    css={STYLES_LINK}
-                    target="_blank"
-                  >
+                  <a href="https://filecoin.io" css={STYLES_LINK} target="_blank">
                     Filecoin
                   </a>
                   <br />
@@ -707,77 +673,67 @@ export default class IndexPage extends React.Component {
                 </span>
               </h1>
               <h3 css={STYLES_H3} style={{ marginBottom: 48 }}>
-                <span css={STYLES_HIGHLIGHT}>Easily upload </span>any kind of
-                media file to your storage system.
+                <span css={STYLES_HIGHLIGHT}>Easily upload </span>any kind of media file to your storage system.
                 <br />
               </h3>
-              <div css={STYLES_FILETYPE}>
-                <div css={STYLES_FILETYPE_GRID_ITEM}>
-                  <video
-                    css={STYLES_VIDEO_SMALL}
-                    src={ASSETS_SMALL[0].src}
-                    autoPlay
-                    loop
-                    muted
-                    type="video/mp4"
-                    playsInline
-                    style={{
-                      backgroundImage: `url('${
-                        ASSETS_SMALL[0].backgroundImage
-                      }')`,
-                    }}
-                  />
-                </div>
-                <div css={STYLES_FILETYPE_GRID_ITEM}>
-                  <video
-                    css={STYLES_VIDEO_SMALL}
-                    src={ASSETS_SMALL[1].src}
-                    autoPlay
-                    loop
-                    muted
-                    type="video/mp4"
-                    playsInline
-                    style={{
-                      backgroundImage: `url('${
-                        ASSETS_SMALL[1].backgroundImage
-                      }')`,
-                    }}
-                  />
-                </div>
+            </div>
+            <div css={STYLES_FILETYPE}>
+              <div css={STYLES_FILETYPE_GRID_ITEM}>
+                <video
+                  css={STYLES_VIDEO_SMALL}
+                  src={ASSETS_SMALL[0].src}
+                  autoPlay
+                  loop
+                  muted
+                  type="video/mp4"
+                  playsInline
+                  style={{
+                    backgroundImage: `url('${ASSETS_SMALL[0].backgroundImage}')`,
+                  }}
+                />
               </div>
-              <div css={STYLES_FILETYPE}>
-                <div css={STYLES_FILETYPE_GRID_ITEM}>
-                  <video
-                    css={STYLES_VIDEO_SMALL}
-                    src={ASSETS_SMALL[2].src}
-                    autoPlay
-                    loop
-                    muted
-                    type="video/mp4"
-                    playsInline
-                    style={{
-                      backgroundImage: `url('${
-                        ASSETS_SMALL[2].backgroundImage
-                      }')`,
-                    }}
-                  />
-                </div>
-                <div css={STYLES_FILETYPE_GRID_ITEM}>
-                  <video
-                    css={STYLES_VIDEO_SMALL}
-                    src={ASSETS_SMALL[3].src}
-                    autoPlay
-                    loop
-                    muted
-                    type="video/mp4"
-                    playsInline
-                    style={{
-                      backgroundImage: `url('${
-                        ASSETS_SMALL[3].backgroundImage
-                      }')`,
-                    }}
-                  />
-                </div>
+              <div css={STYLES_FILETYPE_GRID_ITEM}>
+                <video
+                  css={STYLES_VIDEO_SMALL}
+                  src={ASSETS_SMALL[1].src}
+                  autoPlay
+                  loop
+                  muted
+                  type="video/mp4"
+                  playsInline
+                  style={{
+                    backgroundImage: `url('${ASSETS_SMALL[1].backgroundImage}')`,
+                  }}
+                />
+              </div>
+
+              <div css={STYLES_FILETYPE_GRID_ITEM}>
+                <video
+                  css={STYLES_VIDEO_SMALL}
+                  src={ASSETS_SMALL[2].src}
+                  autoPlay
+                  loop
+                  muted
+                  type="video/mp4"
+                  playsInline
+                  style={{
+                    backgroundImage: `url('${ASSETS_SMALL[2].backgroundImage}')`,
+                  }}
+                />
+              </div>
+              <div css={STYLES_FILETYPE_GRID_ITEM}>
+                <video
+                  css={STYLES_VIDEO_SMALL}
+                  src={ASSETS_SMALL[3].src}
+                  autoPlay
+                  loop
+                  muted
+                  type="video/mp4"
+                  playsInline
+                  style={{
+                    backgroundImage: `url('${ASSETS_SMALL[3].backgroundImage}')`,
+                  }}
+                />
               </div>
             </div>
           </div>
@@ -788,9 +744,8 @@ export default class IndexPage extends React.Component {
                 Upload from <span css={STYLES_HIGHLIGHT}>anywhere</span>
               </h1>
               <h3 css={STYLES_H3}>
-                <span css={STYLES_HIGHLIGHT}>The Slate Chrome extension</span>{" "}
-                lets you seamlessly upload files to your slates from anywhere on
-                the web.
+                <span css={STYLES_HIGHLIGHT}>The Slate Chrome extension</span> lets you seamlessly upload files to your
+                slates from anywhere on the web.
               </h3>
             </div>
             <div>
@@ -808,34 +763,33 @@ export default class IndexPage extends React.Component {
                 <span css={STYLES_HIGHLIGHT}>Organize and publish</span>
               </h1>
               <h3 css={STYLES_H3}>
-                <span css={STYLES_HIGHLIGHT}>A modular interface</span> for your
-                files, giving you complete flexibility.
+                <span css={STYLES_HIGHLIGHT}>A modular interface</span> for your files, giving you complete flexibility.
               </h3>
-              <br />
-              <br />
+            </div>
 
-              {ASSETS_MEDIUM.map((each) => {
-                return (
-                  <React.Fragment key={each.title}>
+            {ASSETS_MEDIUM.map((each) => {
+              return (
+                <React.Fragment key={each.title}>
+                  <div css={STYLES_TEXT_BLOCK}>
                     <h3 css={STYLES_H3}>
                       <span css={STYLES_HIGHLIGHT}>{each.title}</span>
                     </h3>
-                    <video
-                      css={STYLES_VIDEO_MEDIUM}
-                      autoPlay
-                      loop
-                      muted
-                      src={each.src}
-                      type="video/mp4"
-                      playsInline
-                      style={{
-                        backgroundImage: `url('${each.backgroundImage}')`,
-                      }}
-                    />
-                  </React.Fragment>
-                );
-              })}
-            </div>
+                  </div>
+                  <video
+                    css={STYLES_VIDEO_MEDIUM}
+                    autoPlay
+                    loop
+                    muted
+                    src={each.src}
+                    type="video/mp4"
+                    playsInline
+                    style={{
+                      backgroundImage: `url('${each.backgroundImage}')`,
+                    }}
+                  />
+                </React.Fragment>
+              );
+            })}
           </div>
 
           <div css={STYLES_SECTION_SLATE}>
@@ -844,9 +798,8 @@ export default class IndexPage extends React.Component {
                 <span css={STYLES_HIGHLIGHT}>Collaborate and connect</span>
               </h1>
               <h3 css={STYLES_H3}>
-                <span css={STYLES_HIGHLIGHT}>A file sharing network</span> built
-                on top of a storage system making it possible to connect with
-                other people on the Filecoin network.
+                <span css={STYLES_HIGHLIGHT}>A file sharing network</span> built on top of a storage system making it
+                possible to connect with other people on the Filecoin network.
               </h3>
             </div>
 
@@ -859,9 +812,7 @@ export default class IndexPage extends React.Component {
               type="video/mp4"
               playsInline
               style={{
-                backgroundImage: `url('${
-                  ASSET_HERO_COLLABORATE.backgroundImage
-                }')`,
+                backgroundImage: `url('${ASSET_HERO_COLLABORATE.backgroundImage}')`,
               }}
             />
           </div>
@@ -869,21 +820,13 @@ export default class IndexPage extends React.Component {
           <div css={STYLES_SECTION_SLATE}>
             <div css={STYLES_TEXT_BLOCK}>
               <h1 css={STYLES_H1}>
-                Built on{" "}
-                <span css={STYLES_HIGHLIGHT}>trust, privacy, and security</span>
+                Built on <span css={STYLES_HIGHLIGHT}>trust, privacy, and security</span>
               </h1>
               <h3 css={STYLES_H3}>
-                <span css={STYLES_HIGHLIGHT}>
-                  Slate is built on Filecoin and IPFS
-                </span>{" "}
-                — technologies built around ownership and transparency for the
-                future of the web.
+                <span css={STYLES_HIGHLIGHT}>Slate is built on Filecoin and IPFS</span> — technologies built around
+                ownership and transparency for the future of the web.
               </h3>
-              <a
-                css={STYLES_LINK_WHITE}
-                href="https://filecoin.io"
-                target="_blank"
-              >
+              <a css={STYLES_LINK_WHITE} href="https://filecoin.io" target="_blank">
                 Learn more about Filecoin -&gt;
               </a>
             </div>
@@ -895,22 +838,14 @@ export default class IndexPage extends React.Component {
 
           <div css={STYLES_SECTION_SLATE_WALL}>
             <div css={STYLES_SLATE_CARD_CTA}>
-              <a
-                css={STYLES_SLATE_CARD_PARAGRAPH}
-                href="https://slate.host/_"
-                target="_blank"
-              >
+              <a css={STYLES_SLATE_CARD_PARAGRAPH} href="https://slate.host/_" target="_blank">
                 <div css={STYLES_SLATE_CARD_TEXT}>
                   <h1 css={STYLES_SLATE_CARD_CTA_TITLE}>
                     Join us <br />
-                    <span css={STYLES_HIGHLIGHT_BLACK}>
-                      in our open & secure network
-                    </span>
+                    <span css={STYLES_HIGHLIGHT_BLACK}>in our open & secure network</span>
                   </h1>
                   <div css={STYLES_SLATE_CARD_EXPLAINER}>
-                    <div css={STYLES_SLATE_CARD_CTA_PARAGRAPH}>
-                      Create your first slate
-                    </div>
+                    <div css={STYLES_SLATE_CARD_CTA_PARAGRAPH}>Create your first slate</div>
                     <div css={STYLES_SLATE_CARD_CTA_PARAGRAPH}>-&gt;</div>
                   </div>
                 </div>