diff --git a/docs/_includes/header.html b/docs/_includes/header.html
index def45a9e..739830af 100644
--- a/docs/_includes/header.html
+++ b/docs/_includes/header.html
@@ -3,13 +3,16 @@
   <nav class="navbar navbar-default navbar-fixed-top navbar-inverse">
     <div class="container-fluid">
       <div class="navbar-header">
-        <a id="logo-community" href="https://community.algolia.com/">
+        <a class="logo-community" href="https://community.algolia.com/">
           <img src="{{site.baseurl}}/img/logo-community-sm.svg" alt="Algolia Community" />
           Community
         </a>
-        <a id="logo-algolia" href="{{ site.baseurl }}/">
+        <a class="logo-algolia" href="https://www.algolia.com">
           <img src="{{site.baseurl}}/img/algolia-logo.svg" alt="Algolia" />
         </a>
+        <a class="project-title" href="{{ site.baseurl }}/">
+          DocSearch
+        </a>
       </div>
       <div class="navbar-collapse collapse">
         <ul class="nav navbar-nav navbar-right">
diff --git a/docs/_includes/searchbar.html b/docs/_includes/searchbar.html
index 2653919d..9f4c8927 100644
--- a/docs/_includes/searchbar.html
+++ b/docs/_includes/searchbar.html
@@ -9,7 +9,7 @@
 </svg>
 
 <form role="search" novalidate="novalidate" class="searchbox sbx-custom">
-    <input onkeyup="updateReset()" type="search" name="search" placeholder="Search in the documentation" autocomplete="off" required="required" class="sbx-custom__input">
+    <input onkeyup="updateReset()" type="search" name="search" placeholder="Search in the doc ..." autocomplete="off" required="required" class="sbx-custom__input">
     <button type="submit" class="sbx-custom__submit">
         <svg role="img" aria-label="Search">
             <title>Icon Search</title>
diff --git a/docs/_layouts/default.html b/docs/_layouts/default.html
index 0bdb964e..2c1de9cf 100644
--- a/docs/_layouts/default.html
+++ b/docs/_layouts/default.html
@@ -35,7 +35,7 @@
     <link rel="icon" href="{{ "/img/favicon.png" | prepend: site.baseurl }}">
 
     <!-- Fonts -->
-    <link rel="stylesheet" media="screen" href="//fonts.googleapis.com/css?family=Raleway:300,600" />
+    <link rel="stylesheet" media="screen" href="//fonts.googleapis.com/css?family=Raleway:100,300,600" />
     <link rel="stylesheet" media="screen" href="//fonts.googleapis.com/css?family=Open+Sans:300,400,600" />
 
     <link rel="stylesheet" media="screen" href="{{ "/css/main.css" | prepend: site.baseurl }}" />
diff --git a/docs/css/_home.scss b/docs/css/_home.scss
index 50476157..c1320576 100644
--- a/docs/css/_home.scss
+++ b/docs/css/_home.scss
@@ -18,21 +18,46 @@ html, body {
 
 /* HEADER
 // ------------------------- */
-#logo-algolia img {
-  height: 24px;
-  top: -2px;
-  position: relative;
-  margin-right: 12px;
+.logo-algolia {
+  position: absolute;
+  left: 72px;
+  top: 5px;
+  display: block;
+  line-height: 1;
+  img {
+    height: 18px;
+    position: relative;
+    margin-right: 12px;
+  }
 }
 
-#logo-community {
-  font-size: 1.6em;
+.logo-community {
   color: white;
+  font-size: 1.8em;
+  font-weight: 100 !important;
   margin-right: 8px;
+  position: relative;
+  top: 6px;
   img {
+    position: relative;
+    top: -8px;
     height: 46px;
     width: 46px;
   }
+  &:hover, &:active, &:focus {
+    color: white;
+  }
+}
+
+.project-title {
+  color: white;
+  font-size: 1.2em;
+  font-weight: bold;
+  position: relative;
+  top: -4px;
+  &:hover, &:active, &:focus {
+    color: white;
+  }
 }
 
 .site-header {
@@ -53,7 +78,7 @@ html, body {
       }
     }
     .navbar-nav > li {
-      padding: 14px 15px;
+      padding: 14px 8px;
     }
     .navbar-nav > li > a {
       padding: 0 0 4px 0;
@@ -74,9 +99,13 @@ html, body {
 // ------------------------- */
 .jumbotron {
   padding-top: 60px;
+  padding-bottom: 32px;
   background: #091724 url(../img/header-bg.jpg) no-repeat center center;
   background-size: cover;
   margin-bottom: 0;
+  .join-form {
+    border-radius: 5px 5px 0 0;
+  }
   .jumbotron-header {
     text-align: center;
     color: #FFF;
diff --git a/docs/css/_searchbar.scss b/docs/css/_searchbar.scss
index e268a5d2..a199d4f3 100644
--- a/docs/css/_searchbar.scss
+++ b/docs/css/_searchbar.scss
@@ -1,5 +1,5 @@
 $custom:(
-  input-width: 240px,
+  input-width: 190px,
   input-height: 36px,
   border-width: 2px,
   border-radius: 18px,
@@ -179,8 +179,8 @@ $custom:(
 }
 
 .site-header .navbar .navbar-nav > li.searchbar-wrapper {
-  padding-top: 0;
-  padding-bottom: 0;
+  margin: 0;
+  padding: 0
 }
 
 .algolia-autocomplete {