diff --git a/src/components/Header.astro b/src/components/Header.astro
index 1d9ceff..a2c3f98 100644
--- a/src/components/Header.astro
+++ b/src/components/Header.astro
@@ -58,13 +58,13 @@ const { activeNav } = Astro.props;
       <div class="button-wrapper">
         <LinkButton
           href="/search"
-          className={`focus-outline p-1 ${
+          className={`focus-outline p-3 sm:p-1 ${
             activeNav === "search" ? "active" : ""
           }`}
           ariaLabel="search"
           title="Search"
         >
-          <svg xmlns="http://www.w3.org/2000/svg"
+          <svg xmlns="http://www.w3.org/2000/svg" class="scale-125 sm:scale-100"
             ><path
               d="M19.023 16.977a35.13 35.13 0 0 1-1.367-1.384c-.372-.378-.596-.653-.596-.653l-2.8-1.337A6.962 6.962 0 0 0 16 9c0-3.859-3.14-7-7-7S2 5.141 2 9s3.14 7 7 7c1.763 0 3.37-.66 4.603-1.739l1.337 2.8s.275.224.653.596c.387.363.896.854 1.384 1.367l1.358 1.392.604.646 2.121-2.121-.646-.604c-.379-.372-.885-.866-1.391-1.36zM9 14c-2.757 0-5-2.243-5-5s2.243-5 5-5 5 2.243 5 5-2.243 5-5 5z"
             ></path>
@@ -119,16 +119,16 @@ const { activeNav } = Astro.props;
     @apply fill-skin-base w-6 h-6 scale-125;
   }
   nav {
-    @apply w-full py-2 sm:py-0 flex flex-col items-center sm:justify-end sm:flex-row sm:space-x-4 bg-skin-fill;
+    @apply w-full py-2 sm:py-0 sm:pr-4 flex flex-col items-center sm:justify-end sm:flex-row sm:space-x-4 bg-skin-fill;
   }
   nav ul {
     @apply flex flex-col sm:flex-row sm:space-x-4;
   }
   nav li {
-    @apply py-2 text-center my-2 sm:my-0;
+    @apply py-3 sm:py-2 text-center my-1 sm:my-0;
   }
   nav a {
-    @apply py-2 px-3 font-medium hover:text-skin-accent;
+    @apply px-6 py-3 sm:py-2 sm:px-3 font-medium hover:text-skin-accent;
   }
   nav a.active {
     @apply underline underline-offset-4 decoration-wavy decoration-2;
@@ -145,8 +145,12 @@ const { activeNav } = Astro.props;
   nav button svg {
     @apply w-6 h-6 fill-skin-base hover:fill-skin-accent;
   }
+  #theme-btn {
+    /* @apply w-12 h-12 sm:w-9 sm:h-9 flex justify-center items-center sm:inline-block; */
+    @apply p-3 sm:p-1;
+  }
   #theme-btn svg {
-    @apply hover:rotate-12;
+    @apply hover:rotate-12 scale-125 sm:scale-100;
   }
 
   .icon-container {