diff --git a/site/layouts/partials/about.html b/site/layouts/partials/about.html
index 712349f..b712c87 100644
--- a/site/layouts/partials/about.html
+++ b/site/layouts/partials/about.html
@@ -1,18 +1,44 @@
-<article id="about" class="l-relative l-screen-min-full">
-  <div class="l-section-pad l-wrapper">
-    <div>
-      <h2>About Heading</h2>
-      <p>Lorem fuga cupiditate quidem quia earum, hic. Iusto id beatae sit similique sequi! Earum veritatis mollitia iste ipsam totam deleniti Nam cupiditate recusandae tempore ab magnam! Officiis maxime incidunt asperiores?</p>
-      <p>Amet sed ullam ea dolore corrupti sit. Alias aut doloribus explicabo perferendis fuga? Quas nostrum aut earum tempora voluptatem, magnam? Veritatis corrupti perspiciatis at aliquid perspiciatis Eligendi reprehenderit quidem veniam</p>
-      <p>Amet dolore atque iure inventore vitae Dolores fuga porro quo odit et autem. Sint est nesciunt unde non aliquid officiis fugit Repellat cum sequi cum fugiat fugit Voluptatem quaerat quibusdam.</p>
-    </div>
-    <div>
-      <img src="https://via.placeholder.com/200" alt="CARD IMAGE">
-      <h3>Card Heading</h3>
+<article id="about">
+
+  <section class="l-relative l-screen-min-full">
+    <div class="l-underlay about-bg"></div>
+    <div class="l-section-pad l-wrapper">
+      <div>
+        <h2>About Heading One</h2>
+        <div class="section-icon"></div>
+        <p>Lorem fuga cupiditate quidem quia earum, hic. Iusto id beatae sit similique sequi! Earum veritatis mollitia iste ipsam totam deleniti Nam cupiditate recusandae tempore ab magnam! Officiis maxime incidunt asperiores?</p>
+        <p>Amet sed ullam ea dolore corrupti sit. Alias aut doloribus explicabo perferendis fuga? Quas nostrum aut earum tempora voluptatem, magnam? Veritatis corrupti perspiciatis at aliquid perspiciatis Eligendi reprehenderit quidem veniam</p>
+        <p>Amet dolore atque iure inventore vitae Dolores fuga porro quo odit et autem. Sint est nesciunt unde non aliquid officiis fugit Repellat cum sequi cum fugiat fugit Voluptatem quaerat quibusdam.</p>
+      </div>
+      <div>
+        <img src="https://via.placeholder.com/300x400" alt="CARD IMAGE">
+        <h3>Card Heading</h3>
         <p>
           Amet recusandae optio quia velit quisquam. Dolorem ipsam non modi est quisquam? Quia inventore neque amet laudantium impedit a, dignissimos. Repellendus vero animi saepe tempora quibusdam! Repudiandae esse ex adipisci
         </p>
+      </div>
     </div>
-  </div>
+  </section>
+
+  <section class="l-relative l-screen-min-full">
+    <div class="l-underlay about-bg about-bg--secondary"></div>
+    <div class="l-section-pad l-wrapper">
+      <div>
+        <h2>About Heading Two</h2>
+        <div class="section-icon"></div>
+        <p>Lorem fuga cupiditate quidem quia earum, hic. Iusto id beatae sit similique sequi! Earum veritatis mollitia iste ipsam totam deleniti Nam cupiditate recusandae tempore ab magnam! Officiis maxime incidunt asperiores?</p>
+        <p>Amet sed ullam ea dolore corrupti sit. Alias aut doloribus explicabo perferendis fuga? Quas nostrum aut earum tempora voluptatem, magnam? Veritatis corrupti perspiciatis at aliquid perspiciatis Eligendi reprehenderit quidem veniam</p>
+        <p>Amet dolore atque iure inventore vitae Dolores fuga porro quo odit et autem. Sint est nesciunt unde non aliquid officiis fugit Repellat cum sequi cum fugiat fugit Voluptatem quaerat quibusdam.</p>
+      </div>
+      <div>
+        <img src="https://via.placeholder.com/300x400" alt="CARD IMAGE">
+        <h3>Another Card Heading</h3>
+        <p>
+          Amet recusandae optio quia velit quisquam. Dolorem ipsam non modi est quisquam? Quia inventore neque amet laudantium impedit a, dignissimos. Repellendus vero animi saepe tempora quibusdam! Repudiandae esse ex adipisci
+        </p>
+      </div>
+    </div>
+  </section>
+
 </article>