Hey mediafacto,
From the Passster plugin page, it looks like the plugin adds a “Block” to the WordPress Block Editor be used, the Enfold Advanced Layout Builder is a stand alone editor and doesn’t use “Blocks”, when you create a page to can choose the WordPress editor or the Enfold ALB.
I looked in the Passster documentation but I didn’t find any reference to using Passster with the WordPress Classic Editor, so I assume that it is not compatible.
Also please note the typically other builder plugins will conflict with Enfold, so it is not recommend to use the wpbakery builder.

Best regards,
Mike

Hi,
I believe the issue is that the css you tried didn’t account for the parallax option you are using, so try removing the second color section of mobile and allow the first section to show on mobile and then try this css:

@media only screen and (max-width: 767px) { 
#av_section_1.avia-section .av-parallax .av-parallax-inner {
    background-repeat: no-repeat;
    background-image: url(https://hauptwerk-zt.at/wp-content/uploads/2024/01/rendering1_smartp.jpg);
    background-position: 0% 50%;
}
}

This should work, but I recommend adding a custom ID to the first section like: section-mobile-bg then adjust your css.
If you still have trouble please include an admin login in the Private Content area so we can be of more assistance.

Best regards,
Mike

Hi,
Ok, I thought it would be pointing to the issue on your site, I would recommend disabling your customizations and plugins and disable Enfold Theme Options ▸ Performance ▸ JS & CSS file merging and compression for good measure and see if that helps, since the scrolling works on our demo site and my test site.

Best regards,
Mike

Hi,
Unfortunately the min height will need to be adjusted multiple times for the different screen width and the font sixe for the back side will need to be smaller to make up for the lost space. It doesn’t look like there is a “easy” fit for this.
You could use the css above as an example and then use media queries to assign different heights for the different screen sizes that are commonly used, but it won’t be a “fluid” change for all screen sizes.

Best regards,
Mike

Hi,
On this page it looks like a shortcode has been added to a text block element to create the checkout, is this correct?
So I’m not clear what your issue is, do you not see the check box option, or do you see it and it doesn’t work.
From the SureCart plugin page it looks like the plugin adds options to the Gutenberg editor, is this how you are creating the check out form?
Perhaps this is what you did last year and then you copied the shortcode to the page? I don’t think the plugin will add it’s addons into the Advanced Layout Builder text block editor for you to use, try opening a new page and try using the WordPress default editor instead.
If this doesn’t help please explain further and perhaps a screenshots would help since we don’t use the SureCart plugin.

Best regards,
Mike

Hi,
Glad to hear, once you are done creating your site you can either use the theme caching and
– Re-enable JS & CSS file merging and compression
– Re-disable Delete old CSS and JS files
– Re-enable my server cache
or you can use a caching plugin, WP Fastest Cache works good, some people use both the theme cache and a plugin, but sometimes minifying the javascript files twice can cause errors.
I don’t know what you mean by a “cache cleaning plugin”, most caching plugins give you an option to clear its cache, but strangely your 10Web booster plugin did not.
Unless there is anything else we can assist with on this issue, shall we close this thread then?

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,
I see that your
Maximale PHP-Eingabe-Variablen (max_input_vars) is only 5000, try changing it to 10000

Best regards,
Mike

Hi,
I see that you are using PHP v8.3.1, try using v8.2

Best regards,
Mike

Hi,
In the menu item add your unique class name like my-hex-color

Then in your Quick CSS add:

.my-hex-color {
	background-color: #F6BFCA;
}

create a new class name for each new color.

Best regards,
Mike

Hi,
Yes, use a unique class name and add your hex color code to the css, like this:

.my-hex-color {
	background-color: #F6BFCA;
}

Best regards,
Mike

Hey Qgrafica_7,
Please try disabling you 10Web Booster plugin, I believe that it is caching and it doesn’t have an option to clear the cache. Also if your server is caching you will also need to clear this, I recommend disabling your server cache until you are done with the site. Also try disabling Enfold Theme Options ▸ Performance ▸ JS & CSS file merging and compression and enable Enfold Theme Options ▸ Performance ▸ Delete old CSS and JS files to clear this cache.
Once you are done building your site you can enable your 10Web Booster plugin so you won’t have to ffight with the cache.
The only reason you need to add the !important; in your css is because your css doesn’t have enough specifically, most of your css is a single class, and most of the theme css is multiple classes often with a ID included.
I found some css in your Quick CSS to add a background image, but the class you have used is a temporary class that will change when the page is updated:

Best regards,
Mike

Hey Rocuant,
First enable the css classes in the menu items by selecting this option in the menu screen options:

Then add a custom class like “red” to the menu item:

Then add CSS for the menu background color in your Enfold Theme Options ▸ General Styling ▸ Quick CSS field like this:

.red {
	background-color: red;
}

If you want the text color to also be different, like white, add this:

.red .avia-menu-text {
	color: white;
}

This is the expected results:

Then do this for each item.

Best regards,
Mike

Hi,
It looks like you made an error in your css, you wrote 14x; it should be 14px;

Best regards,
Mike

Hi,
Try finding this css that you added:

.responsive #top #header #header_main .inner-container .logo {
    order: 2;
    flex-basis: 30%;
    min-width: 100px;
    max-width: 180px;
    z-index: 9;
}

and change the max-width to suit, such as 250px like this:

.responsive #top #header #header_main .inner-container .logo {
    order: 2;
    flex-basis: 30%;
    min-width: 100px;
    max-width: 250px;
    z-index: 9;
}

but note that the larger the logo is the more it will push down the menu, please see the screenshot in the Private Content area that displays the flex grid for the header to help explain.

Best regards,
Mike