
.snowflake {
	--size        : 1vw;
	width         : var(--size);
	height        : var(--size);
	background    : white;
	border-radius : 50%;
	position      : absolute;
	top           : -5vh;
}

@keyframes snowfall {
	0% {
		transform : translate3d(var(--left-ini), 0, 0);
	}
	100% {
		transform : translate3d(var(--left-end), 110vh, 0);
	}
}

.snowflake:nth-child(1) {
	--size          : 0.8vw;
	--left-ini      : -7vw;
	--left-end      : -1vw;
	left            : 60vw;
	animation       : snowfall 11s linear infinite;
	animation-delay : -8s;
}

.snowflake:nth-child(2) {
	--size          : 0.6vw;
	--left-ini      : 0vw;
	--left-end      : -2vw;
	left            : 1vw;
	animation       : snowfall 8s linear infinite;
	animation-delay : -6s;
}

.snowflake:nth-child(3) {
	--size          : 0.4vw;
	--left-ini      : 1vw;
	--left-end      : -8vw;
	left            : 67vw;
	animation       : snowfall 6s linear infinite;
	animation-delay : -7s;
}

.snowflake:nth-child(4) {
	--size          : 0.6vw;
	--left-ini      : 1vw;
	--left-end      : 8vw;
	left            : 88vw;
	animation       : snowfall 10s linear infinite;
	animation-delay : -1s;
}

.snowflake:nth-child(5) {
	--size          : 0.4vw;
	--left-ini      : 2vw;
	--left-end      : 9vw;
	left            : 37vw;
	animation       : snowfall 6s linear infinite;
	animation-delay : -9s;
}

.snowflake:nth-child(6) {
	--size          : 0.4vw;
	--left-ini      : -6vw;
	--left-end      : -6vw;
	left            : 87vw;
	animation       : snowfall 12s linear infinite;
	animation-delay : -2s;
}

.snowflake:nth-child(7) {
	--size          : 0.2vw;
	--left-ini      : -1vw;
	--left-end      : 9vw;
	left            : 56vw;
	animation       : snowfall 13s linear infinite;
	animation-delay : -6s;
}

.snowflake:nth-child(8) {
	--size          : 0.6vw;
	--left-ini      : -3vw;
	--left-end      : 5vw;
	left            : 13vw;
	animation       : snowfall 12s linear infinite;
	animation-delay : -9s;
}

.snowflake:nth-child(9) {
	--size          : 0.6vw;
	--left-ini      : -7vw;
	--left-end      : 9vw;
	left            : 89vw;
	animation       : snowfall 13s linear infinite;
	animation-delay : -2s;
}

.snowflake:nth-child(10) {
	--size          : 0.6vw;
	--left-ini      : -4vw;
	--left-end      : 5vw;
	left            : 78vw;
	animation       : snowfall 14s linear infinite;
	animation-delay : -5s;
}

.snowflake:nth-child(11) {
	--size          : 1vw;
	--left-ini      : 6vw;
	--left-end      : -3vw;
	left            : 79vw;
	animation       : snowfall 14s linear infinite;
	animation-delay : -5s;
}

.snowflake:nth-child(12) {
	--size          : 0.2vw;
	--left-ini      : -2vw;
	--left-end      : 3vw;
	left            : 14vw;
	animation       : snowfall 13s linear infinite;
	animation-delay : -1s;
}

.snowflake:nth-child(13) {
	--size          : 1vw;
	--left-ini      : 7vw;
	--left-end      : -6vw;
	left            : 38vw;
	animation       : snowfall 12s linear infinite;
	animation-delay : -9s;
}

.snowflake:nth-child(14) {
	--size          : 0.2vw;
	--left-ini      : 0vw;
	--left-end      : 6vw;
	left            : 22vw;
	animation       : snowfall 10s linear infinite;
	animation-delay : -9s;
}

.snowflake:nth-child(15) {
	--size          : 1vw;
	--left-ini      : 9vw;
	--left-end      : 10vw;
	left            : 21vw;
	animation       : snowfall 10s linear infinite;
	animation-delay : -6s;
}

.snowflake:nth-child(16) {
	--size          : 0.2vw;
	--left-ini      : 5vw;
	--left-end      : -1vw;
	left            : 28vw;
	animation       : snowfall 14s linear infinite;
	animation-delay : -5s;
}

.snowflake:nth-child(17) {
	--size          : 1vw;
	--left-ini      : -4vw;
	--left-end      : 10vw;
	left            : 40vw;
	animation       : snowfall 8s linear infinite;
	animation-delay : -3s;
}

.snowflake:nth-child(18) {
	--size          : 0.6vw;
	--left-ini      : 9vw;
	--left-end      : 9vw;
	left            : 98vw;
	animation       : snowfall 10s linear infinite;
	animation-delay : -5s;
}

.snowflake:nth-child(19) {
	--size          : 0.6vw;
	--left-ini      : -7vw;
	--left-end      : 9vw;
	left            : 83vw;
	animation       : snowfall 10s linear infinite;
	animation-delay : -3s;
}

.snowflake:nth-child(20) {
	--size          : 0.4vw;
	--left-ini      : 6vw;
	--left-end      : -9vw;
	left            : 19vw;
	animation       : snowfall 14s linear infinite;
	animation-delay : -10s;
}

.snowflake:nth-child(21) {
	--size          : 0.4vw;
	--left-ini      : -9vw;
	--left-end      : 2vw;
	left            : 11vw;
	animation       : snowfall 9s linear infinite;
	animation-delay : -7s;
}

.snowflake:nth-child(22) {
	--size          : 0.2vw;
	--left-ini      : 2vw;
	--left-end      : 7vw;
	left            : 65vw;
	animation       : snowfall 13s linear infinite;
	animation-delay : -10s;
}

.snowflake:nth-child(23) {
	--size          : 0.8vw;
	--left-ini      : 1vw;
	--left-end      : -3vw;
	left            : 9vw;
	animation       : snowfall 13s linear infinite;
	animation-delay : -4s;
}

.snowflake:nth-child(24) {
	--size          : 0.8vw;
	--left-ini      : -1vw;
	--left-end      : -4vw;
	left            : 89vw;
	animation       : snowfall 8s linear infinite;
	animation-delay : -6s;
}

.snowflake:nth-child(25) {
	--size          : 0.2vw;
	--left-ini      : 3vw;
	--left-end      : 2vw;
	left            : 8vw;
	animation       : snowfall 15s linear infinite;
	animation-delay : -8s;
}

.snowflake:nth-child(26) {
	--size          : 0.4vw;
	--left-ini      : 4vw;
	--left-end      : 2vw;
	left            : 56vw;
	animation       : snowfall 8s linear infinite;
	animation-delay : -1s;
}

.snowflake:nth-child(27) {
	--size          : 1vw;
	--left-ini      : 6vw;
	--left-end      : -9vw;
	left            : 14vw;
	animation       : snowfall 7s linear infinite;
	animation-delay : -9s;
}

.snowflake:nth-child(28) {
	--size          : 0.6vw;
	--left-ini      : -3vw;
	--left-end      : 6vw;
	left            : 67vw;
	animation       : snowfall 7s linear infinite;
	animation-delay : -8s;
}

.snowflake:nth-child(29) {
	--size          : 1vw;
	--left-ini      : -5vw;
	--left-end      : -5vw;
	left            : 37vw;
	animation       : snowfall 11s linear infinite;
	animation-delay : -5s;
}

.snowflake:nth-child(30) {
	--size          : 1vw;
	--left-ini      : -3vw;
	--left-end      : -4vw;
	left            : 22vw;
	animation       : snowfall 11s linear infinite;
	animation-delay : -2s;
}

.snowflake:nth-child(31) {
	--size          : 0.4vw;
	--left-ini      : -9vw;
	--left-end      : 7vw;
	left            : 64vw;
	animation       : snowfall 14s linear infinite;
	animation-delay : -7s;
}

.snowflake:nth-child(32) {
	--size          : 0.4vw;
	--left-ini      : 5vw;
	--left-end      : 8vw;
	left            : 81vw;
	animation       : snowfall 9s linear infinite;
	animation-delay : -9s;
}

.snowflake:nth-child(33) {
	--size          : 0.8vw;
	--left-ini      : 1vw;
	--left-end      : -3vw;
	left            : 51vw;
	animation       : snowfall 10s linear infinite;
	animation-delay : -9s;
}

.snowflake:nth-child(34) {
	--size          : 1vw;
	--left-ini      : -9vw;
	--left-end      : -4vw;
	left            : 2vw;
	animation       : snowfall 13s linear infinite;
	animation-delay : -4s;
}

.snowflake:nth-child(35) {
	--size          : 1vw;
	--left-ini      : -2vw;
	--left-end      : 2vw;
	left            : 48vw;
	animation       : snowfall 15s linear infinite;
	animation-delay : -1s;
}

.snowflake:nth-child(36) {
	--size          : 0.4vw;
	--left-ini      : 0vw;
	--left-end      : -4vw;
	left            : 4vw;
	animation       : snowfall 6s linear infinite;
	animation-delay : -4s;
}

.snowflake:nth-child(37) {
	--size          : 1vw;
	--left-ini      : -1vw;
	--left-end      : -2vw;
	left            : 63vw;
	animation       : snowfall 15s linear infinite;
	animation-delay : -10s;
}

.snowflake:nth-child(38) {
	--size          : 0.6vw;
	--left-ini      : -7vw;
	--left-end      : -6vw;
	left            : 6vw;
	animation       : snowfall 12s linear infinite;
	animation-delay : -6s;
}

.snowflake:nth-child(39) {
	--size          : 1vw;
	--left-ini      : 10vw;
	--left-end      : -5vw;
	left            : 19vw;
	animation       : snowfall 14s linear infinite;
	animation-delay : -5s;
}

.snowflake:nth-child(40) {
	--size          : 0.8vw;
	--left-ini      : 6vw;
	--left-end      : 0vw;
	left            : 40vw;
	animation       : snowfall 13s linear infinite;
	animation-delay : -4s;
}

.snowflake:nth-child(41) {
	--size          : 0.6vw;
	--left-ini      : -5vw;
	--left-end      : -4vw;
	left            : 71vw;
	animation       : snowfall 12s linear infinite;
	animation-delay : -6s;
}

.snowflake:nth-child(42) {
	--size          : 1vw;
	--left-ini      : 7vw;
	--left-end      : -4vw;
	left            : 82vw;
	animation       : snowfall 11s linear infinite;
	animation-delay : -6s;
}

.snowflake:nth-child(43) {
	--size          : 0.4vw;
	--left-ini      : -5vw;
	--left-end      : 0vw;
	left            : 55vw;
	animation       : snowfall 6s linear infinite;
	animation-delay : -8s;
}

.snowflake:nth-child(44) {
	--size          : 1vw;
	--left-ini      : 2vw;
	--left-end      : -2vw;
	left            : 76vw;
	animation       : snowfall 9s linear infinite;
	animation-delay : -2s;
}

.snowflake:nth-child(45) {
	--size          : 0.8vw;
	--left-ini      : -2vw;
	--left-end      : -1vw;
	left            : 23vw;
	animation       : snowfall 12s linear infinite;
	animation-delay : -8s;
}

.snowflake:nth-child(46) {
	--size          : 0.2vw;
	--left-ini      : 0vw;
	--left-end      : 6vw;
	left            : 28vw;
	animation       : snowfall 13s linear infinite;
	animation-delay : -3s;
}

.snowflake:nth-child(47) {
	--size          : 0.4vw;
	--left-ini      : 0vw;
	--left-end      : 7vw;
	left            : 54vw;
	animation       : snowfall 6s linear infinite;
	animation-delay : -10s;
}

.snowflake:nth-child(48) {
	--size          : 0.4vw;
	--left-ini      : -4vw;
	--left-end      : 4vw;
	left            : 70vw;
	animation       : snowfall 9s linear infinite;
	animation-delay : -6s;
}

.snowflake:nth-child(49) {
	--size          : 0.8vw;
	--left-ini      : -5vw;
	--left-end      : 1vw;
	left            : 96vw;
	animation       : snowfall 15s linear infinite;
	animation-delay : -10s;
}

.snowflake:nth-child(50) {
	--size          : 0.6vw;
	--left-ini      : -4vw;
	--left-end      : 10vw;
	left            : 77vw;
	animation       : snowfall 10s linear infinite;
	animation-delay : -10s;
}

/* added small blur every 6 snowflakes*/
.snowflake:nth-child(6n) {
	filter : blur(1px);
}

.snow, .snow:before, .snow:after {
	position         : absolute;
	inset            : 0;
	top              : -700px;

	background-image : radial-gradient(10px 10px at 482px 518px, rgba(255, 255, 255, 0.9) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(8px 8px at 303px 586px, rgba(255, 255, 255, 1.0) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(9px 9px at 251px 475px, rgba(255, 255, 255, 1.0) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(7px 7px at 336px 450px, rgba(255, 255, 255, 0.85) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(8px 8px at 184px 154px, rgba(255, 255, 255, 1.0) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(6px 6px at 425px 23px, rgba(255, 255, 255, 0.9) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(10px 10px at 30px 200px, rgba(255, 255, 255, 0.95) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(8px 8px at 109px 491px, rgba(255, 255, 255, 0.85) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(7px 7px at 542px 130px, rgba(255, 255, 255, 1.0) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(8px 8px at 462px 348px, rgba(255, 255, 255, 0.85) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(7px 7px at 474px 532px, rgba(255, 255, 255, 0.8) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(8px 8px at 62px 48px, rgba(255, 255, 255, 0.75) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(10px 10px at 289px 318px, rgba(255, 255, 255, 0.9) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(7px 7px at 369px 205px, rgba(255, 255, 255, 0.9) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(8px 8px at 201px 566px, rgba(255, 255, 255, 1.0) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(10px 10px at 353px 137px, rgba(255, 255, 255, 1.0) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(8px 8px at 422px 63px, rgba(255, 255, 255, 0.9) 50%, rgba(0, 0, 0, 0)),
	radial-gradient(7px 7px at 540px 398px, rgba(255, 255, 255, 0.75) 50%, rgba(0, 0, 0, 0));

	background-size  : 700px 700px; /* größerer „Tile“-Bereich */
	animation        : snow 3.5s linear infinite;
	content          : "";
}

.snow:after {
	margin-left         : -220px;
	opacity             : .45;
	animation-duration  : 6.5s;
	animation-direction : reverse;
	filter              : blur(3px);
}

.snow:before {
	margin-left         : -320px;
	opacity             : .65;
	animation-duration  : 9.5s;
	animation-direction : reverse;
	filter              : blur(1.5px);
}

@keyframes snow {
	to { transform : translateY(700px); }
	/* Strecke ⇡ passend zur background-size */
}

.snow-wrapper {
	width    : 100vw;
	height   : 1750px;
	overflow : clip;
	position : absolute;
	top      : 0;
}

.snow-wrapper-thankyou {
	width    : 100vw;
	height   : 1000px;
	overflow : clip;
	position : absolute;
	top      : 0;
}
  