diff --git a/src/AliasVault.Client/Main/Layout/MainLayout.razor b/src/AliasVault.Client/Main/Layout/MainLayout.razor
index 691d50bc2..66f5dc0ad 100644
--- a/src/AliasVault.Client/Main/Layout/MainLayout.razor
+++ b/src/AliasVault.Client/Main/Layout/MainLayout.razor
@@ -8,7 +8,7 @@
             <ConfirmModal />
             <FullScreenLoadingIndicator @ref="LoadingIndicator" />
             <TopMenu />
-            <div class="flex pt-16 pb-4 lg:pb-16 overflow-hidden bg-gray-100 dark:bg-gray-900">
+            <div class="flex pt-16 mb-4 lg:mb-16 overflow-hidden bg-gray-100 dark:bg-gray-900 relative z-20">
                 <div id="main-content" class="relative z-10 w-full max-w-screen-2xl mx-auto h-full overflow-y-auto bg-gray-100 dark:bg-gray-900">
                     <main>
                         <GlobalNotificationDisplay />
diff --git a/src/AliasVault.Client/wwwroot/css/tailwind.css b/src/AliasVault.Client/wwwroot/css/tailwind.css
index 7317e358c..6066d91b6 100644
--- a/src/AliasVault.Client/wwwroot/css/tailwind.css
+++ b/src/AliasVault.Client/wwwroot/css/tailwind.css
@@ -690,6 +690,10 @@ video {
   z-index: 50;
 }
 
+.z-20 {
+  z-index: 20;
+}
+
 .col-span-1 {
   grid-column: span 1 / span 1;
 }
@@ -2764,6 +2768,10 @@ video {
     margin-top: 4rem;
   }
 
+  .lg\:mb-16 {
+    margin-bottom: 4rem;
+  }
+
   .lg\:block {
     display: block;
   }