diff --git a/starter/components/elements/mobile-nav-menu.js b/starter/components/elements/mobile-nav-menu.js
index 24d28a6..5dbb3e1 100644
--- a/starter/components/elements/mobile-nav-menu.js
+++ b/starter/components/elements/mobile-nav-menu.js
@@ -1,3 +1,5 @@
+import { useEffect } from "react"
+import { useRouter } from "next/router"
 import PropTypes from "prop-types"
 import { MdClose, MdChevronRight } from "react-icons/md"
 import { mediaPropTypes, linkPropTypes, buttonLinkPropTypes } from "utils/types"
@@ -10,6 +12,12 @@ import CustomLink from "./custom-link"
 const MobileNavMenu = ({ navbar, closeSelf }) => {
   // Prevent window scroll while mobile nav menu is open
   useLockBodyScroll()
+  
+  const router = useRouter()
+
+  useEffect(() => {
+    closeSelf()
+  }, [router.asPath])
 
   return (
     <div className="w-screen h-screen fixed top-0 left-0 overflow-y-scroll bg-white z-10 pb-6">