diff --git a/lib/Vroom/I18N/en.pm b/lib/Vroom/I18N/en.pm
index 12bd95a..ce30134 100644
--- a/lib/Vroom/I18N/en.pm
+++ b/lib/Vroom/I18N/en.pm
@@ -341,7 +341,8 @@ our %Lexicon = (
   "ABOUT_MUSICS"                         => "Also thanks to the authors of songs used",
   "FROM_AUTHOR"                          => "from",
   "PAGE_NOT_FOUND"                       => "This page does not exist",
-  "SERVER_ERROR"                         => "Sorry for the inconvinience"
+  "SERVER_ERROR"                         => "Sorry for the inconvinience",
+  "DOCUMENTATION"                        => "Documentation"
 ); 
 
 1;
diff --git a/lib/Vroom/I18N/fr.pm b/lib/Vroom/I18N/fr.pm
index 5725c30..85ff885 100644
--- a/lib/Vroom/I18N/fr.pm
+++ b/lib/Vroom/I18N/fr.pm
@@ -370,7 +370,8 @@ our %Lexicon = (
     "ABOUT_MUSICS"                              => "Merci également aux auteurs des morceaux de musique utilisés",
     "FROM_AUTHOR"                               => "de",
     "PAGE_NOT_FOUND"                            => "Cette page n'existe pas",
-    "SERVER_ERROR"                              => "Veuillez nous excuser"
+    "SERVER_ERROR"                              => "Veuillez nous excuser",
+    "DOCUMENTATION"                             => "Documentation"
 );
 
 1;
diff --git a/public/css/vroom.css b/public/css/vroom.css
index bafbe0a..dc7b67a 100644
--- a/public/css/vroom.css
+++ b/public/css/vroom.css
@@ -276,7 +276,6 @@ a.popup>span {
 .header-btn-group {
   margin-left: 10px;
 }
-html,
 body {
   height: 100%;
   width: 100%;
@@ -284,6 +283,7 @@ body {
   margin: 0px;
   padding: 0px;
   font-family: 'Happy Monkey', cursive;
+  position: relative;
 }
 #wrap {
   min-height: 100%;
diff --git a/public/js/vroom.js b/public/js/vroom.js
index 2583a00..b2208a4 100644
--- a/public/js/vroom.js
+++ b/public/js/vroom.js
@@ -405,22 +405,24 @@ function initIndex(){
 
 // The documentation page
 function initDoc(){
-  $('#doc-toc').width($('#doc-toc').parents().width());
-  $('#doc-toc').toc({
+
+  $('#toc').width($('#toc').parents().width());
+
+  $('#toc').toc({
     elementClass: 'toc',
     ulClass: 'nav',
-    heading: 'Content',
+    heading: 'Table of content',
     indexingFormats: 'number'
   });
 
- // Scroll to the table of content section when user scroll the mouse
+  // Scroll to the table of content section when user scroll the mouse
   $('body').scrollspy({
-    target: '#doc-toc',
+    target: '#toc',
     offset: $('#headerNav').outerHeight(true) + 40
   });
 
   setTimeout(function() {
-    var $sideBar = $('#doc-toc');
+    var $sideBar = $('#toc');
     $sideBar.affix({
       offset: {
         top: function() {
@@ -434,7 +436,7 @@ function initDoc(){
         }
       }
     });
-  }, 100);
+  }, 200);
 }
 
 // Used on the room admin page
diff --git a/templates/default/documentation.html.ep b/templates/default/documentation.html.ep
index ec2ee66..61d7517 100644
--- a/templates/default/documentation.html.ep
+++ b/templates/default/documentation.html.ep
@@ -4,7 +4,7 @@
 <div class="container-fluid">
   <div class="row-fluid">
     <div class="hidden-xs col-sm-3">
-      <div id="doc-toc">
+      <div id="toc">
       </div>
     </div>
     <div class="col-sm-9" id="doc-content">