diff --git a/landing/landing.css b/landing/landing.css
--- a/landing/landing.css
+++ b/landing/landing.css
@@ -18,6 +18,14 @@
   overflow: auto;
 }
 
+.innerContainerMobileNav {
+  overflow-y: hidden;
+}
+
+.pageContentContainer {
+  position: relative;
+}
+
 .wrapper {
   transition-property: max-width;
   transition: 300ms;
diff --git a/landing/landing.react.js b/landing/landing.react.js
--- a/landing/landing.react.js
+++ b/landing/landing.react.js
@@ -1,5 +1,6 @@
 // @flow
 
+import classNames from 'classnames';
 import * as React from 'react';
 import { useRouteMatch } from 'react-router-dom';
 
@@ -14,6 +15,7 @@
 import Investors from './investors.react.js';
 import Keyservers from './keyservers.react.js';
 import css from './landing.css';
+import MobileNav from './mobile-nav.react.js';
 import Privacy from './privacy.react.js';
 import QR from './qr.react.js';
 import SIWE from './siwe.react.js';
@@ -47,6 +49,13 @@
     [modalContext.modals],
   );
 
+  const [showMobileNav, setShowMobileNav] = React.useState<boolean>(false);
+
+  const innerContainerClassName = classNames({
+    [css.innerContainer]: true,
+    [css.innerContainerMobileNav]: showMobileNav,
+  });
+
   useScrollToTopOnNavigate();
   const onPrivacy = useRouteMatch({ path: '/privacy' });
   const onTerms = useRouteMatch({ path: '/terms' });
@@ -88,11 +97,17 @@
 
   return (
     <div className={css.container}>
-      <div className={css.innerContainer}>
+      <div className={innerContainerClassName}>
         {header}
-        {activePage}
-        {footer}
-        {modals}
+        <div className={css.pageContentContainer}>
+          <MobileNav
+            showMobileNav={showMobileNav}
+            setShowMobileNav={setShowMobileNav}
+          />
+          {activePage}
+          {footer}
+          {modals}
+        </div>
       </div>
     </div>
   );
diff --git a/landing/mobile-nav.css b/landing/mobile-nav.css
--- a/landing/mobile-nav.css
+++ b/landing/mobile-nav.css
@@ -8,6 +8,14 @@
   z-index: 1;
   background-color: var(--comparison-cards);
   padding: 8px 16px 0;
+  transition: 500ms;
+  transition-property: top;
+}
+
+nav.activeMobileNav {
+  top: 0;
+  transition: 500ms;
+  transition-property: top;
 }
 
 div.tabContainer {
diff --git a/landing/mobile-nav.react.js b/landing/mobile-nav.react.js
--- a/landing/mobile-nav.react.js
+++ b/landing/mobile-nav.react.js
@@ -6,14 +6,32 @@
 import * as React from 'react';
 import { NavLink } from 'react-router-dom';
 
+import type { SetState } from 'lib/types/hook-types.js';
+
 import css from './mobile-nav.css';
 import typography from './typography.css';
 
-function MobileNav(): React.Node {
+type Props = {
+  +showMobileNav: boolean,
+  +setShowMobileNav: SetState<boolean>,
+};
+
+function MobileNav(props: Props): React.Node {
+  const { showMobileNav, setShowMobileNav } = props;
+
   const navLinkClassName = classNames([typography.paragraph2, css.tab]);
 
+  const mobileNavClassName = classNames({
+    [css.mobileNav]: true,
+    [css.activeMobileNav]: showMobileNav,
+  });
+
+  const onClickTab = React.useCallback(() => {
+    setShowMobileNav(false);
+  }, [setShowMobileNav]);
+
   return (
-    <nav className={css.mobileNav}>
+    <nav className={mobileNavClassName}>
       <div className={css.tabContainer}>
         <NavLink
           to="/keyservers"
@@ -21,7 +39,9 @@
           className={navLinkClassName}
           activeClassName={css.activeTab}
         >
-          <div className={css.tabContent}>Keyserver</div>
+          <div onClick={onClickTab} className={css.tabContent}>
+            Keyserver
+          </div>
         </NavLink>
       </div>
       <div className={css.tabContainer}>
@@ -31,7 +51,9 @@
           className={navLinkClassName}
           activeClassName={css.activeTab}
         >
-          <div className={css.tabContent}>Team</div>
+          <div onClick={onClickTab} className={css.tabContent}>
+            Team
+          </div>
         </NavLink>
       </div>
       <div className={css.tabContainer}>
@@ -41,7 +63,9 @@
           className={navLinkClassName}
           activeClassName={css.activeTab}
         >
-          <div className={css.tabContent}>Investors</div>
+          <div onClick={onClickTab} className={css.tabContent}>
+            Investors
+          </div>
         </NavLink>
       </div>
       <div className={css.socialIconsContainer}>