Dark toned header on mobile


When I view my page - www.beyondrational.com - on mobile, the header has a dark overlay.

I would like the header to behave similar to when the site is viewed on desktop - where the header area is transparent.

also, is it possible to turn the hamburger menu into sticky on mobile?


Hello Morten,

To accomplish it, try adding this CSS code to Appearance > Customize > Additional CSS from dashboard.

    @media only screen and (max-width: 1199px) {
      .menuStyle1.page-template-template_page-builder .site-header {
        background-color: #fff;
      .menuStyle1 .mobile-menu-toggle_lines:before, .menuStyle1 .mobile-menu-toggle_lines:after {
        background-color: #000 !important;

    @media only screen and (max-width: 1023px) {
      .site-header {
        position: fixed !important;


Sir I want to change transparent color how can I change it to transparent