diff --git a/public/js/searchbar.js b/public/js/searchbar.js
index 0923d4968b6892472ccce199bda6c7ac9a268bba..ef8f0bbaf33c6c79955c1a901899e0c12e4ab837 100644
--- a/public/js/searchbar.js
+++ b/public/js/searchbar.js
@@ -390,14 +390,14 @@ function toggleOptionsDialog() {
 function openOptionsDialog() {
   $('#toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>');
   $('#toggleOptBtn').attr('data-mode', 'c');
-  $('.search-option-frame').css('display', 'flex');
+  $('.search-option-frame').removeClass('hide');
 
 }
 
 function closeOptionsDialog() {
   $('#toggleOptBtn').html('<i class="fa fa-chevron-down" aria-hidden="true"></i>');
   $('#toggleOptBtn').attr('data-mode', 'o');
-  $('.search-option-frame').css('display', 'none');
+  $('.search-option-frame').addClass('hide');
 }
 
 
diff --git a/public/js/utility.js b/public/js/utility.js
index 2029fcd5744b0530fa41c566cd541e4e3858d035..b8d0ca217228a3ba88b809eb9e06cdb8acee72b8 100644
--- a/public/js/utility.js
+++ b/public/js/utility.js
@@ -1,5 +1,6 @@
 $(document).ready(function () {
   $('.js-only').removeClass('js-only');
+  $('.no-js').addClass('hide');
 });
 
 //# sourceMappingURL=utility.js.map
diff --git a/resources/assets/js/searchbar.js b/resources/assets/js/searchbar.js
index 5b4bb784eac07802d9ab278a034810f595404d7a..e4bdaf7ce956e41c0eb47e6f5ab47e76bdf705e4 100644
--- a/resources/assets/js/searchbar.js
+++ b/resources/assets/js/searchbar.js
@@ -390,14 +390,14 @@ function toggleOptionsDialog() {
 function openOptionsDialog() {
   $('#toggleOptBtn').html('<i class="fa fa-chevron-up" aria-hidden="true"></i>');
   $('#toggleOptBtn').attr('data-mode', 'c');
-  $('.search-option-frame').css('display', 'flex');
+  $('.search-option-frame').removeClass('hide');
 
 }
 
 function closeOptionsDialog() {
   $('#toggleOptBtn').html('<i class="fa fa-chevron-down" aria-hidden="true"></i>');
   $('#toggleOptBtn').attr('data-mode', 'o');
-  $('.search-option-frame').css('display', 'none');
+  $('.search-option-frame').addClass('hide');
 }
 
 
diff --git a/resources/assets/js/utility.js b/resources/assets/js/utility.js
index d94161ea25c77a246906e4f72090670c008ad3f4..fc4f9900b5eae2426250d94872c823ef04cec918 100644
--- a/resources/assets/js/utility.js
+++ b/resources/assets/js/utility.js
@@ -1,3 +1,4 @@
 $(document).ready(function () {
   $('.js-only').removeClass('js-only');
+  $('.no-js').addClass('hide');
 });
diff --git a/resources/assets/less/metager/searchbar.less b/resources/assets/less/metager/searchbar.less
index b5d71ad7aa7fd257a3763bbd3bbcd0ec1f094b91..41ad2bfbcc3983887ed1ea017732188602264165 100644
--- a/resources/assets/less/metager/searchbar.less
+++ b/resources/assets/less/metager/searchbar.less
@@ -20,6 +20,11 @@
             margin: 5px;
         }
 
+        .search-settings:only-child {
+            padding: 5px;
+            border-right: solid 1px #ccc;
+        }
+
         select {
             width: 100%;
             -webkit-appearance: none;
@@ -47,7 +52,7 @@
     }
 
     .search-option-frame {
-        display: none;
+        display: flex;
         position: absolute;
         background-color: white;
         top: 50px;
diff --git a/resources/views/parts/searchbar.blade.php b/resources/views/parts/searchbar.blade.php
index 036c621783877621144b2e6acc7905da9ef19a12..4ce4e596c5399aaa64c6fecd62e495512772dc9d 100644
--- a/resources/views/parts/searchbar.blade.php
+++ b/resources/views/parts/searchbar.blade.php
@@ -4,25 +4,16 @@
 	<form id="searchForm" method={{ $request }} action="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "/meta/meta.ger3 ") }}" accept-charset="UTF-8">
 		<div class="searchbar {{$class or ''}}">
 			<div class="search-focus-selector">
-				<button type="button" id="toggleOptBtn" data-mode="o">
+				<button type="button" id="toggleOptBtn" class="js-only" data-mode="o">
 					<i class="fa fa-chevron-down"></i>
 				</button>
-				<noscript>
-					<style>
-						#toggleOptBtn {
-							display: none;
-						}
-						.search-settings {
-							padding: 5px;
-    						border-right: solid 1px #ccc;
-						}
-					</style>
+				<div class="no-js">
 					<div class="search-settings">
 						<a id="settings-btn" class="mutelink btn btn-default" href="{{ LaravelLocalization::getLocalizedURL(LaravelLocalization::getCurrentLocale(), "settings ") }}">
 							<i class="fa fa-cog" aria-hidden="true"></i>
 						</a>
 					</div>
-				</noscript>
+				</div>
 				<select id="focus-select" name="focus" style="font-family: FontAwesome, sans-serif;">
 					<option value="web" style="font-family: FontAwesome, sans-serif;" selected>&#xf0ac; Websuche</option>
 					<option value="nachrichten" style="font-family: FontAwesome, sans-serif;">&#xf0a1; Nachrichtensuche</option>
@@ -30,7 +21,7 @@
 					<option value="produktsuche" style="font-family: FontAwesome, sans-serif;">&#xf07a; Produktsuche</option>
 					<option value="maps" style="font-family: FontAwesome, sans-serif;">&#xf279; Kartensuche</option>
 				</select>
-				<div class="search-option-frame" style="display:none;">
+				<div class="search-option-frame hide">
 					<div class="searchbar-options-arrow">
 					</div>
 					<div class="search-button-container">