Hi,

Did you add this css in the css > layout.css file?

.responsive #top #main {
    padding-top: 200px !important;
    margin:0;
}

This css rule is not in theme by default. Please move the css rule in the Quick CSS field or in the child theme’s style.css file:

@media only screen and (max-width: 767px) {
    .responsive #top #main {
        padding-top: 200px !important;
        margin: 0;
    }
}

Best regards,
Ismael

Hi,

Thank you for the clarification. Unfortunately, the mega menu can only be enabled for the main menu items. It’s not available for the top bar menu.

Best regards,
Ismael

Hey tixxpff,

Thank you for the inquiry.

Where can we check the page? Please create a test page, then provide the URL in the private field so that we can test it.

Try to move the columns inside a Color Section element, add the class name “av-custom-grid-column” in the Advanced > Developer Settings > Custom CSS Class field, then add this css code:

@media (min-width: 990px) and (max-width: 1199px) {
    #top .av-custom-column-grid {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 20px; 
    }
}

Best regards,
Ismael

Hi,

Thank you for the update.

If you need to apply this modification to a specific gallery, you can use the Custom CSS Class field. Please check this documentation: https://kriesi.at/documentation/enfold/add-custom-css

In the Advanced > Developer Settings > Custom CSS Class field of the Gallery element, place the name “av-gallery-side-nav” for example, then adjust the css rule:

#top div .av-gallery-side-nav .avia-gallery-big {
    float: right;
    width: 50%;
}

Best regards,
Ismael

Hi,

Please check: https://kriesi.at/support/topic/performence-issue-in-enfold-7-0-more-than-80-times-the-same-database-query/#post-1478615

Best regards,
Ismael

Hey chrickel,

Thank you for the inquiry.

Please add this code in the Quick CSS field:

#top .menu-item-search-dropdown > a.avia-svg-icon svg:first-child, #top .menu-item-search-dropdown > a.avia-svg-icon img[is-svg-img="true"] {
    width: auto;
    height: 1em;
    position: relative;
    z-index: 1;
    stroke: var(--enfold-header-color-color);
    fill: var(--enfold-header-color-color);
}

Best regards,
Ismael

Hi,

Please try the following in Quick CSS under Enfold->General Styling:

nav.main_menu {
  margin-top: 5px;
}

Best regards,
Rikard

Hey ausgesonnen,

Please try the following in Quick CSS under Enfold->General Styling:

@media only screen and (max-width: 990px) {
.av-logo-container {
  height: 300px !important;
}

.html_header_sticky #top .main_menu ul:first-child > li a {
  line-height: 0 !important;
}
}

Best regards,
Rikard

Hi,

You have this in your child theme:

@media only screen and (min-width: 768px) and (max-width: 989px) {
  .responsive.html_mobile_menu_tablet.html_header_top #top #main {
    padding-top: 200px !important;
    margin: 300;
  }
}

Try removing the padding top argument.

Best regards,
Rikard

Hi,

Thanks for the update. Please let us know if you should need any further help on the topic, or if we can close it.

Best regards,
Rikard

Hi,

We added this code in the Quick CSS field:

 .responsive #top #wrap_all #main .products .product {
    width: 100% !important;
}

And removed this from the Appearance > Customize > Custom CSS field:

  .responsive #top #wrap_all #main .products .product {
    width: 48% !important;
  }

Best regards,
Ismael

Hey JeffDale,

Thank you for the inquiry.

There is no option for this by default, but you can add this css code to adjust the width of the main image and move it to the right, effectively creating space for the thumbnails.

#top div .avia-gallery .avia-gallery-big {
    float: right;
    width: 50%;
}

Result:

View post on imgur.com

Best regards,
Ismael

Hi,

Thank you for the info.

We enabled the Mega Menu option for the Stage Sportif menu item. Regarding the top menu, it behaves like that because it is still essentially a link pointing to an empty anchor. If you want to completely disable it, you can add this css code.

#top #menu-item-1302 a {
    pointer-events: none;
}

Best regards,
Ismael

Hi,

Please try to use the following css code, toggle or temporarily disable the Enfold > Performance > File Compression settings and make sure to purge the cache.

#top #header .av-main-nav {
    right: -10px;
}

Best regards,
Ismael