diff --git a/.replit b/.replit
index e2b98af..e3425a6 100644
--- a/.replit
+++ b/.replit
@@ -15,10 +15,6 @@ run = ["npm", "run", "start"]
 localPort = 5000
 externalPort = 80
 
-[[ports]]
-localPort = 33305
-externalPort = 3002
-
 [[ports]]
 localPort = 34033
 externalPort = 3001
@@ -27,6 +23,10 @@ externalPort = 3001
 localPort = 35637
 externalPort = 3000
 
+[[ports]]
+localPort = 46809
+externalPort = 3002
+
 [env]
 PORT = "5000"
 
diff --git a/attached_assets/image_1758902218391.png b/attached_assets/image_1758902218391.png
new file mode 100644
index 0000000..401b28d
Binary files /dev/null and b/attached_assets/image_1758902218391.png differ
diff --git a/client/src/pages/FolxStadlPage.tsx b/client/src/pages/FolxStadlPage.tsx
index 62ced0e..74ec0a2 100644
--- a/client/src/pages/FolxStadlPage.tsx
+++ b/client/src/pages/FolxStadlPage.tsx
@@ -127,6 +127,11 @@ export default function FolxStadlPage() {
                     GIPFELSTAMMTISCH
                     <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#da234d] transition-all duration-300 group-hover:w-full"></span>
                   </Link>
+                  <Link href="/live" className="relative text-red-500 hover:text-red-400 transition-colors group font-bold flex items-center space-x-1">
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-red-400 via-red-500 to-red-600 transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
                 </nav>
                 
                 <div className="relative">
@@ -193,6 +198,14 @@ export default function FolxStadlPage() {
                   >
                     GIPFELSTAMMTISCH
                   </Link>
+                  <Link 
+                    href="/live" 
+                    className="text-red-500 hover:text-red-400 transition-colors font-bold py-1 border-l-2 border-transparent hover:border-red-500 pl-3 flex items-center space-x-2"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                  </Link>
                 </nav>
               </div>
               
diff --git a/client/src/pages/GeschichteLiedPage.tsx b/client/src/pages/GeschichteLiedPage.tsx
index 8844202..3260953 100644
--- a/client/src/pages/GeschichteLiedPage.tsx
+++ b/client/src/pages/GeschichteLiedPage.tsx
@@ -129,6 +129,11 @@ export default function GeschichteLiedPage() {
                     GIPFELSTAMMTISCH
                     <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#da234d] transition-all duration-300 group-hover:w-full"></span>
                   </Link>
+                  <Link href="/live" className="relative text-red-500 hover:text-red-400 transition-colors group font-bold flex items-center space-x-1">
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-red-400 via-red-500 to-red-600 transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
                 </nav>
                 
                 <div className="relative">
@@ -195,6 +200,14 @@ export default function GeschichteLiedPage() {
                   >
                     GIPFELSTAMMTISCH
                   </Link>
+                  <Link 
+                    href="/live" 
+                    className="text-red-500 hover:text-red-400 transition-colors font-bold py-1 border-l-2 border-transparent hover:border-red-500 pl-3 flex items-center space-x-2"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                  </Link>
                 </nav>
               </div>
               
diff --git a/client/src/pages/GipfelstammtischPage.tsx b/client/src/pages/GipfelstammtischPage.tsx
index 64ea892..af65e31 100644
--- a/client/src/pages/GipfelstammtischPage.tsx
+++ b/client/src/pages/GipfelstammtischPage.tsx
@@ -129,6 +129,11 @@ export default function GipfelstammtischPage() {
                     GIPFELSTAMMTISCH
                     <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#da234d] transition-all duration-300 group-hover:w-full"></span>
                   </Link>
+                  <Link href="/live" className="relative text-red-500 hover:text-red-400 transition-colors group font-bold flex items-center space-x-1">
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-red-400 via-red-500 to-red-600 transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
                 </nav>
                 
                 <div className="relative">
@@ -195,6 +200,14 @@ export default function GipfelstammtischPage() {
                   >
                     GIPFELSTAMMTISCH
                   </Link>
+                  <Link 
+                    href="/live" 
+                    className="text-red-500 hover:text-red-400 transition-colors font-bold py-1 border-l-2 border-transparent hover:border-red-500 pl-3 flex items-center space-x-2"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                  </Link>
                 </nav>
               </div>
               
diff --git a/client/src/pages/LivePage.tsx b/client/src/pages/LivePage.tsx
index 5d96d9e..1769a97 100644
--- a/client/src/pages/LivePage.tsx
+++ b/client/src/pages/LivePage.tsx
@@ -1,7 +1,8 @@
 import { useState, useEffect, useRef } from 'react';
-import { ChevronLeft, Maximize, Volume2, VolumeX, Radio } from 'lucide-react';
+import { ChevronLeft, Maximize, Volume2, VolumeX, Radio, Menu, X, Search } from 'lucide-react';
 import { Link } from 'wouter';
 import { Button } from '@/components/ui/button';
+import { Input } from '@/components/ui/input';
 import { useQuery } from '@tanstack/react-query';
 import VideoCard from '@/components/video-card';
 import AdSenseAd from '@/components/adsense-ad';
@@ -20,6 +21,8 @@ export default function LivePage() {
   const [volume, setVolume] = useState(1);
   const [isMuted, setIsMuted] = useState(false);
   const [error, setError] = useState<string | null>(null);
+  const [isMobileMenuOpen, setIsMobileMenuOpen] = useState(false);
+  const [searchQuery, setSearchQuery] = useState("");
 
   // HLS stream URL
   const streamUrl = 'https://cdne.folxplay.tv/fxt/streams/ch-4/master.m3u8';
@@ -277,21 +280,139 @@ export default function LivePage() {
       <div className="bg-bunny-darker border-b border-white/10">
         <div className="container mx-auto px-4 py-4">
           <div className="flex items-center justify-between">
-            <Link href="/" className="flex items-center space-x-3 hover:opacity-80 transition-opacity">
-              <Button variant="ghost" size="sm" className="text-white hover:bg-white/10">
-                <ChevronLeft className="w-4 h-4 mr-2" />
-                Back
-              </Button>
-            </Link>
-            
-            <div className="flex items-center space-x-3">
-              <div className="flex items-center space-x-2">
-                <div className="w-3 h-3 bg-red-500 rounded-full animate-pulse"></div>
-                <span className="text-red-500 font-bold text-sm uppercase tracking-wide">LIVE</span>
+            {/* Left side - Logo */}
+            <div className="flex items-center space-x-6 flex-1">
+              <Link href="/" className="flex items-center space-x-3 hover:opacity-80 transition-opacity py-4">
+                <div className="w-10 h-10 bg-[#da234d] rounded-lg flex items-center justify-center shadow-lg">
+                  <div className="w-0 h-0 border-l-[11px] border-l-white border-y-[8px] border-y-transparent ml-1"></div>
+                </div>
+                <h1 className="text-2xl font-bold text-white tracking-wide">video.folx.tv</h1>
+              </Link>
+            </div>
+
+            {/* Right side - Navigation + Search */}
+            <div className="flex items-center gap-4">
+              {/* Desktop navigation */}
+              <div className="hidden md:flex items-center space-x-6">
+                <nav className="flex space-x-6">
+                  <Link href="/" className="relative text-bunny-light hover:text-white transition-colors group">
+                    Startseite
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#da234d] transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
+                  <Link href="/folx-stadl" className="relative text-bunny-light hover:text-white transition-colors group">
+                    FOLX STADL
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#da234d] transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
+                  <Link href="/geschichte-lied" className="relative text-bunny-light hover:text-white transition-colors group">
+                    DIE GESCHICHTE DES LIEDES
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#da234d] transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
+                  <Link href="/gipfelstammtisch" className="relative text-bunny-light hover:text-white transition-colors group">
+                    GIPFELSTAMMTISCH
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#da234d] transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
+                  <Link href="/live" className="relative text-red-500 hover:text-red-400 transition-colors group font-bold flex items-center space-x-1">
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-red-400 via-red-500 to-red-600 transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
+                </nav>
+                
+                <div className="relative">
+                  <Input
+                    type="search"
+                    placeholder="Suchen..."
+                    value={searchQuery}
+                    onChange={(e) => setSearchQuery(e.target.value)}
+                    className="bg-white border border-gray-300 rounded-lg px-4 py-1.5 pl-10 text-sm text-gray-900 placeholder-gray-500 focus:outline-none focus:border-[#da234d] transition-colors w-56"
+                  />
+                  <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-gray-400 w-4 h-4" />
+                </div>
               </div>
+
+              {/* Mobile menu button */}
+              <button
+                onClick={() => setIsMobileMenuOpen(!isMobileMenuOpen)}
+                className="md:hidden p-2 rounded-lg bg-white/10 hover:bg-white/20 transition-colors"
+                data-testid="button-mobile-menu-live"
+              >
+                {isMobileMenuOpen ? (
+                  <X className="w-6 h-6 text-white" />
+                ) : (
+                  <Menu className="w-6 h-6 text-white" />
+                )}
+              </button>
             </div>
           </div>
         </div>
+
+        {/* Mobile menu dropdown */}
+        {isMobileMenuOpen && (
+          <div className="md:hidden border-t border-white/20 bg-bunny-dark/95 backdrop-blur-md">
+            <div className="px-6 py-4">
+              {/* Navigation Section */}
+              <div className="mb-6">
+                <h3 className="text-white text-xs font-semibold uppercase tracking-wider mb-3 opacity-70">Navigation</h3>
+                <nav className="flex flex-col space-y-4">
+                  <Link 
+                    href="/" 
+                    className="text-bunny-light hover:text-white transition-colors font-medium py-1 border-l-2 border-transparent hover:border-[#da234d] pl-3"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    Startseite
+                  </Link>
+                  <Link 
+                    href="/folx-stadl" 
+                    className="text-bunny-light hover:text-white transition-colors font-medium py-1 border-l-2 border-transparent hover:border-[#da234d] pl-3"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    FOLX STADL
+                  </Link>
+                  <Link 
+                    href="/geschichte-lied" 
+                    className="text-bunny-light hover:text-white transition-colors font-medium py-1 border-l-2 border-transparent hover:border-[#da234d] pl-3"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    DIE GESCHICHTE DES LIEDES
+                  </Link>
+                  <Link 
+                    href="/gipfelstammtisch" 
+                    className="text-bunny-light hover:text-white transition-colors font-medium py-1 border-l-2 border-transparent hover:border-[#da234d] pl-3"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    GIPFELSTAMMTISCH
+                  </Link>
+                  <Link 
+                    href="/live" 
+                    className="text-red-500 hover:text-red-400 transition-colors font-bold py-1 border-l-2 border-transparent hover:border-red-500 pl-3 flex items-center space-x-2"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                  </Link>
+                </nav>
+              </div>
+              
+              {/* Separator */}
+              <div className="border-t border-white/10 mb-4"></div>
+              
+              {/* Search Section */}
+              <div>
+                <h3 className="text-white text-xs font-semibold uppercase tracking-wider mb-3 opacity-70">Suchen</h3>
+                <div className="relative">
+                  <Input
+                    type="search"
+                    placeholder="Suchen..."
+                    value={searchQuery}
+                    onChange={(e) => setSearchQuery(e.target.value)}
+                    className="bg-white/10 border border-white/20 rounded-lg px-4 py-2.5 pl-10 text-sm text-white placeholder-white/60 focus:outline-none focus:border-[#da234d] focus:bg-white/15 transition-all w-full"
+                  />
+                  <Search className="absolute left-3 top-1/2 transform -translate-y-1/2 text-white/60 w-4 h-4" />
+                </div>
+              </div>
+            </div>
+          </div>
+        )}
       </div>
 
       <div className="container mx-auto px-4 py-6">
diff --git a/client/src/pages/VideoPage.tsx b/client/src/pages/VideoPage.tsx
index 2522008..550eb7b 100644
--- a/client/src/pages/VideoPage.tsx
+++ b/client/src/pages/VideoPage.tsx
@@ -396,6 +396,11 @@ export default function VideoPage() {
                     GIPFELSTAMMTISCH
                     <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-[#da234d] transition-all duration-300 group-hover:w-full"></span>
                   </Link>
+                  <Link href="/live" className="relative text-red-500 hover:text-red-400 transition-colors group font-bold flex items-center space-x-1">
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                    <span className="absolute bottom-0 left-0 w-0 h-0.5 bg-gradient-to-r from-red-400 via-red-500 to-red-600 transition-all duration-300 group-hover:w-full"></span>
+                  </Link>
                 </nav>
                 
                 <div className="relative">
@@ -462,6 +467,14 @@ export default function VideoPage() {
                   >
                     GIPFELSTAMMTISCH
                   </Link>
+                  <Link 
+                    href="/live" 
+                    className="text-red-500 hover:text-red-400 transition-colors font-bold py-1 border-l-2 border-transparent hover:border-red-500 pl-3 flex items-center space-x-2"
+                    onClick={() => setIsMobileMenuOpen(false)}
+                  >
+                    <span className="w-2 h-2 bg-red-500 rounded-full animate-pulse"></span>
+                    <span>LIVE</span>
+                  </Link>
                 </nav>
               </div>