media queries for navbar size

1 files changed, 38 insertions, 0 deletions

diff --git a/css/main.css b/css/main.css
index c315820..aa1c961 100644
--- a/css/main.css
+++ b/css/main.css
@@ -184,6 +184,44 @@ body {
   background: none;
 }
 
+
+
+/* Media queries for navbar size in different screen sizes */
+
+@media (max-height: 768px) {
+  body {
+    font: normal 15px/1.4 'Inter', sans-serif;
+  }
+}
+
+@media (max-height: 750px) {
+  body {
+    font: normal 13px/1.4 'Inter', sans-serif;
+  }
+}
+
+@media (max-height: 658px) {
+  body {
+    font: normal 11px/1.4 'Inter', sans-serif;
+  }
+}
+
+@media (max-height: 579px) {
+  body {
+    font: normal 8px/1.4 'Inter', sans-serif;
+  }
+}
+
+@media (max-height: 549px) {
+  body {
+    font: normal 6px/1.4 'Inter', sans-serif;
+  }
+}
+
+/* End media queries */
+
+
+
 /* // This was supposed to be for the dark mode feature but I
    // took it out because it looked ugly asf
 @media (prefers-color-scheme: dark) {