diff --git a/src/components/Clue/Clue.scss b/src/components/Clue/Clue.scss
index 60546f7..4be53a2 100644
--- a/src/components/Clue/Clue.scss
+++ b/src/components/Clue/Clue.scss
@@ -36,7 +36,7 @@
 }
 
 /** Breakpoints **/
-@media (vars.$breakpoint-sm < width <= vars.$breakpoint-md) {
+@media (vars.$breakpoint-sm <= width <= vars.$breakpoint-md) {
   .Clue {
     scroll-margin-top: vars.$grid-size * 2.3;
   }
diff --git a/src/components/Clues/Clues.scss b/src/components/Clues/Clues.scss
index c5bb93e..d11eb02 100644
--- a/src/components/Clues/Clues.scss
+++ b/src/components/Clues/Clues.scss
@@ -33,7 +33,7 @@
   }
 }
 
-@media (vars.$breakpoint-sm < width <= vars.$breakpoint-md) {
+@media (vars.$breakpoint-sm <= width <= vars.$breakpoint-md) {
   .Clues {
     flex-direction: column;
     overflow-y: auto;
@@ -54,7 +54,7 @@
 }
 
 
-@media (vars.$breakpoint-xs < width <= vars.$breakpoint-sm) {
+@media (vars.$breakpoint-xs <= width <= vars.$breakpoint-sm) {
   .Clues {
     margin-top: vars.$grid-size;
   }
diff --git a/src/components/Crossword/Crossword.scss b/src/components/Crossword/Crossword.scss
index 763c62d..ea102ff 100644
--- a/src/components/Crossword/Crossword.scss
+++ b/src/components/Crossword/Crossword.scss
@@ -16,7 +16,7 @@
   }
 }
 
-@media (vars.$breakpoint-xs < width <= vars.$breakpoint-sm) {
+@media (vars.$breakpoint-xs <= width <= vars.$breakpoint-sm) {
   .Crossword {
     flex-direction: column;
   }
diff --git a/src/components/Grid/Grid.scss b/src/components/Grid/Grid.scss
index ba1d2a1..d34ddca 100644
--- a/src/components/Grid/Grid.scss
+++ b/src/components/Grid/Grid.scss
@@ -35,7 +35,7 @@
   }
 }
 
-@media (vars.$breakpoint-xs < width <= vars.$breakpoint-sm) {
+@media (vars.$breakpoint-xs <= width <= vars.$breakpoint-sm) {
   .Grid {
     scroll-margin-top: vars.$grid-size * 5;
   }