diff --git a/static/js/extra.js b/static/js/extra.js
new file mode 100644
index 0000000..243b0bd
--- /dev/null
+++ b/static/js/extra.js
@@ -0,0 +1,9 @@
+$(document).ready(function () {
+        var url = window.location;
+        $('.navbar-top').find('.active').removeClass('active');
+        $('.navbar-top li a').each(function () {
+            if (this.href == url) {
+                $(this).parent().addClass('active');
+            }
+        });
+   });
diff --git a/templates/default-layout-wrapper.hamlet b/templates/default-layout-wrapper.hamlet
index f1a65bd..37a94f5 100644
--- a/templates/default-layout-wrapper.hamlet
+++ b/templates/default-layout-wrapper.hamlet
@@ -23,6 +23,7 @@ $newline never
     <script type="text/javascript" src="/static/js/dataTables.buttons.min.js">
     <script type="text/javascript" src="/static/js/buttons.html5.min.js">
     <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.3/jszip.min.js">
+    <script type="text/javascript" src="/static/js/extra.js">
 
     <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css"
           integrity="sha384-1q8mTJOASx8j1Au+a5WDVnPi2lkFfwwEAa8hDDdjZlpLegxhjVME1fgjWPGmkzs7" crossorigin="anonymous">
diff --git a/templates/default-layout.hamlet b/templates/default-layout.hamlet
index 1e710b2..ab66f75 100644
--- a/templates/default-layout.hamlet
+++ b/templates/default-layout.hamlet
@@ -16,7 +16,7 @@
                    $if location /= ""
                       \@#{location}
         $maybe user <- maybeUser
-          <ul class="nav navbar-nav navbar-collapse collapse">
+          <ul class="nav navbar-nav navbar-top navbar-collapse collapse">
                 <li class="dropdown">
                    <a id="about" href="#" class="dropdown-toggle" data-toggle="dropdown">_{MsgAbout}<span class="caret"></span>
                    <ul class="dropdown-menu">