diff --git a/src/html/menu.html b/src/html/menu.html
index 91570b1a49790630e6c2369e268ea30710df56a8..8b711a973167addd5d6c883d9d739e9d11b0c873 100644
--- a/src/html/menu.html
+++ b/src/html/menu.html
@@ -37,5 +37,6 @@
   <div id="search-bar">
     <input id="search-input" class="form-control" type="search" placeholder="ctrl + k"/>
     <i id="search-icon" class="fa fa-search" aria-hidden="true"></i>
+    <i id="close-search-icon" class="fa fa-times" aria-hidden="true"></i>
   </div>
 </nav>
diff --git a/src/html/search.html b/src/html/search.html
index 2703e17ee4215c2f6c18b487b6f1ab06ca6e7c4f..02ff668159ad9e379bfe49747d51b1163db034d7 100644
--- a/src/html/search.html
+++ b/src/html/search.html
@@ -1,5 +1,5 @@
 <div id="search-view">
-  <div class="content">
+  <div class="content container-fluid">
     Search results here
   </div>
 </div>
diff --git a/src/js/hd-app.js b/src/js/hd-app.js
index d58e4739e873c5c19f01a34c5c692c520bbe01e4..9d36a67815f4bf3a67ce77b7e253f536af58644f 100644
--- a/src/js/hd-app.js
+++ b/src/js/hd-app.js
@@ -21,10 +21,14 @@ document.addEventListener("DOMContentLoaded", function(event) {
 
   // Open the search bar via touch / click
   searchBar.querySelector("#search-icon").addEventListener("click", openSearchBar);
-
   function openSearchBar(e) {
     navBar.classList.add("search-mode");
     searchBar.querySelector("#search-input").focus();
     searchView.classList.add("search-mode");
   }
+  searchBar.querySelector("#close-search-icon").addEventListener("click", closeSearchBar);
+  function closeSearchBar(e) {
+    navBar.classList.remove("search-mode");
+    searchView.classList.remove("search-mode");
+  }
 });
diff --git a/src/scss/_menu.scss b/src/scss/_menu.scss
index 8ad5a542b70c48466c1f63cf5351e94db6972fae..682866c15c7270886b2a6127b30baef9d9f8b96e 100644
--- a/src/scss/_menu.scss
+++ b/src/scss/_menu.scss
@@ -22,7 +22,7 @@
       padding-left:         30px;
       padding-right:        0px;
       transition-property:  opacity;
-      transition-duration:  0.3s;
+      transition-duration:  0.2s;
       opacity:              1;
     }
 
@@ -55,7 +55,7 @@
       transform:            scaleX(0);
       transform-origin:     100%;
       transition-property:  all;
-      transition-duration:  0.3s;
+      transition-duration:  0.2s;
       position:             absolute;
       top:                  0px;
       right:                0px;
@@ -76,6 +76,10 @@
       &:hover {
         color:  $hd-color;
       }
+
+      &#close-search-icon {
+        display : none;
+      }
     }
   }
 
@@ -96,6 +100,14 @@
       i {
         color:                white;
         background-color:     $twitter-color;
+
+        &#search-icon {
+          display : none;
+        }
+
+        &#close-search-icon {
+          display : inline-block;
+        }
       }
     }
   }