diff --git a/src/partials/_a_common.scss b/src/partials/_a_common.scss
index 06ae2a7..63a701d 100644
--- a/src/partials/_a_common.scss
+++ b/src/partials/_a_common.scss
@@ -70,15 +70,11 @@
 }
 
 body {
+    display: grid;
     background-color: var(--background-0);
 
     // Adds a margin otherwise for some reason.
     margin: 0;
-
-    display: grid;
-    grid-auto-flow: column dense;
-    grid-template-columns: min-content 1fr min-content;
-    grid-template-areas: "nav main spacer";
 }
 
 * {
@@ -107,13 +103,13 @@ a {
     font-family: var(--font-family-generic);
 }
 
-@media (max-width: 500px) {
+// Mobile
+@media (max-width: 600px) {
     :root {
         --spacing-large: var(--spacing-small);
     }
 
     body {
-        grid-auto-flow: row;
         grid-template-columns: none;
         grid-template-areas: "nav" "main" "spacer";
 
@@ -130,3 +126,19 @@ a {
         right: auto;
     }
 }
+
+// Tablets and Intermediary
+@media (min-width: 601px) and (max-width: 1023px) {
+    body {
+        grid-template-columns: min-content 1fr;
+        grid-template-areas: "nav main" "spacer main";
+    }
+}
+
+// Desktops and Laptops
+@media (min-width: 1024px) {
+    body {
+        grid-template-columns: min-content 1fr min-content;
+        grid-template-areas: "nav main spacer";
+    }
+}
diff --git a/src/partials/_a_layouts.scss b/src/partials/_a_layouts.scss
index 63b0e2a..d6ecf75 100644
--- a/src/partials/_a_layouts.scss
+++ b/src/partials/_a_layouts.scss
@@ -19,7 +19,7 @@
     margin-top: var(--spacing-small);
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     .layout_row {
         grid-auto-flow: row;
     }
diff --git a/src/partials/_a_pane.scss b/src/partials/_a_pane.scss
index 7110e5e..d09bff6 100644
--- a/src/partials/_a_pane.scss
+++ b/src/partials/_a_pane.scss
@@ -6,16 +6,18 @@
     margin: var(--spacing-large);
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     .pane {
         width: calc((50% - var(--spacing-small)) * 2);
     }
 }
 
-nav.pane,
-.pane.spacer {
-    gap: var(--spacing-medium);
+@media (min-width: 601px) {
+    nav.pane,
+    .pane.spacer {
+        gap: var(--spacing-medium);
 
-    position: sticky;
-    top: var(--spacing-large);
+        position: sticky;
+        top: var(--spacing-large);
+    }
 }
diff --git a/src/partials/_a_section_list.scss b/src/partials/_a_section_list.scss
index 5859985..fb6206f 100644
--- a/src/partials/_a_section_list.scss
+++ b/src/partials/_a_section_list.scss
@@ -75,7 +75,7 @@
     }
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     .section_list section {
         > header {
             column-gap: var(--spacing-small);
diff --git a/src/partials/_nav_dropdown.scss b/src/partials/_nav_dropdown.scss
index 67b31cd..f94b6f3 100644
--- a/src/partials/_nav_dropdown.scss
+++ b/src/partials/_nav_dropdown.scss
@@ -22,7 +22,7 @@
     }
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     .dropdown {
         > label.item > ion-icon {
             margin-right: var(--padding-mobile);
diff --git a/src/partials/_nav_header.scss b/src/partials/_nav_header.scss
index 735fc02..1ace61c 100644
--- a/src/partials/_nav_header.scss
+++ b/src/partials/_nav_header.scss
@@ -16,7 +16,7 @@ nav.pane > .nav_header {
     }
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     nav.pane > .nav_header {
         grid-template-columns: min-content 1fr min-content;
         grid-template-areas: "logo blank hamburger";
diff --git a/src/partials/_nav_menu.scss b/src/partials/_nav_menu.scss
index bcc3ef1..a21ba40 100644
--- a/src/partials/_nav_menu.scss
+++ b/src/partials/_nav_menu.scss
@@ -45,7 +45,7 @@ nav .menu {
     }
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     .menu {
         .item {
             padding: var(--padding-mobile);
diff --git a/src/partials/_nav_quick_links.scss b/src/partials/_nav_quick_links.scss
index f2e5ef0..3f5404f 100644
--- a/src/partials/_nav_quick_links.scss
+++ b/src/partials/_nav_quick_links.scss
@@ -35,7 +35,7 @@ nav.pane .quick_links {
     }
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     nav.pane .quick_links {
         margin-bottom: var(--spacing-small);
 
diff --git a/src/partials/_nav_title.scss b/src/partials/_nav_title.scss
index fb7c4b3..88bd648 100644
--- a/src/partials/_nav_title.scss
+++ b/src/partials/_nav_title.scss
@@ -13,7 +13,7 @@
     display: block;
 }
 
-@media only screen and (max-width: 500px) {
+@media (max-width: 600px) {
     .nav_title {
         padding: var(--padding-mobile);
     }
diff --git a/src/partials/_page_resume.scss b/src/partials/_page_resume.scss
index 0868096..f05a535 100644
--- a/src/partials/_page_resume.scss
+++ b/src/partials/_page_resume.scss
@@ -34,7 +34,7 @@
     grid-template-columns: 60% auto;
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     .awards,
     .certifications,
     .education,
diff --git a/src/partials/_pane_blog.scss b/src/partials/_pane_blog.scss
index 2070ced..dce9d58 100644
--- a/src/partials/_pane_blog.scss
+++ b/src/partials/_pane_blog.scss
@@ -27,7 +27,7 @@
     }
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     .pane.blog .body > .body {
         padding: var(--spacing-small);
     }
diff --git a/src/partials/_pane_error.scss b/src/partials/_pane_error.scss
index 3eb94a3..bea2d83 100644
--- a/src/partials/_pane_error.scss
+++ b/src/partials/_pane_error.scss
@@ -5,7 +5,7 @@
     text-align: center;
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     .pane.error {
         margin-top: var(--spacing-large);
         margin-bottom: var(--spacing-large);
diff --git a/src/partials/_pane_nav.scss b/src/partials/_pane_nav.scss
index d00d0d6..bad94b0 100644
--- a/src/partials/_pane_nav.scss
+++ b/src/partials/_pane_nav.scss
@@ -24,7 +24,7 @@ nav.pane {
     }
 }
 
-@media (max-width: 500px) {
+@media (max-width: 600px) {
     nav.pane {
         background-color: var(--background-2);
         border-radius: var(--border-radius-leaf);
diff --git a/templates/device_queries.css b/templates/device_queries.css
index 5b02d44..f07df31 100644
--- a/templates/device_queries.css
+++ b/templates/device_queries.css
@@ -1,9 +1,9 @@
 /* Mobile Phone */
-@media (max-width: 500px) {
+@media (max-width: 600px) {
 }
 
 /* Tablets and other weird intermediary stuff. */
-@media (min-width: 501px) and (max-width: 1023) {
+@media (min-width: 601px) and (max-width: 1023) {
 }
 
 /* Desktops and Laptops */