diff --git a/src/app/components/cases.tsx b/src/app/components/cases.tsx
index c99909a..ad72a4b 100644
--- a/src/app/components/cases.tsx
+++ b/src/app/components/cases.tsx
@@ -2,13 +2,15 @@ import Link from "next/link";
 import { getCases } from "$lib/content";
 
 const Cases = () =>
-  <div className="p-20 w-3/4 mx-auto flex flex-col gap-4">
+  <div className="p-20 w-full lg:w-3/4 mx-auto flex flex-col gap-4">
     {getCases().filter(c => !c.data.draft).sort((a, b) => Number(b.data.z) - Number(a.data.z)).map((c) => c.data).map((d) =>
       <div key={d.slug} className="w-full h-max flex justify-center rounded-lg border-2">
-        <Link className="btn flex flex-col w-full text-center" href={d.slug}>
-          <span className="text-lg px-6">{d.title}</span>
-          <span>{d.date}</span>
-        </Link>
+        <div className="gradient w-full">
+          <Link className="btn flex flex-col w-full text-center" href={d.slug}>
+            <span className="text-lg px-6">{d.title}</span>
+            <span>{d.date}</span>
+          </Link>
+        </div>
       </div>
     )}
   </div>
diff --git a/src/app/components/links.tsx b/src/app/components/links.tsx
index c3834d4..a34344f 100644
--- a/src/app/components/links.tsx
+++ b/src/app/components/links.tsx
@@ -6,10 +6,10 @@ const Links = () =>
   <div className="grid w-full h-full place-content-center">
     <div className={"grid grid-cols-2 gap-4 place-content-center"}>
       <Link aria-label="GitHub" href={process.env.NEXT_PUBLIC_GITHUB_URL!} target="_blank">
-        <FontAwesomeIcon className="svg-link" icon={faGithub} />
+        <FontAwesomeIcon className="w-14 h-14 hover:text-sky-400" icon={faGithub} />
       </Link>
       <Link aria-label="GitLab" href={process.env.NEXT_PUBLIC_GITLAB_URL!} target="_blank">
-        <FontAwesomeIcon className="svg-link" icon={faGitlab} />
+        <FontAwesomeIcon className="w-14 h-14 hover:text-sky-400" icon={faGitlab} />
       </Link>
     </div>
   </div>
diff --git a/src/app/components/navbar.tsx b/src/app/components/navbar.tsx
index 247c5d9..822cd42 100644
--- a/src/app/components/navbar.tsx
+++ b/src/app/components/navbar.tsx
@@ -6,8 +6,10 @@ const Navbar = () => {
   const path = usePathname()
   const link = (text: string, href: string) => {
     return (
-      <Link data-selected={path === href} className="btn" aria-label={text} href={href}>
-        {text}
+      <Link data-selected={path === href} className="gradient w-full h-max rounded-md border-2" aria-label={text} href={href}>
+        <div className="btn">
+          {text}
+        </div>
       </Link>
     )
   }
diff --git a/src/app/contact/page.tsx b/src/app/contact/page.tsx
index bfd3c70..b78fca9 100644
--- a/src/app/contact/page.tsx
+++ b/src/app/contact/page.tsx
@@ -6,7 +6,7 @@ const mailto = `mailto:${email}`
 const Contact = () =>
   <div className="w-full h-full p-2 grid place-content-center">
     <div className="flex flex-row gap-4">
-      <a aria-label={mailto} href={mailto}><FontAwesomeIcon className="svg-link" icon={faEnvelope} /></a>
+      <a aria-label={mailto} href={mailto}><FontAwesomeIcon className="w-14 h-14 hover:text-sky-400" icon={faEnvelope} /></a>
     </div>
   </div>
 
diff --git a/src/app/globals.css b/src/app/globals.css
index ceb3c52..355d937 100644
--- a/src/app/globals.css
+++ b/src/app/globals.css
@@ -2,22 +2,23 @@
 @tailwind components;
 @tailwind utilities;
 
+@layer components {
+  .btn {
+    @apply bg-gray-900 transition ease-in duration-200 text-gray-300 hover:bg-gray-700/60 rounded-md px-3 py-2 text-sm
+  }
+}
+
+@layer utilities {
+  .gradient {
+    @apply bg-gradient-to-br from-slate-950 via-red-700 to-yellow-400
+  }
+}
+
 body {
-  @apply bg-slate-950 text-slate-50 w-screen h-screen
+  @apply gradient text-slate-50 w-screen h-screen
 }
 
 main {
-  @apply flex flex-col w-full h-full
+  @apply flex flex-col w-full h-full bg-slate-950/95
 }
 
-svg {
-  @apply hover:text-cyan-500
-}
-
-.svg-link {
-  @apply w-14 h-14
-}
-
-.btn {
-  @apply bg-gray-900 text-gray-300 hover:bg-gray-700 hover:text-white rounded-md px-3 py-2 text-sm font-medium data-[selected=true]:bg-gray-600
-}