Viewing 3 posts - 1 through 3 (of 3 total)
  • Author
    Posts
  • January 8, 2026 at 4:10 pm #1493726
    95mc

    Hi,

    I need the transparent header in mobile. I have add this code that I found in the documentation but can’t works.

    @media only screen and (max-width: 990px) {
    .responsive.html_mobile_menu_tablet #top #wrap_all #header {
    position: absolute;
    }
    .html_mobile_menu_tablet #top #wrap_all .av_header_transparency {
    background: transparent;
    }
    }

    Could you help me?

    Many thanks,

    BR,

    Antonio

    January 9, 2026 at 5:50 am #1493752
    Ismael

    Hey Antonio,

    Thank you for the inquiry.

    You can add this css code to switch the header to transparent in the mobile view.

    @media only screen and (max-width: 767px) {

  /* Add your Mobile Styles here */
  .responsive #top #wrap_all #header {
    position: fixed;
    background: transparent;
  }

  .responsive #top .av_header_transparency.av_alternate_logo_active .logo a>img,
  .responsive #top .av_header_transparency.av_alternate_logo_active .logo a>svg {
    display: none;
  }

  .responsive #top .av_header_transparency .logo .subtext.avia-svg-logo-sub,
  .responsive #top .av_header_transparency .logo img.alternate {
    display: block;
  }

  #top #header.header_color.av_header_transparency .av-main-nav>li>a:hover .av-hamburger-inner,
  #top #header.header_color.av_header_transparency .av-main-nav>li>a:focus .av-hamburger-inner,
  #top #header.header_color.av_header_transparency .av-main-nav>li>a:hover .av-hamburger-inner::before,
  #top #header.header_color.av_header_transparency .av-main-nav>li>a:focus .av-hamburger-inner::before,
  #top #header.header_color.av_header_transparency .av-main-nav>li>a:hover .av-hamburger-inner::after,
  #top #header.header_color.av_header_transparency .av-main-nav>li>a:focus .av-hamburger-inner::after {
    background: var(--enfold-header-color-button-font);
    opacity: 1;
  }

  #top .header_color .av-hamburger-inner,
  #top .header_color .av-hamburger-inner::before,
  #top .header_color .av-hamburger-inner::after {
    background-color: var(--enfold-header-color-button-font);
  }
}

    (see screenshot in the private field)

    Best regards,
    Ismael

    January 9, 2026 at 10:55 am #1493769
    95mc

    Hi Ismael,

    Look good but the pages that have not transparent header the icon burger change color and the page tittle is below the header.
    See the image attach.
    Many thanks,

    BR,

    Antonio.

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)
  • You must be logged in to reply to this topic.