diff --git a/public/assets/LAP_logo_v3_transp.png b/public/assets/LapLogo_black_white.png
similarity index 100%
rename from public/assets/LAP_logo_v3_transp.png
rename to public/assets/LapLogo_black_white.png
diff --git a/public/assets/LapLogo_white_orange.png b/public/assets/LapLogo_white_orange.png
new file mode 100644
index 0000000..3fd93ab
Binary files /dev/null and b/public/assets/LapLogo_white_orange.png differ
diff --git a/src/components/layout/Section.svelte b/src/components/layout/Section.svelte
index 9d68af1..5008952 100644
--- a/src/components/layout/Section.svelte
+++ b/src/components/layout/Section.svelte
@@ -7,7 +7,7 @@
 
   const paddingClasses = {
     none: "py-0",
-    small: "py-8",
+    small: "py-4 md:py-8",
     normal: "py-12 max-md:py-8",
     large: "py-[clamp(3rem,8vw,6rem)] max-md:py-12",
   };
@@ -26,7 +26,7 @@
 
 <section
   {id}
-  class="w-full relative {paddingClasses[padding]} {className}"
+  class="w-full {paddingClasses[padding]} {className}"
   style={backgroundStyle ? `background: ${backgroundStyle};` : ""}
 >
   <div class="{fullWidth ? '' : 'max-w-[1200px]'} mx-auto px-(--site-padding)">
diff --git a/src/layout/Navbar.svelte b/src/layout/Navbar.svelte
index 8f9c88b..c29be24 100644
--- a/src/layout/Navbar.svelte
+++ b/src/layout/Navbar.svelte
@@ -10,7 +10,6 @@
 
   // Icon imports (Lucide)
   import Coffee from "lucide-svelte/icons/coffee";
-  import CalendarClock from "lucide-svelte/icons/calendar-clock";
   import Presentation from "lucide-svelte/icons/presentation";
   import Swords from "lucide-svelte/icons/swords";
   import Lectern from "lucide-svelte/icons/lectern";
@@ -20,19 +19,32 @@
   import Menu from "lucide-svelte/icons/menu";
   import X from "lucide-svelte/icons/x";
 
-  let mobileMenuOpen = false;
-  let isClosing = false;
+  let mobileMenuOpen = $state(false);
+  let isClosing = $state(false);
+  let currentPath = $state(getPath());
+
+  // Update currentPath when navigation occurs
+  $effect(() => {
+    const handleNavigation = () => {
+      currentPath = getPath();
+    };
+
+    window.addEventListener("popstate", handleNavigation);
+    return () => window.removeEventListener("popstate", handleNavigation);
+  });
 
   // Reactively control body scroll
-  $: if (typeof document !== 'undefined') {
-    if (mobileMenuOpen) {
-      document.body.style.overflow = 'hidden';
-      document.documentElement.style.overflow = 'hidden';
-    } else {
-      document.body.style.overflow = '';
-      document.documentElement.style.overflow = '';
+  $effect(() => {
+    if (typeof document !== 'undefined') {
+      if (mobileMenuOpen) {
+        document.body.style.overflow = 'hidden';
+        document.documentElement.style.overflow = 'hidden';
+      } else {
+        document.body.style.overflow = '';
+        document.documentElement.style.overflow = '';
+      }
     }
-  }
+  });
 
   onDestroy(() => {
     if (typeof document !== 'undefined') {
@@ -56,6 +68,7 @@
 
   function handleNavigation(path, options = {}) {
     navigate(path, options);
+    currentPath = getPath();
     closeMobileMenu();
   }
 
@@ -95,76 +108,87 @@
 
 <Section className="text-white" background="off-black" padding="small">
   {#if $text && Object.keys($text).length > 0}
-  <div class="flex items-center justify-end">
-    <!-- Desktop Navigation -->
-    <nav class="z-10 hidden md:flex gap-4 justify-end text-xl">
-        <Dropdown
-          name={$text.about || 'Meist'}
-          buttonClass="rounded-[5px]"
-          buttonHoverStyle="background-color:var(--orange); color:var(--black)"
-          panelClassName="bg-[var(--off-black)]"
-        >
-          <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/lapikutest")}
-            >{$text.aboutPages.info}</Button
+    <div class="flex items-center w-full relative min-h-16 md:min-h-0">
+      <!-- Logo -->
+      {#if currentPath !== "/" && currentPath !== "/en"}
+        <div class="absolute left-1/2 -translate-x-1/2 top-1/2 -translate-y-1/2 md:relative md:left-auto md:translate-x-0 md:top-auto md:translate-y-0">
+          <Button onClick={() => handleNavigation("/")}>
+            <img src="assets/LapLogo_white_orange.png" alt="Lapikud Logo" class="h-16" />
+          </Button>
+        </div>
+      {/if}
+      
+      <div class="flex items-center justify-end ml-auto w-full md:w-auto">
+        <!-- Desktop Navigation -->
+        <nav class="z-10 hidden md:flex gap-4 justify-end text-xl">
+          <Dropdown
+            name={$text.about || 'Meist'}
+            buttonClass="rounded-[5px]"
+            buttonHoverStyle="background-color:var(--orange); color:var(--black)"
+            panelClassName="bg-[var(--off-black)]"
           >
-          <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/tudengile")}
-            ><Bot />{$text.aboutPages.join}</Button
+            <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/lapikutest")}
+              >{$text.aboutPages.info}</Button
+            >
+            <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/tudengile")}
+              ><Bot />{$text.aboutPages.join}</Button
+            >
+            <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/mentorid")}
+              ><HandHeart />{$text.aboutPages.mentors}</Button
+            >
+            <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/juhatus")}
+              ><Lectern />{$text.aboutPages.board}</Button
+            >
+          </Dropdown>
+          <Dropdown
+            name={$text.events}
+            buttonClass="rounded-[5px]"
+            buttonHoverStyle="background-color:var(--orange); color:var(--black)"
+            panelClassName="bg-[var(--off-black)]"
           >
-          <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/mentorid")}
-            ><HandHeart />{$text.aboutPages.mentors}</Button
+            <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/koolitused")}
+              ><Presentation />{$text.eventsPages.workshops}</Button
+            >
+            <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/rebased")}
+              ><Swords />{$text.eventsPages.fresh}</Button
+            >
+            <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("https://asikarikas.ee/", { external: true })}
+              ><Trophy />ASI Karikas</Button
+            >
+            <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("https://remondikohvik.lapikud.ee/", { external: true })}
+              ><Coffee />{$text.eventsPages.repair}</Button
+            >
+          </Dropdown>
+          <Button buttonHoverStyle="background-color:var(--orange); color:var(--black)" class="rounded-[5px]" onClick={() => navigate("/kontakt")}
+            >{$text.contact}
+          </Button>
+          <Button buttonHoverStyle="background-color:var(--orange); color:var(--black)" class="rounded-[5px]" onClick={() => navigate("/helpdesk")}
+            >{$text.helpdesk}
+          </Button>
+          
+          <!-- Language Switcher -->
+          <Button 
+            class="rounded-[5px] px-3 py-1 text-sm ml-2"
+            style="color: var(--orange)"
+            buttonHoverStyle="background-color:var(--orange); color:var(--black)"
+            onClick={() => switchLanguageRoute($currentLang === 'est' ? 'en' : 'est')}
           >
-          <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/juhatus")}
-            ><Lectern />{$text.aboutPages.board}</Button
-          >
-        </Dropdown>
-        <Dropdown
-          name={$text.events}
-          buttonClass="rounded-[5px]"
-          buttonHoverStyle="background-color:var(--orange); color:var(--black)"
-          panelClassName="bg-[var(--off-black)]"
-        >
-          <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/koolitused")}
-            ><Presentation />{$text.eventsPages.workshops}</Button
-          >
-          <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("/rebased")}
-            ><Swords />{$text.eventsPages.fresh}</Button
-          >
-          <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("https://asikarikas.ee/", { external: true })}
-            ><Trophy />ASI Karikas</Button
-          >
-          <Button class="rounded-[5px] bg-transparent" buttonHoverStyle="color:var(--orange)" onClick={() => navigate("https://remondikohvik.lapikud.ee/", { external: true })}
-            ><Coffee />{$text.eventsPages.repair}</Button
-          >
-        </Dropdown>
-        <Button buttonHoverStyle="background-color:var(--orange); color:var(--black)" class="rounded-[5px]" onClick={() => navigate("/kontakt")}
-          >{$text.contact}
-        </Button>
-        <Button buttonHoverStyle="background-color:var(--orange); color:var(--black)" class="rounded-[5px]" onClick={() => navigate("/helpdesk")}
-          >{$text.helpdesk}
-        </Button>
-        
-        <!-- Language Switcher -->
-        <Button 
-          class="rounded-[5px] px-3 py-1 text-sm ml-2"
-          style="color: var(--orange)"
-          buttonHoverStyle="background-color:var(--orange); color:var(--black)"
-          onClick={() => switchLanguageRoute($currentLang === 'est' ? 'en' : 'est')}
-        >
-          {$currentLang === 'est' ? 'EN' : 'EST'}
-        </Button>
-    </nav>
+            {$currentLang === 'est' ? 'EN' : 'EST'}
+          </Button>
+      </nav>
 
-    <!-- Mobile Hamburger Button -->
-    <Button
-      onClick={toggleMobileMenu}
-      class="md:hidden ml-auto p-2 text-white transition-colors bg-transparent"
-      buttonHoverStyle="color: var(--orange)"
-      style="opacity: {mobileMenuOpen ? '0' : '1'}; pointer-events: {mobileMenuOpen ? 'none' : 'auto'};"
-      aria-label="Toggle menu"
-    >
-      <Menu size={32} />
-    </Button>
-  </div>
+      <!-- Mobile Hamburger Button - Fixed position -->
+      <Button
+        onClick={toggleMobileMenu}
+        class="md:hidden p-2 text-white transition-colors bg-transparent absolute right-0"
+        buttonHoverStyle="color: var(--orange)"
+        style="opacity: {mobileMenuOpen ? '0' : '1'}; pointer-events: {mobileMenuOpen ? 'none' : 'auto'};"
+        aria-label="Toggle menu"
+      >
+        <Menu size={32} />
+      </Button>
+    </div>
+    </div>
   {/if}
 </Section>
 
@@ -296,4 +320,4 @@
       </Stack>
     </Stack>
   </div>
-{/if}
+{/if}
\ No newline at end of file
diff --git a/src/routes/Home.svelte b/src/routes/Home.svelte
index 3519f77..3d9c94e 100644
--- a/src/routes/Home.svelte
+++ b/src/routes/Home.svelte
@@ -4,7 +4,6 @@
     Grid,
     Card,
     Center,
-    Container,
   } from "$components";
   import { onMount } from "svelte";
   import yaml from 'js-yaml';
@@ -29,7 +28,7 @@
 <Section background="orange">
   <Grid>
     <Center>
-      <img src="/assets/LAP_logo_v3_transp.png" alt="MTÜ Lapikud" class="max-w-md w-full h-auto" style="padding: var(--space-4);"/>
+      <img src="/assets/LapLogo_black_white.png" alt="MTÜ Lapikud" class="max-w-md w-full h-auto" style="padding: var(--space-4);"/>
     </Center>
     <p class="text-3xl leading-relaxed" style="padding: var(--space-4);">
       MTÜ Lapikud on Tallinna Tehnikaülikooli Tarkvaraarendusklubi, mis ühendab endisi