Hi,
Thank you for your question, the above css is for a single product page with a sidebar, but I didn’t find one on your site.
Your screenshot is to a shop page not a product page https://dev. YourSite .com/boutique/ replace YourSite with your actual domain.
so your question is relevant to the thread you linked to and not this thread. Please note that since this is not your thread you will not see anything we write in the Private Content area, it is better to open a new thread.
But I will try to help, so the issue is that on mobile the sidebar is hidden by default and it contans left padding for the desktop version, so for mobile you need to remove the padding also, like this:

@media only screen and (max-width:767px) {
.responsive #top.woocommerce-shop #main .sidebar {
    display: block;
}
.responsive #top.woocommerce-shop #main .sidebar_left .content {
    padding-left: 0;
}
.responsive #top.woocommerce-shop #main .sidebar_left .sidebar {
    border-right-style: none;
}
}

For a single product page the css should be like:

@media only screen and (max-width:767px) {
.responsive #top.single-product #main .sidebar {
    display: block;
}
.responsive #top.single-product #main .sidebar_left .content {
    padding-left: 0;
}
.responsive #top.single-product #main .sidebar_left .sidebar {
    border-right-style: none;
}
}

but I didn’t find one on your site to test, if this doesn’t help then please open a new thread with a link to your single product page with a sidebar so we can assist with an updated solution, this will also help future users with finding the solution.

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

Hey Susanne,
Please try this code in the General Styling ▸ Quick CSS field or in the WordPress ▸ Customize ▸ Additional CSS field:

#footer h3.widgettitle {
	font-size: 10px;
}

and adjust the font size to suit, then clear your browser cache and any cache plugin, and check.
If this doesn’t help please include the url to your site so we can take a closer look.

Best regards,
Mike

Hi,
Thank you, for the cart on a transparent header I added this:

@media only screen and (min-width: 767px) { 
#top .av_header_transparency .av-main-nav ul#menu-item-shop a.cart_dropdown_link span:before {
	color: #fff;
}
}

For the menu spacing I added this css:

@media only screen and (min-width: 767px) { 
.html_cart_at_menu.html_header_searchicon #menu-item-search.menu-item-search-dropdown {
    padding-right: 0;
}
}

Please clear your browser cache and check.

Best regards,
Mike

Hi,
Hopefully you will be able to sort this out with the plugin, or you could hire a freelancer. 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

Hey Kyle,
Thanks for the link to your site but the login didn’t work for me, nonetheless try this function in your functions.php instead:

function popup_inline_with_no_scroll() { ?>
<script>
(function($) {
  $(window).on('load', function(){
    $('.open-popup-link').addClass('no-scroll');
    $('.open-popup-link').magnificPopup({
      type:'inline',
      midClick: true,
      callbacks: {
        beforeOpen: function () {
          $('body').css("overflow-y", "hidden");
        },
        close: function() {
          $('body').css("overflow-y", "auto");
        },
      },
    });
  });
})(jQuery);
</script>
<?php }
add_action("wp_head", "popup_inline_with_no_scroll");

Then clear your browser cache and any cache plugin, and check.

Best regards,
Mike

Hi,
Glad Ismael could 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,
Glad this helped, I was not able to view your new site because the password seems incorrect, but the gap around the cart is set by the padding in the css above, so you could try adjusting that, on the test site the spacing seemed good, perhaps you have some other css affecting the menu items?

Best regards,
Mike

Hi,
Thanks for the feedback, I believe that I have achieved this on a test page for you, please check this page.
I first made a copy of your page, and copied your slider to “test slider copy” then I removed the background image from the test slider:

then I added this css to your Quick CSS:

#top.page-id-2004 #main {
    background-repeat: no-repeat;
    background-image: url(https://nordicanalytics.dk/wp-content/uploads/2021/11/gbnm.png);
    background-position: 50% 50%;
    background-attachment: fixed;
}

#top.page-id-2004 #layer_slider_1 {
	background: transparent;
    background-color: transparent;
}

please clear your browser cache and check.

Best regards,
Mike

Hi,
Thanks for the login, the reason this didn’t work was because you are forcing jQuery to load in the footer so you were getting an error, to correct I removed the jQuery part of the script and now it works. Although it is disabled as you requested.
This is the new script.

function custom_mobile_homepage() {
    ?>
	<script>
		const mediaQuery = window.matchMedia('(max-width: 480px)');
	if (window.location.pathname == '/' && mediaQuery) {
	   window.location = "/startseite-mobil/";
	}
	</script>
    <?php
}
add_action( 'wp_head', 'custom_mobile_homepage', 10 );

Best regards,
Mike

Hi,
Sorry I don’t believe that I understand what you are trying to achieve, I see the fixed image behind the “Our values” time line, but I don’t understand how you want scroll applied to the layerslider, there is only one slide so your not using the scroll function to switch slides?
Are you trying to have a transparent layerslider element and show the fixed body image behind it? I don’t believe that is possible because the layerslider would have to be placed inside of another element like a color section, but you can’t do that with the layerslider element.

Best regards,
Mike

Hi,
Thank you for the login, to correct the logo interfering with the menu sub-menus I adjusted the script to this:

function hide_lower_half_of_logo_on_scroll() { ?>
    <script>
(function ($) { 
  $('.logo, .logo *').css({'max-height':'269px','height':'269px','width':'131px'});
  $(window).scroll(function() {
    var width = $(window).width(), height = $(window).height();    
    var scroll = $(window).scrollTop();
      if (scroll >= 90 && width >= 768) {
    $('.logo, .logo *').css({'clip-path':'inset(0 0 63% 0)'});
   } else {
    $('.logo, .logo *').css({'clip-path':'none'});
   }
  });
})(jQuery); 
</script>
    <?php
}
add_action('wp_footer', 'hide_lower_half_of_logo_on_scroll');

Now the bottom half of the logo image is hidden with clip-path instead of overflow.

For the anchors landing behind the header you had this function with a negative 50, I changed it to a positive 25 and now it works correctly:

function avf_header_setting_filter_mod($header) {
	$header['header_scroll_offset'] = $header['header_scroll_offset'] + 25;
	return $header;
}
add_filter('avf_header_setting_filter', 'avf_header_setting_filter_mod', 9999, 1);

please clear your browser cache and check.

Best regards,
Mike

Hi,
Glad to hear, for the button try this css:

@media only screen and (max-width: 767px) { 
#top.single-product form.cart {
    margin-top: 20px;
}
}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,
Glad that helped, the plus & percentage signs are using opacity 0.5 so they look faded, to make them the same as the numbers try this css:

#top .avia-no-number {
    opacity: 1;
}

After applying the css, please clear your browser cache and check.

Best regards,
Mike

Hi,
I couldn’t login with the password above to check, but testing the script on my test site didn’t give any errors, try copying the code again from the forum and not an email, or update the password you posted for us so we can try.

Best regards,
Mike