Bei dem Nick ausgesonnen, nehme ich mal an ich kann dir auch deutsch antworten:

Diese Fehler kann sind durch die vielen Media Querries entstanden. Eine Klammer die aufgeht – muß auch wieder geschlossen werden.
Da ich nicht weiß, was du mit deinen Regelen bewerkstelligen wolltest, kann ich auch nicht entscheiden ob der Fehler ein vorzeitiges Schließen der Klammer ist, oder eine überflüßig gesetzte Klammer ist.
Im Beispiel oben ob diese Regel nur unterhalb von 767px gelten soll oder eben generell:

.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table td, 
.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table th {
	padding: 0;
}

Davon ist abhängig ob die Klammer oben zu früh geschlossen wurde, oder ob die andere zu viel ist. etc.
Da die Fehler mannigfaltig sind, empfehle ich alle zu entfernen. Die jenigen die leicht als korrekt zu erkennen sind wieder einzufügen. Also die nicht in media-querries gesetzt sind und auf/zu gehen.

Und dann neu zu überdenken, was gemacht werden muss.

PS: um solche Fehler in Zukunft zu vermeiden; immer die Regeln, die du neu hinzufügen willst ganz an das Ende der Quick css zu setzen – niemals so zwischen drin reinzuschmeißen. Das birgt in sich Fehler Quellen. Dann am Ende – sortieren und die Media-Querries zusammenführen.

Ansonsten musst du eventuell auf die Hilfe eines Mods hoffen, der sich einloggt, und die verschiedenen Möglichkeiten durchspielt.

__________

With the nickname ausgesonnen, I assume I can also answer you in German:

These errors can be caused by the many media queries. A bracket that opens – must also be closed again.
Since I don’t know what you wanted to achieve with your rules, I can’t decide whether the error is a premature closing of the bracket or a bracket that was set superfluously.
In the example above whether this rule should only apply below 767px or in general:

.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table td, 
.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table th {
	padding: 0;
}

It depends on whether the bracket at the top was closed too early, or whether the other one is too much, etc.
Since the errors are manifold, I recommend removing all of them. The ones that are easy to recognize as correct should be reinserted. So the ones that are not set in media-querries and open/close.

And then rethink what needs to be done.

PS: to avoid such mistakes in the future; always put the rules you want to add at the end of the quick css – never throw them in between. This is a source of errors. Then at the end – sort and merge the media queries.

Otherwise, you may have to hope for the help of a mod who logs in and runs through the various options.

this is hard to say – because i do not know where to close an opended media query on your code, because I don’t know whether these errors occurred because you inserted a new media query rule into an existing one or simply forgot to put a closing bracket.

So i can’t tell you whether you should remove it where i wrote “closed too early?” (because then the bracket at “or an additional superfluous bracket” would be correct. Or just remove that bracket ( at “closed too early?”) . That depends on the intention of what you want to achieve. Both leads to a working code but do different things.

in other words :
i do not know if you like to have:

@media only screen and (max-width: 767px) {
	.responsive #top.page-id-472 .avia_responsive_table .avia-data-table tr:first-child th {
		display: block;
	}
	.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table td, 
	.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table th {
		padding: 0;
	}
} 

or that:

@media only screen and (max-width: 767px) {
	.responsive #top.page-id-472 .avia_responsive_table .avia-data-table tr:first-child th {
		display: block;
	}
} 
.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table td, 
.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table th {
	padding: 0;
}

etc.
_______

So, if I no longer knew exactly what belonged to which intention, I would first remove everything. Then reinsert the ones that are unproblematic (opening and closing brackets that are clear ) and then add the media queries step by step.

In most cases it happens with media-query instructions. A bracket that is forgotten to be closed or one that is set too much.

here is one extra – or before the closing media query bracket is set to early?

.responsive #top.page-id-472 div .avia_responsive_table .avia-data-table td, .responsive #top.page-id-472 div .avia_responsive_table .avia-data-table th {
padding: 0;
}
}

next here is an opening bracket – with no closing ( i do not know if all the rest should be inside the media query – or if you like to close directly after that)

@media only screen and (max-width: 767px) {
	#top .avia-icongrid.av-flex-cells.av-break-989 .av-icon-cell-item {
		flex: 1 1 100%;
	}

.av-burger-menu-main.menu-item-avia-special {
display: block;
}
}

Actually, you have already described it in sufficient detail above. Just to be on the safe side, there are posts that belong to both categories.
As you can see here on an example page, I chose the “and” in the logic, and in fact only those posts are listed that belong to both categories. So I cannot confirm this behavior.

https://webers-testseite.de/blog/

I will now test the masonry element you mentioned underneath. …

You can see that the Masonry also shows the same posts as the blog post element. ( of course the sorting option no longer makes sense here )

PS: btw. i want to test the magazine element too – but it does not have that logic option. Maybe a good idea to have it here too.

This is more difficult than you think. Because a shadow cast on these svg dividers would be directed outwards. But that would mean casting a shadow upwards over the film. If I understand you correctly, however, the shadow should be directed downwards; but that means an inset shadow on the svg itself, and only on one edge.

It is possible – albeit with some effort – by creating a custom SVG divider. To do this, you should familiarize yourself a little with how to integrate them into the general process.

If you take a look at the example page with developer tools, you will see how it works.
The svg has two identical polygons (red), but I fill one of them with a gradient (green arrow) that goes from black to white; however, the white only has 0% coverage at the end. This white must later be replaced by the color of the following section via the ID of the stop-color using quick css.

in my example page i gave to the section a custom class to better select that svg:
( benefit is now that we can select from outside the inner gradient )

.avia-section.shadow-special #nextBGColor {
  stop-color: #083a96 !important;
}

next : how to have custom svg dividers …

But both are not present now!
neither this: https://sample-page.li/wp-content/themes/enfold/style.css
nor that https://sample-page.li/wp-content/themes/enfold-child/style.css

If you use the same function name more than once (ava_custom_script_group_lightbox), an error is also displayed – but with a different message. Function names must be unique.

btw. i would have finished the variable setting with a semicolon – but as said above – no error on using it without.
var accordion = $('.accordion-lightbox-group') ;

oh sorry – then I misunderstood your request. To me it sounds like you want to see the icons inside the mobile menu as well (hamburger menu). – The above way is a quick and easy way to have this for small social icon lists. I didn’t see that these are hidden below. of 479px.

__________

or try to preserve the social-bookmarks on the same place – because even on 280px screenwidth ( most mobile phones got 320px and more ) the logo does not overlap that area:

@media only screen and (max-width: 989px) {
  .responsive.av-burger-overlay-active #top #header .main_menu .social_bookmarks a {
    color: #FFF;
  }
/** if you had changed the phone-info input field - see at bottom of my message **/
  .phone-info .header-meta-mail {
    display: none;
  }
}

@media only screen and (max-width: 479px) {
  .responsive #top #wrap_all .main_menu .social_bookmarks {
    display: block !important;
  }
  .responsive #top #wrap_all .main_menu .avia-menu .av-burger-menu-main {
    border-color: #1b5289;
    padding-right: 15px;
    margin-right: 5px;
    border-right-width: 1px;
    border-right-style: solid;
    transition: border-color 0.2s ease-in-out;
  }
}

but i guess you have to change then a bit your phone-info input field. The standard behavior of enfold between 768px and 989px here in your setting is to show the burger icon and the social-bookmarks besides each other and to hide header_meta social bookmarks, so the “of mail” is obsolete on top then.
maybe you can do this:
<div><a href="tel: +31595729729">Bel 0595 729 729</a><a class="header-meta-mail" href="https://noorderwindbewindvoering.nl/contact/#contactformulier"> of mail</a></div>
– and with that class we can hide it on demand

or in my opinion better – just to add the binding word to e-mail bookmark without link:
<div><a href="tel: +31595729729">Bel 0595 729 729</a><span class="header-meta-mail"> of mail</span></div>

yes – where is the leading:
function ava_custom_script_group_lightbox()

on : link

put this to your quick css:

@media only screen and (max-width: 989px) {
  .responsive.av-burger-overlay-active #top #header .main_menu .social_bookmarks a {
    color: #FFF;
  }
}

What happens if you declare that page (blue) as start page on : Enfold (Child) – Theme Options – Frontpage Settings ?

but – in this case i had to see the page it belongs to – because on my testpage i do not see such a hem (un ourlet à droite).
maybe you set only a border-radius for left side.

border-radius: 50px 0px 0px 50px; it begins with top/left and goes clock-wise.
and btw. why don’t you set for the background a transparency – then it will be ok for transparency headers too:

#top #wrap_all #menu-item-2862 .avia-menu-text {
	border-left: 5px solid;
	border-radius: 50px 0px 0px 50px;
	border-color: #D60B52;
	background-color: transparent;
	padding: 15px 0px 15px 15px;
}

you belong to such a page: https://kriesi.at/themes/enfold-2017/blog/blog-masonry/

and you have allready set this:

… just a moment
on your starting page you got those standard settings. For example h2 : 28px font-size
on your “clone” you got a alb declared font-size:

to give better advice – it might be nice if you switch of merging. Because then we can see what source css is responsible for that behavior.

Are you shure that this isn’t a caching problem? Have you any caching tools installed.

i changed the code on my example page – but i do not know how to hide mfp-bottom-bar if mfp-title is empty.