diff --git a/src/app/teachers/page.tsx b/src/app/teachers/page.tsx
index 2d9bc89..cbe0153 100644
--- a/src/app/teachers/page.tsx
+++ b/src/app/teachers/page.tsx
@@ -3,27 +3,39 @@
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 import ReactLenis from "lenis/react";
 import NavbarLayoutFloatingOverlay from '@/components/navbar/NavbarLayoutFloatingOverlay/NavbarLayoutFloatingOverlay';
-import TeamCardOne from '@/components/sections/team/TeamCardOne';
+import TeamCardFive from '@/components/sections/team/TeamCardFive';
 
 export default function TeachersDirectoryPage() {
   return (
-    <ThemeProvider>
+    <ThemeProvider
+        defaultButtonVariant="hover-bubble"
+        defaultTextAnimation="reveal-blur"
+        borderRadius="pill"
+        contentWidth="mediumLarge"
+        sizing="mediumLarge"
+        background="grid"
+        cardStyle="subtle-shadow"
+        primaryButtonStyle="shadow"
+        secondaryButtonStyle="layered"
+        headingFontWeight="medium">
       <ReactLenis root>
-        <NavbarLayoutFloatingOverlay
-            navItems={[{ name: "Home", id: "/" }, { name: "Live Class", id: "/live-class" }, { name: "Teachers", id: "/teachers" }]}
-            brandName="EduPortal"
-        />
+        <div id="nav" data-section="nav">
+            <NavbarLayoutFloatingOverlay
+                navItems={[{ name: "Home", id: "/" }, { name: "Live Class", id: "/live-class" }, { name: "Teachers", id: "/teachers" }]}
+                brandName="EduPortal"
+            />
+        </div>
         <div className="pt-32 pb-20">
-          <TeamCardOne
+          <TeamCardFive
             title="Teacher Directory"
             description="Discover our glowing stars in education."
             animationType="blur-reveal"
-            gridVariant="bento-grid"
-            members={[
+            textboxLayout="default"
+            useInvertedBackground={false}
+            team={[
                 { id: "t1", name: "Sir John", role: "Maths Expert", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DWOyL1bzOiv10ehHhaFjaIeseb/uploaded-1778395176655-kaqs298t.png" },
                 { id: "t2", name: "Sarah Teacher", role: "Science Head", imageSrc: "https://webuild-dev.s3.eu-north-1.amazonaws.com/users/user_3DWOyL1bzOiv10ehHhaFjaIeseb/uploaded-1778395176655-kaqs298t.png" }
             ]}
-            className="glow-effect"
           />
         </div>
       </ReactLenis>