diff --git a/.github/workflows/main.yml b/.github/workflows/main.yml
index 17cf28fc..292cf8f5 100644
--- a/.github/workflows/main.yml
+++ b/.github/workflows/main.yml
@@ -19,7 +19,7 @@ jobs:
         script: |
           cd programming/VPlan_FR/
           
-          kill -INT (lsof -t nohup.out)  || true
+          # kill -INT (lsof -t nohup.out)  || true
           
           git checkout production
           git pull
@@ -34,8 +34,8 @@ jobs:
           sudo service apache2 restart
 
           cd ..
-          rm nohup.out || true
-          nohup venv/bin/python3 -m backend.load_plans --ignore-exceptions --never-raise-out-of-proxies -l DEBUG - i 300 > nohup.out 2> nohup.err < /dev/null &
+          # rm nohup.out || true
+          # nohup venv/bin/python3 -m backend.load_plans --ignore-exceptions --never-raise-out-of-proxies -l DEBUG - i 300 > nohup.out 2> nohup.err < /dev/null &
 
-          disown (lsof -t nohup.out) || true
+          # disown (lsof -t nohup.out) || true
           
diff --git a/.gitignore b/.gitignore
index 4665fcb2..9ea9b39c 100644
--- a/.gitignore
+++ b/.gitignore
@@ -163,6 +163,7 @@ cython_debug/
 
 client/node_modules
 backend/schools/private_data
+client/public/base_static/teachers
 creds.json
 proxies.json
 
diff --git a/README.md b/README.md
index a55c04a7..a11e5768 100644
--- a/README.md
+++ b/README.md
@@ -4,7 +4,7 @@
 
 # vplan.fr
 
-This repository contains the code of the website [vplan.fr](https://vplan.fr/), which is free to use and already supports many schools in (eastern) Germany! If you want to contribute to the project, [contact us](https://vplan.fr/#contact), [submit an issue](https://github.com/ArtrenH/VPlan_FR/issues/new) or [fork this repo](https://github.com/ArtrenH/VPlan_FR/fork) and create a pull request for changes.
+This repository contains the code of the website [vplan.fr](https://vplan.fr/), which is free to use and already supports many schools in (eastern) Germany! If you want to contribute to the project, [contact us](https://vplan.fr/#contact), [submit an issue](https://github.com/vplan-fr/VPlan_FR/issues/new) or [fork this repo](https://github.com/vplan-fr/VPlan_FR/fork) and create a pull request for changes.
 
 ![Preview Image of example school](readme_preview.png)
 
@@ -66,4 +66,4 @@ and in another terminal, the npm dev server using:
 - `cd client`
 - `npm run dev`
 
-If you have any more questions or need help with the setup, don't hesitate to [contact us](https://vplan.fr/#contact). :)
\ No newline at end of file
+If you have any more questions or need help with the setup, don't hesitate to [contact us](https://vplan.fr/#contact). :) 
diff --git a/client/public/base_static/images/landing_page/start_bg.webp b/client/public/base_static/images/landing_page/start_bg.webp
new file mode 100644
index 00000000..4e8566cd
Binary files /dev/null and b/client/public/base_static/images/landing_page/start_bg.webp differ
diff --git a/client/public/base_static/images/landing_page/vplanfr_form_view.png b/client/public/base_static/images/landing_page/vplanfr_form_view.png
new file mode 100644
index 00000000..a18b77f8
Binary files /dev/null and b/client/public/base_static/images/landing_page/vplanfr_form_view.png differ
diff --git a/client/public/base_static/images/landing_page/vplanfr_room_overview.png b/client/public/base_static/images/landing_page/vplanfr_room_overview.png
new file mode 100644
index 00000000..71fe1bc5
Binary files /dev/null and b/client/public/base_static/images/landing_page/vplanfr_room_overview.png differ
diff --git a/client/public/base_static/images/landing_page/vplanfr_room_view.png b/client/public/base_static/images/landing_page/vplanfr_room_view.png
new file mode 100644
index 00000000..c89c48ac
Binary files /dev/null and b/client/public/base_static/images/landing_page/vplanfr_room_view.png differ
diff --git a/client/public/base_static/images/landing_page/vplanfr_teacher_view.png b/client/public/base_static/images/landing_page/vplanfr_teacher_view.png
new file mode 100644
index 00000000..c2704743
Binary files /dev/null and b/client/public/base_static/images/landing_page/vplanfr_teacher_view.png differ
diff --git a/client/public/base_static/images/landing_page/vpmobil24_form_view.png b/client/public/base_static/images/landing_page/vpmobil24_form_view.png
new file mode 100644
index 00000000..37971cdb
Binary files /dev/null and b/client/public/base_static/images/landing_page/vpmobil24_form_view.png differ
diff --git a/client/public/base_static/images/vplan_fr_werbeplakat.png b/client/public/base_static/images/vplan_fr_werbeplakat.png
new file mode 100644
index 00000000..73f1eb4e
Binary files /dev/null and b/client/public/base_static/images/vplan_fr_werbeplakat.png differ
diff --git a/client/public/index.html b/client/public/index.html
index d39eaea2..b1774091 100644
--- a/client/public/index.html
+++ b/client/public/index.html
@@ -6,7 +6,7 @@
     <meta name="viewport" content="width=device-width, initial-scale=1.0">
 
     <!-- Website Info-Tags -->
-    <meta name="author" content="https://github.com/ArtrenH/VPlan_FR/graphs/contributors" />
+    <meta name="author" content="https://github.com/vplan-fr/VPlan_FR/graphs/contributors" />
     <meta http-equiv="Pragma" content="no-cache" />
     <meta name="robots" content="NOINDEX,NOFOLLOW" />
     <meta http-equiv="content-Language" content="de" />
diff --git a/client/src/App.svelte b/client/src/App.svelte
index 2275511a..973abf3a 100644
--- a/client/src/App.svelte
+++ b/client/src/App.svelte
@@ -2,6 +2,8 @@
     import Plan from "./components/Plan.svelte";
     import Weekplan from "./components/Weekplan.svelte";
     import Authentication from "./components/Authentication.svelte";
+    import LandingPage from "./components/LandingPage.svelte";
+    import LandingPageNavbar from "./components/LandingPageNavbar.svelte";
 	import Toast from './base_components/Toast.svelte';
     import Navbar from "./components/Navbar.svelte";
     import Settings from "./components/Settings.svelte";
@@ -24,6 +26,8 @@
     import {animateScroll} from 'svelte-scrollto-element';
     import Button from "./base_components/Button.svelte";
     import { fade } from "svelte/transition";
+    import FancyBackground from "./components/FancyBackground.svelte";
+    import NotFound from "./components/NotFound.svelte";
 
     const pad = (n, s = 2) => (`${new Array(s).fill(0)}${n}`).slice(-s);
     let school_num;
@@ -356,7 +360,6 @@
             history.go(1);
             return;
         }
-        if(new_location === "") {new_location = "plan";}
         navigate_page(new_location);
         if (new_location.startsWith("plan")) {
             refresh_plan_vars();
@@ -365,7 +368,6 @@
 
     let new_location = location.hash.slice(1);
     if(!((new_location === "login" || new_location === "register") && $logged_in)) {
-        if(new_location === "") {new_location = "plan";}
         if(new_location === "favorite") {
             load_favorite = true;
             new_location = "plan";
@@ -380,6 +382,12 @@
 
 {#if $logged_in}
     <Navbar />
+{:else if $current_page !== "login" && $current_page !== "register"}
+    <LandingPageNavbar />
+{/if}
+
+{#if $current_page === ""}
+    <FancyBackground />
 {/if}
 
 <Settings />
@@ -393,6 +401,8 @@
             <AboutUs />
         {:else if $current_page === "impressum"}
             <Impressum />
+        {:else if $current_page === ""}
+            <LandingPage></LandingPage>
         {:else if $logged_in}
             {#if $current_page.substring(0, 4) === "plan" || $current_page.substring(0, 8) === "weekplan"}
                 <h1 class="responsive-heading">{emoji} {greeting}</h1>
@@ -455,7 +465,10 @@
             {:else if $current_page === "school_manager"}
                 <SchoolManager bind:school_num bind:date bind:plan_type bind:plan_value />
             {:else if $current_page === "favorite"}
-                <span class="responsive-text">Lade deine Favoriten...</span>
+                <div style="display: flex; flex-direction: column; gap: 2rem; width: auto; min-height: 50vh; justify-content: center; align-items: center;">
+                    <div class="rotating"><span class="material-symbols-outlined fancy-text" style="font-size: max(3rem, 5vw)">sync</span></div>
+                    <span class="responsive-text" style="text-align: center;">Lade deine Favoriten...</span>
+                </div>
             {:else if $current_page === "favorites"}
                 <Favorites />
             {:else if $current_page === "pwa_install"}
@@ -463,10 +476,12 @@
             {:else if $current_page === "stats"}
                 <Stats />
             {:else}
-                <span class="responsive-text">Seite nicht gefunden!</span>
+                <NotFound />
             {/if}
-        {:else}
+        {:else if $current_page === "login" || $current_page === "register"}
             <Authentication></Authentication>
+        {:else}
+            <NotFound />
         {/if}
     </main>
     <Toast />
@@ -474,8 +489,9 @@
 <footer class:padding={footer_padding}>
     <Dropdown let:toggle small={true} transform_origin_x="100%" flipped={true}>
         <button slot="toggle_button" on:click={toggle}><span class="material-symbols-outlined">menu</span></button>
-        
+
         {#if !$logged_in}<button on:click={() => {navigate_page("login")}}>Login</button>{/if}
+        <button on:click={() => {navigate_page("")}}>Startseite</button>
         <button on:click={() => {navigate_page("impressum")}}>Impressum</button>
         <button on:click={() => {navigate_page("contact")}}>Kontakt</button>
         <button on:click={() => {navigate_page("about_us")}}>Über Uns</button>
@@ -484,6 +500,44 @@
 </footer>
 
 <style lang="scss">
+  .rotating {
+    animation: rotate 2s linear infinite;
+  }
+  @keyframes rotate {
+    from {
+      transform: rotate(0deg);
+    }
+    to {
+      transform: rotate(-360deg);
+    }
+  }
+  .fancy-text {
+    background: linear-gradient(310deg, #cc33ff, #3358ff, #33bbff);
+    color: transparent;
+    -webkit-background-clip: text;
+    background-clip: text;
+    background-size: 600% 600%;
+
+    -webkit-animation: colorScroll 3s ease infinite;
+    -moz-animation: colorScroll 3s ease infinite;
+    animation: colorScroll 3s ease infinite;
+  }
+
+  @-webkit-keyframes colorScroll {
+    0%{background-position:0% 50%}
+    50%{background-position:100% 50%}
+    100%{background-position:0% 50%}
+  }
+  @-moz-keyframes colorScroll {
+    0%{background-position:0% 50%}
+    50%{background-position:100% 50%}
+    100%{background-position:0% 50%}
+  }
+  @keyframes colorScroll {
+    0%{background-position:0% 50%}
+    50%{background-position:100% 50%}
+    100%{background-position:0% 50%}
+  }
     .plan-status {
         pointer-events: none;
         position: absolute;
@@ -504,11 +558,11 @@
             &[data-plan-type=cached] {
                 color: rgba(255, 255, 255, 0.5);
             }
-            
+
             &[data-plan-type=network_cached] {
                 color: #00db00;
             }
-            
+
             &[data-plan-type=network_uncached] {
                 color: #dbae00;
             }
@@ -523,6 +577,8 @@
     }
 
     #page-container {
+        max-width: 100%;
+        overflow-x: hidden;
         position: relative;
         min-height: calc(100vh - 56px);
         padding-bottom: 15px;
diff --git a/client/src/components/AboutUs.svelte b/client/src/components/AboutUs.svelte
index d562f99e..09e5c215 100644
--- a/client/src/components/AboutUs.svelte
+++ b/client/src/components/AboutUs.svelte
@@ -34,7 +34,7 @@
         <p class="responsive-text">
             Man kann uns mit unserem <button on:click={() => navigate_page("contact")} class="link-button" type="button">Kontaktformular</button> oder per Mail unter <a href="mailto:elanus4506@gmail.com">elanus4506@gmail.com</a> erreichen.
             <br>
-            Hier ist außerdem unser <a href="https://github.com/ArtrenH/VPlan_FR">Github-Repository</a>.
+            Hier ist außerdem unser <a href="https://github.com/vplan-fr/VPlan_FR">Github-Repository</a>.
         </p>
     </div>
 </main>
diff --git a/client/src/components/FancyBackground.svelte b/client/src/components/FancyBackground.svelte
new file mode 100644
index 00000000..d1e35ebb
--- /dev/null
+++ b/client/src/components/FancyBackground.svelte
@@ -0,0 +1,85 @@
+<script>
+    let blob;
+    let clientX = 0;
+    let clientY = 0;
+    function moveBlob(event) {
+        if(window.screen.width < 900) {return;}
+        clientX = event["clientX"];
+        clientY = event["clientY"];
+
+        blob.animate({
+            left: `${clientX + document.documentElement.scrollLeft}px`,
+            top: `${clientY + document.documentElement.scrollTop}px`
+        }, { duration: 2000, fill: "forwards" });
+    }
+    function moveScrollBlob(event) {
+        if(window.screen.width >= 900) {return;}
+        blob.animate({
+            left: `${window.screen.width/2 + document.documentElement.scrollLeft}px`,
+            top: `${window.screen.height/2 + document.documentElement.scrollTop}px`
+        }, { duration: 6000, fill: "forwards" });
+    }
+</script>
+
+<svelte:body on:mousemove={moveBlob}></svelte:body>
+<svelte:window on:scroll={moveScrollBlob}></svelte:window>
+<svelte:head>
+    <style>
+        body {
+            position: relative;
+        }
+    </style>
+</svelte:head>
+
+<div id="bg"></div>
+
+<div id="blob-container">
+    <div id="blob" bind:this={blob}></div>
+</div>
+
+<style lang="scss">
+    #bg {
+        height: 100%;
+        width: 100%;
+        position: absolute;
+        z-index: -1;
+        background-image:  radial-gradient(#666666 0.5px, transparent 0.5px), radial-gradient(#666666 0.5px, transparent 0.5px);
+        background-repeat: repeat;
+        background-size: 20px 20px;
+        background-position: 0 0, 10px 10px;
+    }
+
+    #blob {
+        height: 34vmax;
+        aspect-ratio: 1;
+        position: absolute;
+        left: 50%;
+        top: 50%;
+        translate: -50% -50%;
+        border-radius: 50%;
+        background: white linear-gradient(to right, var(--accent-color), blue);
+        animation: rotate 20s infinite;
+        opacity: 0.6;
+        filter:blur(3vmax);
+    }
+    #blob-container {
+      height: 100%;
+      width: 100%;
+      position: absolute;
+      z-index: -2;
+      overflow: hidden;
+    }
+    @keyframes rotateBlob {
+        from {
+            rotate: 0deg;
+        }
+
+        50% {
+            scale: 1 1.5;
+        }
+
+        to {
+            rotate: 360deg;
+        }
+    }
+</style>
\ No newline at end of file
diff --git a/client/src/components/LandingPage.svelte b/client/src/components/LandingPage.svelte
new file mode 100644
index 00000000..ee2396bf
--- /dev/null
+++ b/client/src/components/LandingPage.svelte
@@ -0,0 +1,491 @@
+<script>
+    import { fade } from 'svelte/transition';
+    import { onMount } from "svelte";
+    import { title, register_button_visible } from "../stores";
+    import Button from "../base_components/Button.svelte";
+    import {navigate_page} from "../utils.js";
+
+    onMount(() => {
+        location.hash = "";
+        title.set("Startseite");
+        // console.log("Mounted AboutUs.svelte");
+    });
+
+    let intersectionObserver;
+    let lockVisible = false;
+    let mottos = [
+        "vplan.fr, it's better... For real",
+        "Yippee 🎉",
+        "Deine Träume gehen in Erfüllung",
+        "30 day no money back guarantee",
+        "Ganz Mühlhausen fährt drauf ab (Angaben ohne Gewähr)",
+        "Jetzt schon (oder eines Tages) an deiner Schule"
+    ]
+    let currentMottoIndex = 0;
+    let startSection;
+    let realSliderValue = 10;
+    let compareSliderValue;
+    $: compareSliderValue = (Math.max(Math.min(realSliderValue, 100), 0)).toString();
+    let lastKnownScrollPosition = 0;
+    let rotating_text;
+
+    setTimeout(updateCurrentMottoIndex, 5000);
+    function updateCurrentMottoIndex() {
+        currentMottoIndex = (currentMottoIndex+1) % mottos.length;
+        setTimeout(updateCurrentMottoIndex, 5000);
+    }
+
+    function ensureIntersectionObserver() {
+        if (intersectionObserver) return;
+
+        intersectionObserver = new IntersectionObserver(
+            (entries) => {
+                entries.forEach(entry => {
+                    const eventName = entry.isIntersecting ? 'enterViewport' : 'exitViewport';
+                    entry.target.dispatchEvent(new CustomEvent(eventName));
+                });
+            }
+        );
+    }
+
+    function update3DRotation(event) {
+        if(!$register_button_visible || window.screen.width < 900) return;
+        const middleX = startSection.offsetLeft + startSection.offsetWidth / 2;
+        const middleY = startSection.offsetTop + startSection.offsetHeight / 2;
+        const offsetX = ((event.clientX + document.documentElement.scrollLeft - middleX) / middleX) * 45;
+        const offsetY = (((event.clientY + document.documentElement.scrollTop - 30) - middleY) / middleY) * 45;
+
+        startSection.animate({
+            transform: `perspective(5000px) rotateY(${Math.max(Math.min(offsetX, 35), -35)}deg) rotateX(${Math.max(Math.min(offsetY, 35), -35) * -1}deg)`
+        }, { duration: 1000, fill: "forwards" });
+    }
+
+    function update3DRotationScroll(event) {
+        if(!$register_button_visible || window.screen.width >= 900) return;
+
+        const middleY = startSection.offsetTop + startSection.offsetHeight / 2;
+        const offsetY = (((document.documentElement.scrollTop + window.screen.height / 2 - 80) - middleY) / middleY) * 45;
+
+        startSection.animate({
+            transform: `perspective(5000px) rotateY(0deg) rotateX(${Math.max(Math.min(offsetY, 80), -80) * -1 + 'deg'})`
+        }, {duration: 50, fill: "forwards"});
+    }
+
+    function addToSlider(event) {
+        let deltaY = window.scrollY - lastKnownScrollPosition;
+        lastKnownScrollPosition = window.scrollY;
+
+        realSliderValue = realSliderValue + deltaY/10;
+    }
+
+    function viewport(element) {
+        ensureIntersectionObserver();
+
+        intersectionObserver.observe(element);
+
+        return {
+            destroy() {
+                intersectionObserver.unobserve(element);
+            }
+        }
+    }
+</script>
+
+<svelte:body on:mousemove={update3DRotation}></svelte:body>
+<svelte:window on:scroll={() => {update3DRotationScroll(); addToSlider()}}></svelte:window>
+
+<div style="display: flex; flex-direction: column; gap: 2rem; position: relative;">
+    <div class="bubble-container">
+        <div class="bubble one"></div>
+        <div class="bubble two"></div>
+        <div class="bubble three"></div>
+    </div>
+    <section class="start" bind:this={startSection}>
+        <h1 class="responsive-heading">
+            Better VPlan
+        </h1>
+        {#key currentMottoIndex}
+            <p style="text-align: center; margin-bottom: 1.5rem;" in:fade>
+                {mottos[currentMottoIndex]}
+            </p>
+        {/key}
+        <div use:viewport
+             on:enterViewport={() => $register_button_visible = true}
+             on:exitViewport={() => $register_button_visible = false}>
+            <Button background="var(--accent-color)" on:click={() => navigate_page('login')}>
+                Anmelden
+            </Button>
+        </div>
+    </section>
+    <section class="plans">
+        <div style="display: flex; flex-direction: row; gap: 2rem; align-items: center; margin-bottom: 2rem;">
+            <h2 class="responsive-heading">Pläne <span class="fancy-text" data-text="unlocked">unlocked</span></h2>
+            <div style="display: flex;align-items: center;justify-content: center;">
+                <span use:viewport
+                      on:enterViewport={() => setTimeout(() => lockVisible = true, 800)}
+                      on:exitViewport={() => lockVisible = false}
+                      class:unlocked={lockVisible} class="lock" style="--locked-color: #ff8888; --unlocked-color: #ffffff"></span>
+            </div>
+        </div>
+        <div class="presentation">
+            <h2 class="responsive-heading" style="color: rgb(120, 120, 120)">Klassenplan<br>Wahrer Lehrerplan<br>Raumplan</h2>
+            <div class="compare-slider">
+                <div class="bg"></div>
+                <div class="fg" style="width: {compareSliderValue}%"></div>
+                <input type="range" min="1" max="100" value={compareSliderValue} on:input={(evt) => realSliderValue = parseFloat(evt.target.value)} class="slider" name='slider' id="slider">
+                <button type="button" style="left: calc({compareSliderValue}% - 18px)" tabindex="-1">
+                    <div class="arrows"></div>
+                </button>
+            </div>
+        </div>
+        <div class="presentation reverse">
+            <h2 class="responsive-heading" style="color: rgb(150, 150, 150)">Freie Räume</h2>
+            <img src="/public/base_static/images/landing_page/vplanfr_room_overview.png" alt="Raum-Übersicht in Better VPlan">
+        </div>
+    </section>
+    <section>
+        <h2 class="responsive-heading">
+            Mobile Daten übrig für
+            <div style="position: relative; color: transparent; display: inline-block;">
+                Wichtigeres
+                <div bind:this={rotating_text} class="rotating-text"
+                     use:viewport
+                     on:enterViewport={() => setTimeout(() => {rotating_text.style.setProperty('--transform-val', '-300%')}, 1500)}
+                     on:exitViewport={() => {}}>
+                    <span>WhatsApp</span>
+                    <span>Discord</span>
+                    <span>Spotify</span>
+                    <span>Wichtigeres</span>
+                </div>
+            </div>
+        </h2> <!-- Scrollt durch Whatsapp, Discord, Spotify, wichtigeres -->
+        <div class="circle-bg" style="display: flex; justify-content: center;">
+            <div style="display: flex; flex-direction: column; gap: 1rem; font-size: min(5vw, 1.4rem);" class="responsive-text">
+                <span style="filter: drop-shadow(0px 0px 4px black)">🚀 4x weniger API-Requests als die VpMobil24 App</span>
+                <span style="filter: drop-shadow(0px 0px 4px black)">⚡ Near-instant Ladezeiten</span>
+                <span style="filter: drop-shadow(0px 0px 4px black)">🚵‍♂️ Funktioniert genauso offline (mit Planstatusindikatoren)</span>
+            </div>
+        </div>
+    </section>
+    <section>
+        <h2 class="responsive-heading"><span class="fancy-text" data-text="Quality">Quality</span> of Life</h2>
+        <!-- Solo leveling fenster gelb lila magenta + so dreck auf den fenstern vibe -->
+        <ul class="responsive-text">
+            <li>Cleanes Customizable Design</li>
+            <li>Beliebig viele Favoriten</li>
+            <li>Alle Vorkommen von Klassen, Räumen, Lehrern etc. führen bei klicken zu ihrem jeweiligen Plan</li>
+            <li>Überblick über alte Pläne</li>
+            <li>GAMES :DDD</li>
+        </ul>
+    </section>
+    <section>
+        <div style="height: 10px; width: auto; overflow: hidden; border-radius: 9vw; margin-top: 2rem; margin-bottom: 2rem;">
+            <hr style="margin: 0; border-top: solid 10px; border-image: repeating-linear-gradient(-75deg, #fcd53f, #fcd53f 10px, #533566 10px, #533566 20px) 20;">
+        </div>
+        <h2 class="responsive-heading">Geplante Features 🚧</h2>
+        <ul class="responsive-text">
+            <li>Push Notifications</li>
+            <li>Kalendersynchronisation</li>
+            <li>Wochenplan</li>
+        </ul>
+    </section>
+</div>
+
+<style lang="scss">
+  .rotating-text {
+    position: absolute;
+    inset: 0;
+    mask-image: linear-gradient(to bottom, transparent 0%, black 20%, black 80%, transparent 100%);
+    display: flex;
+    flex-direction: column;
+    color: white;
+    --transform-val: 0%;
+
+    span {
+      transition: transform 2s cubic-bezier(0, 0, 0.5, 1);
+      transform: translateY(var(--transform-val));
+    }
+  }
+  .bubble-container {
+    position: absolute;
+    height: 60vh;
+    width: 100%;
+    z-index: 999;
+    pointer-events: none;
+
+    .bubble {
+      position: absolute;
+      aspect-ratio: 1;
+      border-radius: 999vw;
+      backdrop-filter: blur(5px);
+      background: radial-gradient(circle, rgba(0,0,0,0) 0%, var(--bubble-color) 100%);
+
+      &.one {
+        top: 0;
+        left: 0;
+        transform: translate(-50%, -40%);
+        width: 6rem;
+        --bubble-color: rgba(202, 41, 255, 0.4);
+      }
+      &.two {
+        top: 50%;
+        right: 0;
+        transform: translate(60%, -50%);
+        width: 10rem;
+        --bubble-color: rgba(63, 101, 255, 0.4);
+
+        @media only screen and (max-width: 900px) {
+          top: 30%;
+          width: 8rem;
+        }
+      }
+      &.three {
+        bottom: 0;
+        will-change: left;
+        left: 35%;
+        transform: translate(45%, 55%);
+        width: 3rem;
+        --bubble-color: rgba(67, 126, 253, 0.4);
+
+        @media only screen and (max-height: 350px) {
+          left: 13%;
+          width: 3rem;
+        }
+      }
+    }
+  }
+  .plans {
+    .presentation {
+      width: auto;
+      display: flex;
+      flex-direction: column;
+      align-items: center;
+      margin-bottom: 4rem;
+
+      @media only screen and (min-width: 900px) {
+        flex-direction: row;
+        &.reverse {
+          flex-direction: row-reverse;
+        }
+        justify-content: space-around;
+      }
+
+      img {
+        $height: 80vh;
+        height: $height;
+        width: calc($height * 360 / 770);
+        aspect-ratio: 360 / 770;
+        border-radius: 1rem;
+        overflow: hidden;
+        -webkit-mask-image: -webkit-radial-gradient(white, black);
+      }
+    }
+  }
+  .compare-slider {
+    $height: 80vh;
+    position: relative;
+    height: $height;
+    width: calc($height * 360 / 770);
+    aspect-ratio: 360 / 770;
+    border-radius: 1rem;
+    overflow: hidden;
+    -webkit-mask-image: -webkit-radial-gradient(white, black);
+
+    & > div {
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background-size: calc((360 / 770) * $height) 100%;
+    }
+    .bg {
+      background-image: url('/public/base_static/images/landing_page/vpmobil24_form_view.png');
+    }
+    .fg {
+      background-image: url('/public/base_static/images/landing_page/vplanfr_form_view.png');
+      width: 20%;
+    }
+
+    @mixin center() {
+      display: flex;
+      justify-content: center;
+      align-items: center;
+    }
+
+    .slider {
+      position: absolute;
+      -webkit-appearance: none;
+      appearance: none;
+      width: 100%;
+      height: 100%;
+      background: transparent !important;
+      outline: none;
+      margin: 0;
+      transition: all .2s;
+      @include center;
+      &::-webkit-slider-thumb {
+        -webkit-appearance: none;
+        appearance: none;
+        width: 5px;
+        height: $height;
+        background: linear-gradient(180deg, purple, #6200ff);
+        cursor: pointer;
+        border-radius: 5vw;
+      }
+    }
+    & > button {
+      $size: 30px;
+      border: 3px solid rgb(30, 30, 30);
+      pointer-events: none;
+      position: absolute;
+      width: $size;
+      height: $size;
+      border-radius: 50%;
+      background: rgb(50, 50, 50);
+      left: calc(20% - 18px);
+      top: calc(50% - 18px);
+      @include center;
+
+      @mixin arrow-helper() {
+        content: '';
+        padding: 3px;
+        display: inline-block;
+        border: solid white;
+        border-width: 0 2px 2px 0;
+      }
+
+      &::before {
+        content: "";
+        position: absolute;
+        z-index: 0;
+        inset: -5px;
+        border-radius: 99vw;
+        background: linear-gradient(180deg, purple, #6200ff);
+        filter: blur(5px);
+      }
+
+      .arrows {
+          @include center;
+          &::after {
+            @include arrow-helper();
+            transform: rotate(-45deg);
+          }
+          &::before {
+            @include arrow-helper();
+            transform: rotate(135deg);
+          }
+      }
+    }
+  }
+  .fancy-text {
+    position: relative;
+    transform-style: preserve-3d;
+    z-index: 0;
+  }
+  .fancy-text::before {
+      content: attr(data-text);
+      position: absolute;
+      inset: 0;
+      color: transparent;
+      background: -webkit-linear-gradient(45deg, magenta, #0043ff);
+      -webkit-background-clip: text;
+      background-clip: text;
+      z-index: -2;
+      filter: blur(5px);
+      font-weight: bolder;
+      margin-top: 5px;
+    }
+  .start {
+      position: relative;
+      display: flex;
+      flex-direction: column;
+      justify-content: center;
+      align-items: center;
+      width: auto;
+      min-height: 60vh;
+      padding: 2rem;
+      background-color: rgb(0, 33, 179);
+      background-image: url("/public/base_static/images/landing_page/start_bg.webp");
+      background-size: cover;
+      background-position: 50% 50%;
+      box-sizing: border-box;
+      border: 2px solid var(--accent-color);
+      border-radius: 1rem;
+      overflow: hidden;
+
+      transform-style: preserve-3d;
+  }
+    .circle-bg {
+      background-color: #6e6e80;
+      background-image: radial-gradient(circle at center center, rgb(154, 82, 242), #110043), repeating-radial-gradient(circle at center center, rgb(154, 82, 242), var(--background), 10px, transparent 20px, transparent 10px);
+      background-blend-mode: multiply;
+      border-radius: 2rem;
+      padding: 2rem;
+      position: relative;
+
+      &::before {
+        content: "";
+        position: absolute;
+        z-index: -1;
+        inset: -5px;
+        border-radius: 2rem;
+        background: linear-gradient(180deg, purple, #6200ff);
+        filter: blur(20px);
+        opacity: 0.4;
+      }
+    }
+    /* Locked */
+    .lock {
+      width: 24px;
+      height: 21px;
+      border: 3px solid var(--locked-color);
+      border-radius: 5px;
+      position: relative;
+      -webkit-transition: all 0.2s ease-in-out;
+      transition: all 0.2s ease-in-out;
+    }
+    .lock:after {
+      content: "";
+      display: block;
+      background: var(--locked-color);
+      width: 3px;
+      height: 7px;
+      position: absolute;
+      top: 50%;
+      left: 50%;
+      margin: -3.5px 0 0 -2px;
+      -webkit-transition: all 0.2s ease-in-out;
+      transition: all 0.2s ease-in-out;
+    }
+    .lock:before {
+      content: "";
+      display: block;
+      width: 10px;
+      height: 10px;
+      bottom: 100%;
+      position: absolute;
+      left: 50%;
+      margin-left: -8px;
+      border: 3px solid var(--locked-color);
+      border-top-right-radius: 50%;
+      border-top-left-radius: 50%;
+      border-bottom: 0;
+      -webkit-transition: all 0.2s ease-in-out;
+      transition: all 0.2s ease-in-out;
+    }
+    /* Unlocked */
+    .unlocked:before {
+      bottom: 130%;
+      left: 31%;
+      margin-left: -11.5px;
+      transform: scale(-1, 1);
+    }
+    .unlocked,
+    .unlocked:before {
+      border-color: var(--unlocked-color);
+    }
+    .unlocked:after {
+      background: var(--unlocked-color);
+    }
+</style>
\ No newline at end of file
diff --git a/client/src/components/LandingPageNavbar.svelte b/client/src/components/LandingPageNavbar.svelte
new file mode 100644
index 00000000..7adcc45a
--- /dev/null
+++ b/client/src/components/LandingPageNavbar.svelte
@@ -0,0 +1,141 @@
+<script>
+    import {new_changelogs_available, register_button_visible} from '../stores.js';
+    import { fade } from 'svelte/transition';
+    import Dropdown from '../base_components/Dropdown.svelte';
+    import { fly } from 'svelte/transition';
+    import {navigate_page} from "../utils.js";
+    import Button from "../base_components/Button.svelte";
+</script>
+
+<nav transition:fly={{y:-64}}>
+    <button class="logo-button" on:click={() => {navigate_page("");}}>
+        <img class="logo" src="/public/base_static/images/better_vp_white.svg" alt="Better VPlan Logo">
+    </button>
+    <ul class="nav-element-wrapper">
+        {#if !$register_button_visible}
+            <li style="display: flex; align-items: center;" transition:fade={{duration: 100}}>
+                <Button background="var(--accent-color)" on:click={() => navigate_page('login')}>
+                    Anmelden
+                </Button>
+            </li>
+        {/if}
+        <li>
+            <Dropdown let:toggle>
+                <button slot="toggle_button" on:click={toggle} class="nav-button">
+                    <span class="material-symbols-outlined" class:new_notification={$new_changelogs_available}>menu</span>
+                </button>
+
+                {#if $register_button_visible}
+                    <button class="nav-button" on:click={() => navigate_page("login")}><span class="material-symbols-outlined">account_circle</span> Login</button>
+                {/if}
+                <button class="nav-button" on:click={() => navigate_page("about_us")}><span class="material-symbols-outlined">groups</span> Über uns</button>
+                <button class="nav-button" on:click={() => navigate_page("contact")}><span class="material-symbols-outlined">contact_page</span> Kontaktiere uns</button>
+                <button class="nav-button" on:click={() => navigate_page("impressum")}><span class="material-symbols-outlined">policy</span> Impressum</button>
+            </Dropdown>
+        </li>
+    </ul>
+</nav>
+
+<style lang="scss">
+  nav {
+    z-index: 9999;
+    background: var(--background);
+    box-shadow: 0px 3px 4px rgba(0, 0, 0, 0.2);
+    height: 64px;
+    @media only screen and (max-width: 601px) {
+      height: 56px;
+      padding: 0px 5px;
+    }
+    position: fixed;
+    top: 0;
+    left: 0;
+    width: 100vw;
+    margin-right: calc(100% - 100vw);
+    padding: 0px 20px;
+    box-sizing: border-box;
+
+    &::after {
+      content: "";
+      position: absolute;
+      top: 0;
+      left: 0;
+      width: 100%;
+      height: 100%;
+      background: rgba(255, 255, 255, 0.07);
+      pointer-events: none;
+    }
+
+    .logo-button {
+      height: 100%;
+      box-sizing: border-box;
+      border: none;
+      background: transparent;
+      .logo {
+        box-sizing: border-box;
+        height: 100%;
+        padding: 10px;
+        @media only screen and (max-width: 601px) {
+          padding: 8px;
+        }
+      }
+    }
+
+    .nav-element-wrapper {
+      position: relative;
+      display: flex;
+      flex-direction: row;
+      height: 100%;
+      float: right;
+
+      li {
+        height: 100%;
+        list-style-type: none;
+      }
+    }
+
+    .nav-button {
+      width: 100%;
+      height: 100%;
+      padding: 15px;
+      background-color: transparent;
+      border: none;
+      font-size: var(--font-size-base);
+      color: var(--text-color);
+      transition: background-color 200ms ease;
+      display: flex;
+      flex-direction: row;
+      justify-content: flex-start;
+      align-items: center;
+      gap: 10px;
+
+      &:hover, &:focus-visible {
+        background-color: rgba(0, 0, 0, 0.3);
+      }
+
+      span {
+        position: relative;
+        font-size: 1.4em;
+      }
+    }
+  }
+  .new_notification {
+    position: relative;
+
+    &::after {
+      content: "";
+      position: absolute;
+      top: 0;
+      right: 0;
+      transform: translate(50%, -50%);
+      background: var(--accent-color);
+      width: 10px;
+      aspect-ratio: 1;
+      border-radius: 999vw;
+    }
+  }
+  .favorite-selected {
+    background: rgba(255, 255, 255, 0.2);
+    outline: 4px solid rgba(255, 255, 255, 0.2);
+    border-radius: 999vw;
+  }
+</style>
\ No newline at end of file
diff --git a/client/src/components/NotFound.svelte b/client/src/components/NotFound.svelte
new file mode 100644
index 00000000..8d1f1c34
--- /dev/null
+++ b/client/src/components/NotFound.svelte
@@ -0,0 +1,43 @@
+<script>
+    import {onMount} from "svelte";
+    import {title} from "../stores.js";
+
+    onMount(() => {
+        title.set("Seite nicht gefunden");
+    });
+</script>
+
+<div style="display: flex; flex-direction: column; gap: 2rem; width: auto; min-height: 50vh; justify-content: center; align-items: center;">
+    <span class="material-symbols-outlined fancy-text" style="font-size: max(3rem, 5vw)">travel_explore</span>
+    <span class="responsive-text" style="text-align: center;">Wir haben weit und breit gesucht aber nichts gefunden. ☹️</span>
+</div>
+
+<style lang="scss">
+    .fancy-text {
+      background: linear-gradient(310deg, #cc33ff, #3358ff, #33bbff);
+      color: transparent;
+      -webkit-background-clip: text;
+      background-clip: text;
+      background-size: 600% 600%;
+
+      -webkit-animation: colorScroll 3s ease infinite;
+      -moz-animation: colorScroll 3s ease infinite;
+      animation: colorScroll 3s ease infinite;
+    }
+
+    @-webkit-keyframes colorScroll {
+      0%{background-position:0% 50%}
+      50%{background-position:100% 50%}
+      100%{background-position:0% 50%}
+    }
+    @-moz-keyframes colorScroll {
+      0%{background-position:0% 50%}
+      50%{background-position:100% 50%}
+      100%{background-position:0% 50%}
+    }
+    @keyframes colorScroll {
+      0%{background-position:0% 50%}
+      50%{background-position:100% 50%}
+      100%{background-position:0% 50%}
+    }
+</style>
\ No newline at end of file
diff --git a/client/src/components/SchoolManager.svelte b/client/src/components/SchoolManager.svelte
index ae516657..93b058a4 100644
--- a/client/src/components/SchoolManager.svelte
+++ b/client/src/components/SchoolManager.svelte
@@ -123,7 +123,6 @@
             return {};
         }
         for (let school of schools) {
-            console.log(school);
             if (school.id === school_id.toString()) {
                 return school
             }
@@ -150,7 +149,6 @@
     $: authorize_school_data = get_school_by_id(authorize_school_id);
 
     function add_school() {
-        console.log(add_school_name, add_school_num, add_school_username, add_school_password);
 
         let formData = new FormData();
         formData.append('display_name', add_school_name);
diff --git a/client/src/stores.js b/client/src/stores.js
index ef1b9a19..4d323dc5 100644
--- a/client/src/stores.js
+++ b/client/src/stores.js
@@ -11,3 +11,5 @@ export const pwa_prompt = writable();
 export const new_changelogs_available = writable(false);
 export const favorites = writable([]);
 export const selected_favorite = writable(0);
+
+export const register_button_visible = writable(false);
\ No newline at end of file
diff --git a/client/src/utils.js b/client/src/utils.js
index 29beff64..21a40c5d 100644
--- a/client/src/utils.js
+++ b/client/src/utils.js
@@ -1,4 +1,4 @@
-import {current_page, indexed_db, settings} from "./stores.js";
+import {current_page, indexed_db, register_button_visible, settings} from "./stores.js";
 import {notifications} from "./notifications.js";
 import { get } from "svelte/store";
 import { favorites } from "./stores.js";
@@ -118,6 +118,7 @@ export function navigate_page(page_id) {
     if(page_id === "plan" && get(current_page).startsWith("plan")) {return;}
     current_page.set(page_id);
     location.hash = `#${page_id}`;
+    register_button_visible.set(false);
     // console.log(`Changed Location to: "${page_id}"`);
 }
 
@@ -340,11 +341,22 @@ export function format_date(date) {
         "August", "September", "Oktober", "November", "Dezember"
     ];
 
+    const days = [
+        "So",
+        "Mo",
+        "Di",
+        "Mi",
+        "Do",
+        "Fr",
+        "Sa"
+    ];
+
+    const weekday = days[date.getDay()];
     const day = date.getDate();
     const monthIndex = date.getMonth();
     const year = date.getFullYear();
 
-    return `${day}. ${months[monthIndex]} ${year}`;
+    return `${weekday}., ${day}. ${months[monthIndex]} ${year}`;
 
 }
 
diff --git a/docs/changelog/2.0.0.md b/docs/changelog/2.0.0.md
index 2ce2f97e..6f5e8bad 100644
--- a/docs/changelog/2.0.0.md
+++ b/docs/changelog/2.0.0.md
@@ -30,7 +30,7 @@ Die alte Version unseres Plans war zwar toll und auf jeden Fall besser als die O
 
 # Ihr wollt für uns werben oder uns finanziell unterstützen?
 
-- [Hier]() könnt Ihr unser Werbeplakat herunterladen und an Eurer Schule aufhängen oder im Schülerrat bewerben.
+- [Hier](/public/base_static/images/vplan_fr_werbeplakat.png) könnt Ihr unser Werbeplakat herunterladen und an Eurer Schule aufhängen oder im Schülerrat bewerben.
 - [Hier 💸](https://www.paypal.com/paypalme/qrtrenh) ist unser PayPal
   - Schreibt uns auch gerne auf Discord und falls Ihr uns 5 € oder mehr (Server-Kosten für einen Monat) gebt, bedanken wir uns auf unserer Seite bei Euch.
 
@@ -47,11 +47,11 @@ Die alte Version unseres Plans war zwar toll und auf jeden Fall besser als die O
 
 # Infos für unsere Developer-Freunde 🧑‍💻
 
-- Der gesamte Code bleibt natürlich open-source auf [Github](https://github.com/ArtrenH/VPlan_FR) verfügbar.
+- Der gesamte Code bleibt natürlich open-source auf [Github](https://github.com/vplan-fr/VPlan_FR) verfügbar.
 - Ihr wollt mitmachen:
-  - Kontaktiert uns auf [Github](https://github.com/ArtrenH/VPlan_FR) oder Discord
+  - Kontaktiert uns auf [Github](https://github.com/vplan-fr/VPlan_FR) oder Discord
 - Ihr habt feature-requests:
-  - Macht ein Issue auf [Github](https://github.com/ArtrenH/VPlan_FR/issues) auf.
+  - Macht ein Issue auf [Github](https://github.com/vplan-fr/VPlan_FR/issues) auf.
 
 
 # Data Science 📊