diff --git a/core/static/core/navbar.scss b/core/static/core/navbar.scss
index bdf67d04..83fa58de 100644
--- a/core/static/core/navbar.scss
+++ b/core/static/core/navbar.scss
@@ -126,10 +126,13 @@ nav.navbar {
 
       ul.content {
         list-style-type: none;
-        box-shadow: 3px 3px 3px 0 #dfdfdf;
         background: white;
         margin: 0;
 
+        @media (min-width: 500px) {
+          box-shadow: 3px 3px 3px 0 #dfdfdf;
+        }
+
         >li>a {
           display: flex;
           padding: 15px 20px;
diff --git a/core/templates/core/base.jinja b/core/templates/core/base.jinja
index 8000b1fa..70e3bad1 100644
--- a/core/templates/core/base.jinja
+++ b/core/templates/core/base.jinja
@@ -123,12 +123,19 @@
     {% block script %}
       <script>
         const menuItems = document.querySelectorAll(".navbar details[name='navbar'].menu");
+        const isMobile = () => {
+          return window.innerWidth >= 500;
+        }
         for (const item of menuItems){
           item.addEventListener("mouseover", () => {
-            item.setAttribute("open", "");
+            if (isMobile()){
+              item.setAttribute("open", "");
+            }
           })
           item.addEventListener("mouseout", () => {
-            item.removeAttribute("open");
+            if (isMobile()){
+              item.removeAttribute("open");
+            }
           })
         }