diff --git a/src/components/AppShell.vue b/src/components/AppShell.vue
index 3d3471488..b0135e3f0 100644
--- a/src/components/AppShell.vue
+++ b/src/components/AppShell.vue
@@ -1,5 +1,5 @@
 <template>
-  <div class="min-h-full">
+  <div class="flex h-screen w-screen">
     <TransitionRoot
       as="template"
       :show="mainMenuOpen"
@@ -116,7 +116,7 @@
       </div>
     </div>
 
-    <main class="flex flex-col min-h-screen pt-16 md:pl-64 xl:pl-80">
+    <main class="flex flex-col min-h-full w-full pt-16 md:pl-64 xl:pl-80">
       <slot />
     </main>
   </div>
diff --git a/src/layouts/BaseLayout.astro b/src/layouts/BaseLayout.astro
index f7f350ab8..7b2635e72 100644
--- a/src/layouts/BaseLayout.astro
+++ b/src/layouts/BaseLayout.astro
@@ -75,11 +75,9 @@ const navigation = Navigation.create({ nav: sideNavConfig, content });
   <body>
     <header>
     </header>
-    <div class="flex flex-col min-h-screen">
+    <div class="flex flex-col h-screen w-screen">
       <AppShell client:load path={Astro.url.pathname} baseUrl={Astro.url.origin} navigation={navigation}>
-        <main>
-          <slot />
-        </main>
+        <slot />
         <button
           id="freshdesk"
           type="button"
diff --git a/src/pages/404.astro b/src/pages/404.astro
new file mode 100644
index 000000000..f8f9ed552
--- /dev/null
+++ b/src/pages/404.astro
@@ -0,0 +1,9 @@
+---
+import BaseLayout from '../layouts/BaseLayout.astro';
+---
+
+<BaseLayout>
+  <div class="desktop-gutters px-4 sm:px-8 my-32">
+    404
+  </div>
+</BaseLayout>
diff --git a/src/pages/api/[...slug].astro b/src/pages/api/[...slug].astro
index b98ec133c..b12e88da1 100644
--- a/src/pages/api/[...slug].astro
+++ b/src/pages/api/[...slug].astro
@@ -34,7 +34,7 @@ const { title, description } = entry.data;
         </Prose>
       </article>
     </div>
-    <div class="hidden xl:sticky border-none xl:top-[4.5rem] xl:block xl:h-[calc(100vh-4.5rem)] xl:flex-none xl:py-16 xl:pr-6 overflow-y-auto">
+    <div class="hidden xl:sticky border-none xl:top-[4.5rem] xl:block xl:h-[calc(100vh-10rem)] xl:flex-none xl:py-16 xl:pr-6 overflow-y-auto">
       <TocNav client:load headings={headings} />
     </div>
   </div>
diff --git a/src/pages/guides/[...slug].astro b/src/pages/guides/[...slug].astro
index 95d872d1c..9089fac4c 100644
--- a/src/pages/guides/[...slug].astro
+++ b/src/pages/guides/[...slug].astro
@@ -45,7 +45,7 @@ const { title, description } = entry.data;
         </Prose>
       </article>
     </div>
-    <div class="hidden xl:sticky border-none xl:top-[4.5rem] xl:block xl:h-[calc(100vh-4.5rem)] xl:flex-none xl:py-16 xl:pr-6 overflow-y-auto">
+    <div class="hidden xl:sticky border-none xl:top-[4.5rem] xl:block xl:h-[calc(100vh-10rem)] xl:flex-none xl:py-16 xl:pr-6 overflow-y-auto">
       <TocNav client:load headings={headings} />
     </div>
   </div>
