diff --git a/scss/_bpl.scss b/scss/_bpl.scss
index eb5a1cc265fbfbd8c85b6f999be59369828dd817..45c98dc2fdbfda25204284e35fd297be617218bd 100644
--- a/scss/_bpl.scss
+++ b/scss/_bpl.scss
@@ -229,7 +229,7 @@ header {
           padding: 0;
           border: 0;
           background: none;
-          color: #fff;
+          color: $white;
           font-size: 1.1em;
           outline: none;
           font-weight: normal;
@@ -280,12 +280,22 @@ header {
         }
       }
     }
-
+    a {
+        color: $white;
+        padding-right: $padding;
+      }
+    nav {
+      display: flex;
+      align-items: center;
+      border-right: 2px solid $nav-border;
+      padding: 0 $padding*2;
+      
+    }
     .account {
       display: flex;
       align-items: center;
-      padding-right: $padding*2;
-
+      padding: 0 $padding*2;
+      
       img {
         width: 40px;
         height: 40px;
diff --git a/scss/_colors.scss b/scss/_colors.scss
index 103348403aee21bbbdf0124b8d37231d12535eab..4e1e895b1e78493dfdb74c8d1067453d41454201 100644
--- a/scss/_colors.scss
+++ b/scss/_colors.scss
@@ -7,6 +7,8 @@ $light-blue:    #95EAFF;
 $teal:          #0ECAEA;
 $blue:          #0088E4;
 $purple:        #893BC4;
+$white:					#ffffff;
+$black:    			#000000;
 
 
 // Properties --------------------------
diff --git a/styleguide/index.html b/styleguide/index.html
index 96ec2135f06f0f6f23dd2a5f8c2e2a2a00690911..b69bbaa97e486a6fe70d256a16bcc579f8dfcae7 100644
--- a/styleguide/index.html
+++ b/styleguide/index.html
@@ -64,7 +64,14 @@
           </div>
 
         </div>
+        <nav>
+          <a href="#" title="Title">Home</a>
+          <a href="#" title="Title">Discover</a>
+          <a href="#" title="Title">Blog</a>
+        </nav>
         <div class="account">
+          <a href="#" title="Title">My Account</a>
+          <a href="#" title="Title">Login</a>
           <img src="http://res.cloudinary.com/hrscywv4p/image/upload/c_thumb,h_280,w_280/dnnyonhwq2x22k1jxzxk.png" />
         </div>
       </div>