diff --git a/components/nav/mobile/footer.module.css b/components/nav/mobile/footer.module.css
index 879f66fb..094d95d3 100644
--- a/components/nav/mobile/footer.module.css
+++ b/components/nav/mobile/footer.module.css
@@ -6,6 +6,7 @@
     background-color: var(--bs-body-bg);
     border-top: 1px solid var(--theme-toolbarActive);
     z-index: 1000;
+    justify-content: end;
 }
 
 .footerPadding {
diff --git a/components/nav/sticky-bar.js b/components/nav/sticky-bar.js
index 98ce3d24..a0312941 100644
--- a/components/nav/sticky-bar.js
+++ b/components/nav/sticky-bar.js
@@ -7,51 +7,52 @@ import classNames from 'classnames'
 
 export default function StickyBar ({ prefix, sub, path, topNavKey, dropNavKey }) {
   const ref = useRef()
-  const sticky = useRef()
   const me = useMe()
 
   useEffect(() => {
-    const observer = new window.IntersectionObserver(([entry]) => {
-      sticky?.current?.classList.toggle(styles.hide, entry.isIntersecting)
-    })
-    ref?.current && observer.observe(ref.current)
+    const stick = () => {
+      if (window.scrollY > 100) {
+        ref.current?.classList.remove(styles.hide)
+      } else {
+        ref.current?.classList.add(styles.hide)
+      }
+    }
+
+    window.addEventListener('scroll', stick)
 
     return () => {
-      ref?.current && observer.unobserve(ref.current)
+      window.removeEventListener('scroll', stick)
     }
-  }, [ref?.current, sticky?.current])
+  }, [ref?.current])
 
   return (
-    <>
-      <div ref={ref} style={{ position: 'relative', top: '50px' }} />
-      <div className={classNames(styles.hide, styles.sticky)} ref={sticky}>
-        <Container className='px-0 d-none d-md-block'>
-          <Navbar className='py-0'>
-            <Nav
-              className={styles.navbarNav}
-              activeKey={topNavKey}
-            >
-              <Back />
-              <Brand className='me-1' />
-              <SearchItem className='me-0 ms-2' />
-              <NavPrice />
-              {me ? <MeCorner dropNavKey={dropNavKey} me={me} className='d-flex' /> : <AnonCorner path={path} className='d-flex' />}
-            </Nav>
-          </Navbar>
-        </Container>
-        <Container className='px-sm-0 d-block d-md-none'>
-          <Navbar className='py-0'>
-            <Nav
-              className={classNames(styles.navbarNav, 'justify-content-between')}
-              activeKey={topNavKey}
-            >
-              <Back />
-              <NavPrice className='flex-shrink-1 flex-grow-0' />
-              {me ? <NavWalletSummary className='px-2' /> : <SignUpButton />}
-            </Nav>
-          </Navbar>
-        </Container>
-      </div>
-    </>
+    <div className={classNames(styles.hide, styles.sticky)} ref={ref}>
+      <Container className='px-0 d-none d-md-block'>
+        <Navbar className='py-0'>
+          <Nav
+            className={styles.navbarNav}
+            activeKey={topNavKey}
+          >
+            <Back />
+            <Brand className='me-1' />
+            <SearchItem className='me-0 ms-2' />
+            <NavPrice />
+            {me ? <MeCorner dropNavKey={dropNavKey} me={me} className='d-flex' /> : <AnonCorner path={path} className='d-flex' />}
+          </Nav>
+        </Navbar>
+      </Container>
+      <Container className='px-sm-0 d-block d-md-none'>
+        <Navbar className='py-0'>
+          <Nav
+            className={classNames(styles.navbarNav, 'justify-content-between')}
+            activeKey={topNavKey}
+          >
+            <Back />
+            <NavPrice className='flex-shrink-1 flex-grow-0' />
+            {me ? <NavWalletSummary className='px-2' /> : <SignUpButton />}
+          </Nav>
+        </Navbar>
+      </Container>
+    </div>
   )
 }