Initial commit

17 files changed, 312 insertions, 1 deletions

diff --git a/site/layouts/partials/2-up.html b/site/layouts/partials/2-up.html
new file mode 100644
index 0000000..d4f30fe
--- /dev/null
+++ b/site/layouts/partials/2-up.html
@@ -0,0 +1,24 @@
+<div class="bg-off-white pv4">
+  <div class="ph3 mw7 center">
+    <h2 class="f2 b lh-title mb2">{{.heading}}</h2>
+    <p class="mb4 mw6">{{.description}}</p>
+
+    <div class="flex-ns mhn2-ns mb3">
+      <div class="ph2-ns w-50-ns">
+        <img src="{{.svg1}}" alt="" class="center db mb3" style="width: 240px">
+        <p>{{.text1}}</p>
+      </div>
+
+      <div class="ph2-ns w-50-ns">
+        <img src="{{.svg2}}" alt="" class="center db mb3" style="width: 240px">
+        <p>{{.text2}}</p>
+      </div>
+    </div>
+
+    {{ if .buttonText }}
+      <div class="tc">
+        <a href="#" class="btn raise">{{.buttonText}}</a>
+      </div>
+    {{ end }}
+  </div>
+</div>
diff --git a/site/layouts/partials/4-up.html b/site/layouts/partials/4-up.html
new file mode 100644
index 0000000..dff48b4
--- /dev/null
+++ b/site/layouts/partials/4-up.html
@@ -0,0 +1,36 @@
+<div class="bg-off-white pv4">
+	<div class="ph3 mw7 center">
+		<h2 class="f2 b lh-title mb2">{{.heading}}</h2>
+		<p class="mb4 mw6">{{.description}}</p>
+
+		<div class="flex-ns flex-wrap mhn2-ns mb3">
+
+			<div class="ph2-ns w-50-ns mb4">
+				<img src="{{.svg1}}" alt="" class="center db mb3" style="width: 240px">
+				<p>{{.text1}}</p>
+			</div>
+
+			<div class="ph2-ns w-50-ns mb4">
+				<img src="{{.svg2}}" alt="" class="center db mb3" style="width: 240px">
+				<p>{{.text2}}</p>
+			</div>
+
+      <div class="ph2-ns w-50-ns mb4">
+        <img src="{{.svg3}}" alt="" class="center db mb3" style="width: 240px">
+        <p>{{.text3}}</p>
+      </div>
+
+      <div class="ph2-ns w-50-ns mb4">
+        <img src="{{.svg4}}" alt="" class="center db mb3" style="width: 240px">
+        <p>{{.text4}}</p>
+      </div>
+
+		</div>
+
+		{{ if .buttonText }}
+			<div class="tc">
+				<a href="#" class="btn raise">{{.buttonText}}</a>
+			</div>
+		{{ end }}
+	</div>
+</div>
diff --git a/site/layouts/partials/about.html b/site/layouts/partials/about.html
new file mode 100644
index 0000000..657aead
--- /dev/null
+++ b/site/layouts/partials/about.html
@@ -0,0 +1,21 @@
+<div class="bg-grey-1 pv4">
+	<div class="ph3 mw7 center">
+
+		<div class="flex-l mhn2-l">
+			<div class="w-40-l ph2-l">
+				<h2 class="f2 b lh-title mb2">{{.heading}}</h1>
+
+				<p>{{.text}}</p>
+			</div>
+
+			<div class="w-60-l ph2-l">
+				<img src="img/home/about-section.jpg" alt="" class="mb3">
+			</div>
+		</div>
+
+		<div class="tc">
+			<a href="#" class="btn raise">{{.buttonText}}</a>
+		</div>
+
+	</div>
+</div>
diff --git a/site/layouts/partials/blockquote.html b/site/layouts/partials/blockquote.html
new file mode 100644
index 0000000..6f432bd
--- /dev/null
+++ b/site/layouts/partials/blockquote.html
@@ -0,0 +1,6 @@
+<div class="mw6 center mb3">
+  <blockquote class="bg-grey-1 primary pa3 mb3 br1 b">
+    <p class="f4 mb0">{{.quote}}</p>
+    <cite class="tr db grey-3">{{.author}}</cite>
+  </blockquote>
+</div>
diff --git a/site/layouts/partials/blog.html b/site/layouts/partials/blog.html
new file mode 100644
index 0000000..c8f5ff1
--- /dev/null
+++ b/site/layouts/partials/blog.html
@@ -0,0 +1,22 @@
+<div class="bg-off-white">
+	<div class="ph3 mw7 center mb4">
+
+		<h2 class="f2 b lh-title mb2">post section</h1>
+
+
+	  <div class="flex-l mhn1-l flex-wrap mb3">
+
+			{{ range where .Data.Pages "Type" "post" }}
+				<div class="ph1-l w-50-l flex">
+					{{ .Render "li" }}
+				</div>
+			{{ end }}
+
+	  </div>
+
+	  <div class="tc">
+	  	<a href="/post" class="btn mb3 raise">Read more</a>
+	  </div>
+
+	</div>
+</div>
diff --git a/site/layouts/partials/footer.html b/site/layouts/partials/footer.html
index 310a610..629e288 100644
--- a/site/layouts/partials/footer.html
+++ b/site/layouts/partials/footer.html
@@ -1,3 +1,59 @@
+<footer class="bg-black ph3 pv4 white">
+
+	<div class="mw7 center pt3">
+		<div class="measure-narrow center mb4">
+			<img src="/img/logo.svg" alt="" class="db w4 center mb4">
+			<p class="f3 lh-title light-gray b tc mb2">Newsletter subscribe</p>
+			<p>Get awesome news from us in your inbox every two weeks. Be the first to learn about new products.</p>
+
+			<form action="" class="flex-ns mb3">
+				<fieldset class="flex-auto mb2 mb0-ns mr2-ns">
+					<input type="text" id="email" placeholder="Your email" class="w-100">
+					<label for="email">Your email</label>
+				</fieldset>
+				<button class="btn mb3 w-100 w-auto-ns mb0-ns raise" type="submit">Submit</button>
+			</form>
+		</div>
+
+		<div class="flex-ns justify-between">
+			<div>
+				<h3 class="f4 b lh-title mb1 primary">List of links</h3>
+				<ul class="mb3">
+					<li><a href="/" class="link">Home</a></li>
+					<li><a href="/products" class="link">Our products</a></li>
+					<li><a href="/about" class="link">About us</a></li>
+					<li><a href="/post" class="link">post</a></li>
+					<li><a href="/contact" class="link">Contact</a></li>
+				</ul>
+			</div>
+
+			<div>
+				<h3 class="f4 b lh-title mb1 primary">Another list of links</h3>
+				<ul class="mb3">
+					<li><a href="#" class="link">Latest offer</a></li>
+					<li><a href="#" class="link">Our locations</a></li>
+					<li><a href="#" class="link">Our partners</a></li>
+				</ul>
+			</div>
+
+			<div>
+				<h3 class="f4 b lh-title mb2 primary">Social media</h3>
+				<ul class="mhn2">
+					{{ partial "social-icon" (dict "link" "facebook.com" "svg" "500px") }}
+					{{ partial "social-icon" (dict "link" "facebook.com" "svg" "Airbnb") }}
+					{{ partial "social-icon" (dict "link" "facebook.com" "svg" "Facebook") }}
+					{{ partial "social-icon" (dict "link" "facebook.com" "svg" "Amazon") }}
+				</ul>
+			</div>
+		</div>
+	</div>
+
+</footer>
+
+{{ partial "svg" . }}
+
 <script src="/app.js"></script>
+
 </body>
+
 </html>
diff --git a/site/layouts/partials/header.html b/site/layouts/partials/header.html
index c84dc6e..c9268c2 100644
--- a/site/layouts/partials/header.html
+++ b/site/layouts/partials/header.html
@@ -3,5 +3,10 @@
   <head>
     <title>Hugo with Gulp and Webpack</title>
     <link rel="stylesheet" href="/css/main.css"/>
+
+    <meta charset="utf-8">
+  	<meta http-equiv="x-ua-compatible" content="ie=edge">
+  	<meta name="viewport" content="width=device-width, initial-scale=1">
+    <link href="https://fonts.googleapis.com/css?family=Nunito+Sans:400,700,800" rel="stylesheet">
   </head>
-  <body>
+  <body class="sans-serif">
diff --git a/site/layouts/partials/image-grid.html b/site/layouts/partials/image-grid.html
new file mode 100644
index 0000000..25bf701
--- /dev/null
+++ b/site/layouts/partials/image-grid.html
@@ -0,0 +1,17 @@
+<div class="mw7 center ph3 pv4">
+
+	<div class="flex flex-wrap mhn1">
+		<div class="w-100 w-50-ns ph1-ns">
+			<img src="/img/products/products-grid3.jpg" alt="">
+		</div>
+
+		<div class="w-100 w-50-ns ph1-ns">
+			<img src="/img/products/products-grid2.jpg" alt="">
+		</div>
+
+		<div class="w-100 ph1-ns">
+			<img src="/img/products/products-grid1.jpg" alt="">
+		</div>
+	</div>
+
+</div>
diff --git a/site/layouts/partials/jumbotron.html b/site/layouts/partials/jumbotron.html
new file mode 100644
index 0000000..b843c1c
--- /dev/null
+++ b/site/layouts/partials/jumbotron.html
@@ -0,0 +1,18 @@
+<div class="pv5 pv6-l ph3 bg-center cover" style="background-image: url('{{.imageUrl}}')">
+  <div class="mw7 center ph3">
+    <div class="db mb3">
+      <div class="mw7 relative bg-fix-primary mb3">
+        <h1 class="f2 f1-l b di lh-title mb3 white mw6 bg-primary">
+          {{.title}}
+        </h1>
+      </div>
+      <div class="mw7 relative bg-fix-primary">
+        {{ if .subtitle }}
+        <p class="b f4 di lh-title mb3 white mw6 bg-primary">
+          {{.subtitle}}
+        </p>
+        {{ end }}
+      </div>
+    </div>
+  </div>
+</div>
diff --git a/site/layouts/partials/media-block-reverse.html b/site/layouts/partials/media-block-reverse.html
new file mode 100644
index 0000000..a7b8c18
--- /dev/null
+++ b/site/layouts/partials/media-block-reverse.html
@@ -0,0 +1,12 @@
+<div class="flex-ns mhn3-ns mb4">
+
+  <div class="ph3-ns w-50-ns order-last-ns">
+    <img src="{{.imageUrl}}" alt="" class="db mb2">
+  </div>
+
+  <div class="ph3-ns w-50-ns">
+    <h3 class="f3 b lh-title mb1">{{.heading}}</h3>
+    <p>{{.text}}</p>
+  </div>
+
+</div>
diff --git a/site/layouts/partials/media-block.html b/site/layouts/partials/media-block.html
new file mode 100644
index 0000000..db5f619
--- /dev/null
+++ b/site/layouts/partials/media-block.html
@@ -0,0 +1,12 @@
+<div class="flex-ns mhn3-ns mb4">
+
+  <div class="ph3-ns w-50-ns">
+    <img src="{{.imageUrl}}" alt="" class="db mb2">
+  </div>
+
+  <div class="ph3-ns w-50-ns">
+    <h3 class="f3 b lh-title mb1">{{.heading}}</h3>
+    <p>{{.text}}</p>
+  </div>
+
+</div>
diff --git a/site/layouts/partials/nav.html b/site/layouts/partials/nav.html
new file mode 100644
index 0000000..8225a10
--- /dev/null
+++ b/site/layouts/partials/nav.html
@@ -0,0 +1,12 @@
+<nav class="overflow-x-scroll flex justify-between center bg-white divider">
+  <a href="/" class="pa3 dib mr4 flex-none">
+    <img src="/img/logo.svg" alt="" width="80px">
+  </a>
+
+  <ul class="flex b grey-3">
+    <li><a href="/products" class="pa3 link db">Products</a></li>
+    <li><a href="/about" class="pa3 link db">About</a></li>
+    <li><a href="/post" class="pa3 link db">post</a></li>
+    <li><a href="/contact" class="pa3 link db">Contact</a></li>
+  </ul>
+</nav>
diff --git a/site/layouts/partials/pricing-card.html b/site/layouts/partials/pricing-card.html
new file mode 100644
index 0000000..2f009b2
--- /dev/null
+++ b/site/layouts/partials/pricing-card.html
@@ -0,0 +1,27 @@
+<div class="ph2">
+
+	<!-- Title -->
+	<h3 class="b f5 grey-3 tc lh-title mb3">{{.plan}}</h3>
+
+	<!-- Price -->
+	<p class="primary f1 b tc lh-title">
+		<span class="f4">$</span>{{.price}}
+	</p>
+
+	<!-- Description -->
+	<p class="b">{{.description}}</p>
+
+	<!-- Features -->
+	<ul>
+		<li>
+			<p class="pb2 mb2 divider">{{.item1}}</p>
+		</li>
+		<li>
+			<p class="pb2 mb2 divider">{{.item2}}</p>
+		</li>
+		<li>
+			<p>{{.item3}}</p>
+		</li>
+	</ul>
+
+</div>
diff --git a/site/layouts/partials/short-text.html b/site/layouts/partials/short-text.html
new file mode 100644
index 0000000..7f10bb7
--- /dev/null
+++ b/site/layouts/partials/short-text.html
@@ -0,0 +1,6 @@
+<div class="bg-grey-1 pv4">
+  <div class="flex-l mhn1-l ph3 center mw7">
+    <h2 class="f2 b lh-title mb2 w-40-l">{{.heading}}</h2>
+    <p class="w-60-l mb0">{{.text}}</p>
+  </div>
+</div>
diff --git a/site/layouts/partials/social-icon.html b/site/layouts/partials/social-icon.html
new file mode 100644
index 0000000..6d616be
--- /dev/null
+++ b/site/layouts/partials/social-icon.html
@@ -0,0 +1,7 @@
+<li class="dib ph2">
+  <a href="{{.link}}" class="link bg-white black db relative br-100 pa2 raise">
+    <svg width="16px" height="16px" class="db">
+      <use xlink:href="#{{.svg}}"></use>
+    </svg>
+  </a>
+</li>
diff --git a/site/layouts/partials/svg.html b/site/layouts/partials/svg.html
new file mode 100644
index 0000000..7a0c34d
--- /dev/null
+++ b/site/layouts/partials/svg.html
@@ -0,0 +1,5 @@
+<div style="height: 0; width: 0; position: absolute; visibility: hidden">
+	<!-- inject:svg -->
+  <svg xmlns="http://www.w3.org/2000/svg"><symbol id="500px" viewBox="0 0 36 46"><title>500px-black</title><path d="M35.374 38.234c-.326-.324-.604-.515-.848-.584a.618.618 0 0 0-.639.152l-.161.159a18.262 18.262 0 0 1-5.82 3.901 18.28 18.28 0 0 1-7.126 1.43 18.28 18.28 0 0 1-7.126-1.43 18.262 18.262 0 0 1-5.82-3.901c-1.752-1.742-3.072-3.688-3.924-5.785-.83-2.045-1.102-3.583-1.191-4.088l-.02-.112c-.114-.595-.665-.637-1.457-.516-.329.05-1.331.202-1.236.919l.002.016a20.815 20.815 0 0 0 5.9 11.48 20.956 20.956 0 0 0 6.685 4.48 20.998 20.998 0 0 0 8.187 1.644c2.838 0 5.592-.553 8.187-1.645a20.964 20.964 0 0 0 6.685-4.481l.168-.171c.213-.23.398-.633-.446-1.469zM20.754 4.928c-2.713 0-5.599.544-7.719 1.456a.602.602 0 0 0-.392.523c-.028.24.037.556.199.968.132.334.481 1.221 1.157.965 2.17-.823 4.569-1.276 6.755-1.276 2.477 0 4.879.482 7.14 1.433 1.796.756 3.491 1.847 5.334 3.434a.645.645 0 0 0 .424.175c.359 0 .704-.351.999-.68.492-.549.83-1.005.345-1.461-1.76-1.657-3.688-2.895-6.069-3.896a20.967 20.967 0 0 0-8.173-1.641zm-3.699 22.804c.003.305.284.572.451.732l.053.051c.287.281.561.424.814.424a.567.567 0 0 0 .384-.14c.127-.117 1.559-1.56 1.696-1.697l1.597 1.583c.148.166.309.249.496.254.255 0 .533-.151.826-.448.689-.7.344-1.077.178-1.259l-1.618-1.609 1.688-1.69c.37-.398.043-.821-.283-1.145-.473-.471-.93-.592-1.223-.324l-1.678 1.671-1.697-1.688a.465.465 0 0 0-.328-.131c-.226 0-.494.152-.795.452-.522.519-.634.877-.362 1.164l1.698 1.682-1.688 1.681c-.139.138-.208.286-.207.44zM6.293 30.224c.01.028.25.687.389 1.013a14.994 14.994 0 0 0 3.245 4.785 15.139 15.139 0 0 0 10.71 4.41c2.044 0 4.028-.398 5.896-1.184 1.804-.758 3.423-1.844 4.814-3.226a14.981 14.981 0 0 0 4.436-10.647 14.89 14.89 0 0 0-1.191-5.861 15.02 15.02 0 0 0-3.245-4.786 15.139 15.139 0 0 0-10.71-4.41c-2.069 0-4.135.409-5.977 1.184-1.472.619-3.964 2.213-5.423 3.709l-.009.009V2.828h20.939c.762-.008.762-1.066.762-1.414 0-.347 0-1.405-.764-1.414H7.524a.992.992 0 0 0-.998.982v17.442c0 .563.705.969 1.36 1.108 1.279.272 1.575-.135 1.888-.565l.042-.057c.478-.706 1.973-2.202 1.988-2.217 2.333-2.319 5.452-3.596 8.783-3.596 3.315 0 6.425 1.277 8.758 3.596 2.341 2.327 3.63 5.411 3.63 8.682 0 3.284-1.282 6.367-3.611 8.682-2.299 2.286-5.511 3.596-8.812 3.596-2.236 0-4.394-.592-6.243-1.713l.008-10.606c0-1.414.617-2.951 1.651-4.112a6.068 6.068 0 0 1 4.588-2.058c1.72 0 3.327.649 4.524 1.828a6.122 6.122 0 0 1 1.843 4.391c0 3.544-2.803 6.32-6.382 6.32-.69 0-1.944-.303-1.996-.316-.723-.214-1.03.783-1.131 1.112-.389 1.264.196 1.515.317 1.552 1.152.355 1.907.423 2.897.423 5.052 0 9.162-4.088 9.162-9.113 0-4.984-4.108-9.04-9.157-9.04-2.473 0-4.795.94-6.54 2.646-1.662 1.625-2.615 3.791-2.615 5.943l-.001.053c-.008.268-.013 6.626-.015 8.713l-.009-.01c-.95-1.045-1.888-2.645-2.51-4.28-.244-.641-.795-.527-1.547-.297-.328.101-1.328.407-1.107 1.125l.003.009z"/></symbol><symbol id="Airbnb" viewBox="0 0 44 48"><title>Airbnb-black</title><path d="M43.2 33.5l-.2-.6c-.2-.4-.3-.8-.5-1.1-.2-.4-.3-.8-.5-1.1l-.6-1.2-.1-.1C38 22.2 34.6 15.3 31.2 8.7l-.1-.3c-.4-.7-.8-1.4-1.1-2.2l-.2-.2c-.4-.8-.9-1.6-1.6-2.4-1.5-1.9-3.8-3-6.2-3-2.4 0-4.6 1-6.2 2.9-.7.9-1.2 1.8-1.7 2.6L13 8.3l-.1.3C9 16.1 5.6 22.9 2.7 29.3l-.1.1c-.2.4-.4.8-.5 1.2l-.5 1.1c-.2.5-.5 1.1-.7 1.7-.6 1.8-.8 3.5-.6 5.2.5 3.6 2.9 6.6 6.3 8 1.2.5 2.5.8 3.9.8l1.3-.1c1.6-.2 3.3-.7 4.8-1.6 1.8-1 3.5-2.4 5.5-4.5 1.9 2 3.7 3.4 5.5 4.5 1.5.9 3.1 1.4 4.8 1.6.3 0 .8.1 1.3.1 1.4 0 2.8-.3 3.9-.8 3.3-1.3 5.7-4.4 6.3-8 .1-1.5-.1-3.2-.7-5.1zm-25.5-8.7c.1-.6.3-1.2.6-1.7.8-1.2 2.1-1.8 3.6-1.8 1.6 0 2.9.7 3.6 1.8.4.5.6 1.1.7 1.7.1.8.1 1.7-.1 2.6-.5 2.2-1.9 4.9-4.2 7.9-2.2-2.9-3.7-5.6-4.2-7.9-.1-1-.1-1.8 0-2.6zM30 28.4c.3-1.4.4-2.7.2-4.1-.2-1.2-.6-2.4-1.3-3.3-1.5-2.2-4-3.5-6.9-3.5-2.8 0-5.3 1.3-6.9 3.5-.7 1-1.1 2.1-1.3 3.3-.2 1.3-.1 2.7.2 4.1.7 3 2.5 6.4 5.4 10.1-1.7 1.9-3.3 3.2-4.8 4.1-1.1.6-2.2 1-3.3 1.1-1.1.1-2.2 0-3.3-.4-2.1-.9-3.6-2.8-3.9-5-.1-1.3 0-2.3.5-3.5.1-.3.2-.6.4-.9l.2-.5c.3-.7.7-1.5 1-2.3V31c3.4-7.2 6.8-14.2 10.1-20.6l.1-.3c.2-.3.4-.7.6-1.1l.6-1.1c.4-.8.8-1.4 1.2-1.9.9-1 2-1.5 3.3-1.5s2.4.5 3.3 1.5c.4.5.8 1.1 1.2 1.9.2.3.4.7.5 1.1.2.4.4.7.5 1l.1.3c3.5 6.8 6.8 13.7 10 20.5l.1.2.5 1.1c.2.4.4.8.5 1.1l.2.5c.2.3.3.6.4.9.4 1.2.5 2.3.3 3.3-.3 2.2-1.8 4.1-3.9 5-1 .4-2.1.6-3.2.4-1.1-.1-2.2-.5-3.3-1.1-1.5-.8-3-2.1-4.8-4.1 3-3.3 4.8-6.7 5.5-9.7z"/></symbol><symbol id="Amazon" viewBox="0 0 48 48"><title>Amazon-black</title><path d="M25.403 25.96c-.742 1.482-2.015 2.437-3.392 2.759-.209 0-.528.104-.847.104-2.328 0-3.706-1.801-3.706-4.45 0-3.394 2.012-4.981 4.552-5.726 1.377-.316 2.969-.424 4.558-.424v1.273c0 2.437.104 4.343-1.166 6.463zm1.166-12.607c-1.377.104-2.969.209-4.558.418-2.436.322-4.871.745-6.881 1.7-3.92 1.59-6.57 4.981-6.57 9.959 0 6.257 4.024 9.433 9.113 9.433 1.693 0 3.071-.215 4.338-.528 2.018-.638 3.708-1.804 5.721-3.925 1.166 1.59 1.487 2.335 3.497 4.029.531.209 1.061.209 1.482-.104 1.273-1.062 3.5-2.97 4.662-4.029.531-.424.426-1.062.104-1.587-1.163-1.485-2.331-2.759-2.331-5.619v-9.538c0-4.026.322-7.736-2.644-10.489C30.066.851 26.251.001 23.285.001h-1.273C16.613.314 10.895 2.647 9.62 9.324c-.212.85.426 1.166.849 1.271l5.932.743c.635-.107.954-.638 1.058-1.163.528-2.332 2.436-3.498 4.552-3.713h.426c1.273 0 2.65.531 3.389 1.592.847 1.271.742 2.968.742 4.453v.847zM47.994 35.946v-.003c-.023-.5-.127-.881-.336-1.197l-.023-.031-.025-.031c-.212-.232-.415-.319-.635-.415-.658-.254-1.614-.39-2.766-.392-.827 0-1.738.079-2.656.28l-.003-.062-.923.308-.017.008-.522.169v.023a8.17 8.17 0 0 0-1.685.946c-.322.24-.587.559-.601 1.048a.98.98 0 0 0 .35.751c.223.181.483.243.711.243l.15-.011.045-.003.034-.006c.452-.096 1.109-.161 1.88-.268.66-.073 1.36-.127 1.967-.127.429-.003.816.028 1.081.085l.285.09.042.02.025.265c.006.508-.209 1.451-.505 2.372-.288.92-.638 1.844-.869 2.456a1.253 1.253 0 0 0-.093.466c-.006.246.096.545.31.743.209.198.48.277.706.277h.011c.339-.003.627-.138.875-.333 2.342-2.106 3.158-5.472 3.192-7.367l-.006-.302zm-6.945 2.92a1.648 1.648 0 0 0-.714.161l-.768.325-.364.152-.474.189v.006c-5.151 2.089-10.561 3.315-15.567 3.422l-.548.006c-7.874.006-14.297-3.648-20.777-7.248a1.478 1.478 0 0 0-.686-.181c-.291 0-.59.11-.807.313a1.11 1.11 0 0 0-.344.805c-.003.392.209.754.505.988C6.587 43.087 13.253 47.994 22.219 48l.531-.008c5.704-.127 12.152-2.056 17.159-5.201l.031-.02a17.47 17.47 0 0 0 1.928-1.333c.384-.285.649-.731.649-1.194-.017-.822-.714-1.378-1.468-1.378z"/></symbol><symbol id="Facebook" viewBox="0 0 48 48"><title>Facebook-black</title><path d="M25.638 48H2.649A2.648 2.648 0 0 1 0 45.351V2.65A2.649 2.649 0 0 1 2.649.001h42.702A2.649 2.649 0 0 1 48 2.65v42.701A2.649 2.649 0 0 1 45.351 48H33.119V29.412h6.239l.934-7.244h-7.173v-4.625c0-2.097.582-3.527 3.59-3.527l3.836-.002V7.535c-.663-.088-2.941-.286-5.59-.286-5.531 0-9.317 3.376-9.317 9.576v5.342h-6.255v7.244h6.255v18.588z"/></symbol></svg>
+  <!-- endinject -->
+</div>
diff --git a/site/layouts/partials/table.html b/site/layouts/partials/table.html
new file mode 100644
index 0000000..66da24c
--- /dev/null
+++ b/site/layouts/partials/table.html
@@ -0,0 +1,25 @@
+<div class="bg-off-white pv4 ph3">
+
+	<div class="mw7 center">
+
+		<h2 class="f2 b lh-title mb3">{{.heading}}</h1>
+		<p class="mw6">{{.text}}</p>
+
+		<div class="flex-l mhn2-l mw7">
+
+			<div class="w-33-l ph2">{{ partial "pricing-card" (dict "plan" "Small" "price" "50" "description" "Perfect for the drinker who likes to enjoy 1-2 cups per day." "item1" "3 lbs of coffee per month" "item2" "Green or roasted beans" "item3" "One or two varieties of beans") }}
+			</div>
+
+			<div class="w-33-l ph2">
+				{{ partial "pricing-card" (dict "plan" "Big" "price" "80" "description" "Great for avid drinkers, java-loving couples and bigger crowds" "item1" "6 lbs of coffee per month" "item2" "Green or roasted beans" "item3" "Up to 4 different varieties of beans") }}
+			</div>
+
+			<div class="w-33-l ph2">
+				{{ partial "pricing-card" (dict "plan" "Small" "price" "80" "description" "Want a few tiny batches from different varieties? Try our custom plan" "item1" "However little or much you need" "item2" "Green or roasted beans" "item3" "Unlimited varieties") }}
+			</div>
+
+		</div>
+
+	</div>
+
+</div>