Hi,

Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

Please change the color value to suit your design.

#top select, 
#top .avia_ajax_form .select, 
#top .entry-content-wrapper select {
    background: #000;
    color: gold;
}

If you do not view the changes please try to hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload” and review the site again.

Best regards,
Vinay

Hi,

Please try the below CSS

/* Sticky header on mobile */
@media only screen and (max-width: 767px) {
  .responsive #top #main {
  	/* Margin top value should be equal to header height*/
    margin-top: 180px;
  }
  .responsive #top #wrap_all #header {
    position: fixed;
  }
}

You can also use a fullwidth submenu element and use the stick to top option in the element.

If you still have an issue provide a precise link to your site, showing the elements in question? We need to be able to inspect them in order to help :)

Best regards,
Vinay

Hey yossi,

Did you manage to get this sorted? I see the Instagram is working and the layout looks fine on my end.

If you still have any issue please clear the cache, re-save the options in the theme settings and let us know if that helps.

Best regards,
Vinay

Hi,

Is this how you like to make the masonry gallery?

Unfortunately, it would require quite some time and customization of the theme to achieve this. However, if you like to get started on your own here is some CSS you can use

#top .av-masonry-entry .av-inner-masonry {
bottom:50%;
}
#top .av-masonry-entry .av-inner-masonry-content {
    width: 60%;
    top:0;
    bottom:0%;
    overflow:hidden;
}

#top .av-masonry-outerimage-container, .av-masonry-image-container {
    left: 40%;
    bottom:0%;
    top:0;
}

I am sorry to tell you that this is not covered by our support. However, if it’s really important for you to get this done, you can always hire a freelancer to do the job for you :)

Best regards,
Vinay

Hi,

Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

@media only screen and (max-width:767px) {
  .responsive #top #main .sidebar {
    display: block;
    border-color: white;
  }

  .responsive #top #main .sidebar .inner_sidebar {
    margin-left: 0;
  }
}

Best regards,
Vinay

Hi,

By color box, I’m assuming you like to position the “color section” background image correct?

Please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

First please add a unique id to the color section developer ID then change the unique ID name in the below code and use it in Enfold > general styling > Quick CSS :)

NOTE: Please change the % value of the position in X and Y axis to adjust the image position.

/* For desktop*/
#top #unique-id {
background-image: url(https://your-site.com/image.jpg)!important;
background-position: 0% 50%!important;
}

/* For mobile */
@media only screen and (max-width: 767px) {
#top #unique-id {
background-image: url(https://your-site.com/image.jpg)!important;
background-position: 0% 50%!important;
}
}

Best regards,
Vinay

Hi,

I have added the below code to Quick CSS

/* submenu color */

#top #header ul li ul li a:hover .avia-menu-text {
    color: #FFF;
}

Please review the site now :)

Best regards,
Vinay

Hi!

The function has been added to your site via FTP. Please review the site and let us know if you have any questions.

Please wait while we update you!

In the meantime could you please provide us with your hosting control panel details, please?

Thank you for using Enfold.

Regards,
Vinay

• This reply was modified 7 years, 4 months ago by Vinay.

Hi,

Please try adding !important to the position rule

/* BG adjustment for Mobile */
@media only screen and (max-width: 767px) {
#top #home-section1 {
background-image: url(https://fwiwappraisals.com/wp-content/uploads/2018/02/bnr-391701547.jpg)!important;
background-position: 0% 50%!important;
}
}

Best regards,
Vinay

Hi,

Thank you for contacting us, Please select 3 under the number of columns.

For further assistance, we request that you create a new ticket on our support form.

Best regards,
Vinay

Hi,

I checked the content slider on the homepage.

You have 2 slides with 3 logos in each and it is showing perfectly fine on your homepage.

What exactly is the issue you are facing?

Best regards,
Vinay

Hi,

The below code is to adjust the image for the mobile view

@media only screen and (max-width: 767px) {
    #top #home-section1 {
        background-image: url(image.jpg)!important; 
        background-position: 50% 50%;
     }
}

Adjust the background position for desktop from color section options or use the below css.

#top #home-section1 {      
        background-position: 0% 50%!important;
     }

Best regards,
Vinay

Hi,

Please update to the latest version, you can change the submenu hover style from Enfold > Advanced styling > Main menu sublevel links

If you like to do it using CSS please try adding this code to the Quick CSS section under Enfold > General Styling or to your child theme’s style.css file:

#top .header_color .main_menu .menu ul li>a:hover {
    color: #333333;
    background: gold;
}

Best regards,
Vinay

Hi,

The code provided by Mike seems to work fine. The mobile menu kicks in at a higher resolution. You may not see the changes until the cached files are cleared in your browser.

Please try to hard refresh by pressing Ctrl + Shift + F5 on your browser or press the F12 key to open chrome dev tools and right click on the refresh button and select “Empty Cache and Hard Reload” and review the site again.

If you still have an issue please try the below code and feel free to adjust the max-width value for the @media query.

/* Activate burger menu */
 @media only screen and (max-width: 1224px) {
#top #header .av-main-nav > li.menu-item  {
    display: none!important;
}
#top #header .av-burger-menu-main {
    cursor: pointer;
    display: block!important;
}}

Best regards,
Vinay

Hey Jackal01,

A plugin conflict may be one of the reasons for this issue.
To find which plugin is causing the conflict please follow these steps:

1. Go to your plugins page > Deactivate all active Plugins
2. Update WordPress and Enfold to the latest version if you have not.
3. Make sure all the plugins are updated.
4. If the problem does not persist when plugins are turned off, activate one plugin at a time and refresh until you find the plugin in conflict.

We await the results of your plugin compatibility test.

Thanks for your cooperation :)

Best regards,
Vinay