diff --git a/src/app/grade-12/page.tsx b/src/app/grade-12/page.tsx
index ff5b793..0e6c396 100644
--- a/src/app/grade-12/page.tsx
+++ b/src/app/grade-12/page.tsx
@@ -4,10 +4,11 @@ import FeatureCardSix from '@/components/sections/feature/FeatureCardSix';
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
 
 export default function Grade12Page() {
+  const navItems = [{name: "Home", id: "/"}, {name: "Grade 1", id: "/grade-1"}, {name: "Grade 2", id: "/grade-2"}, {name: "Grade 3", id: "/grade-3"}, {name: "Grade 4", id: "/grade-4"}, {name: "Grade 9", id: "/grade-9"}, {name: "Grade 10", id: "/grade-10"}, {name: "Grade 11", id: "/grade-11"}, {name: "Grade 12", id: "/grade-12"}];
   return (
     <ThemeProvider defaultButtonVariant="text-stagger" defaultTextAnimation="entrance-slide" borderRadius="rounded" contentWidth="medium" sizing="medium" background="circleGradient" cardStyle="glass-elevated" primaryButtonStyle="gradient" secondaryButtonStyle="glass" headingFontWeight="normal">
       <div id="nav" data-section="nav">
-        <NavbarLayoutFloatingOverlay navItems={[{name: "Home", id: "/"}, {name: "Grade 9", id: "/grade-9"}, {name: "Grade 10", id: "/grade-10"}, {name: "Grade 11", id: "/grade-11"}, {name: "Grade 12", id: "/grade-12"}]} brandName="Crispy Cluck" />
+        <NavbarLayoutFloatingOverlay navItems={navItems} brandName="Crispy Cluck" />
       </div>
       <div className="pt-32 pb-20 px-8">
         <FeatureCardSix