diff --git a/css/main.css b/css/main.css
index 30f45e0..5b8606e 100644
--- a/css/main.css
+++ b/css/main.css
@@ -71,7 +71,8 @@ body {
         padding: 7px 14px;
         font-size: 18px;
         color: #fff;
-        box-sizing: border-box; }
+        box-sizing: border-box;
+        z-index: -1; }
         .main #search-bar .autocomplete-items-container .autocomplete-item:hover {
           background: #3b3b3b; }
       .main #search-bar .autocomplete-items-container .autocomplete-active {
@@ -131,7 +132,7 @@ body {
 .settings-modal {
   display: none;
   position: fixed;
-  z-index: 1;
+  z-index: 3;
   width: 80vw;
   height: 80vh;
   overflow: auto;
diff --git a/js/autocomplete.js b/js/autocomplete.js
index bb5d366..5be0f83 100644
--- a/js/autocomplete.js
+++ b/js/autocomplete.js
@@ -15,7 +15,7 @@ function autocomplete(inp, passedValues) {
         currentFocus = -1;
 
         // Update some values of the parent container
-        parentContainer.setAttribute("id", this.id + "autocomplete-list");
+        parentContainer.setAttribute("id", this.id + "-autocomplete-list");
         parentContainer.style.paddingBottom = "1rem";
 
 
diff --git a/js/main.js b/js/main.js
index 84979d1..a5885a4 100644
--- a/js/main.js
+++ b/js/main.js
@@ -3,7 +3,7 @@ window.onload = function() {
 }
 
 
-debug = true; // Enable while testing on local
+debug = false; // Enable while testing on local
 searchBarDivId = "search-bar"
 searchBarId = "search-bar-input"
 messageDivId = "message"
@@ -81,6 +81,8 @@ function initSearchBar(jsonData) {
         if (query == "--setting") {
             showSettings()
             document.getElementById(searchBarId).value = ""
+            // Remove the autocomplete boxes
+            document.getElementById("search-bar-input-autocomplete-list").style.display = "none";
             return
         }
 
diff --git a/scss/main.scss b/scss/main.scss
index 7046525..fc4ccc1 100644
--- a/scss/main.scss
+++ b/scss/main.scss
@@ -107,6 +107,7 @@ body {
                 font-size: 18px;
                 color: $foreground;
                 box-sizing: border-box;
+                z-index: -1;
 
                 &:hover {
                     background: lighten($background, 10);
@@ -224,7 +225,7 @@ body {
 .settings-modal {
     display: none;
     position: fixed;
-    z-index: 1;
+    z-index: 3;
     width: 80vw;
     height: 80vh;
     overflow: auto;