diff --git a/site/assets/scss/elements/_layout.scss b/site/assets/scss/elements/_layout.scss
new file mode 100644
index 0000000..bb2539d
--- /dev/null
+++ b/site/assets/scss/elements/_layout.scss
@@ -0,0 +1,5 @@
+header,
+main,
+footer {
+  padding: 0 $gutter;
+}
diff --git a/site/assets/scss/elements/_nav.scss b/site/assets/scss/elements/_nav.scss
new file mode 100644
index 0000000..1400abe
--- /dev/null
+++ b/site/assets/scss/elements/_nav.scss
@@ -0,0 +1,9 @@
+nav {
+  ul {
+    @include slim-ul;
+
+    li {
+      display: inline-block;
+    }
+  }
+}
diff --git a/site/assets/scss/elements/_typography.scss b/site/assets/scss/elements/_typography.scss
index 3f5575e..2ba89e8 100644
--- a/site/assets/scss/elements/_typography.scss
+++ b/site/assets/scss/elements/_typography.scss
@@ -1,48 +1,81 @@
-// .h1,
-// h1 {
-// }
-//
-// .h2,
-// h2 {
-// }
-//
-// .h3,
-// h3 {
-// }
-//
-// .h4,
-// h4 {
-// }
-//
-// .h5,
-// h5 {
-// }
-//
-// .h6,
-// h6 {
-// }
-//
-// a {
-//   &:visited {
-//   }
-//
-//   &:hover {
-//   }
-//
-//   &:active {
-//   }
-// }
-//
-// .small {
-// }
-//
-// code {
-//
-// }
-
-// tahoma
-
-.sample {
-  margin: 25px;
-  font-size: 28px;
+html,
+body {
+  @include font-default;
+}
+
+.h1,
+h1 {
+  @include font-roboto;
+  margin: $gutter 0 ($gutter / 2);
+  font-size: 40px;
+  font-weight: 300;
+}
+
+.h2,
+h2 {
+  @include font-roboto;
+  margin: $gutter 0 ($gutter / 2);
+  font-size: 32px;
+  font-weight: 300;
+}
+
+.h3,
+h3 {
+  @include font-roboto;
+  margin: $gutter 0 ($gutter / 2);
+  font-size: 26px;
+  font-weight: 400;
+}
+
+.h4,
+h4 {
+  @include font-roboto;
+  margin: $gutter 0 0;
+  font-size: 22px;
+  font-weight: 700;
+}
+
+.h5,
+h5 {
+  @include font-roboto;
+  margin: $gutter 0 0;
+  font-size: 18px;
+  font-weight: 700;
+}
+
+.small-heading,
+.h6,
+h6 {
+  @include font-roboto;
+  margin: $gutter 0 0;
+  font-size: 14px;
+  font-weight: 700;
+}
+
+p {
+  margin: ($gutter / 2) 0 0;
+  line-height: 1.4;
+}
+
+// a {
+//   &:visited { }
+//   &:hover { }
+//   &:active { }
+// }
+
+.small {
+  @include font-roboto;
+  line-height: 1.3;
+  letter-spacing: 0.3px;
+  font-size: 14px;
+  font-weight: 300;
+}
+
+code {
+  @include font-mono;
+  display: block;
+  margin: $gutter;
+  line-height: 1.35;
+  white-space: pre;
+  font-size: 18px;
 }
diff --git a/site/assets/scss/main.scss b/site/assets/scss/main.scss
index 5452f97..404a261 100644
--- a/site/assets/scss/main.scss
+++ b/site/assets/scss/main.scss
@@ -7,6 +7,8 @@
 @import 'generic/reset';
 
 @import 'elements/typography';
+@import 'elements/nav';
 @import 'elements/icons';
+@import 'elements/layout';
 
 // @import 'components/thing';
diff --git a/site/assets/scss/settings/_colors.scss b/site/assets/scss/settings/_colors.scss
index e69de29..3fc9e1b 100644
--- a/site/assets/scss/settings/_colors.scss
+++ b/site/assets/scss/settings/_colors.scss
@@ -0,0 +1,85 @@
+
+
+$color-a1: rgba(191, 189, 193, 1);
+$color-a2: rgba(109, 106, 117, 1);
+$color-a3: rgba(55, 50, 62, 1);
+$color-a4: rgba(222, 184, 65, 1);
+$color-a5: rgba(222, 158, 54, 1);
+
+
+$color-b1: rgba(187, 225, 195, 1);
+$color-b2: rgba(167, 205, 189, 1);
+$color-b3: rgba(134, 157, 122, 1);
+$color-b4: rgba(145, 120, 93, 1);
+$color-b5: rgba(139, 93, 51, 1);
+
+
+$color-c1: rgba(240, 58, 71, 1);
+$color-c2: rgba(175, 91, 91, 1);
+$color-c3: rgba(246, 244, 243, 1);
+$color-c4: rgba(39, 111, 191, 1);
+$color-c5: rgba(24, 48, 89, 1);
+
+
+$color-d1: rgba(172, 189, 186, 1);
+$color-d2: rgba(205, 221, 221, 1);
+$color-d3: rgba(165, 153, 181, 1);
+$color-d4: rgba(46, 47, 47, 1);
+$color-d5: rgba(5, 16, 20, 1);
+
+
+$color-e1: rgba(255, 200, 87, 1);
+$color-e2: rgba(233, 114, 76, 1);
+$color-e3: rgba(197, 40, 61, 1);
+$color-e4: rgba(72, 29, 36, 1);
+$color-e5: rgba(37, 95, 133, 1);
+
+.color-samples {
+  > div {
+    display: flex;
+    margin: $gutter 0;
+    height: 100px;
+
+    > div { flex: 1 1 auto; }
+  }
+
+  .color-a {
+    :nth-child(1) { background-color: $color-a1; }
+    :nth-child(2) { background-color: $color-a2; }
+    :nth-child(3) { background-color: $color-a3; }
+    :nth-child(4) { background-color: $color-a4; }
+    :nth-child(5) { background-color: $color-a5; }
+  }
+
+  .color-b {
+    :nth-child(1) { background-color: $color-b1; }
+    :nth-child(2) { background-color: $color-b2; }
+    :nth-child(3) { background-color: $color-b3; }
+    :nth-child(4) { background-color: $color-b4; }
+    :nth-child(5) { background-color: $color-b5; }
+  }
+
+  .color-c {
+    :nth-child(1) { background-color: $color-c1; }
+    :nth-child(2) { background-color: $color-c2; }
+    :nth-child(3) { background-color: $color-c3; }
+    :nth-child(4) { background-color: $color-c4; }
+    :nth-child(5) { background-color: $color-c5; }
+  }
+
+  .color-d {
+    :nth-child(1) { background-color: $color-d1; }
+    :nth-child(2) { background-color: $color-d2; }
+    :nth-child(3) { background-color: $color-d3; }
+    :nth-child(4) { background-color: $color-d4; }
+    :nth-child(5) { background-color: $color-d5; }
+  }
+
+  .color-e {
+    :nth-child(1) { background-color: $color-e1; }
+    :nth-child(2) { background-color: $color-e2; }
+    :nth-child(3) { background-color: $color-e3; }
+    :nth-child(4) { background-color: $color-e4; }
+    :nth-child(5) { background-color: $color-e5; }
+  }
+}
diff --git a/site/assets/scss/settings/_variables.scss b/site/assets/scss/settings/_variables.scss
index e69de29..5e157e0 100644
--- a/site/assets/scss/settings/_variables.scss
+++ b/site/assets/scss/settings/_variables.scss
@@ -0,0 +1 @@
+$gutter: 15px;
diff --git a/site/assets/scss/tools/_fonts.scss b/site/assets/scss/tools/_fonts.scss
index ecd09a1..2dfb437 100644
--- a/site/assets/scss/tools/_fonts.scss
+++ b/site/assets/scss/tools/_fonts.scss
@@ -33,16 +33,16 @@
   src: url('/assets/fonts/roboto-bolditalic-webfont.woff2') format('woff2'), url('/assets/fonts/roboto-bolditalic-webfont.woff') format('woff');
 }
 
-@font-face {
-  font-family: 'inconsolata';
-  font-weight: 700;
-  font-style: normal;
-  src: url('/assets/fonts/inconsolata-bold-webfont.woff2') format('woff2'), url('/assets/fonts/inconsolata-bold-webfont.woff') format('woff');
-}
-
 @font-face {
   font-family: 'inconsolata';
   font-weight: 400;
   font-style: normal;
   src: url('/assets/fonts/inconsolata-regular-webfont.woff2') format('woff2'), url('/assets/fonts/inconsolata-regular-webfont.woff') format('woff');
 }
+
+@font-face {
+  font-family: 'inconsolata';
+  font-weight: 700;
+  font-style: normal;
+  src: url('/assets/fonts/inconsolata-bold-webfont.woff2') format('woff2'), url('/assets/fonts/inconsolata-bold-webfont.woff') format('woff');
+}
diff --git a/site/assets/scss/tools/_mixins.scss b/site/assets/scss/tools/_mixins.scss
index e69de29..82efbee 100644
--- a/site/assets/scss/tools/_mixins.scss
+++ b/site/assets/scss/tools/_mixins.scss
@@ -0,0 +1,20 @@
+@mixin font-default {
+  letter-spacing: 0.1em;
+  font-family: tahoma, sans-serif;
+}
+
+@mixin font-roboto {
+  font-family: 'roboto', tahoma, sans-serif;
+}
+
+@mixin font-mono {
+  font-family: 'inconsolata', 'consolas', monospace;
+}
+
+@mixin slim-ul {
+  margin-right: 0;
+  margin-left: 0;
+  padding: 0;
+
+  list-style-type: none;
+}
diff --git a/site/layouts/default.hbs b/site/layouts/default.hbs
index fa696c5..3f0fd3a 100644
--- a/site/layouts/default.hbs
+++ b/site/layouts/default.hbs
@@ -6,8 +6,10 @@
   <body>
     {{> analytics }}
 
-    {{> nav-main }}
-    {{> nav-social }}
+    <header>
+      {{> nav-main }}
+      {{> nav-social }}
+    </header>
 
     <main>
       {{> body }}
diff --git a/site/pages/about.hbs b/site/pages/about.hbs
deleted file mode 100644
index bc13ec7..0000000
--- a/site/pages/about.hbs
+++ /dev/null
@@ -1,23 +0,0 @@
-<h1>Mark Moser - digital handyman</h1>
-
-<p>
-  I&rsquo;m a ruby developer exploring and learning everything I can about being a better
-  developer. This place is where I share my findings, explorations, and other creative
-  outlets.
-</p>
-
-<p>
-  I&rsquo;m also fond of working in video post production: editing, compositing, and
-  motion graphics. I can either be your &ldquo;one man band&rdquo; for those smaller
-  productions, put together a killer team when you need even greater production value,
-  or be the go-to post production guy you call to join your existing team.
-  I have experience shooting interviews and putting together short informational
-  videos. I am very comfortable in the whole Adobe Production Suite of tools.
-</p>
-
-<p>
-  I have a high value for quality craftsmanship. I want to do great work, with people who
-  also do great work. I love to explore and learn about my world. I enjoy being
-  challenged. I take pleasure in providing creative solutions to specific needs, always
-  keeping the bigger picture in mind. I was raised to work hard and play hard.
-</p>
diff --git a/site/pages/index.hbs b/site/pages/index.hbs
index 6d2fd91..57585c1 100644
--- a/site/pages/index.hbs
+++ b/site/pages/index.hbs
@@ -1,41 +1,15 @@
-<h1>Looking at styling for an h1</h1>
-<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
-<h2>Looking at styling for an h2</h2>
-<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
-<h3>Looking at styling for an h3</h3>
-<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
-<h4>Looking at styling for an h4</h4>
-<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
-<h5>Looking at styling for an h5</h5>
-<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
-<h6>Looking at styling for an h6</h6>
-<p class="small">Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
+<h1>I build web things.</h1>
 
-<h2>Fonts</h2>
-{{> sample font="roboto" }}
-{{> sample font="tahoma" }}
-{{> sample font="inconsolata" }}
+<p>
+  I&rsquo;m a web developer exploring and learning everything I can about being a better
+  developer. This place is where I share my findings, explorations, and other creative
+  outlets.
+</p>
 
-<h2>Colors</h2>
+<p>
+  I have a high value for quality craftsmanship. I want to do great work, with people who
+  also do great work. I love to explore and learn about my world. I enjoy being
+  challenged. I take pleasure in providing creative solutions to specific needs, always
+  keeping the bigger picture in mind. I was raised to work hard and play hard.
+</p>
 
-
-
-<h2>Misc elements</h2>
-
-<code>
-  function thing1(thing2) {
-    var thing3 = 'some default value';
-    return thing2 + thing3;
-  }
-</code>
-
-<ul>
-  <li>item 1 in unordered list</li>
-  <li>item 2 in unordered list</li>
-  <li>item 3 in unordered list</li>
-  <li>item 4 in unordered list</li>
-  <li>item 5 in unordered list</li>
-</ul>
-
-<a class="cta-primary" href="#cta-primary">Do a Thing!</a>
-<a class="cta-secondary" href="#cta-secondary">Do another thing</a>
diff --git a/site/partials/rail.hbs b/site/pages/misc.hbs
similarity index 93%
rename from site/partials/rail.hbs
rename to site/pages/misc.hbs
index e7504ba..b871f03 100644
--- a/site/partials/rail.hbs
+++ b/site/pages/misc.hbs
@@ -1,3 +1,8 @@
+---
+  title: Misc links and such
+---
+
+<h1>{{title}}</h1>
 <ul>
   <li>
     <a href="mailto:markamoser@gmail.com">markamoser@gmail.com</a>
diff --git a/site/pages/styleguide.hbs b/site/pages/styleguide.hbs
new file mode 100644
index 0000000..27cd3e9
--- /dev/null
+++ b/site/pages/styleguide.hbs
@@ -0,0 +1,47 @@
+---
+  title: site style guide
+---
+
+<h1>Looking at styling for an h1</h1>
+<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
+<h2>Looking at styling for an h2</h2>
+<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
+<h3>Looking at styling for an h3</h3>
+<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
+<h4>Looking at styling for an h4</h4>
+<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
+<h5>Looking at styling for an h5</h5>
+<p>Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
+<h6>Looking at styling for an h6</h6>
+<p class="small">Cum sociis natoque penatibus et magnis <a href="#sample-anchor">dis parturient montes</a>, nascetur ridiculus mus. Donec sed odio dui. Lorem ipsum dolor sit amet, <strong>consectetur adipiscing elit</strong>. Duis mollis, est non <i>commodo luctus</i>, nisi erat porttitor ligula, eget lacinia odio sem nec elit. Donec sed odio dui. Sed posuere consectetur est at lobortis. Praesent commodo cursus magna, vel scelerisque nisl consectetur et.</p>
+
+<a class="cta-primary" href="#cta-primary">Do a Thing!</a>
+<a class="cta-secondary" href="#cta-secondary">Do another thing</a>
+
+<h2>Colors</h2>
+
+<div class="color-samples">
+  <div class="color-a"><div></div><div></div><div></div><div></div><div></div></div>
+  <div class="color-b"><div></div><div></div><div></div><div></div><div></div></div>
+  <div class="color-c"><div></div><div></div><div></div><div></div><div></div></div>
+  <div class="color-d"><div></div><div></div><div></div><div></div><div></div></div>
+  <div class="color-e"><div></div><div></div><div></div><div></div><div></div></div>
+</div>
+
+
+<h2>Misc elements</h2>
+
+<code>
+  function thing1(thing2) {
+    var thing3 = 'some default value';
+    return thing2 + thing3;
+  }
+</code>
+
+<ul>
+  <li>item 1 in unordered list</li>
+  <li>item 2 in unordered list</li>
+  <li>item 3 in unordered list</li>
+  <li>item 4 in unordered list</li>
+  <li>item 5 in unordered list</li>
+</ul>
diff --git a/site/pages/video.hbs b/site/pages/video.hbs
new file mode 100644
index 0000000..2dcebba
--- /dev/null
+++ b/site/pages/video.hbs
@@ -0,0 +1,105 @@
+---
+  title: Old Video Projects
+
+  videos:
+    demo:
+      file: "reel2011.mp4"
+      title: "2011 Demo Reel"
+      width: "960"
+      height: "480"
+      options:
+        controls: true
+        autoplay: false
+        preload: "auto"
+      note: "A short sampling of my after effects work. I do love to edit. (<a href=\"video/MarkMoser_reel2011.mp4\">download</a>)"
+      vimeo: "<iframe src=\"//player.vimeo.com/video/29118777?byline=0&amp;portrait=0&amp;autoplay=0\" width=\"720\" height=\"360\" frameborder=\"0\" webkitAllowFullScreen allowFullScreen></iframe>"
+
+    las_invent:
+      file: "LAS_InventYourFuture_720x404.mp4"
+      title: "Invent Your Future"
+      width: "720"
+      height: "404"
+      options:
+        controls: true
+        autoplay: false
+        preload: "auto"
+      poster: "LAS_InventYourFuture_720x404.png"
+      role: "Editor"
+      credit: "DP: <a href=\"http://www.chrisbrownphoto.com\">Chris Brown</a><br />
+               Art Direction: <a href=\"http://www.bonadiescreative.com\">John Bonadies</a>"
+
+    bid_web:
+      file: "BackInTheDay_640x360.mov"
+      title: "Back In the Day"
+      width: "640"
+      height: "360"
+      options:
+        controls: true
+        autoplay: false
+        preload: "auto"
+      poster: "BackInTheDay_640x360.png"
+      role: "Editor"
+      credit: "Producer/Director/DP: <a href=\"http://www.chrisbrownphoto.com\">Chris Brown</a><br />
+               Musician: <a href=\"http://www.rockymaffit.com\">Rocky Maffit</a><br />
+               <a href=\"http://www.jhanamusic.com/artists/Rocky%20Maffit/rockymaffit.html\">Jhana Music Group</a>"
+
+    ccrawl_large:
+      file: "CCrawl_purple_960x540.m4v"
+      title: "PW Container Crawl"
+      width: "960"
+      height: "540"
+      options:
+        controls: true
+        autoplay: false
+        preload: "auto"
+      poster: "CCrawl_purple_960x540.png"
+      role: "Edit / Compositing"
+      credit: "Producer/Director/DP: <a href=\"http://www.chrisbrownphoto.com\">Chris Brown</a><br />
+               Stylist: Ron Walder <br />
+               <a href=\"http://provenwinners.com/\">Proven Winners</a>"
+
+    crawl_demo_lg:
+      file: "CrawlDemo_960x540.mov"
+      title: "Crawl Breakdown"
+      width: "960"
+      height: "540"
+      options:
+        controls: true
+        autoplay: false
+        preload: "auto"
+      poster: "CrawlDemo_960x540.png"
+      role: "Edit / Compositing"
+      credit: "Producer/Director/DP: <a href=\"http://www.chrisbrownphoto.com\">Chris Brown</a><br />
+               Stylist: Ron Walder <br />
+               <a href=\"http://provenwinners.com/\">Proven Winners</a>"
+
+    pw_garden_640:
+      file: "SecretGarden_Alternate-640.m4v"
+      title: "PW Garden Spot"
+      width: "640"
+      height: "360"
+      options:
+        controls: true
+        autoplay: false
+        preload: "auto"
+      poster: "SecretGarden_Alternate-640.png"
+      role: "Edit / Compositing"
+      credit: "Producer/Director/DP: <a href=\"http://www.chrisbrownphoto.com\">Chris Brown</a><br />
+               Stylist: Ron Walder <br />
+               Creative Director: Dave Lierman <br />
+               <a href=\"http://provenwinners.com/\">Proven Winners</a>"
+
+    balloon_time:
+      file: "BalloonTime_400x262.mov"
+      title: "Balloon Time!"
+      width: "400"
+      height: "262"
+      options:
+        controls: true
+        autoplay: false
+        preload: "auto"
+      poster: "BalloonTime_400x262.png"
+      role: "Prep / Shoot / Post"
+---
+
+<h1>{{title}}</h1>
diff --git a/site/partials/nav-foot.hbs b/site/partials/nav-foot.hbs
index 91572e5..2557abd 100644
--- a/site/partials/nav-foot.hbs
+++ b/site/partials/nav-foot.hbs
@@ -1,8 +1,7 @@
 <nav class="nav-foot">
   <ul>
-    <li><a href="foot-link-1">foot-link-1</a></li>
-    <li><a href="foot-link-2">foot-link-2</a></li>
-    <li><a href="foot-link-3">foot-link-3</a></li>
-    <li><a href="foot-link-4">foot-link-4</a></li>
+    <li><a href="styleguide.html">styleguide</a></li>
+    <li><a href="video.html">video</a></li>
+    <li><a href="misc.html">misc</a></li>
   </ul>
 </nav>
diff --git a/site/partials/nav-main.hbs b/site/partials/nav-main.hbs
index 1146364..92c7d6e 100644
--- a/site/partials/nav-main.hbs
+++ b/site/partials/nav-main.hbs
@@ -2,14 +2,8 @@
   <ul>
     <li>
       <a href='/'>
-        home
+        <span>home</span>
       </a>
     </li>
-    <li>
-      <a href='/video'>video</a>
-    </li>
-    <li>
-      <a href='/contact'>contact</a>
-    </li>
   </ul>
 </nav>