diff --git a/src/app/layout.js b/src/app/layout.js
index 17aaef9..2b84d2c 100644
--- a/src/app/layout.js
+++ b/src/app/layout.js
@@ -37,7 +37,7 @@ export default function RootLayout({children}) {
     return (
         <html lang="en" suppressHydrationWarning>
         <body
-            className={"bg-gray-200 dark:bg-black text-emerald-800 dark:text-emerald-300"}>
+            className={"text-emerald-800 dark:text-emerald-300 bg-gradient-to-tr  dark:from-black  dark:via-emerald-800 dark:to-black from-gray-300 via-emerald-100 to-gray-300"}>
         <ThemeProvider
             attribute="class"
             defaultTheme="dark"
@@ -45,8 +45,7 @@ export default function RootLayout({children}) {
             disableTransitionOnChange
         >
             <header
-                className={"fixed dark:bg-black bg-gray-200 w-full flex text-4xl md:text-5xl p-3 justify-between " +
-                    "border-b-2 border-emerald-800 dark:border-emerald-300 content-center flex items-center"}>
+                className={"fixed dark:bg-black bg-gray-200 w-full flex text-4xl md:text-5xl p-3 justify-between border-b-2 border-emerald-800 dark:border-emerald-300 content-center items-center"}>
                 <Burger/>
                 <div className={""}>{getTitle()}</div>
                 <ModeToggle/>
diff --git a/src/app/page.js b/src/app/page.js
index 603f58b..63c422b 100644
--- a/src/app/page.js
+++ b/src/app/page.js
@@ -27,40 +27,34 @@ export default function Home() {
             <div className="flex justify-between h-screen items-center border-b-2 border-x-2  border-emerald-800
             dark:border-emerald-300 dark:animate-pulse-border-dark animate-pulse-border-light w-screen p-0 m-0">
                 <section className={"w-1/2 p-5"}>
-                    <p>Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt
-                        ut labore
-                        et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et
-                        ea rebum. Stet
-                        clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor
-                        sit amet,
-                        consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna
-                        aliquyam erat, sed
-                        diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd
-                        gubergren, no sea
-                        takimata sanctus est Lorem ipsum dolor sit amet.</p>
+                    <p className={"md:text-2xl"}>
+                        Hier findest du einige meiner Informatik-Skills! Klicke einfach auf einer der Sprachen* und du
+                        kommst zu den Projekten mit der jeweiligen Sprache! Nicht zu jeder Sprache hat es aber unbedingt
+                        ein Projekt. *Nicht alle sind Programmiersprachen.
+                    </p>
                 </section>
                 <ul className={"w-1/2 left-1/2 list-none p-5 text-center"}>
-                    <li className={"text-xl border-2 rounded-2xl border-emerald-800 dark:border-cyan-400 dark:text-cyan-400 bg-cyan-400 dark:bg-black p-2 m-2"}>
+                    <li className={"text-xl border-2 rounded-2xl dark:hover:bg-radial from-black via-black to-cyan-400 border-emerald-800 dark:border-cyan-400 dark:text-cyan-400 bg-cyan-400 dark:bg-black p-2 m-2"}>
                         <Link href={"https://github.com/KrisHD1337?tab=repositories&q=&type=&language=python&sort="}
                               target={"_blank"}>Python</Link>
                     </li>
-                    <li className={"text-xl border-2 rounded-2xl border-emerald-800 dark:border-orange-400 dark:text-orange-400 bg-orange-400 dark:bg-black p-2 m-2"}>
+                    <li className={"text-xl border-2 rounded-2xl dark:hover:bg-radial from-black via-black to-orange-400 border-emerald-800 dark:border-orange-400 dark:text-orange-400 bg-orange-400 dark:bg-black p-2 m-2"}>
                         <Link href={"https://github.com/KrisHD1337?tab=repositories&q=&type=&language=java&sort="}
                               target={"_blank"}>Java</Link>
                     </li>
-                    <li className={"text-xl border-2 rounded-2xl border-emerald-800 dark:border-yellow-400 dark:text-yellow-400 bg-yellow-400 dark:bg-black p-2 m-2"}>
+                    <li className={"text-xl border-2 rounded-2xl dark:hover:bg-radial from-black via-black to-yellow-400 border-emerald-800 dark:border-yellow-400 dark:text-yellow-400 bg-yellow-400 dark:bg-black p-2 m-2"}>
                         <Link href={"https://github.com/KrisHD1337?tab=repositories&q=&type=&language=javascript&sort="}
                               target={"_blank"}>JavaScript</Link>
                     </li>
-                    <li className={"text-xl border-2 rounded-2xl border-emerald-800 dark:border-green-400 dark:text-green-400 bg-green-400 dark:bg-black p-2 m-2"}>
+                    <li className={"text-xl border-2 rounded-2xl dark:hover:bg-radial from-black via-black to-green-400 border-emerald-800 dark:border-green-400 dark:text-green-400 bg-green-400 dark:bg-black p-2 m-2"}>
                         <Link href={"https://github.com/KrisHD1337?tab=repositories&q=&type=&language=html&sort="}
                               target={"_blank"}>HTML</Link>
                     </li>
-                    <li className={"text-xl border-2 rounded-2xl border-emerald-800 dark:border-blue-400 dark:text-blue-400 bg-blue-400 dark:bg-black p-2 m-2"}>
+                    <li className={"text-xl border-2 rounded-2xl dark:hover:bg-radial from-black via-black to-blue-400 border-emerald-800 dark:border-blue-400 dark:text-blue-400 bg-blue-400 dark:bg-black p-2 m-2"}>
                         <Link href={"https://github.com/KrisHD1337?tab=repositories&q=&type=&language=css&sort="}
                               target={"_blank"}>CSS</Link>
                     </li>
-                    <li className={"text-xl border-2 rounded-2xl border-emerald-800 dark:border-red-400 dark:text-red-400 bg-red-400 dark:bg-black p-2 m-2"}>
+                    <li className={"text-xl border-2 rounded-2xl dark:hover:bg-radial from-black via-black to-red-400 border-emerald-800 dark:border-red-400 dark:text-red-400 bg-red-400 dark:bg-black p-2 m-2"}>
                         <Link href={"https://github.com/KrisHD1337?tab=repositories&q=&type=&language=sql&sort="}
                               target={"_blank"}>SQL</Link>
                     </li>
diff --git a/src/components/burger.jsx b/src/components/burger.jsx
index c1bf36d..68bbd05 100644
--- a/src/components/burger.jsx
+++ b/src/components/burger.jsx
@@ -9,8 +9,9 @@ export default function Burger() {
         <div>
             <button className={"text-4xl md:text-5xl"} onClick={() => setIsOpen(!isOpen)}>&#9776;</button>
             <div
-                    className={`absolute top-19 left-0 md:w-1/4 w-3/4 h-screen dark:bg-emerald-950 dark:border-t-emerald-400 
-                dark:border-r-emerald-400 border-2 bg-gray-200 flex flex-col
+                    className={`absolute top-19 left-0 md:w-1/4 w-3/4 h-screen bg-gradient-to-tl 
+                    dark:from-emerald-950 dark:via-emerald-800 dark:to-emerald-950 dark:border-t-emerald-400 
+                dark:border-r-emerald-400 border-2 from-gray-300 via-emerald-100 to-gray-300 flex flex-col
                 border-t-emerald-600 border-r-emerald-600
                 gap-6 font-semibold text-lg transform transition-transform
                 ${isOpen ? "opacity-100" : "opacity-0 hidden"}`}