diff --git a/docs/_static/hasura-custom.css b/docs/_static/hasura-custom.css
index e32cf4a4ea32a..acc20ec5a481f 100644
--- a/docs/_static/hasura-custom.css
+++ b/docs/_static/hasura-custom.css
@@ -191,7 +191,7 @@ tt, code, kbd, pre, samp {
   font-size: 15px !important;
 }
 
-#docs-content {
+#docs-content, #docs-header {
   font-size: 16px !important;
   margin-left: 40px; margin-right: 40px;
 }
@@ -554,12 +554,12 @@ p {
   color: #FEC53D;
 }
 
-.input_search_box {
+#input_search_box {
   position: relative;
   width: 64%;
 }
 
-.input_search_box .search_icon {
+#input_search_box .search_icon {
   position: absolute;
   top: 13px;
   left: 10px;
@@ -569,32 +569,41 @@ p {
   z-index: 1;
 }
 
-.input_search_box .algolia-autocomplete {
+#input_search_box .algolia-autocomplete {
   width: 100%;
 }
 
-.input_search_box .algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu,
-.input_search_box .algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu {
+#input_search_box .algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu,
+#input_search_box .algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu {
   left: -25px !important;
   max-width: calc(156% + 50px);
   min-width: calc(156% + 50px);  /* 1 / width(input_search_box) + 50px */
 }
 
-.input_search_box .algolia-autocomplete a {
+#input_search_box .algolia-autocomplete a {
   text-decoration: none;
 }
 
-.input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--highlight {
+#input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--highlight {
   color: #FF993A;
 }
 
-.input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight,
-.input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl1 .algolia-docsearch-suggestion--highlight,
-.input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight {
+#input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl0 .algolia-docsearch-suggestion--highlight,
+#input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--category-header .algolia-docsearch-suggestion--category-header-lvl1 .algolia-docsearch-suggestion--highlight,
+#input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--text .algolia-docsearch-suggestion--highlight {
   box-shadow: inset 0 -2px 0 0 #FF993A;
 }
 
-.input_search_box input {
+#input_search_box .algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion.suggestion-layout-simple,
+#input_search_box .algolia-autocomplete .ds-dropdown-menu .ds-suggestion.ds-cursor .algolia-docsearch-suggestion:not(.suggestion-layout-simple) .algolia-docsearch-suggestion--content {
+  background-color: #FEECC0;
+}
+
+#input_search_box .algolia-autocomplete .algolia-docsearch-suggestion--highlight {
+  background: #FEEFFE;
+}
+
+#input_search_box input {
   height: 44px;
   box-sizing: border-box;
   text-indent: 30px;
@@ -613,27 +622,27 @@ p {
 
 }
 
-.input_search_box input:focus {
+#input_search_box input:focus {
   outline: none;
 }
 
-.input_search_box input::placeholder {
+#input_search_box input::placeholder {
   color:#ccc;
 }
 
-.input_search_box input::-webkit-input-placeholder {
+#input_search_box input::-webkit-input-placeholder {
   color:#ccc;
 }
 
-.input_search_box input::-moz-placeholder { /* Firefox 19+ */
+#input_search_box input::-moz-placeholder { /* Firefox 19+ */
   color:#ccc;
 }
 
-.input_search_box input:-ms-input-placeholder { /* IE 10+ */
+#input_search_box input:-ms-input-placeholder { /* IE 10+ */
   color:#ccc;
 }
 
-.input_search_box input:-moz-placeholder { /* Firefox 18- */
+#input_search_box input:-moz-placeholder { /* Firefox 18- */
   color:#ccc;
 }
 
@@ -959,7 +968,7 @@ p {
   overflow-y: auto;
 }
 
-.search_head_wrapper {
+#docs-header-actions {
   margin-top: 29px;
 }
 
@@ -1336,13 +1345,13 @@ ol, ul {
     min-width: 0px !important;
   }
 
-  .input_search_box {
+  #input_search_box {
     width: 60%;
     margin-left: 10px;
   }
 
-  .input_search_box .algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu,
-  .input_search_box .algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu {
+  #input_search_box .algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu,
+  #input_search_box .algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu {
     left: -34px !important;
     max-width: calc(166% + 10px);
     min-width: calc(166% + 10px);  /* 1 / width(input_search_box) + 10px */
@@ -1381,16 +1390,16 @@ ol, ul {
     margin: 0 auto !important;
   }
 
-  .mobile-logo {
+  #mobile-logo {
     display: flex;
     margin-top: 20px;
   }
 
-  .search_head_wrapper {
+  #docs-header-actions {
     margin-top: 20px;
   }
 
-  #docs-content {
+  #docs-content, #docs-header {
     margin-left: 0;
     margin-right: 0;
   }
@@ -1399,13 +1408,13 @@ ol, ul {
 
 /* Mobile overrides */
 @media (max-width: 768px) {
-  .input_search_box {
+  #input_search_box {
     width: 90%;
     margin-left: 10px;
   }
 
-  .input_search_box .algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu,
-  .input_search_box .algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu {
+  #input_search_box .algolia-autocomplete.algolia-autocomplete-right .ds-dropdown-menu,
+  #input_search_box .algolia-autocomplete.algolia-autocomplete-left .ds-dropdown-menu {
     left: -34px !important;
     max-width: calc(111% + 10px);
     min-width: calc(111% + 10px);  /* 1 / width(input_search_box) + 10px */
diff --git a/docs/_theme/djangodocs/layout.html b/docs/_theme/djangodocs/layout.html
index 8aecfef69587f..8877160d91508 100644
--- a/docs/_theme/djangodocs/layout.html
+++ b/docs/_theme/djangodocs/layout.html
@@ -31,26 +31,13 @@
           {% set pagenameSplit = pagename.split('/') %}
           {% block sidebarwrapper %}
             <div class="yui-b mobile-hide" id="sidebar">
-              {%- if last_updated %}
-                <span><b>Last updated:</b> {{ last_updated }}</span>
-              {%- endif %}
               {{ sidebar() }}
             </div>
           {% endblock %}
           <div class="content_inner_wrapper">
             <div role="main" parent={{ rootpage }}>
-              <div id="docs-content">
-                <!-- div class="media_wrapper details_media">
-                  <div class="float_right wd_100">
-                    <div class="share_wrapper">
-                      <button class="share_btn green_btn">
-                        <span>Share</span>
-                        <i class="fa fa-share" aria-hidden="true"></i>
-                      </button>
-                    </div>
-                  </div>
-                </div -->
-                <div class="mobile-logo mobile-only">
+              <div id="docs-header">
+                <div class="mobile-only" id="mobile-logo">
                   <a href="https://{{ BASE_DOMAIN }}/" target="_blank">
                     <div class="img_wrapper inline-block">
                       <img class="responsive logo_img no-shadow" src="{{ pathto('_images/layout/logo-dark.svg', 1) }}" />
@@ -58,15 +45,15 @@
                   </a>
                   <a href="https://docs.{{ BASE_DOMAIN }}" class="docs_label mobile-logo-docs">DOCS&nbsp;&nbsp;v{{version}}</a>
                 </div>
-                <div class="search_head_wrapper">
+                <div id="docs-header-actions">
                   <div class="inline-block mobile-only" id="nav_tree_icon">
                     <span class="fa fa-bars"></span>
                   </div>
-                  <div class="inline-block input_search_box">
+                  <div class="inline-block" id="input_search_box">
                     <span class="fa fa-search search_icon"></span>
                     <input type="text" class="search_element" placeholder="Search docs..." />
                   </div>
-                  <div class="header_links inline-block">
+                  <div class="inline-block header_links">
                     <div class="social_icons_wrapper">
                       <div class="social_icons">
                         <iframe src="https://ghbtns.com/github-btn.html?user=hasura&repo=graphql-engine&type=star&count=true" frameBorder="0" scrolling="0" width="95px" height="25px"></iframe>
@@ -82,26 +69,16 @@
                         </a>
                         <span class="tooltiptext">Get instant support on our discord server</span>
                       </div>
-
                     </div>
-                    <!-- no need support button
-                    <div class="buttons">
-                      <div class="inline-block"> -->
-                        <!-- a target="_blank" href="https://dashboard.{{ BASE_DOMAIN }}/login" -->
-                          <!-- no need support button <button class="indiv_btns black supportBtn"> Support </button> -->
-                        <!--/ a -->
-                        <!-- no need support button
-                      </div>
-                    </div> -->
                   </div>
                 </div>
+              </div>
+              <div id="docs-content">
                 <div id="{{ pagename|replace('/', '-') }}">
                   {% block body %}{% endblock %}
                 </div>
-
               </div>
               <div class="nav">{{ secondnav() }}</div>
-
               <div class="feedback_wrapper">
                 <div class="feedback">
                   Was this page helpful?
@@ -135,7 +112,6 @@
                   Thank you for your feedback!
                 </div>
               </div>
-
               <div class="footer-hasura-custom">
                 Want to contribute or report missing content? Check out the <a target="_blank" href="https://github.com/hasura/graphql-engine/tree/master/docs">github repo for docs</a>.<br>
                 Powered by <a target="_blank" href="http://www.sphinx-doc.org">Sphinx</a>.
@@ -271,6 +247,22 @@
       apiKey: 'c59018461c19e20fe11459136e57900c',
       indexName: 'hasura',
       inputSelector: '.search_element',
+      transformData: function(suggestions) {
+        if (window.location.origin !== 'https://docs.hasura.io') {
+          suggestions.forEach(suggestion => {
+            if (window.location.origin === 'http://localhost:8000') {
+              suggestion.url = suggestion.url.replace(/https:\/\/docs.hasura.io\/[^\/]*/, window.location.origin)
+            } else {
+              suggestion.url = suggestion.url.replace('https://docs.hasura.io', window.location.origin);
+            }
+          });
+        }
+
+        return suggestions;
+      },
+      // algoliaOptions: {
+      //   hitsPerPage: 10
+      // },
       debug: false
   });
 </script>