Resize header padding when lower 400px & dropdown-toggle margin fix

resources/css/mixins.scss

@@ -24,6 +24,12 @@
   }
 }
 
+@mixin header_overflow3 {
+  @media screen and (max-width: variables.$header_overflow3) {
+    @content;
+  }
+}
+
 @mixin mx_index_brands_fix {
   @media screen and (max-width: variables.$index_brands_fix) {
     @content;

resources/css/variables.scss

@@ -1,5 +1,6 @@
 $header_overflow: 1200px;
 $header_overflow2: 850px;
+$header_overflow3: 360px;
 $index_brands_fix: 1100px;
 $index_brands_fix2: 850px;
 $footer_overflow: 1200px;

resources/styles/main.css

@@ -407,6 +407,11 @@ a:hover {
     padding: 0 50px;
   }
 }
+@media screen and (max-width: 360px) {
+  #header {
+    padding: 0 25px;
+  }
+}
 #header #logo {
   display: flex;
   align-items: center;
@@ -462,7 +467,7 @@ a:hover {
   display: none;
 }
 #header .dropdown-toggle {
-  margin: 0 auto 0;
+  margin: 0;
   width: 36px;
   height: 36px;
   position: relative;