Header menu acting strange at specific page widths - Dawn Theme

[MagdalenaBB]

Hello! We have a header menu which looks very bad when the page width is between 990 px and 1125 px. The first picture is an illustration of the way it looks, the other picture is the way we intend it to look at all page widths which are 1125px and below. 

Does anyone know how to do this? Thank you in advance 🖤
Website - MAISON MAGDALENA
Password - MaisonMagdalena.222

  - 1

 - 2

[MagdalenaBB]

Correction - it needs to be fixed between 990px to 1125px. 

[PaulNewton]

@MagdalenaBB  use the 3 dots menu on the rightside of your post to edit the original post with clarification of the better description for the needed outcome.

[PaulNewton]

CSS band-aid using a custom-css setting

https://help.shopify.com/en/manual/online-store/themes/theme-structure/extend/add-css 

@media screen and (max-width: 1125px) {
 .header {
   display: grid;
   grid-template-areas: 'left-icons heading icons';
   grid-template-columns: 1fr 2fr 1fr;
   align-items: center;
 }
}

Otherwise backup theme and modify base.css directly to change the grid rules in around line 2431 , .header--middle-center:not(.drawer-menu) ,  or adjust the media query that works use 990px around line 2045

[MagdalenaBB]

Unfortunately, the custom CSS did not work. Thank you anyways!

[PaulNewton]

Per above you may need to  fix the underlying rules in base.css, or try to up the specificity of the rule 

@media screen and (max-width: 1125px) {
 .section-header .header {
   display: grid;
   grid-template-areas: 'left-icons heading icons';
   grid-template-columns: 1fr 2fr 1fr;
   align-items: center;
 }
}

, or force it with "!important",

@media screen and (max-width: 1125px) {
 .header {
   display: grid;
   grid-template-areas: 'left-icons heading icons' !important;
   grid-template-columns: 1fr 2fr 1fr;
   align-items: center;
 }
}

[MagdalenaBB]

Unfortunately it still does not change, even if I call !important;
There must be some underlying issue in the code overriding it.
Thank your for your time.