Hi Ismael,

it works like a charm!

Thanks again for your work and patience.

As the issue has been solved the topic can be closed :-)

Best regards,

Fabio

Hi Ismael,

thanks for your help! I had some issues with overlays but after some tweaks, it’s just working fine! I also managed to add the Search Icon when the burger menu is visible. I quote the code in case it may be of help :-)

@media only screen and (max-width: 1385px) {
  nav.main_menu {
    display: block !important;
  }
  #avia-menu .menu-item {
    display: none;
  }
  .av-burger-menu-main.menu-item-avia-special {
    display: block;
  }
}

@media only screen and (min-width: 435px) {
.av-hamburger strong {
display: block;
position: absolute;
left: -115px;
top: -42px;
text-transform: uppercase;
font-size: 34px;
}}

@media screen and (max-width: 1380px) and (min-width: 490px) {
#top #menu-item-search {
    display: block !important;
    right: 80px;
}}

@media screen and (max-width: 491px) and (min-width: 435px) {
#top #menu-item-search {
    display: none;
}
}

I have the really last question to ask you: how can i set the burger word “MENU” in a responsive way?
Let me explain better: when I scroll down the browser window (between the resolution range 1090 px – 1523 px) the word “MENU” is not responsive, it just sticks at the top. It doesn’t align with other elements like Search Icon and Menu Icon. I tried to change the position values but nothing changed.

Please find the screenshotted issue on the private content area.

This is the code I’m currently using:

@media only screen and (min-width: 435px) {
.av-hamburger strong {
display: block;
position: absolute;
left: -115px;
top: -42px;
text-transform: uppercase;
font-size: 34px;
}}

Sorry to bother you again and thanks in advance for your time.

Fabio

• This reply was modified 6 years, 3 months ago by MontanariGiulio.