diff --git a/static/src/less/navbar.less b/static/src/less/navbar.less
index 89c28d6..e095954 100644
--- a/static/src/less/navbar.less
+++ b/static/src/less/navbar.less
@@ -20,9 +20,11 @@
 }
 
 #navigation {
-  .flexbox();
-  justify-content: center;
-  float: none;
+  @media (min-width: @screen-xs-max) {
+    .flexbox();
+    justify-content: center;
+    float: none;
+  }
   & a {
     .transition(~"ease-in-out .3s color");
   }
@@ -100,6 +102,21 @@
   z-index: 10000;
 }
 
-navbar + * {
-  margin-top: 52px;
+@media (min-width: @screen-xs-max) {
+  navbar + * {
+    margin-top: 52px;
+  }
 }
+
+/* @group Header Navbar*/
+@media (min-width: @screen-xs-max) {
+  .header navbar{
+    #navbar-container {
+      position: initial;
+      margin: 0 auto;
+      width: 100%;
+    }
+  };
+}
+
+/* @end Header Navbar*/
diff --git a/static/src/less/style.less b/static/src/less/style.less
index 132c7dc..3e8a5ca 100644
--- a/static/src/less/style.less
+++ b/static/src/less/style.less
@@ -2,7 +2,7 @@
 @import "node_modules/bootstrap/less/bootstrap";
 @import "node_modules/bootstrap/less/theme";
 @import "node_modules/ionicons/less/ionicons";
-@import url(https://fonts.googleapis.com/css?family=Roboto:400,300,400italic,700);
+// @import url(https://fonts.googleapis.com/css?family=Roboto:400,300,400italic,700);
 @import (inline) "node_modules/animate.css/animate.css";
 @import (inline) "node_modules/normalize.css/normalize.css";
 @import 'homepage';
@@ -122,7 +122,7 @@ footer {
 /* @group content base */
 .jumbotron.header {
   padding-top: 10px;
-  padding-bottom: 10px;
+  padding-bottom: 0;
   background-color: #232323;
   color: white;
   .box-shadow(0px 8px 10px 3px rgba(0,0,0,0.6));