Hi,
I’m not sure what is causing this, but if it is your only issue I added this css to your WordPress ▸ Customize ▸ Additional CSS and it seems to have solved it:

#top #av-burger-menu-ul a {
	color: #7bafe7;
	font-size: 18px;
}
.html_av-overlay-side #top .av-burger-overlay-scroll {
	background-color: #fff;
}
.av-burger-overlay-active #top .av-hamburger-inner, 
.av-burger-overlay-active #top .av-hamburger-inner::before, 
.av-burger-overlay-active #top .av-hamburger-inner::after {
    background-color: #000;
}

Please clear your browser cache and check.
I also checked the placement of the menu overlay and it seems correct for all screen sizes, it is meant to show from the edge of the screen, on desktop your page content is narrow and that is why it seems off a little, I guess we could move it over on larger screens with this css:

@media only screen and (min-width: 1700px) { 
.html_av-overlay-side .av-burger-overlay-scroll {
	right: 20%;
}
}

but that looks odd to me when I test it, you can test in the WordPress ▸ Customize ▸ Additional CSS and see for yourself.

Best regards,
Mike

Hey idelaydis,

Thank you for the inquiry.

There is no option for adjusting font size and color by default, but many email browsers, such as Gmail, provide options to customize font settings. You can use these options to adjust the font size and color according to your preferences.

In Gmail, for example, you can modify the font settings by following these steps:

1. Open Gmail and click on the gear icon in the top-right corner.
2. Select “Settings” from the dropdown menu.
3. In the “General” tab, scroll down to the “Default text style” section.
4. Here, you can adjust the font size, font family, and font color to your liking.
5. Once you have made the desired changes, scroll to the bottom and click on “Save Changes” to apply the modifications.

Please note that the availability and exact location of font customization options may vary across different email clients and browsers. It’s recommended to explore the settings of the specific email client you are using to find the font adjustment options.

Best regards,
Ismael

Hi,
To change the font size of the mobile menu go to Enfold Theme Options ▸ Advanced Styling ▸ Link Menu in overlay/slide out, you can also change the spacing there:

Best regards,
Mike

Hi,
I added this code to your WPCode plugin as a javascript snippt and enabled the header on the three pages and now the burger menu is replaced with the back button you had created at the bottom of those pages, please clear your browser cache and check.

window.addEventListener('DOMContentLoaded', function() {
(function($){
  var button = $('<div class="avia-button-wrap avia-button-right back-button"><a href="https://www.stilecatalini.it/#barche" class="avia-button avia-icon_select-yes-left-icon avia-size-large avia-position-center av-button-notext avia-color-light avia-font-color-white"><span class="avia_button_icon avia_button_icon_left" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span><span class="avia_iconbox_title"></span><span class="avia_button_background avia-button avia-color-theme-color"></span></a></div>');
 if ($("body").hasClass("page-id-738") || $("body").hasClass("page-id-5837") || $("body").hasClass("page-id-5667") == true) {
  $('.main_menu').prepend(button);
  $('.avia-menu.av-main-nav-wrap').css({'display':'none'});
  $('.main_menu').css({'display':'flex','align-items':'center'});
} else {}
})(jQuery);
});

I tested on mobile & desktop and it works.

Best regards,
Mike

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

.av-hamburger strong {
    display: block!important;
    position: absolute;
    font-size: 20px;
    transform: translate(21%, -11%);
    color: #fff;
}

The expected results:

Best regards,
Mike

Hi,
I see that you added the mini font change to the text element, but this is for paragraph text and not headings so to change the H1 size to 8px you could use this css:

@media only screen and (max-width: 479px) {
.responsive #top #wrap_all .all_colors .av-mini-font-size-8 h1 {
    font-size: 8px;
}
}

and change the font size to suit.
Another option is to see the global settings at Enfold Theme Options ▸ General Styling ▸ Typography ▸ Advanced Options: Customize Typography Settings

Best regards,
Mike

Hey biggsuccess,
Thanks but I think that you linked to the Aweber success page and not the landing page.
Nonetheless to make the text larger try some css like this and adjust to suit:

.awpage-text-element,.awpage-signup-form__field-label {
	font-size: 24px;
}

Best regards,
Mike

Hey Intercettazioni,
Thanks for your patience and the link to your site try the following CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field for each request:
1: adjust the font size to suit

#socket {
	font-size: 22px;
}

2:

#top .template-page .entry-content-wrapper h1, 
#top .template-page .entry-content-wrapper h2 {
    letter-spacing: 0;
}

3:

#top #header_main > .container .main_menu .av-main-nav > li#menu-item-search > a {
	color: #000;
}

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

Hey Stilecatalini,
Thanks for your patience and the link to your site, I see your sticky close button at the bottom of your page, but it links to the homepage “Barche” section, so this is more like a “back” button than a “close” button.
Nonetheless to add this button to your three pages venticinque, venticinque-panoramica, ventuno-sport-fisherman and have it hide on scroll down and show on scroll up, add this code to the end of your child theme functions.php file in Appearance ▸ Editor:

function custom_back_button() { ?>
  <script>
(function($){
  var button = $('<div class="avia-button-wrap avia-button-right back-button"><a href="https://www.stilecatalini.it/#barche" class="avia-button avia-icon_select-yes-left-icon avia-size-large avia-position-center av-button-notext avia-color-light avia-font-color-white"><span class="avia_button_icon avia_button_icon_left" aria-hidden="true" data-av_icon="" data-av_iconfont="entypo-fontello"></span><span class="avia_iconbox_title"></span><span class="avia_button_background avia-button avia-color-theme-color"></span></a></div>');
  if ($("body").hasClass("page-id-738") || $("body").hasClass("page-id-5837") || $("body").hasClass("page-id-5667") == true) {
  $(button).prependTo('#wrap_all');
  } else {}
})(jQuery);
  
(function() {
    var doc = document.documentElement;
    var w = window;
    var prevScroll = w.scrollY || doc.scrollTop;
    var curScroll;
    var direction = 0;
    var prevDirection = 0;
    var backButton = document.querySelector('.back-button');
    var checkScroll = function() {
        curScroll = w.scrollY || doc.scrollTop;
        if (curScroll > prevScroll) {
            direction = 2;
        } else if (curScroll < prevScroll) {
            direction = 1;
        }
        if (direction !== prevDirection) {
            toggleButton(direction, curScroll);
        }
        prevScroll = curScroll;
    };
    var toggleButton = function(direction, curScroll) {
        if (direction === 2) {
            backButton.style.opacity=0;
            prevDirection = direction;
        } else if (direction === 1) {
            backButton.style.opacity=1;
            prevDirection = direction;
        }
    };
    window.addEventListener('scroll', checkScroll);
}
)();
</script>
  <?php
}
add_action('wp_footer', 'custom_back_button');

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

.back-button {
    position: fixed;
    top: 1%;
    right: 1%;
    z-index: 999;
    background-color: transparent;
}

Best regards,
Mike

Hi,
Thank you for your patience, I found some errors in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field and I corrected them and added this css:

#top .wpcf7-form input[type='text'],
#top .wpcf7-form input[type='email'],
#top .wpcf7-form input[type='tel'],
#top .wpcf7-form .wpcf7-textarea {
border: 2px solid #222;
background: transparent;
color: #222;
font-family: "HelveticaNeue", "Helvetica Neue", Helvetica, Arial, sans-serif;
font-size: 18px;
line-height: 1em;
padding: 13px!important;
border-radius: 2px;
}

#top .wpcf7-form .wpcf7-submit {
padding: 16px 20px;
border-radius: 2px;
border: 2px solid #222;
background: transparent;
color: #222;
font-size: 0.92em;
min-width: 142px;
}

please clear your browser cache and check.

Best regards,
Mike

Hey Tanja,

Thank you for the inquiry.

You can configure the style of the caption such as the font size and overlay in the Styling > Image Caption toggle. You can also add css to adjust the style of the caption even further. To make the caption italic for example, please add this css code.

.av-image-caption-overlay {
    font-style: italic;
}

Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings in order to ensure that the changes take effect.

Best regards,
Ismael

Hey woogie07,

Thank you for the inquiry.

To adjust the size of the testimonial image and text, as well as move the arrows lower and align them to the center, you can add the following CSS code:

#top .av-large-testimonial-slider .avia-testimonial-meta .avia-testimonial-image {
    width: 180px;
    height: 180px;
}

#top .av-large-testimonial-slider .avia-testimonial-meta-mini {
    line-height: 2.8em;
    padding-top: 30px;
}

#top .av-large-testimonial-slider .avia-slideshow-arrows a {
    top: 70px;
    margin-top: -1px;
    opacity: 0.1;
    font-size: 45px;
}

Please make sure to toggle or temporarily disable the Enfold > Performance > File Compression settings to make sure that the changes take effect.

Best regards,
Ismael

Hi,
When I check the numbers I see that you are using css to make the font size 14px below 850px and above that they are 24px:

@media only screen and (max-width: 850px) {
#top .VuK-IconList-numbers li .iconlist-char:before {
    font-family: 'PT Sans',Helvetica,serif;
    font-size: 14px;
    font-weight: bold;
    position: relative;
    bottom: 2px;
}
}

Perhaps you just added this after you asked the question, but it seems to be working for me.
As for your first question, I don’t see a second icon list element, I see a hotspot element, but I thought it was only a test, perhaps if you explain further with some context and a admin login it would make more sense, but right now I think the one iconlist #Ablaufschritte element looks fine on both desktop and mobile and I would remove the hotspot element.

Best regards,
Mike

Hi,
To change the font size of the red text in your screenshot Try this CSS in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field:

#top #header #menu-item-search .ajax_search_response a.av_ajax_search_entry {
    font-weight: bold;
    text-transform: uppercase;
    font-size: 14px;
    line-height: 1.2em;
}

After applying the css, please clear your browser cache and check.
This is the expected result:

Best regards,
Mike