Hey Munford,
Glad to hear that you have this sorted out, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike

Hi,
Ok, with the changes above the fallback image shows for me on Android, I don’t have an iPhone.
Try clearing your browser cache following these steps for Safari and note step 4 where you will Clear the History for iPhone

Best regards,
Mike

Hi,
Glad to hear that you have this sorted out, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike

Hi,
Please add this css, and also keep the css Ismael posted:

#top a:hover:where(:not(.wp-element-button,.avia-button)) {
    text-decoration: underline;
    color: #d97d1a!important;
}

Best regards,
Mike

Hi,
video is not supposed to display on mobile devices, I enabled Hide Video On Mobile Devices:

and now the fallback image shows on my Samsung Android.
This video limitation is from the browser and not the theme.

Best regards,
Mike

Hi,
To make the slider title h3 try adding this code to the end of your child theme functions.php file in Appearance ▸ Editor:

function custom_slider_h3_script() { ?>
  <script>
(function($) {
  $(function() {
    function replaceElementTag(targetSelector, newTagString) {
      $(targetSelector).each(function(){
        var newElem = $(newTagString, {html: $(this).html()});
        $.each(this.attributes, function() {
          newElem.attr(this.name, this.value);
        });
        $(this).replaceWith(newElem);
      });
    }
    replaceElementTag('.avia-caption-title.is-h1 h1', '<h3></h3>');
  });
}(jQuery)); 
</script>
  <?php
}
add_action( 'wp_footer', 'custom_slider_h3_script', 99 );

Best regards,
Mike

Hi,
Glad we were able to help, if you have any further questions please create a new thread and we will gladly try to help you. Thank you for using Enfold.

Best regards,
Mike

Hi,

Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field instead:

@media only screen and (max-width: 479px) { 
#top #wrap_all #main h4.av-special-heading-tag,#top #wrap_all #main h6.av-special-heading-tag {
    font-size: 8px;
}
}

adjust the font size to suit

Best regards,
Mike

Hi,
Please login to the support forum and create a new ticket, this thread is not in the correct area for support requests.

Best regards,
Mike

Hi,
When I check I see this error:

The server is temporarily unable to service your request due to maintenance downtime or capacity problems. Please try again later.

Additionally, a 503 Service Unavailable error was encountered while trying to use an ErrorDocument to handle the request.

I recommend checking with your webhost, you might have exceeded your allowed server usage. A 503 error is a server error, your webhost will need to check your server, it’s not something that can be changed in the theme.

Best regards,
Mike

Hi,
Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

@media only screen and (max-width: 767px) {
.html_av-overlay-side-classic #top .av-burger-overlay .avia-menu-text {
    font-size: 17px;
}
}

Please ensure to copy the code from the forum and not an email notification so the symbols are not converted.
After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,
I checked the six pages from your backend but still don’t see it, if the above works try adding a media query so it will only work on tablets and desktop, like this:

@media only screen and (min-width: 768px) { 
#main .avia-section {width:1080px; display: block; float: none;
margin: 0 auto;  }
}

or adjust the min-width larger to suit.

Best regards,
Mike

Hi,
I tried to recreate the mega menu like your example on my demo site following the steps above and this was my result:

This is the menu structure in the backend:

Try to change your menu like this.

Best regards,
Mike

Hi,
Try disabling all of your plugins and any custom functions and clear your site and browser cache, if you still think that you have a bug that we can reproduce on our test sites then post it here and we will see if we can reproduce.

Best regards,
Mike

Hi,
If you want the arrows to the side of the image, the image can not be the same size of the content:

@media only screen and (max-width: 767px) {
    .responsive #top .av-large-testimonial-slider.avia-testimonial-wrapper .avia-testimonial {
        padding: 0;
    }
    .avia-testimonial-meta-mini {
    width: 100%;
    }
    #top .avia-slideshow-arrows a {
    	margin: 0;
    }
    .avia-slideshow-arrows a.prev-slide {
    	left: -7%;
    }
    .avia-slideshow-arrows a.next-slide {
    	right: -7% !important;
    }
}

this is the result:

Best regards,
Mike