diff --git a/src/app/sacraments/page.tsx b/src/app/sacraments/page.tsx
index 1789da4..eae5770 100644
--- a/src/app/sacraments/page.tsx
+++ b/src/app/sacraments/page.tsx
@@ -2,7 +2,6 @@
 
 import ReactLenis from "lenis/react";
 import NavbarLayoutFloatingInline from "@/components/navbar/NavbarLayoutFloatingInline";
-import FooterBase from "@/components/sections/footer/FooterBase";
 import { ThemeProvider } from "@/providers/themeProvider/ThemeProvider";
 
 export default function SacramentsPage() {
@@ -11,18 +10,29 @@ export default function SacramentsPage() {
         { name: "Mass Schedule", id: "/mass-schedule" },
         { name: "Sacraments", id: "/sacraments" },
         { name: "Staff", id: "/staff" },
-        { name: "Giving", id: "/giving" },
         { name: "Contact", id: "/contact" },
     ];
 
     return (
-        <ThemeProvider>
+        <ThemeProvider
+            defaultButtonVariant="icon-arrow"
+            defaultTextAnimation="entrance-slide"
+            borderRadius="rounded"
+            contentWidth="medium"
+            sizing="medium"
+            background="none"
+            cardStyle="glass-elevated"
+            primaryButtonStyle="shadow"
+            secondaryButtonStyle="solid"
+            headingFontWeight="medium"
+        >
             <ReactLenis root>
-                <NavbarLayoutFloatingInline navItems={navItems} brandName="Coach" button={{ text: "Book a Call", href: "/contact" }} />
+                <div id="nav" data-section="nav">
+                    <NavbarLayoutFloatingInline navItems={navItems} brandName="St. Jerome" />
+                </div>
                 <main className="pt-32 min-h-screen px-4">
                     <h1 className="text-4xl font-bold text-center mb-8">Sacraments</h1>
                 </main>
-                <FooterBase logoText="Coach" columns={[{ title: "Navigation", items: navItems.map(i => ({ label: i.name, href: i.id })) }]} />
             </ReactLenis>
         </ThemeProvider>
     );