diff --git a/src/assets/img/ARC-HIVE-logo.jpg b/src/assets/img/ARC-HIVE-logo.jpg
new file mode 100644
index 0000000..8ede09c
Binary files /dev/null and b/src/assets/img/ARC-HIVE-logo.jpg differ
diff --git a/src/assets/img/ARC-HIVE-logo.svg b/src/assets/img/ARC-HIVE-logo.svg
new file mode 100644
index 0000000..d9f10d8
--- /dev/null
+++ b/src/assets/img/ARC-HIVE-logo.svg
@@ -0,0 +1,45 @@
+<?xml version="1.0" encoding="UTF-8" standalone="no"?>
+<svg
+   xmlns:dc="http://purl.org/dc/elements/1.1/"
+   xmlns:cc="http://creativecommons.org/ns#"
+   xmlns:rdf="http://www.w3.org/1999/02/22-rdf-syntax-ns#"
+   xmlns:svg="http://www.w3.org/2000/svg"
+   xmlns="http://www.w3.org/2000/svg"
+   version="1.1"
+   id="svg2"
+   xml:space="preserve"
+   width="865.62665"
+   height="355.04001"
+   viewBox="0 0 865.62665 355.04001"><metadata
+     id="metadata8"><rdf:RDF><cc:Work
+         rdf:about=""><dc:format>image/svg+xml</dc:format><dc:type
+           rdf:resource="http://purl.org/dc/dcmitype/StillImage" /><dc:title></dc:title></cc:Work></rdf:RDF></metadata><defs
+     id="defs6" /><g
+     id="g10"
+     transform="matrix(1.3333333,0,0,-1.3333333,0,355.04)"><g
+       id="g12"
+       transform="scale(0.1)"><path
+         d="M 75,1331.41 C 79.5977,1005.45 208.422,696.109 437.77,460.301 667.211,224.398 972.246,87.8789 1296.67,75.8906 1570.9,65.8984 1834.82,142.141 2060.1,296.77 l 3.56,2.16 c 14.78,7.89 26.85,14.961 37.88,22.179 l 450.53,340.071 c 190.26,125.41 423.77,189 694.03,189 270.27,0 503.77,-63.59 694.04,-189 l 1.96,-1.371 448.57,-338.7 c 11.12,-7.277 23.38,-14.449 38.49,-22.5 l 3.57,-2.16 c 225.26,-154.41 489.16,-230.6677 763.23,-220.4099 324.33,12.0898 629.26,148.6409 858.61,384.5119 229.24,235.738 358.02,545.009 362.65,870.859 -4.63,325.85 -133.41,635.11 -362.65,870.86 -229.35,235.87 -534.28,372.43 -858.61,384.51 -274.03,10.21 -537.98,-66.01 -763.23,-220.4 l -3.56,-2.17 c -15.1,-8.04 -27.37,-15.21 -38.5,-22.5 l -450.53,-340.07 c -190.26,-125.41 -423.76,-189 -694.04,-189 -270.27,0 -503.77,63.59 -694.03,189 l -1.95,1.38 -448.59,338.69 c -10.99,7.2 -23.06,14.27 -37.87,22.17 l -3.56,2.17 c -225.26,154.62 -489.23,230.99 -763.43,220.87 -324.424,-11.98 -629.459,-148.5 -858.9,-384.4 C 208.422,1966.72 79.5977,1657.37 75,1331.41 Z M 1344.92,0 c -16.97,0 -33.96,0.308594 -51.01,0.949219 C 950.105,13.6406 626.961,158.211 384.004,408.012 141.137,657.719 4.76172,985.43 0,1330.8 l 44.3984,0.61 L 0,1332.02 c 4.76172,345.37 141.137,673.09 384.004,922.79 242.957,249.8 566.101,394.36 909.906,407.06 289.68,10.66 568.66,-69.79 806.92,-232.81 16.5,-8.87 30.2,-16.96 42.97,-25.38 l 1.95,-1.38 448.59,-338.69 c 177.62,-116.77 396.88,-175.97 651.76,-175.97 254.87,0 474.15,59.21 651.77,175.96 l 450.54,340.08 c 12.91,8.52 26.82,16.72 43.64,25.74 238.25,162.78 517.22,243.13 806.7,232.31 343.7,-12.81 666.74,-157.41 909.6,-407.17 242.76,-249.67 379.08,-577.31 383.87,-922.59 l -40.85,-0.56 40.85,-0.56 C 6487.43,985.57 6351.11,657.922 6108.35,408.262 5865.49,158.512 5542.45,13.8984 5198.75,1.10156 4909.03,-9.73828 4630.29,70.6289 4392.05,233.41 c -16.83,9.012 -30.73,17.219 -43.64,25.719 l -1.96,1.383 -448.59,338.707 C 3720.23,715.98 3500.96,775.18 3246.1,775.18 c -254.87,0 -474.13,-59.2 -651.76,-175.969 L 2143.79,259.129 C 2131,250.691 2117.3,242.609 2100.83,233.762 1876.58,80.332 1616.26,0 1344.92,0"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path14" /><path
+         d="m 823.75,1266.44 -64.387,179.6 -25.41,80.48 h -2.543 l -23.719,-78.79 -66.082,-181.29 z m 27.109,-73.7 H 615.352 l -53.375,-146.57 h -93.188 l 210.945,559.13 h 108.438 l 210.945,-559.13 h -95.73 l -52.528,146.57"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path16" /><path
+         d="m 1233.8,1345.23 h 130.47 c 73.7,0 109.28,29.64 109.28,91.49 0,61.85 -35.58,91.49 -109.28,91.49 H 1233.8 Z m 120.3,-75.4 H 1233.8 V 1046.17 H 1144 v 559.13 h 227.89 c 120.3,0 195.7,-62.69 195.7,-167.73 0,-80.49 -44.06,-135.55 -118.61,-157.58 l 151.64,-233.82 h -104.19 l -142.33,223.66"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path18" /><path
+         d="m 1986.12,1037.71 c -161.81,0 -263.47,110.12 -263.47,288.02 0,177.91 102.51,288.05 262.62,288.05 110.98,0 189.77,-46.6 223.66,-137.25 l -85.57,-38.12 c -22.03,66.08 -63.54,96.58 -133.01,96.58 -104.2,0 -172.82,-76.25 -172.82,-209.26 0,-132.14 63.54,-209.24 169.43,-209.24 71.16,0 122.84,35.58 144.03,106.74 l 86.4,-28.8 c -34.73,-102.5 -121.99,-156.72 -231.27,-156.72"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path20" /><path
+         d="m 4559.9,1605.3 v -559.13 h -91.49 v 243.99 h -276.17 v -243.99 h -90.66 v 559.13 h 90.66 v -237.2 h 276.17 v 237.2 h 91.49"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path22" /><path
+         d="m 4836.95,1046.17 h -90.64 v 559.13 h 90.64 v -559.13"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path24" /><path
+         d="m 5273.25,1046.17 h -105.9 L 4959.8,1605.3 h 96.58 l 130.46,-371.9 33.88,-110.99 33.89,110.14 130.47,372.75 h 95.73 l -207.56,-559.13"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path26" /><path
+         d="m 6019.63,1124.11 v -77.94 h -416.8 v 559.13 h 404.94 v -77.94 H 5693.48 V 1366.4 h 245.67 v -76.24 h -245.67 v -166.05 h 326.15"
+         style="fill:#231f20;fill-opacity:1;fill-rule:nonzero;stroke:none"
+         id="path28" /></g></g></svg>
diff --git a/src/assets/scss/_settings.scss b/src/assets/scss/_settings.scss
index f933852..7d322ed 100644
--- a/src/assets/scss/_settings.scss
+++ b/src/assets/scss/_settings.scss
@@ -865,11 +865,11 @@ $thumbnail-radius: $global-radius;
 // 53. Title Bar
 // -------------
 
-$titlebar-background: $black;
-$titlebar-color: $white;
+$titlebar-background: $white;
+$titlebar-color: $black;
 $titlebar-padding: 0.5rem;
 $titlebar-text-font-weight: bold;
-$titlebar-icon-color: $white;
+$titlebar-icon-color: $black;
 $titlebar-icon-color-hover: $medium-gray;
 $titlebar-icon-spacing: 0.25rem;
 
diff --git a/src/layouts/default.html b/src/layouts/default.html
index d5130cb..b3a968f 100644
--- a/src/layouts/default.html
+++ b/src/layouts/default.html
@@ -12,10 +12,75 @@
 <body>
 
 {{!-- Pages you create in the src/pages/ folder are inserted here when the flattened page is created. --}}
-{{> header}}
-{{> hero}}
-{{> body}}
-{{> footer}}
-<script src="{{root}}assets/js/app.js"></script>
-</body>
+
+  <main class="off-canvas-content" data-off-canvas-content>
+   
+   {{> header}}
+   <header data-sticky-container>
+       <div class="title-bar" data-sticky data-options="marginTop:0;" data-top-anchor="1">
+         <div class="title-bar-left">
+           <a href="#">
+             <h1 class="site-name hide">arcHIVE</h1>
+             <img src="{{root}}assets/img/ARC-HIVE-logo.svg" class="logo"/>
+           </a>
+         </div>
+         <div class="title-bar-right">
+<button type="button" class="menu-icon show-for-small-only" data-toggle="offCanvasNestedPush">
+</button>
+<div class="off-canvas position-right is-closed" id="offCanvasNestedPush" data-off-canvas>
+            <!-- Content -->
+            <ul class="menu">
+              <li><a href="#">News</a></li>
+              <li><a href="#">Collections</a></li>
+              <li class="is-active"><a href="#">Digital kit</a></li>
+              <li><a href="#">Publishing</a></li>
+              <li><a href="#">Documentation</a></li>
+              <li><a href="#">Info</a></li>
+              <li><a href="#">Login</a></li>
+              <li><a href="#"><i class="fi-list"></i>Search</a></li>
+            </ul>
+</div>
+     </div>
+   </header>
+   
+   {{> hero}}
+   <hero class="grid-x">
+     <div class="cell small-12 ">
+           <h1> big old hero</h1>
+     </div>
+   </hero>
+           
+   {{> body}}
+    </main>
+    {{> footer}}
+    <footer class="grid-x">
+      <div class="cell small-4">
+        <ul class="menu">
+          <li><a href="#">One</a></li>
+          <li><a href="#">Two</a></li>
+          <li><a href="#">Three</a></li>
+          <li><a href="#">Four</a></li>
+        </ul>
+      </div>
+      <div class="cell small-4">
+        <ul class="menu">
+          <li><a href="#">One</a></li>
+          <li><a href="#">Two</a></li>
+          <li><a href="#">Three</a></li>
+          <li><a href="#">Four</a></li>
+        </ul>
+      </div>
+      <div class="cell small-4">
+        <ul class="menu">
+          <li><a href="#">One</a></li>
+          <li><a href="#">Two</a></li>
+          <li><a href="#">Three</a></li>
+          <li><a href="#">Four</a></li>
+        </ul>
+      </div>
+    </footer>
+
+   <script src="{{root}}assets/js/app.js"></script>
+  </div>
+ </body>
 </html>
diff --git a/src/pages/index.html b/src/pages/index.html
index cd7fc72..adb81e9 100644
--- a/src/pages/index.html
+++ b/src/pages/index.html
@@ -1,9 +1,9 @@
-    <div class="grid-container">
-      <div class="grid-x grid-padding-x">
+    <main class="g rid-container">
+      <header class="grid-x grid-padding-x">
         <div class="large-12 cell">
           <h1>arcHIVE project kitchen sink</h1>
         </div>
-      </div>
+      </header>
 
       <div class="grid-x grid-padding-x">
         <div class="large-12 cell">
@@ -150,4 +150,4 @@
           </div>
         </div>
       </div>
-    </div>
+    </main>
diff --git a/src/partials/footer.html b/src/partials/footer.html
index f29f5cf..e69de29 100644
--- a/src/partials/footer.html
+++ b/src/partials/footer.html
@@ -1,26 +0,0 @@
-<footer class="grid-x">
-  <div class="cell small-4">
-    <ul class="menu">
-      <li><a href="#">One</a></li>
-      <li><a href="#">Two</a></li>
-      <li><a href="#">Three</a></li>
-      <li><a href="#">Four</a></li>
-    </ul>    
-  </div>
-  <div class="cell small-4">
-    <ul class="menu">
-      <li><a href="#">One</a></li>
-      <li><a href="#">Two</a></li>
-      <li><a href="#">Three</a></li>
-      <li><a href="#">Four</a></li>
-    </ul>    
-  </div>
-  <div class="cell small-4">
-    <ul class="menu">
-      <li><a href="#">One</a></li>
-      <li><a href="#">Two</a></li>
-      <li><a href="#">Three</a></li>
-      <li><a href="#">Four</a></li>
-    </ul>    
-  </div>
-</footer>
diff --git a/src/partials/header.html b/src/partials/header.html
index f168e1c..e69de29 100644
--- a/src/partials/header.html
+++ b/src/partials/header.html
@@ -1,11 +0,0 @@
-<div class="grid-x">
-  <div class="cell small-12 medium-4">arcHIVE</div>
-  <div class="cell hide-for-small medium-8">
-    <ul class="menu">
-      <li><a href="#">One</a></li>
-      <li><a href="#">Two</a></li>
-      <li><a href="#">Three</a></li>
-      <li><a href="#">Four</a></li>
-    </ul>    
-  </div>
-</div>
diff --git a/src/partials/hero.html b/src/partials/hero.html
index c962dd8..e69de29 100644
--- a/src/partials/hero.html
+++ b/src/partials/hero.html
@@ -1,5 +0,0 @@
-<div class="grid-x">
-  <div class="cell small-12 ">
-	<h1> big old hero</h1>
-  </div>
-</div>