Initial commit

27 files changed, 485 insertions, 2 deletions

diff --git a/site/layouts/_default/li.html b/site/layouts/_default/li.html
new file mode 100644
index 0000000..d521ea0
--- /dev/null
+++ b/site/layouts/_default/li.html
@@ -0,0 +1,3 @@
+<li>
+  Hello
+</li>
diff --git a/site/layouts/_default/single.html b/site/layouts/_default/single.html
new file mode 100644
index 0000000..124e30d
--- /dev/null
+++ b/site/layouts/_default/single.html
@@ -0,0 +1,5 @@
+{{ partial "header" . }}
+{{ partial "nav" . }}
+{{ partial "jumbotron" (dict "imageUrl" "/img/7.jpg" "title" "This is where the heading goes" "subtitle" "This is where the subtitle goes") }}
+  {{ .Content }}
+{{ partial "footer" . }}
diff --git a/site/layouts/about/single.html b/site/layouts/about/single.html
new file mode 100644
index 0000000..ddcdd5f
--- /dev/null
+++ b/site/layouts/about/single.html
@@ -0,0 +1,16 @@
+{{ partial "header" . }}
+{{ partial "nav" . }}
+{{ partial "jumbotron" (dict "imageUrl" "/img/about/jumbotron.jpg" "title" "About us" "subtitle" "Our values") }}
+
+<div class="mw7 center ph3 pt4">
+
+  {{ partial "media-block" (dict "heading" "Shade-grown coffee" "text" "Coffee is a small tree or shrub that grows in the forest understory in its wild form, and traditionally was grown commercially under other trees that provided shade. The forest-like structure of shade coffee farms provides habitat for a great number of migratory and resident species." "imageUrl" "/img/about/direct-sourcing.jpg") }}
+
+  {{ partial "media-block-reverse" (dict "heading" "Shade-grown coffee" "text" "Coffee is a small tree or shrub that grows in the forest understory in its wild form, and traditionally was grown commercially under other trees that provided shade. The forest-like structure of shade coffee farms provides habitat for a great number of migratory and resident species." "imageUrl" "/img/about/reinvest-profits.jpg") }}
+
+  {{ partial "media-block" (dict "heading" "Shade-grown coffee" "text" "Coffee is a small tree or shrub that grows in the forest understory in its wild form, and traditionally was grown commercially under other trees that provided shade. The forest-like structure of shade coffee farms provides habitat for a great number of migratory and resident species." "imageUrl" "/img/about/shade-grown.jpg") }}
+
+  {{ partial "media-block-reverse" (dict "heading" "Shade-grown coffee" "text" "Coffee is a small tree or shrub that grows in the forest understory in its wild form, and traditionally was grown commercially under other trees that provided shade. The forest-like structure of shade coffee farms provides habitat for a great number of migratory and resident species." "imageUrl" "/img/about/single-origin.jpg") }}
+</div>
+
+{{ partial "footer" . }}
diff --git a/site/layouts/contact/single.html b/site/layouts/contact/single.html
new file mode 100644
index 0000000..e98f8d1
--- /dev/null
+++ b/site/layouts/contact/single.html
@@ -0,0 +1,60 @@
+{{ partial "header" . }}
+
+{{ partial "nav" . }}
+
+<div class="bg-black white ph3">
+	<div class="center mw6 pv3">
+		<img src="/img/logo.svg" alt="" class="db w4 center pv4">
+		<p>We’d love to get in touch with you and hear your ideas and questions. We strive to grow and improve constantly and your feedback is valuable for us.</p>
+		<h3 class="f4 b lh-title mb2">How can I get…?</h3>
+		<p>You can also use the form below for any inquiries about coffee availability, monthly subscriptions and scheduling a 1-on-1 session with our baristas. Don’t be shy, drop us a line!</p>
+
+		<div class="flex-ns">
+			<div>
+				<h4 class="f4 b lh-title mb2 primary">Location</h4>
+				<p>3153 Lynn Avenue, South San Francisco, California 94080</p>
+			</div>
+
+			<div>
+				<h4 class="f4 b lh-title mb2 primary">Working hours</h4>
+				<p>Monday – Saturday: 9AM – 7PM We’re closed on Sundays</p>
+			</div>
+		</div>
+
+		<!-- Contact -->
+		<div>
+		  <h4 class="f3 b lh-title mb3 tc">Drop us a line below</h4>
+
+		  <form action="">
+		    <div class="flex-l mhn1-l">
+		          <!-- Name -->
+		      <div class="ph1-l w-50-l">
+		        <fieldset>
+		          <input type="text" id="name" placeholder="Name" class="w-100 mb2">
+		          <label for="name">Name</label>
+		        </fieldset>
+		      </div>
+		          <!-- Email -->
+		      <div class="ph1-l w-50-l">
+		        <fieldset>
+		          <input type="email" id="email" placeholder="Email" class="w-100 mb2">
+		          <label for="email">Email</label>
+		        </fieldset>
+		      </div>
+		    </div>
+
+		        <!-- Message -->
+		    <fieldset>
+		      <textarea name="name" placeholder="Your message" rows="8" cols="80" id="message" class="w-100"></textarea>
+		      <label for="message">Your message</label>
+		    </fieldset>
+		        <!-- Button -->
+		    <div class="tc">
+		      <button type="submit" class="btn w-100 w-auto-ns raise">Submit</button>
+		    </div>
+		  </form>
+		</div>
+	</div>
+</div>
+
+{{ partial "footer" . }}
diff --git a/site/layouts/index.html b/site/layouts/index.html
index 225c92b..fa1b5cb 100644
--- a/site/layouts/index.html
+++ b/site/layouts/index.html
@@ -1,5 +1,15 @@
 {{ partial "header" . }}
 
-<h1>Hugo with Gulp, PostCSS and Webpack</h1>
+{{ partial "nav" . }}
+
+{{ partial "jumbotron" (dict "imageUrl" "/img/home/jumbotron.jpg" "title" "Great coffee with a conscience" "subtitle" "Support sustainable farming while enjoying a cup") }}
+
+{{ partial "short-text" (dict "heading" "Why Kaldi?" "text" "Kaldi is the coffee store for everyone who believes that great coffee shouldn't just taste good, it should do good too. We source all of our beans directly from small scale sustainable farmers and make sure part of the profits are reinvested in their communities.")}}
+
+{{ partial "2-up" (dict "heading" "What we offer" "description" "Kaldi is the ultimate spot for coffee lovers who want to learn about their java’s origin and support the farmers that grew it. We take coffee production, roasting and brewing seriously and we’re glad to pass that knowledge to anyone." "svg1" "img/illustrations/coffee.svg" "text1" "We sell green and roasted coffee beans that are sourced directly from independent farmers and farm cooperatives. We’re proud to offer a variety of coffee beans grown with great care for the environment and local communities. Check our post or contact us directly for current availability." "svg2" "/img/illustrations/coffee-gear.svg" "text2" "We offer a small, but carefully curated selection of brewing gear and tools for every taste and experience level. No matter if you roast your own beans or just bought your first french press, you’ll find a gadget to fall in love with in our shop." "buttonText" "See all products"  ) }}
+
+{{ partial "about" (dict "heading" "Our values" "text" "Coffee is an amazing part of human culture but it has a dark side too – one of colonialism and mindless abuse of natural resources and human lives. We want to turn this around and return the coffee trade to the drink’s exhilarating, empowering and unifying nature." "buttonText" "Read more") }}
+
+{{ partial "post" . }}
 
 {{ partial "footer" . }}
diff --git a/site/layouts/indexes/post.html b/site/layouts/indexes/post.html
new file mode 100644
index 0000000..a60f513
--- /dev/null
+++ b/site/layouts/indexes/post.html
@@ -0,0 +1,16 @@
+{{ partial "header" . }}
+{{ partial "nav" . }}
+
+{{ partial "jumbotron" (dict "imageUrl" "/img/post-index.jpg" "title" "post") }}
+
+<div class="mw7 center">
+  <ul class="flex-ns flex-wrap mhn1-ns pa3">
+      {{ range .Data.Pages }}
+          <div class="w-50-ns ph1-ns flex">
+            {{ .Render "li"}}
+          </div>
+      {{ end }}
+  </ul>
+</div>
+
+{{ partial "footer" . }}
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>
diff --git a/site/layouts/post/li.html b/site/layouts/post/li.html
new file mode 100644
index 0000000..de2d1da
--- /dev/null
+++ b/site/layouts/post/li.html
@@ -0,0 +1,6 @@
+<a href="{{ .Permalink }}" class="no-underline pa3 bg-grey-1 br1 mb2 db raise">
+		<h3 class="f3 b lh-title mb1 primary">{{ .Title }}</h3>
+		<p class="mid-gray lh-title mb2">{{ .Date.Format "Mon, Jan 2, 2006" }}</p>
+		<p class="mb0">{{ .Summary }}</p>
+		<p class="link b dib black mb0">Read more →</p>
+</a>
diff --git a/site/layouts/post/list.html b/site/layouts/post/list.html
new file mode 100644
index 0000000..5d13c7e
--- /dev/null
+++ b/site/layouts/post/list.html
@@ -0,0 +1,14 @@
+{{ partial "header" . }}
+{{ partial "nav" . }}
+
+{{ partial "jumbotron" (dict "imageUrl" "img/2.jpg" "title" "post title goes here") }}
+
+<ul class="flex-l">
+    {{ range .Data.Pages }}
+        <div>
+          {{ .Render "li"}}
+        </div>
+    {{ end }}
+</ul>
+
+{{ partial "footer" . }}
diff --git a/site/layouts/post/single.html b/site/layouts/post/single.html
new file mode 100644
index 0000000..e7198b3
--- /dev/null
+++ b/site/layouts/post/single.html
@@ -0,0 +1,13 @@
+{{ partial "header" . }}
+{{ partial "nav" . }}
+  <div class="mw6 center ph3 pv4">
+    <h1 class="f2 lh-title b mb3">{{.Title}}</h1>
+    <div class="flex justify-between grey-3">
+      <p>{{ .Date.Format "Mon, Jan 2, 2006" }}</p>
+      <p>Read in {{ .ReadingTime }} minutes</p>
+    </div>
+    <div class="cms mw6">
+      {{ .Content }}
+    </div>
+  </div>
+{{ partial "footer" . }}
diff --git a/site/layouts/products/single.html b/site/layouts/products/single.html
new file mode 100644
index 0000000..0124e39
--- /dev/null
+++ b/site/layouts/products/single.html
@@ -0,0 +1,29 @@
+{{ partial "header" . }}
+{{ partial "nav" . }}
+
+{{ partial "jumbotron" (dict "imageUrl" "/img/products/jumbotron.jpg" "title" "Products") }}
+
+{{ partial "4-up" (dict "heading" "What we offer" "description" "Kaldi is the ultimate spot for coffee lovers who want to learn about their java’s origin and support the farmers that grew it. We take coffee production, roasting and brewing seriously and we’re glad to pass that knowledge to anyone." "svg1" "/img/illustrations/coffee.svg" "text1" "We sell green and roasted coffee beans that are sourced directly from independent farmers and farm cooperatives. We’re proud to offer a variety of coffee beans grown with great care for the environment and local communities. Check our post or contact us directly for current availability." "svg2" "/img/illustrations/coffee-gear.svg" "text2" "We offer a small, but carefully curated selection of brewing gear and tools for every taste and experience level. No matter if you roast your own beans or just bought your first french press, you’ll find a gadget to fall in love with in our shop." "svg3" "/img/illustrations/tutorials.svg" "text3" "Love a great cup of coffee, but never knew how to make one? Bought a fancy new Chemex but have no clue how to use it? Don't worry, we’re here to help. You can schedule a custom 1-on-1 consultation with our baristas to learn anything you want to know about coffee roasting and brewing. Email us or call the store for details." "svg4" "/img/illustrations/meeting-space.svg" "text4" "We believe that good coffee has the power to bring people together. That’s why we decided to turn a corner of our shop into a cozy meeting space where you can hang out with fellow coffee lovers and learn about coffee making techniques. All of the artwork on display there is for sale. The full price you pay goes to the artist."  ) }}
+
+<div class="mw7 center">
+  <div class="mw6 ph3 mb3">
+    <h3 class="f3 b lh-title mb2">Great coffee with no compromises</h3>
+    <p>We hold our coffee to the highest standards from the shrub to the cup. That’s why we’re meticulous and transparent about each step of the coffee’s journey. We personally visit each farm to make sure the conditions are optimal for the plants, farmers and the local environment.</p>
+  </div>
+</div>
+
+<!-- Image grid -->
+{{ partial "image-grid" . }}
+
+{{ partial "blockquote" (dict "quote" "A testimonial from someone who can’t live without this." "author" "A satisfied customer") }}
+
+{{ partial "blockquote" (dict "quote" "“The first time I tried Kaldi’s coffee, I couldn’t even believe that was the same thing I’ve been drinking every morning.”" "author" "Elisabeth Kaurismäki") }}
+
+{{ partial "blockquote" (dict "quote" "“Kaldi is the place to go if you want the best quality coffee. I love their stance on empowering farmers and transparency.”" "author" "Philipp Trommler") }}
+
+<!-- Full-width image -->
+<img src="/img/products/products-full-width.jpg" alt="" class="db">
+
+{{ partial "table" (dict "heading" "Monthly subscriptions" "text" "We make it easy to make great coffee a part of your life. Choose one of our monthly subscription plans to receive great coffee at your doorstep each month. Contact us about more details and payment info.") }}
+
+{{ partial "footer" . }}