diff --git a/src/components/navbar.scss b/src/components/navbar.scss
index c7c2e84..eda26f7 100644
--- a/src/components/navbar.scss
+++ b/src/components/navbar.scss
@@ -26,6 +26,20 @@ nav {
 
     font-size: var(--nav-font-size);
 
+    div.sec-left {
+        @media (max-width: 475px) {
+            div {
+                display: none;
+            }
+        }
+
+        @media (max-width: 310px) {
+            img {
+                display: none;
+            }
+        }
+    }
+
     a:hover, button:hover {
         @apply text-yellow-400;
         font-weight: 500;
diff --git a/src/components/navbar.tsx b/src/components/navbar.tsx
index d6e8db2..abec827 100644
--- a/src/components/navbar.tsx
+++ b/src/components/navbar.tsx
@@ -20,7 +20,7 @@ export default function NavBar() {
     return (
         <nav ref={nref}>
             <div className=" max-w-[100rem] pnav lg:mx-auto xl:px-16">
-                <div className="flex items-center gap-4">
+                <div className="flex items-center gap-4 sec-left">
                     <img className="h-10" src="/favicon.ico"/>
                     <div className=" border p-2 font-montserrat">LUGVITC</div>
                 </div>