diff --git a/app/contact/page.tsx b/app/contact/page.tsx
index 72043d7..e487d6e 100644
--- a/app/contact/page.tsx
+++ b/app/contact/page.tsx
@@ -46,7 +46,7 @@ export default function Example() {
 									{s.icon}
 								</span>{" "}
 								<div className="z-10 flex flex-col items-center">
-									<span className="text-xl font-medium duration-150 lg:text-3xl text-zinc-200 group-hover:text-white font-display">
+									<span className="lg:text-xl font-medium duration-150 xl:text-3xl text-zinc-200 group-hover:text-white font-display">
 										{s.handle}
 									</span>
 									<span className="mt-4 text-sm text-center duration-1000 text-zinc-400 group-hover:text-zinc-200">
diff --git a/app/page.tsx b/app/page.tsx
index 6055bc4..3250dcb 100644
--- a/app/page.tsx
+++ b/app/page.tsx
@@ -11,7 +11,7 @@ export default function Home() {
 	return (
 		<div className="flex flex-col items-center justify-center w-screen h-screen overflow-hidden bg-gradient-to-tl from-black via-zinc-600/20 to-black">
 			<nav className="my-16 animate-fade-in">
-				<ul className="flex items-center justify-center gap-4">
+				<ul className="flex flex-wrap items-center justify-center gap-4">
 					{navigation.map((item) => (
 						<Link
 							key={item.href}
@@ -34,7 +34,7 @@ export default function Home() {
 
 			<div className="hidden w-screen h-px animate-glow md:block animate-fade-right bg-gradient-to-r from-zinc-300/0 via-zinc-300/50 to-zinc-300/0" />
 			<div className="my-16 text-center animate-fade-in">
-				<h2 className="text-sm text-zinc-500 ">
+				<h2 className="text-sm text-zinc-500 mx-6">
 					Hi, my name is Andreas, I'm building serverless and open source
 					solutions at{" "}
 					<Link
@@ -45,8 +45,8 @@ export default function Home() {
 						Upstash
 					</Link>
 
-					<br />
-					and working on{" "}
+					
+					<wbr /> and working on{" "}
 					<Link
 						target="_blank"
 						href="https://unkey.dev"
diff --git a/app/projects/page.tsx b/app/projects/page.tsx
index 4183490..57f6a10 100644
--- a/app/projects/page.tsx
+++ b/app/projects/page.tsx
@@ -40,7 +40,7 @@ export default async function ProjectsPage() {
 	return (
 		<div className="relative pb-16">
 			<Navigation />
-			<div className="px-6 pt-16 mx-auto space-y-8 max-w-7xl lg:px-8 md:space-y-16 md:pt-24 lg:pt-32">
+			<div className="px-6 pt-20 mx-auto space-y-8 max-w-7xl lg:px-8 md:space-y-16 md:pt-24 lg:pt-32">
 				<div className="max-w-2xl mx-auto lg:mx-0">
 					<h2 className="text-3xl font-bold tracking-tight text-zinc-100 sm:text-4xl">
 						Projects