A little bit responsiveness to header

resources/css/mixins.scss

@@ -18,6 +18,12 @@
   }
 }
 
+@mixin header_overflow {
+  @media screen and (max-width: variables.$header_overflow) {
+    @content;
+  }
+}
+
 @mixin footer_overflow2 {
   @media screen and (max-width: variables.$footer_overflow2) {
     @content;

resources/css/partials/header.scss

@@ -38,6 +38,19 @@
           margin-right: 0;
         }
       }
+
+      @include mixins.header_overflow {
+        display: none;
+      }
+    }
+  }
+
+  .menu {
+    display: none;
+    margin-right: variables.$innerContainerMargin;
+
+    @include mixins.header_overflow {
+      display: block;
     }
   }
 }

resources/css/variables.scss

@@ -1,7 +1,8 @@
 $mobileS: 360px;
 $navbar_overflow: 550px;
-$footer_overflow: 1110px;
+$header_overflow: 730px;
 $footer_overflow2: 880px;
+$footer_overflow: 1110px;
 $main: 1700px;
 $fourK: 2560px;
 
@@ -15,7 +16,7 @@ $sz_m_footer_p: 12px;
 $sz_s_footer_p: 8px;
 
 $clr_header: #01003B;
-$clr_logo: #D6FFFF;
+$clr_logo: #FDFFFF;
 $clr_nav_sleep: #A3C2C2;
 $clr_nav_active: $clr_logo;