diff --git a/src/app.css b/src/app.css
index 366d1dd5..a685bef7 100644
--- a/src/app.css
+++ b/src/app.css
@@ -398,7 +398,7 @@ body.keyboard-open .cb {
   @apply bottom-sai;
 }
 
-body.keyboard-open .bottom-nav {
+body.keyboard-open .hide-on-keyboard {
   display: none;
 }
 
diff --git a/src/app/components/PrimaryNav.svelte b/src/app/components/PrimaryNav.svelte
index 3e62f0fa..e27ffd03 100644
--- a/src/app/components/PrimaryNav.svelte
+++ b/src/app/components/PrimaryNav.svelte
@@ -110,10 +110,11 @@
 {@render children?.()}
 
 <!-- a little extra something for ios -->
-<div class="bottom-nav fixed bottom-0 left-0 right-0 z-nav h-[var(--saib)] bg-base-100 md:hidden">
+<div
+  class="bottom-nav hide-on-keyboard fixed bottom-0 left-0 right-0 z-nav h-[var(--saib)] bg-base-100 md:hidden">
 </div>
 <div
-  class="bottom-nav border-top bottom-sai fixed left-0 right-0 z-nav h-14 border border-base-200 bg-base-100 md:hidden">
+  class="bottom-nav hide-on-keyboard border-top bottom-sai fixed left-0 right-0 z-nav h-14 border border-base-200 bg-base-100 md:hidden">
   <div class="content-padding-x content-sizing flex justify-between px-2">
     <div class="flex gap-2 sm:gap-6">
       <PrimaryNavItem title="Home" href="/home">
diff --git a/src/lib/components/PageContent.svelte b/src/lib/components/PageContent.svelte
index f4006e7e..2de2b716 100644
--- a/src/lib/components/PageContent.svelte
+++ b/src/lib/components/PageContent.svelte
@@ -14,6 +14,6 @@
   {...props}
   bind:this={element}
   data-component="PageContent"
-  class="scroll-container cw md:bottom-sai fixed bottom-[calc(var(--saib)+3.5rem)] top-[calc(var(--sait)+3rem)] z-feature overflow-y-auto overflow-x-hidden {props.class}">
+  class="scroll-container cw cb fixed top-[calc(var(--sait)+3rem)] z-feature overflow-y-auto overflow-x-hidden {props.class}">
   {@render children?.()}
 </div>