diff --git a/src/lib/footer/Footer.svelte b/src/lib/footer/Footer.svelte
index 244e16d..f19c7f3 100644
--- a/src/lib/footer/Footer.svelte
+++ b/src/lib/footer/Footer.svelte
@@ -6,7 +6,7 @@
 </script>
 
 <footer
-	class="@container py-20 px-2 @lg:px-10 bg-white dark:bg-black dark:bg-opacity-50 text-black dark:text-white z-20 flex flex-col gap-10"
+	class="@container py-20 bg-white dark:bg-black dark:bg-opacity-50 text-black dark:text-white z-20 flex flex-col gap-10"
 >
 	<div class="absolute top-0 -mt-40" id="contact"></div>
 
diff --git a/src/lib/header/NavDropdown.svelte b/src/lib/header/NavDropdown.svelte
index 909fcce..2da6fcc 100644
--- a/src/lib/header/NavDropdown.svelte
+++ b/src/lib/header/NavDropdown.svelte
@@ -22,7 +22,6 @@
 	function toggle() {
 		dropdown.classList.toggle("flex");
 		dropdown.classList.toggle("hidden");
-		console.log(dropdown);
 	}
 </script>
 
diff --git a/src/lib/home/Banner.svelte b/src/lib/home/Banner.svelte
index 730c737..c8268c2 100644
--- a/src/lib/home/Banner.svelte
+++ b/src/lib/home/Banner.svelte
@@ -139,23 +139,22 @@
 			</div>
 
 			<p class="text-gray-800 dark:text-gray-300 lg:text-lg max-w-[800px]">
-				I'm a {calculateAge(new Date("2001-10-30"))} year old programmer and tech enthusiast from The Netherlands. I have an entrepreneurial spirit and own the webdevelopment studio called DubbelNull.
-				I am motivated by creating software that provides useful services to people which improves their lives.
+				I'm a {calculateAge(new Date("2001-10-30"))} year old programmer and tech enthusiast from The Netherlands. I have an entrepreneurial spirit and own a webdevelopment studio called DubbelNull.
+				I am motivated by creating reliable software that makes a difference and improves the lives of people through unique solutions.
 				<br/><br/>
 				Bart Industries is my public digital home. It's a collection of my socials, work experiences and past projects, artworks, hobbies and interests, fursonas and anything else I feel like sharing with the world.
 				<br/><br/>
-				Feel free to have a poke around and learn about who I am and the things I've worked on.
-				If you want to contact me you can find my details <a href="#contact" class="a">here</a>.
+				Feel free to have a look around and learn about who I am and the things I've worked on.
 			</p>
 
 			<Socials type="default" />
+
+			<span class="hidden 2xl:flex justify-center text-8xl float text-blue-600">
+				<img src="/downarrow.png" class="w-10" />
+			</span>
 		</div>
 	</div>
 
-	<!-- <span class="hidden @4xl:flex absolute left-0 bottom-0 w-full justify-center mb-20 z-50 text-8xl float text-blue-600">
-		<img src="/downarrow.png" class="w-10" />
-	</span> -->
-
 	<svg class="dark:hidden block absolute left-0 bottom-0 right-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="#e5e7eb" fill-opacity="1" d="M0,96L48,96C96,96,192,96,288,112C384,128,480,160,576,176C672,192,768,192,864,213.3C960,235,1056,277,1152,266.7C1248,256,1344,192,1392,160L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
 	<svg class="hidden dark:block absolute left-0 bottom-0 right-0" xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="#1f2937" fill-opacity="1" d="M0,96L48,96C96,96,192,96,288,112C384,128,480,160,576,176C672,192,768,192,864,213.3C960,235,1056,277,1152,266.7C1248,256,1344,192,1392,160L1440,128L1440,320L1392,320C1344,320,1248,320,1152,320C1056,320,960,320,864,320C768,320,672,320,576,320C480,320,384,320,288,320C192,320,96,320,48,320L0,320Z"></path></svg>
 </main>
diff --git a/src/lib/home/Furry.svelte b/src/lib/home/Furry.svelte
index 2ee2b67..b0411a8 100644
--- a/src/lib/home/Furry.svelte
+++ b/src/lib/home/Furry.svelte
@@ -30,7 +30,6 @@
                 const x = e.pageX - slider.offsetLeft;
                 const walk = (x - startX) * 1; //scroll-fast
                 slider.scrollLeft = scrollLeft - walk;
-                console.log(walk);
             });
             slider.addEventListener('wheel', (evt) => {
                 slider.scrollLeft += evt.deltaY;
diff --git a/src/lib/home/Portfolio.svelte b/src/lib/home/Portfolio.svelte
index a854712..714c3ed 100644
--- a/src/lib/home/Portfolio.svelte
+++ b/src/lib/home/Portfolio.svelte
@@ -4,12 +4,12 @@
 
     const words = [
 		"JavaScript",
-		"<b>TypeScript</b>",
+		"<b class='text-blue-500'>TypeScript</b>",
 		"MySQL",
-		"<b>Laravel</b>",
+		"<b class='text-blue-500'>Laravel</b>",
 		"PHP",
 		"Livewire",
-		"<b>NestJS</b>",
+		"<b class='text-blue-500'>NestJS</b>",
 		"NodeJS",
 		"Unity",
 		"Substance Painter",
@@ -17,23 +17,23 @@
 		"PostgreSQL",
 		"TailwindCSS",
         "Rust",
-        "<b>Blazor</b>",
+        "<b class='text-blue-500'>Blazor</b>",
 		"Redis",
-		"<b>Svelte</b>",
-        "<b>SvelteKit</b>",
+		"<b class='text-blue-500'>Svelte</b>",
+        "<b class='text-blue-500'>SvelteKit</b>",
 		"Python",
 		"Django",
 		"Vue",
-		"<b>Java</b>",
-        "<b>C#</b>",
+		"<b class='text-blue-500'>Java</b>",
+        "<b class='text-blue-500'>C#</b>",
 		"JavaFX",
 		"NGINX",
 		"Docker",
         "PayPal API",
-		"<b>REST</b>",
+		"<b class='text-blue-500'>REST</b>",
 		"GraphQL",
 		"TypeORM",
-		"<b>Eloquent</b>",
+		"<b class='text-blue-500'>Eloquent</b>",
 		"Express",
         "Bash",
         ".NET",
@@ -42,7 +42,7 @@
 		"Blade",
 		"JSX",
 		"Pug",
-		"<b>Wordpress</b>",
+		"<b class='text-blue-500'>Wordpress</b>",
 		"Vercel",
         "SEO",
 		"Netlify",
@@ -53,7 +53,7 @@
 		"Sass",
         ".NET Core",
 		"Webpack",
-        "<b>Linux</b>",
+        "<b class='text-blue-500'>Linux</b>",
 	];
 </script>
 
@@ -64,7 +64,7 @@
             <p class="lg:text-lg">A collection of some of the projects and experiences I am most proud of</p>
         </div>
 
-        <div class="container px-5 my-5 lg:my-20 grid grid-cols-1 @2xl:grid-cols-2 @6xl:grid-cols-3 gap-5 justify-between">
+        <div class="container my-5 lg:my-20 grid grid-cols-1 @2xl:grid-cols-2 @6xl:grid-cols-3 gap-5 justify-between">
             <div class="absolute top-0 -mt-40" id="portfolio"></div>
 
             <Card>
@@ -206,30 +206,34 @@
                 </Card>
             </span>
 
-            <Card
-                buttonHref="https://saxion.nl"
-                buttonText="🎓 Open Website"
-            >
-                <h3
-                    class="text-xl font-bold flex-wrap inline-flex items-center gap-3 justify-between"
-                >
-                    <div class="inline-flex gap-3">
+            <span class="@xl:row-span-3">
+                <Card>
+                    <h3
+                        class="text-xl font-bold flex-wrap inline-flex items-center gap-3"
+                    >
                         <img
-                            src="/saxion.png"
-                            class="h-8 rounded-full"
-                            alt="puppypride"
-                        /> Saxion University
+                            src="/homepage/esu.png"
+                            class="h-10 rounded-full bg-black p-1"
+                            alt="esu"
+                        /> Easter System Universe
+                    </h3>
+                    <div class="h-full flex flex-col">
+                        <p class="text-sm text-gray-800 dark:text-gray-100">
+                            For the past years I've worked on building and writing a universe of mysteries called ESU. It is now mature enough to release, with several dimensions and planets on which the natives speak their own unique languages.
+                            <br/><br/>
+                            The universe confronts you with anomalies and alien concepts familiar enough to relate with as they fight for survival in an ever more technological world.
+                            Worlds collide as it becomes ever more apparent that the puppeteers of the world might not be who you think they are, instigating a battle in which you must rely on hope to make it through.
+                            <br/><br/>
+                            The first written story titled "Luther's Throne" is planned to release soon and will be published on this website.
+                        </p>
                     </div>
-                    <span class="text-sm font-light">2020 to 2024</span>
-                </h3>
-                <p class="text-sm text-gray-800 dark:text-gray-100">
-                    I am a year 4 student at the Saxion University of Applied Sciences in The Netherlands majoring in Software Engineering and expected to graduate in 2024.
-                    During the study I've done numerous projects for real clients and worked in teams comprised of people with many different backgrounds.
-                    Most of my programming knowledge was self researched, but the study has connected me with companies and allowed me to work on real world products like my work at Agro IT.
-                </p>
-            </Card>
+                    <span class="flex items-center">
+                        <img src="/homepage/esubanner.png" alt="cover of act 1" />
+                    </span>
+                </Card>
+            </span>
 
-            <span class="@xl:col-span-2">
+            <span class="@xl:row-span-2">
                 <Card>
                     <h3
                         class="text-xl font-bold flex-wrap inline-flex items-center gap-3 justify-between"
@@ -242,7 +246,7 @@
                     <p class="text-sm text-gray-800 dark:text-gray-100">
                         I can work with anything and love to try out new things and technologies! I have a lot of common knowledge around computer software and hardware and can adapt to anything that may be needed, but here is a constantly growing list of some of the things I am comfortable on and like working with:
                     </p>
-                    <div id="scroll-container" class="flex flex-wrap gap-1 w-full text-center text-sm">
+                    <div id="scroll-container" class="flex flex-wrap gap-1 w-full text-center">
                         {#each words as word, key}
                             <p>
                                 {#if key == words.length - 2}
@@ -281,6 +285,29 @@
                     </p>
                 </div>
             </Card>
+
+            <Card
+                buttonHref="https://saxion.nl"
+                buttonText="🎓 Open Website"
+            >
+                <h3
+                    class="text-xl font-bold flex-wrap inline-flex items-center gap-3 justify-between"
+                >
+                    <div class="inline-flex gap-3">
+                        <img
+                            src="/saxion.png"
+                            class="h-8 rounded-full"
+                            alt="puppypride"
+                        /> Saxion University
+                    </div>
+                    <span class="text-sm font-light">2020 to 2024</span>
+                </h3>
+                <p class="text-sm text-gray-800 dark:text-gray-100">
+                    I am a year 4 student at the Saxion University of Applied Sciences in The Netherlands majoring in Software Engineering and expected to graduate in 2024.
+                    During the study I've done numerous projects for real clients and worked in teams comprised of people with many different backgrounds.
+                    Most of my programming knowledge was self researched, but the study has connected me with companies and allowed me to work on real world products like my work at Agro IT.
+                </p>
+            </Card>
         </div>
     </div>
 </section>
\ No newline at end of file
diff --git a/src/lib/home/Virtual.svelte b/src/lib/home/Virtual.svelte
index 16556de..615cfcb 100644
--- a/src/lib/home/Virtual.svelte
+++ b/src/lib/home/Virtual.svelte
@@ -1,7 +1,7 @@
 <main class="@container flex flex-col gap-20 relative">
 	<div class="absolute top-0 -mt-40" id="vr"></div>
 
-	<section class="w-full h-full flex flex-col px-5 justify-between gap-10 @lg:gap-20">
+	<section class="w-full h-full flex flex-col justify-between gap-10 @lg:gap-20">
 		<h2 class="lg:hidden block baron text-6xl text-center @2xl:text-left @2xl:text-8xl text-blue-600">Virtual Reality</h2>
 		<div class="flex-col hidden lg:flex baron text-2xl lg:text-4xl 2xl:text-5xl text-left text-blue-600 lg:-ml-80 xl:-ml-40 2xl:-ml-10">
 			<div class="flex gap-5 items-end">
@@ -77,7 +77,7 @@
 
 			<div class="object-cover @6xl:aspect-[2/1] h-full w-full @6xl:col-span-2 flex flex-col gap-5 2xl:text-lg relative">
 				<div class="absolute inset-0 w-full h-full bg-white dark:bg-black skew-x-3"></div>
-				<p class="absolute inset-0 w-full h-full lg:p-5 2xl:p-10">
+				<p class="w-full h-full p-5 2xl:p-10 z-10">
 					VR is a world where anything is possible. A place where cities can be built with just a few button clicks. A place where friendships and communities are built on creativity and compassion. A place where anyone can be what they want to be without limitation. A place where freedom flourishes and humanity's light shines brighter than anywhere else.
 					<br/><br/>
 					Despite what the failures of big-tech's attempts at creating a metaverse may make you think, VR is a very real and very big world consisting of millions of creative individuals with plenty of proven business models.
@@ -96,7 +96,7 @@
 
 			<div class="object-cover @6xl:aspect-[2/1] h-full w-full @6xl:col-span-2 flex flex-col gap-5 2xl:text-lg lg:-ml-3 relative">
 				<div class="absolute inset-0 w-full h-full bg-white dark:bg-black skew-x-3"></div>
-				<p class="absolute inset-0 w-full h-full lg:p-5 2xl:p-10">
+				<p class="w-full h-full p-5 2xl:p-10 z-10">
 					Because of my adventures in virtual reality I have gained knowledge surrounding things such as game development, modelling and texturing. Most of the avatars shown in the pictures were hand-made by me, and I have created many worlds and systems inside these VR platforms.
 					<br/><br/>
 					In my experience auxiliary skills, like in this case having knowledge of the inner workings of the software that makes these emerging technological markets possible, often come in handy even when working in a completely different field. They make you a more versatile person with a broader range of knowledge that'll help inspire and solve difficult problems with unique solutions.
diff --git a/src/routes/+page.svelte b/src/routes/+page.svelte
index 865f21b..a797383 100644
--- a/src/routes/+page.svelte
+++ b/src/routes/+page.svelte
@@ -32,7 +32,7 @@
 	</div>
 
 	<div class="dotsandlines">
-		<div class="h-[400px] bg-gradient-to-b from-gray-200 dark:from-gray-800"></div>
+		<div class="h-[100px] lg:h-[400px] bg-gradient-to-b from-gray-200 dark:from-gray-800"></div>
 	</div>
 
 	<div class="bg-repeat-y bg-contain dotsandlines pb-20">
diff --git a/static/homepage/esu.png b/static/homepage/esu.png
new file mode 100644
index 0000000..ddc58ee
Binary files /dev/null and b/static/homepage/esu.png differ
diff --git a/static/homepage/esubanner.png b/static/homepage/esubanner.png
new file mode 100644
index 0000000..481a955
Binary files /dev/null and b/static/homepage/esubanner.png differ
diff --git a/static/homepage/esudragon.jpg b/static/homepage/esudragon.jpg
new file mode 100644
index 0000000..780eb97
Binary files /dev/null and b/static/homepage/esudragon.jpg differ