diff --git a/src/components/MobileHead/MobileHead.tsx b/src/components/MobileHead/MobileHead.tsx
index 2ce1389c..ceb2ab27 100644
--- a/src/components/MobileHead/MobileHead.tsx
+++ b/src/components/MobileHead/MobileHead.tsx
@@ -29,7 +29,7 @@ const MobileHead = () => {
         sx={{
           backgroundColor: 'transparent',
           maxWidth: '100%',
-          zIndex: '9',
+          zIndex: theme => theme.zIndex.appBar,
           width: '100%'
         }}
       >
diff --git a/src/components/Overlay/Overlay.tsx b/src/components/Overlay/Overlay.tsx
index 5a99e961..3015e392 100644
--- a/src/components/Overlay/Overlay.tsx
+++ b/src/components/Overlay/Overlay.tsx
@@ -34,13 +34,13 @@ const Overlay = () => {
       </Stack>
 
       <Stack
-        sx={theme => ({
+        sx={{
           position: 'fixed',
           bottom: '25px',
           left: '25px',
-          zIndex: theme.zIndex.appBar,
+          zIndex: 2,
           maxWidth: '765px'
-        })}
+        }}
         gap={2}
       >
         <Fade in={shouldShowSearchBar} mountOnEnter timeout={300}>