Header not inline on mobile

Even though the option is selected when customizing the home page, the menu simply will not fall in line with the logo on mobile and tablet devices. It automatically centers it on the page. I have other CSS and plugins, of course, and I don’t know what’s messing it up. My website is alphamooseediting.com.

Hello there,

Try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (max-width:767px){
            
      .header-wrap .container{
        text-align: left;
      }

      .header-wrap .btn-menu{
        float: right;
        margin-right: 15px;
      }  

      .header-wrap .col-md-4 {
        max-width: 90%;
        position: relative;
        z-index: 2;
      }

      .header-wrap .col-md-8 {
        margin-top: -50px;       
      }        

      #mainnav-mobi {
        top: 70px;
      }
      
    }

Regards,
Kharis