Two separate logos in header

Hey Martijn,

The only option we have is 1 logo for the regular header and the other logo is for transparent header.

Best regards,
Nikko

Hi Martijn,

You can try using a header widget to add it: https://kriesi.at/documentation/enfold/header/#adding-a-header-widget-area
I think what you did now seems already good, what is the issue you’re having with it?

Best regards,
Nikko

Hi TenMediaNL,

Sure, just let us know if you need further assistance.
If you’re not planning to use transparent headers, I can think of another workaround.

Best regards,
Nikko

Hi Martijn,

Try adding this css code in Quick CSS:

#header .container.av-logo-container {
    z-index: 2;
}

#top #header .widget {
    position: relative;
    width: 1250px;
    max-width: 100%;
    margin: 0 auto;
    padding: 0 50px;
    z-index: 5;
}

#top #header .widget .textwidget {
    position: absolute;
    right: 50px;
}

Best regards,
Nikko

Hi Martijn,

For the tablets burger menu, try adding this css code:

@media only screen and (max-width:1024px) {
  .av_minimal_header #header_main_alternate {
    display: none;
  }

  .html_header_top #top .av_menu_left .main_menu {
    left: auto;
    right: 0;
  }
}

As for hiding the header widget in mobile, use this code:

@media only screen and (max-width:767px) {
  #top #header .widget {
    display: none;
  }
}

Best regards,
Nikko

Hi,

Add this to quick css:

@media only screen and (max-width: 1024px)  {
 #main{
padding-top:155px!important;
}}

Best regards,
Jordan Shannon