diff --git a/searx/static/themes/oscar/css/logicodev-dark.min.css.map b/searx/static/themes/oscar/css/logicodev-dark.min.css.map
index eafe5f34..32293f3a 100644
Binary files a/searx/static/themes/oscar/css/logicodev-dark.min.css.map and b/searx/static/themes/oscar/css/logicodev-dark.min.css.map differ
diff --git a/searx/static/themes/simple/css/searxng-rtl.css b/searx/static/themes/simple/css/searxng-rtl.css
index 0f13208a..974e0c86 100644
--- a/searx/static/themes/simple/css/searxng-rtl.css
+++ b/searx/static/themes/simple/css/searxng-rtl.css
@@ -1962,7 +1962,7 @@ td:hover .engine-tooltip,
 .autocomplete.open:empty {
   display: none;
 }
-@media screen and (max-width: 45rem) {
+@media screen and (max-width: 50em) {
   .autocomplete {
     bottom: 0;
   }
diff --git a/searx/static/themes/simple/css/searxng-rtl.min.css b/searx/static/themes/simple/css/searxng-rtl.min.css
index be6b40bf..a4ae1861 100644
Binary files a/searx/static/themes/simple/css/searxng-rtl.min.css and b/searx/static/themes/simple/css/searxng-rtl.min.css differ
diff --git a/searx/static/themes/simple/css/searxng-rtl.min.css.map b/searx/static/themes/simple/css/searxng-rtl.min.css.map
index bbfe17c6..f2def3f3 100644
Binary files a/searx/static/themes/simple/css/searxng-rtl.min.css.map and b/searx/static/themes/simple/css/searxng-rtl.min.css.map differ
diff --git a/searx/static/themes/simple/css/searxng.css b/searx/static/themes/simple/css/searxng.css
index 9b2c2fbd..4d9523a8 100644
--- a/searx/static/themes/simple/css/searxng.css
+++ b/searx/static/themes/simple/css/searxng.css
@@ -1962,7 +1962,7 @@ td:hover .engine-tooltip,
 .autocomplete.open:empty {
   display: none;
 }
-@media screen and (max-width: 45rem) {
+@media screen and (max-width: 50em) {
   .autocomplete {
     bottom: 0;
   }
diff --git a/searx/static/themes/simple/css/searxng.min.css b/searx/static/themes/simple/css/searxng.min.css
index 4d10f450..602e5c68 100644
Binary files a/searx/static/themes/simple/css/searxng.min.css and b/searx/static/themes/simple/css/searxng.min.css differ
diff --git a/searx/static/themes/simple/css/searxng.min.css.map b/searx/static/themes/simple/css/searxng.min.css.map
index 7ab9c3d9..329a5041 100644
Binary files a/searx/static/themes/simple/css/searxng.min.css.map and b/searx/static/themes/simple/css/searxng.min.css.map differ
diff --git a/searx/static/themes/simple/src/less/autocomplete.less b/searx/static/themes/simple/src/less/autocomplete.less
index 0c0ae3f3..5f574538 100644
--- a/searx/static/themes/simple/src/less/autocomplete.less
+++ b/searx/static/themes/simple/src/less/autocomplete.less
@@ -60,7 +60,7 @@
   }
 }
 
-@media screen and (max-width: @results-width) {
+@media screen and (max-width: @phone) {
   .autocomplete {
     bottom: 0;
   }
diff --git a/searx/static/themes/simple/src/less/definitions.less b/searx/static/themes/simple/src/less/definitions.less
index fc1bcd5f..9caf4f3f 100644
--- a/searx/static/themes/simple/src/less/definitions.less
+++ b/searx/static/themes/simple/src/less/definitions.less
@@ -196,6 +196,12 @@ html {
 @results-margin: 2rem;
 @search-width: 40rem;
 
+/// Device Size
+/// @desktop > @tablet
+@tablet: 80em;
+@phone: 50em;
+@small-phone: 35em;
+
 /// From style.less
 @stacked-bar-chart: rgb(0, 0, 0);
 
diff --git a/searx/static/themes/simple/src/less/index.less b/searx/static/themes/simple/src/less/index.less
index a74988a7..64bfda06 100644
--- a/searx/static/themes/simple/src/less/index.less
+++ b/searx/static/themes/simple/src/less/index.less
@@ -35,7 +35,7 @@
   }
 }
 
-@media screen and (max-width: 80em) {
+@media screen and (max-width: @tablet) {
   div.title {
     h1 {
       font-size: 1em;
@@ -47,7 +47,7 @@
   }
 }
 
-@media screen and (max-width: 50em) {
+@media screen and (max-width: @phone) {
   #main_index {
     margin-top: 0;
   }
diff --git a/searx/static/themes/simple/src/less/preferences.less b/searx/static/themes/simple/src/less/preferences.less
index 5b512cc7..70edc3c8 100644
--- a/searx/static/themes/simple/src/less/preferences.less
+++ b/searx/static/themes/simple/src/less/preferences.less
@@ -116,7 +116,7 @@
   }
 }
 
-@media screen and (max-width: 80em) {
+@media screen and (max-width: @tablet) {
   .preferences_back {
     clear: both;
   }
diff --git a/searx/static/themes/simple/src/less/search.less b/searx/static/themes/simple/src/less/search.less
index 36f0011e..5e8888f0 100644
--- a/searx/static/themes/simple/src/less/search.less
+++ b/searx/static/themes/simple/src/less/search.less
@@ -103,7 +103,7 @@
   vertical-align: middle;
 }
 
-@media screen and (max-width: 80em) {
+@media screen and (max-width: @tablet) {
   #search {
     padding: 0 @results-tablet-offset;
   }
@@ -145,7 +145,7 @@
   }
 }
 
-@media screen and (max-width: 50em) {
+@media screen and (max-width: @phone) {
   #search {
     width: 100%;
     margin: 0;
diff --git a/searx/static/themes/simple/src/less/style.less b/searx/static/themes/simple/src/less/style.less
index 1a541816..1f6bb451 100644
--- a/searx/static/themes/simple/src/less/style.less
+++ b/searx/static/themes/simple/src/less/style.less
@@ -569,7 +569,7 @@ article.result-images[data-vim-selected]::before {
   }
 }
 
-@media screen and (max-width: 80em) {
+@media screen and (max-width: @tablet) {
   #main_preferences,
   #main_about,
   #main_stats {
@@ -710,7 +710,7 @@ article.result-images[data-vim-selected]::before {
   }
 }
 
-@media screen and (max-width: 50em) {
+@media screen and (max-width: @phone) {
   #main_results div#results {
     grid-template-columns: 100%;
     margin: 2rem 0 0 0;
@@ -767,7 +767,7 @@ article.result-images[data-vim-selected]::before {
   }
 }
 
-@media screen and (max-width: 35em) {
+@media screen and (max-width: @small-phone) {
   .result-videos {
     img.thumbnail {
       float: none !important;
diff --git a/searx/static/themes/simple/src/less/toolkit.less b/searx/static/themes/simple/src/less/toolkit.less
index 8c92fe48..524cc93d 100644
--- a/searx/static/themes/simple/src/less/toolkit.less
+++ b/searx/static/themes/simple/src/less/toolkit.less
@@ -433,7 +433,7 @@ select {
   }
 }
 
-@media screen and (max-width: 50em) {
+@media screen and (max-width: @phone) {
   .tabs > label {
     width: 100%;
   }