/************ BESTATTERTAG ANIMATIONEN ************/
:root {
	--einblenden-dauer: 0.9s;
	--einblenden-weg: 36px;
	--einblenden-kurve: cubic-bezier(0.22, 0.7, 0.2, 1);
}

body[class~="ivp_active"] :is(.sanftEinblenden, .sanftVonUnten, .sanftVonLinks, .sanftVonRechts, .sanftVergrößern)[class~="ivp"]:not([class~="wivp"]) { opacity: 0; }
body[class~="ivp_active"] .sanftVonUnten[class~="ivp"]:not([class~="wivp"]) { translate: 0 var(--einblenden-weg); }
body[class~="ivp_active"] .sanftVonLinks[class~="ivp"]:not([class~="wivp"]) { translate: calc(var(--einblenden-weg) * -1.6) 0; }
body[class~="ivp_active"] .sanftVonRechts[class~="ivp"]:not([class~="wivp"]) { translate: calc(var(--einblenden-weg) * 1.6) 0; }
body[class~="ivp_active"] .sanftVergrößern[class~="ivp"]:not([class~="wivp"]) { scale: 0.94; }

:is(.sanftEinblenden, .sanftVonUnten, .sanftVonLinks, .sanftVonRechts, .sanftVergrößern)[class~="ivp"] {
	transition:
		opacity var(--einblenden-dauer) ease-out var(--verzoegerung, 0s),
		translate calc(var(--einblenden-dauer) * 1.2) var(--einblenden-kurve) var(--verzoegerung, 0s),
		scale calc(var(--einblenden-dauer) * 1.2) var(--einblenden-kurve) var(--verzoegerung, 0s);
}

.nacheinanderEinblenden > :nth-child(2) { --verzoegerung: 0.12s; }
.nacheinanderEinblenden > :nth-child(3) { --verzoegerung: 0.24s; }
.nacheinanderEinblenden > :nth-child(4) { --verzoegerung: 0.36s; }
.nacheinanderEinblenden > :nth-child(5) { --verzoegerung: 0.48s; }
.nacheinanderEinblenden > :nth-child(n+6) { --verzoegerung: 0.6s; }