diff --git a/src/components/faq.svelte b/src/components/faq.svelte
index 8b4e08c..d44be96 100644
--- a/src/components/faq.svelte
+++ b/src/components/faq.svelte
@@ -1,5 +1,5 @@
 <script>
-	import Icon from '@iconify/svelte';
+	import Icon from "@iconify/svelte";
 
 	let features = [
 		{
@@ -12,43 +12,45 @@
 			question: "What is a writeup?",
 			answer:
 				"A writeup is a collection of all the evidence and flags you have collected, and how you found them. Check out b1c's excellent writeup for MCPS HSF 2023.",
-				icon: "mdi:chevron-down",
+			icon: "mdi:chevron-down",
 		},
 		{
 			question: "What are the divisions?",
 			answer:
 				"The competition is divided into a novice and advanced division. The novice division is for beginners, and the advanced division is for more experienced hackers.",
-				icon: "mdi:chevron-down",
+			icon: "mdi:chevron-down",
 		},
 		{
 			question: "Do I need experience?",
 			answer:
 				"No! This competition is for people for all skill levels. Also, winners are determined by the writeup and number of flags.",
-				icon: "mdi:chevron-down",
+			icon: "mdi:chevron-down",
 		},
 		{
 			question: "Are there prizes?",
 			answer:
 				"Yes! We had drones and GoPros last year. The top three in both the novice and advanced division win prizes.",
-				icon: "mdi:chevron-down",
+			icon: "mdi:chevron-down",
 		},
 		{
 			question: "I have more questions!",
 			answer:
 				"Join our Discord server below and ask away! We'll be happy to answer any questions you have.",
-				icon: "mdi:chevron-down",
+			icon: "mdi:chevron-down",
 		},
 	];
 
 	function toggleAnswer(event) {
-		const button = event.currentTarget;
-		const question = button.nextElementSibling;
+		const entry = event.currentTarget;
+		const question = entry.firstElementChild;
 		const answer = question.nextElementSibling;
 		if (answer) {
 			answer.classList.toggle("hidden");
 			// change the icon in the features array
 			const questionText = question.textContent;
-			const index = features.findIndex((feature) => feature.question === questionText);
+			const index = features.findIndex(
+				(feature) => feature.question === questionText
+			);
 			const feature = features[index];
 			if (feature.icon === "mdi:chevron-down") {
 				feature.icon = "mdi:chevron-up";
@@ -56,16 +58,19 @@
 				feature.icon = "mdi:chevron-down";
 			}
 			features[index] = feature;
-			
 		}
 	}
 </script>
 
 <span id="faq" class="font-heading font-semibold text-center">
-	<span class="hidden md:block md:text-3xl lg:text-5xl border-x-8 border-dashed border-x-primary px-8">
+	<span
+		class="hidden md:block md:text-3xl lg:text-5xl border-x-8 border-dashed border-x-primary px-8"
+	>
 		Frequently Asked Questions
 	</span>
-	<span class="block md:hidden text-5xl border-x-8 border-dashed border-x-primary px-8">
+	<span
+		class="block md:hidden text-5xl border-x-8 border-dashed border-x-primary px-8"
+	>
 		FAQ
 	</span>
 </span>
@@ -77,51 +82,45 @@
 		{#if question !== "What is a writeup?"}
 			<li
 				class="relative flex flex-col items-center gap-2 border md:border-4 md:border-double border-primary p-2 xs:p-4 rounded-md xs:rounded-lg"
+				on:click={toggleAnswer}
+				on:keypress={toggleAnswer}
 			>
-				<a
-					class="md:hidden absolute top-3 right-1 xs:top-5 xs:right-2"
-					on:click={toggleAnswer}
-				>
-					<Icon class="w-6 h-6" icon={icon} />
-				</a>
 				<p
 					class="xs:text-lg font-medium xs:font-semibold font-heading tracking-tighter md:tracking-normal"
 				>
 					{question}
 				</p>
-				<p
-					class="hidden md:block text-offset text-sm"
-				>
+				<p class="hidden md:block text-offset text-sm">
 					{answer}
 				</p>
+				<Icon
+					class="md:hidden absolute top-3 right-1 xs:top-5 xs:right-2 w-6 h-6"
+					{icon}
+				/>
 			</li>
 		{:else}
 			<li
 				class="relative flex flex-col items-center gap-2 border md:border-4 md:border-double border-primary p-2 xs:p-4 rounded-md xs:rounded-lg"
 			>
-				<a
-					class="md:hidden absolute top-3 right-1 xs:top-5 xs:right-2 h-8"
-					on:click={toggleAnswer}
-				>
-					<Icon class="w-6 h-6" icon={icon} />
-				</a>
 				<p
 					class="xs:text-lg font-medium xs:font-semibold font-heading tracking-tighter md:tracking-normal"
 				>
 					What is a writeup?
 				</p>
-				<p
-					class="hidden md:block font-light text-offset text-sm"
-				>
+				<p class="hidden md:block font-light text-offset text-sm">
 					A writeup is a collection of all the evidence and flags you have
 					collected, and how you found them. Check out b1c's{" "}
 					<a
 						class="text-primary underline hover:decoration-wavy underline-offset-4"
 						href="pdfs/b1c_HSFReport.pdf"
-					>excellent writeup
+						>excellent writeup
 					</a>
 					for MCPS HSF 2023.
 				</p>
+				<Icon
+					class="md:hidden absolute top-3 right-1 xs:top-5 xs:right-2 w-6 h-6"
+					{icon}
+				/>
 			</li>
 		{/if}
 	{/each}
diff --git a/src/components/header.astro b/src/components/header.astro
index 11b0d78..46137c0 100644
--- a/src/components/header.astro
+++ b/src/components/header.astro
@@ -32,16 +32,16 @@ const socialLinks: Array<FooterLink> = [
 
 <header
 	id="page-header"
-	class="absolute top-0 z-20 flex w-full items-center gap-16 xs:gap-0 justify-center xs:justify-between border-b-2 border-transparent px-5 sm:px-12 lg:px-24 py-6 ease-linear transition-all duration-250"
+	class="absolute top-0 z-20 flex w-full items-center justify-between border-b-2 border-transparent px-5 sm:px-12 lg:px-24 py-6 ease-linear transition-all duration-250"
 >
-	<div class="flex items-center gap-3 xs:gap-4 sm:gap-8">
+	<div class="flex items-center gap-0 xs:gap-4 sm:gap-8">
 		<button
 			id="open-nav-button"
 			type="button"
 			class="btn md:hidden"
 			aria-label="Navigation"
 		>
-			<Icon pack="mdi" name="menu" class="h-8" />
+			<Icon pack="mdi" name="menu" class="h-8 w-8" />
 		</button>
 		<a class="hidden xs:inline relative hover:opacity-50" href="#">
 			<Logo sizeAdjust />
diff --git a/src/components/sponsor-button.svelte b/src/components/sponsor-button.svelte
index e99afd7..57da7b5 100644
--- a/src/components/sponsor-button.svelte
+++ b/src/components/sponsor-button.svelte
@@ -10,7 +10,7 @@
 		.flat();
 </script>
 
-<div class="relative">
+<div class="relative overflow-hidden">
 	<div id="seal" class="relative h-56 md:h-64 mt-4 md:mt-8 animate-spin-slow">
 		{#each array as char, index}
 			<div
diff --git a/src/components/theme-switcher.astro b/src/components/theme-switcher.astro
index 63c0cdd..12a8297 100644
--- a/src/components/theme-switcher.astro
+++ b/src/components/theme-switcher.astro
@@ -12,11 +12,11 @@ import { Icon } from "astro-icon";
   class="origin-[right_center] text-icon hover:text-primary hover:scale-110 hover:ease-in-out"
 >
   <div id="icon-theme-light">
-    <Icon name="theme/light" class="h-8" />
+    <Icon name="theme/light" class="h-8 w-8" />
     <span class="sr-only">Use light theme</span>
   </div>
   <div id="icon-theme-dark" class="hidden">
-    <Icon name="theme/dark" class="h-8" />
+    <Icon name="theme/dark" class="h-8 w-8" />
     <span class="sr-only">Use dark theme</span>
   </div>
 </button>