diff --git a/src/app/(auth)/login/page.jsx b/src/app/(auth)/login/page.jsx
deleted file mode 100644
index 51359e2..0000000
--- a/src/app/(auth)/login/page.jsx
+++ /dev/null
@@ -1,58 +0,0 @@
-import Link from 'next/link'
-
-import { Button } from '@/components/Button'
-import { TextField } from '@/components/Fields'
-import { Logo } from '@/components/Logo'
-import { SlimLayout } from '@/components/SlimLayout'
-
-export const metadata = {
-  title: 'Sign In',
-}
-
-export default function Login() {
-  return (
-    <SlimLayout>
-      <div className="flex">
-        <Link href="/" aria-label="Home">
-          <Logo className="h-10 w-auto" />
-        </Link>
-      </div>
-      <h2 className="mt-20 text-lg font-semibold text-gray-800">
-        Sign in to your account
-      </h2>
-      <p className="mt-2 text-sm text-gray-700">
-        Don’t have an account?{' '}
-        <Link
-          href="/register"
-          className="font-medium text-blue-600 hover:underline"
-        >
-          Sign up
-        </Link>{' '}
-        for a free trial.
-      </p>
-      <form action="#" className="mt-10 grid grid-cols-1 gap-y-8">
-        <TextField
-          label="Email address"
-          name="email"
-          type="email"
-          autoComplete="email"
-          required
-        />
-        <TextField
-          label="Password"
-          name="password"
-          type="password"
-          autoComplete="current-password"
-          required
-        />
-        <div>
-          <Button type="submit" variant="solid" color="blue" className="w-full">
-            <span>
-              Sign in <span aria-hidden="true">&rarr;</span>
-            </span>
-          </Button>
-        </div>
-      </form>
-    </SlimLayout>
-  )
-}
diff --git a/src/app/(auth)/register/page.jsx b/src/app/(auth)/register/page.jsx
deleted file mode 100644
index dc06b78..0000000
--- a/src/app/(auth)/register/page.jsx
+++ /dev/null
@@ -1,87 +0,0 @@
-import Link from 'next/link'
-
-import { Button } from '@/components/Button'
-import { SelectField, TextField } from '@/components/Fields'
-import { Logo } from '@/components/Logo'
-import { SlimLayout } from '@/components/SlimLayout'
-
-export const metadata = {
-  title: 'Sign Up',
-}
-
-export default function Register() {
-  return (
-    <SlimLayout>
-      <div className="flex">
-        <Link href="/" aria-label="Home">
-          <Logo className="h-10 w-auto" />
-        </Link>
-      </div>
-      <h2 className="mt-20 text-lg font-semibold text-gray-800">
-        Get started for free
-      </h2>
-      <p className="mt-2 text-sm text-gray-700">
-        Already registered?{' '}
-        <Link
-          href="/login"
-          className="font-medium text-blue-600 hover:underline"
-        >
-          Sign in
-        </Link>{' '}
-        to your account.
-      </p>
-      <form
-        action="#"
-        className="mt-10 grid grid-cols-1 gap-x-6 gap-y-8 sm:grid-cols-2"
-      >
-        <TextField
-          label="First name"
-          name="first_name"
-          type="text"
-          autoComplete="given-name"
-          required
-        />
-        <TextField
-          label="Last name"
-          name="last_name"
-          type="text"
-          autoComplete="family-name"
-          required
-        />
-        <TextField
-          className="col-span-full"
-          label="Email address"
-          name="email"
-          type="email"
-          autoComplete="email"
-          required
-        />
-        <TextField
-          className="col-span-full"
-          label="Password"
-          name="password"
-          type="password"
-          autoComplete="new-password"
-          required
-        />
-        <SelectField
-          className="col-span-full"
-          label="How did you hear about us?"
-          name="referral_source"
-        >
-          <option>AltaVista search</option>
-          <option>Super Bowl commercial</option>
-          <option>Our route 34 city bus ad</option>
-          <option>The “Never Use This” podcast</option>
-        </SelectField>
-        <div className="col-span-full">
-          <Button type="submit" variant="solid" color="blue" className="w-full">
-            <span>
-              Sign up <span aria-hidden="true">&rarr;</span>
-            </span>
-          </Button>
-        </div>
-      </form>
-    </SlimLayout>
-  )
-}
diff --git a/src/app/contact/page.jsx b/src/app/contact/page.jsx
deleted file mode 100644
index 018d0bd..0000000
--- a/src/app/contact/page.jsx
+++ /dev/null
@@ -1,15 +0,0 @@
-import { ContactHero } from "@/components/ContactHero"
-import { Header } from "@/components/Header"
-import { Footer } from "@/components/Footer"
-
-export default function Contact() {
-  return (
-    <>
-      <Header />
-      <main>
-        <ContactHero />
-      </main>
-      <Footer />
-    </>
-  )
-}
diff --git a/src/app/dahabiyas/page.jsx b/src/app/dahabiyas/page.jsx
deleted file mode 100644
index 1f3293c..0000000
--- a/src/app/dahabiyas/page.jsx
+++ /dev/null
@@ -1,27 +0,0 @@
-import { CallToAction3 } from '@/components/CallToAction3'
-import { Footer } from '@/components/Footer'
-import { Header } from '@/components/Header'
-import Daha1 from '@/components/Daha1'
-import Daha2 from '@/components/Daha2'
-import Veda1 from '@/components/Veda1'
-import Veda2 from '@/components/Veda2'
-import Veda3 from '@/components/Veda3'
-import Veda4 from '@/components/Veda4'
-
-export default function Dahabiyas() {
-  return (
-    <>
-      <Header />
-      <main>
-        <Daha1 />
-        <Daha2 />
-        <Veda1 />
-        <Veda2 />
-        <Veda3 />
-        <Veda4 />
-        <CallToAction3 />
-      </main>
-      <Footer />
-    </>
-  )
-}
diff --git a/src/app/experiences/page.jsx b/src/app/experiences/page.jsx
deleted file mode 100644
index dfc5d04..0000000
--- a/src/app/experiences/page.jsx
+++ /dev/null
@@ -1,29 +0,0 @@
-import { CallToAction3 } from '@/components/CallToAction3'
-import { Footer } from '@/components/Footer'
-import { Header } from '@/components/Header'
-import Exp from '@/components/Exp'
-import { Community } from '@/components/Community'
-import { Retreats } from '@/components/Retreats'
-import { Events } from '@/components/Events'
-import { Nomads } from '@/components/Nomads'
-import { Experience } from '@/components/Exp2'
-import FFVid from '@/components/FreeflowVideo'
-
-export default function Experiences() {
-  return (
-    <>
-      <Header />
-      <main>
-      <Experience/>
-      <Community />
-        <Retreats />
-        <Events />
-        <Nomads />
-        <FFVid/>
-        <Exp/>
-        <CallToAction3 />
-      </main>
-      <Footer />
-    </>
-  )
-}
\ No newline at end of file
diff --git a/src/app/gallery/page.jsx b/src/app/gallery/page.jsx
deleted file mode 100644
index 5741c02..0000000
--- a/src/app/gallery/page.jsx
+++ /dev/null
@@ -1,20 +0,0 @@
-import { CallToAction3 } from '@/components/CallToAction3'
-import { Footer } from '@/components/Footer'
-import { Header } from '@/components/Header'
-import Story from '@/components/Story'
-import Story2 from '@/components/Story2'
-import Team from '@/components/Team'
-import QuiltedImageList from '@/components/Gallery'
-
-
-export default function OurStory() {
-  return (
-    <>
-      <Header />
-      <main>
-        <QuiltedImageList />
-      </main>
-      <Footer />
-    </>
-  )
-}
diff --git a/src/app/itinerary/page.jsx b/src/app/itinerary/page.jsx
deleted file mode 100644
index a751276..0000000
--- a/src/app/itinerary/page.jsx
+++ /dev/null
@@ -1,19 +0,0 @@
-import { CallToAction3 } from '@/components/CallToAction3'
-import { Footer } from '@/components/Footer'
-import { Header } from '@/components/Header'
-import Iti1 from '@/components/Iti1'
-import Timeline from '@/components/Timeline'
-
-export default function Itinerary() {
-  return (
-    <>
-      <Header />
-      <main>
-        <Iti1 />
-        <Timeline />
-        <CallToAction3 />
-      </main>
-      <Footer />
-    </>
-  )
-}
\ No newline at end of file
diff --git a/src/app/layout.jsx b/src/app/layout.jsx
index 64ff359..7732f30 100644
--- a/src/app/layout.jsx
+++ b/src/app/layout.jsx
@@ -1,6 +1,7 @@
 import { Inter, Lexend } from 'next/font/google'
 import clsx from 'clsx'
 
+import BottomAudioPlayer from '@/components/ui/AudioPlayerBar'
 import '@/styles/tailwind.css'
 
 export const metadata = {
@@ -34,7 +35,10 @@ export default function RootLayout({ children }) {
         lexend.variable,
       )}
     >
-      <body className="flex h-full flex-col pt-20">{children}</body>
+            <body className="flex h-full flex-col pt-20">
+        {children}
+        <BottomAudioPlayer />
+      </body>
     </html>
   )
 }
diff --git a/src/app/page.jsx b/src/app/page.jsx
index 4d4f92a..33d56a7 100644
--- a/src/app/page.jsx
+++ b/src/app/page.jsx
@@ -2,7 +2,6 @@
 import { Footer } from '@/components/Footer'
 import { Header } from '@/components/Header'
 import { Hero } from '@/components/Hero'
-import { AudioPlayerBar } from '@/components/ui/AudioPlayerBar'
 
 
 
diff --git a/src/app/story/page.jsx b/src/app/story/page.jsx
deleted file mode 100644
index 3a0b1df..0000000
--- a/src/app/story/page.jsx
+++ /dev/null
@@ -1,22 +0,0 @@
-import { CallToAction3 } from '@/components/CallToAction3'
-import { Footer } from '@/components/Footer'
-import { Header } from '@/components/Header'
-import Story from '@/components/Story'
-import Story2 from '@/components/Story2'
-import Team from '@/components/Team'
-
-
-export default function OurStory() {
-  return (
-    <>
-      <Header />
-      <main>
-        <Story />
-        <Story2 />
-        <Team />
-        <CallToAction3 />
-      </main>
-      <Footer />
-    </>
-  )
-}
diff --git a/src/components/NavLink.jsx b/src/components/NavLink.jsx
index 3faf59b..eae12a4 100644
--- a/src/components/NavLink.jsx
+++ b/src/components/NavLink.jsx
@@ -4,7 +4,7 @@ export function NavLink({ href, children }) {
   return (
     <Link
       href={href}
-      className="inline-block rounded-lg px-2 py-1 text-sm text-white hover:bg-gold-600 hover:text-slate-900"
+      className="inline-block rounded-lg px-2 py-1 text-sm text-gold-900 hover:bg-gold-600 hover:text-slate-900"
     >
       {children}
     </Link>
diff --git a/src/components/ui/AudioPlayerBar.jsx b/src/components/ui/AudioPlayerBar.jsx
index 805fe82..0846f0c 100644
--- a/src/components/ui/AudioPlayerBar.jsx
+++ b/src/components/ui/AudioPlayerBar.jsx
@@ -1,3 +1,5 @@
+'use client';
+
 import AudioPlayerBar from '@kevtucker/react-audio-player-bar';
 
 function BottomAudioPlayer() {