diff --git a/_src/_assets/styles/bigchain/_forms.scss b/_src/_assets/styles/bigchain/_forms.scss
index ec82509..3ae23af 100644
--- a/_src/_assets/styles/bigchain/_forms.scss
+++ b/_src/_assets/styles/bigchain/_forms.scss
@@ -5,11 +5,13 @@
 //
 
 .form-control {
+    @extend .transition;
     display: block;
     width: 100%;
     appearance: none;
     padding: $input-padding-x $input-padding-y;
     font-family: $input-font;
+    font-weight: $font-weight-bold;
     font-size: $font-size-base;
     line-height: $line-height;
     color: $input-color;
@@ -17,11 +19,10 @@
     border: none;
     border-bottom: 2px solid $input-border-color;
     border-radius: 0;
-    transition: border-color ease-in-out .15s;
 
     &:focus {
         outline: 0;
-        border-color: #fff;
+        border-color: $input-border-focus;
     }
 
     // Placeholder
diff --git a/_src/_assets/styles/bigchain/_logo.scss b/_src/_assets/styles/bigchain/_logo.scss
index 09e058e..002ea7a 100644
--- a/_src/_assets/styles/bigchain/_logo.scss
+++ b/_src/_assets/styles/bigchain/_logo.scss
@@ -6,7 +6,7 @@
 
 // default logo
 .logo {
-    fill: $brand-main-blue-dark;
+    fill: $brand-main-blue;
     width: 300px;
     height: 30px;
 }
@@ -22,7 +22,7 @@
 
 .logo--full {
     display: block;
-    width: 99%;
+    width: 100%;
     height: auto;
 }
 
@@ -30,6 +30,6 @@
 //
 // color modifiers
 //
-.logo--blue {
-    fill: $brand-main-blue;
+.logo--dark {
+    fill: $brand-main-blue-dark;
 }
diff --git a/_src/_assets/styles/bigchain/_variables.scss b/_src/_assets/styles/bigchain/_variables.scss
index 287805d..2201b5f 100644
--- a/_src/_assets/styles/bigchain/_variables.scss
+++ b/_src/_assets/styles/bigchain/_variables.scss
@@ -180,13 +180,11 @@ $input-padding-y:                0 !default;
 $input-bg:                       rgba(255,255,255,.1) !default;
 $input-bg-disabled:              $gray-lighter !default;
 
-$input-color:                    $gray !default;
+$input-color:                    $gray-dark !default;
 $input-border-color:             $gray-lighter !default;
 
-$input-border-focus:             #66afe9 !default;
-$input-box-shadow-focus:         rgba(102,175,233,.6) !default;
-
-$input-color-placeholder:        #999 !default;
+$input-border-focus:             $gray !default;
+$input-color-placeholder:        $gray !default;
 
 
 //
diff --git a/_src/_assets/styles/page-front.scss b/_src/_assets/styles/page-front.scss
index 1151799..7eb0ad3 100644
--- a/_src/_assets/styles/page-front.scss
+++ b/_src/_assets/styles/page-front.scss
@@ -153,4 +153,10 @@
         max-width: $screen-sm-min;
         margin: auto;
     }
+
+    .form-control {
+        &:focus {
+            border-color: #fff;
+        }
+    }
 }
diff --git a/_src/styleguide.md b/_src/styleguide.md
index ba23088..5990d12 100644
--- a/_src/styleguide.md
+++ b/_src/styleguide.md
@@ -47,9 +47,35 @@ sitemap: false
 </div>
 
 
-# Typography
+## Logo
 
-## Body Copy
+<svg class="logo logo--sm" aria-labelledby="title"><title>Logo Bigchain</title><use xlink:href="/assets/img/sprite.svg#logo"></use></svg>
+
+<svg class="logo" aria-labelledby="title"><title>Logo Bigchain</title><use xlink:href="/assets/img/sprite.svg#logo"></use></svg>
+
+<svg class="logo logo--full" aria-labelledby="title"><title>Logo Bigchain</title><use xlink:href="/assets/img/sprite.svg#logo"></use></svg>
+
+```html
+<svg class="logo logo--sm" aria-labelledby="title">
+    <title>Logo Bigchain</title>
+    <use xlink:href="/assets/img/sprite.svg#logo"></use>
+</svg>
+
+<svg class="logo" aria-labelledby="title">
+    <title>Logo Bigchain</title>
+    <use xlink:href="/assets/img/sprite.svg#logo"></use>
+</svg>
+
+<svg class="logo logo--full" aria-labelledby="title">
+    <title>Logo Bigchain</title>
+    <use xlink:href="/assets/img/sprite.svg#logo"></use>
+</svg>
+```
+
+
+## Typography
+
+### Body Copy
 
 Nullam quis risus eget urna mollis ornare vel eu leo. Cum sociis natoque penatibus et magnis dis [parturient montes](#), nascetur ridiculus mus. Nullam id dolor id nibh **ultricies vehicula**.
 
@@ -122,6 +148,38 @@ Donec *ullamcorper nulla* non metus auctor fringilla. Duis mollis, est non commo
 ```
 
 
+### Forms
+
+<form class="js-parsley" action="#">
+    <div class="form-group">
+        <input class="form-control" type="text" id="name" name="name" required>
+        <label class="form-label" for="name">Your Name</label>
+    </div>
+    <div class="form-group">
+        <input class="form-control" type="email" id="email" name="email">
+        <label class="form-label" for="email">Your Email</label>
+    </div>
+    <div class="form-group">
+        <input class="btn btn-primary" type="submit" value="Submit">
+    </div>
+</form>
+
+```html
+<form class="js-parsley" action="#">
+    <div class="form-group">
+        <input class="form-control" type="text" id="name" name="name" required>
+        <label class="form-label" for="name">Your Name</label>
+    </div>
+    <div class="form-group">
+        <input class="form-control" type="email" id="email" name="email">
+        <label class="form-label" for="email">Your Email</label>
+    </div>
+    <div class="form-group">
+        <input class="btn btn-primary" type="submit" value="Submit">
+    </div>
+</form>
+```
+
 ### Alerts
 
 <div class="alert alert-success"><strong class="alert__title">Lucas ipsum</strong> dolor sit amet kenobi ubese yaka weequay aka trioculus</div>