diff --git a/app/layout.tsx b/app/layout.tsx
index bf16687..901350d 100644
--- a/app/layout.tsx
+++ b/app/layout.tsx
@@ -4,6 +4,7 @@ import "./globals.css";
 import { Header } from "@/components/header";
 import SessionProviderWrapper from "@/components/session-provider";
 import { Footer } from "@/components/footer";
+import { LanguageProvider } from "@/components/hooks/use-language";
 
 const geistSans = Geist({ variable: "--font-geist-sans", subsets: ["latin"] });
 const geistMono = Geist_Mono({
@@ -26,12 +27,14 @@ export default function RootLayout({
       <body
         className={`${geistSans.variable} ${geistMono.variable} antialiased min-h-screen flex flex-col`}
       >
-        <SessionProviderWrapper>
-          <Header />
-          <main className="flex-grow">{children}</main>
-          <div className="flex-grow mt-50" />
-        </SessionProviderWrapper>
-        <Footer />
+        <LanguageProvider>
+          <SessionProviderWrapper>
+            <Header />
+            <main className="flex-grow">{children}</main>
+            <div className="flex-grow mt-50" />
+          </SessionProviderWrapper>
+          <Footer />
+        </LanguageProvider>
       </body>
     </html>
   );
diff --git a/app/profile/[id]/page.tsx b/app/profile/[id]/page.tsx
index 09fe659..00e9e3a 100644
--- a/app/profile/[id]/page.tsx
+++ b/app/profile/[id]/page.tsx
@@ -3,6 +3,35 @@ import { Post } from "@/components/posts";
 import { posts } from "@/components/types/post";
 import { Button } from "@/components/ui/button";
 import { signOut, useSession } from "next-auth/react";
+import { useEffect, useState } from "react";
+
+const LanguageMenu = () => {
+  const [language, setLanguage] = useState("no");
+  useEffect(() => {
+    const lang = localStorage.getItem("language");
+    if (lang === "en") {
+      setLanguage("en");
+    }
+  }, []);
+
+  useEffect(() => {
+    localStorage.setItem("language", language);
+    window.dispatchEvent(new Event("storage"));
+  }, [language]);
+
+  return (
+    <div className="flex items-center gap-2">
+      <label className="flex items-center gap-1 text-sm">
+        <input
+          type="checkbox"
+          checked={language == "en"}
+          onChange={() => setLanguage(language == "en" ? "no" : "en")}
+        />
+        Bergenser-modus
+      </label>
+    </div>
+  );
+};
 
 export default function ProfilePage() {
   const { data: session } = useSession();
@@ -17,7 +46,7 @@ export default function ProfilePage() {
         <p className="mt-4">Navn: {user?.name}</p>
         <p>E-post: {user?.email}</p>
       </div>
-
+      <LanguageMenu />
       <div>
         <h2 className="text-2xl font-semibold">Mine arrangementer:</h2>
         {myEvents.length > 0 ? (
diff --git a/components/header.tsx b/components/header.tsx
index 53fb79b..6b35079 100644
--- a/components/header.tsx
+++ b/components/header.tsx
@@ -7,22 +7,23 @@ import { getInterestBySlug } from "./types/interests";
 import { getEventById } from "./types/post";
 import { useEffect, useState } from "react";
 import { AnimatedIcons } from "@/components/animation/animatedIcons";
+import useLanguage from "./hooks/use-language";
 
 export function Header() {
   const pathname = usePathname();
+  const notBergenser = useLanguage();
 
   const [bade, setBade] = useState(false);
   const [title, setTitle] = useState("...KOMPIS");
   const [ending, setEnding] = useState("kompis");
-  const [bergenser, setBergenser] = useState(false);
 
   useEffect(() => {
-    if (bergenser) {
-      setEnding("tjommi");
-    } else {
+    if (notBergenser) {
       setEnding("kompis");
+    } else {
+      setEnding("tjommi");
     }
-  }, [bergenser]);
+  }, [notBergenser]);
 
   useEffect(() => {
     if (pathname.startsWith("/hobbies/")) {
@@ -59,17 +60,8 @@ export function Header() {
           {title}
         </Link>
 
-        <div className="mt-4 md:mt-0 md:ml-auto flex items-center gap-2 flex-col">
+        <div className="mt-4 md:mt-0 md:ml-auto flex items-center gap-2 flex-col md:mr-6">
           <AuthButtons />
-          <label className="flex items-center gap-1 text-sm">
-            <input
-              type="checkbox"
-              id="toggle"
-              checked={bergenser}
-              onChange={() => setBergenser(!bergenser)}
-            />
-            Bergenser-modus
-          </label>
         </div>
       </div>
     </header>
diff --git a/components/hooks/use-language.tsx b/components/hooks/use-language.tsx
new file mode 100644
index 0000000..285845d
--- /dev/null
+++ b/components/hooks/use-language.tsx
@@ -0,0 +1,41 @@
+"use client";
+import {
+  type ReactNode,
+  createContext,
+  useContext,
+  useEffect,
+  useState,
+} from "react";
+
+const LanguageContext = createContext(true);
+
+const LanguageProvider = ({ children }: { children: ReactNode }) => {
+  const [isNorwegian, setIsNorwegian] = useState(true);
+
+  useEffect(() => {
+    const checkLanguageData = () => {
+      const lang = localStorage.getItem("language");
+      if (lang === "en") {
+        setIsNorwegian(false);
+      } else {
+        setIsNorwegian(true);
+      }
+    };
+    checkLanguageData();
+    window.addEventListener("storage", checkLanguageData);
+    return () => {
+      window.removeEventListener("storage", checkLanguageData);
+    };
+  }, []);
+
+  return (
+    <LanguageContext.Provider value={isNorwegian}>
+      {children}
+    </LanguageContext.Provider>
+  );
+};
+
+const useLanguage = (): boolean => useContext(LanguageContext);
+
+export { LanguageProvider };
+export default useLanguage;
