diff --git a/web/src/components/Header.tsx b/web/src/components/Header.tsx
index 8ec27f03d..8171a8ce6 100644
--- a/web/src/components/Header.tsx
+++ b/web/src/components/Header.tsx
@@ -32,7 +32,7 @@ const Header = () => {
 
   return (
     <div
-      className={`fixed sm:sticky top-0 left-0 w-full sm:w-56 h-full shrink-0 pointer-events-none sm:pointer-events-auto z-20 ${
+      className={`fixed sm:sticky top-0 left-0 w-full sm:w-56 h-full shrink-0 pointer-events-none sm:pointer-events-auto z-10 ${
         showHeader && "pointer-events-auto"
       }`}
     >
diff --git a/web/src/components/MobileHeader.tsx b/web/src/components/MobileHeader.tsx
index 067e0784a..3889f90e0 100644
--- a/web/src/components/MobileHeader.tsx
+++ b/web/src/components/MobileHeader.tsx
@@ -28,7 +28,7 @@ const MobileHeader = (props: Props) => {
   }, [filter, shortcuts]);
 
   return (
-    <div className="sticky top-0 pt-4 pb-1 mb-1 backdrop-blur-sm flex sm:hidden flex-row justify-between items-center w-full h-auto flex-nowrap shrink-0 z-2">
+    <div className="sticky top-0 pt-4 pb-1 mb-1 backdrop-blur-sm flex md:hidden flex-row justify-between items-center w-full h-auto flex-nowrap shrink-0 z-2">
       <div className="flex flex-row justify-start items-center mr-2 shrink-0 overflow-hidden">
         <div
           className="flex sm:hidden flex-row justify-center items-center w-6 h-6 mr-1 shrink-0 bg-transparent"