diff --git a/frontend/styles.css b/frontend/styles.css
index e7d7fd56..61629020 100644
--- a/frontend/styles.css
+++ b/frontend/styles.css
@@ -15,6 +15,14 @@
   body {
     @apply font-sans text-slate dark:text-offwhite;
   }
+
+  @media screen and (max-width: 768px) {
+    .navbar-mobile {
+      position: relative !important;
+      margin-bottom: 2rem;
+    }
+  }
+
   h1 {
     @apply text-6xl dark:text-white;
     @apply mb-3;
@@ -165,13 +173,3 @@
     /* 2 */
   }
 }
-
-.nav-shadow {
-    box-shadow: 0px 1px 0px #d1d1d1;
-    border-bottom: 1px solid #f6f6f6;
-  }
-
-.dark .nav-shadow {
-  border-bottom: 1px solid #07405f;
-  box-shadow: 0 1px 0 #000;
-}
diff --git a/templates/includes/_header.html b/templates/includes/_header.html
index 6f57bbda..84ffdd41 100644
--- a/templates/includes/_header.html
+++ b/templates/includes/_header.html
@@ -2,12 +2,23 @@
 {% load account socialaccount active_link_tags %}
 
 
-<div class="absolute top-0 z-50 bg-gray-200 md:absolute md:top-0 right-0 left-0 dark:bg-black">
 
+<div class="absolute top-0 z-50 bg-gray-200 md:absolute md:top-0 right-0 left-0 dark:bg-black navbar-mobile">
+  <style>
+    .nav-shadow {
+      box-shadow: 0px 1px 0px #d1d1d1;
+      border-bottom: 1px solid #f6f6f6;
+    }
+
+    .dark .nav-shadow {
+      border-bottom: 1px solid #07405f;
+      box-shadow: 0 1px 0 #000;
+    }
+  </style>
   <div class="relative mx-auto">
     <div id="navbar-container" class="max-w-7xl md:px-6 mx-auto" x-data="searchToggleComponent" @resize.window="updateSearchButtonLocation()">
       <div id="headblock" class="hidden items-center py-1 px-2 nav-shadow md:flex">
-        <div class="w-[40px] h-[25px] -mt-[3px]">
+        <div class="w-[40px] h-[25px] -mt-[3px]" style="width:40px">
           <a href="{% url 'home' %}" class="inline-block">
               <img class="hidden w-auto dark:inline-block h-[25px]"
                    src="{% static 'img/Boost_Symbol_Transparent.svg' %}"
@@ -161,11 +172,11 @@
           <div class="inline-block relative pt-2 pl-2 mx-auto">
             <a href="{% url 'home' %}">
                 <img class="hidden w-auto dark:inline h-[30px]"
-                    src="{% static 'img/Boost_Brandmark_WhiteBoost_Transparent.svg' %}"
+                    src="{% static 'img/Boost_Symbol_Transparent.svg' %}"
                     alt="Boost">
 
                 <img class="inline w-auto dark:hidden h-[30px]"
-                    src="{% static 'img/Boost_Brandmark_BlackBoost_Transparent.svg' %}"
+                    src="{% static 'img/Boost_Symbol_Transparent.svg' %}"
                     alt="Boost">
               </a>
           </div>
diff --git a/yarn.lock b/yarn.lock
index b6d07e7a..05e7875e 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -140,15 +140,10 @@ caniuse-api@^3.0.0:
     lodash.memoize "^4.1.2"
     lodash.uniq "^4.5.0"
 
-caniuse-lite@^1.0.0:
-  version "1.0.30001431"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001431.tgz#e7c59bd1bc518fae03a4656be442ce6c4887a795"
-  integrity sha512-zBUoFU0ZcxpvSt9IU66dXVT/3ctO1cy4y9cscs1szkPlcWb6pasYM144GqrUygUbT+k7cmUCW61cvskjcv0enQ==
-
-caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001407:
-  version "1.0.30001425"
-  resolved "https://registry.yarnpkg.com/caniuse-lite/-/caniuse-lite-1.0.30001425.tgz#52917791a453eb3265143d2cd08d80629e82c735"
-  integrity sha512-/pzFv0OmNG6W0ym80P3NtapU0QEiDS3VuYAZMGoLLqiC7f6FJFe1MjpQDREGApeenD9wloeytmVDj+JLXPC6qw==
+caniuse-lite@^1.0.0, caniuse-lite@^1.0.30001400, caniuse-lite@^1.0.30001407:
+  version "1.0.30001651"
+  resolved "https://registry.npmjs.org/caniuse-lite/-/caniuse-lite-1.0.30001651.tgz"
+  integrity sha512-9Cf+Xv1jJNe1xPZLGuUXLNkE1BoDkqRqYyFJ9TDYSqhduqA4hu4oR9HluGoWYQC/aj8WHjsGVV+bwkh0+tegRg==
 
 chokidar@^3.5.3:
   version "3.5.3"