/* components/background/snow/index.wxss */
@keyframes fall {
	from {
		transform: translateY(-10px) rotate(0);
	}

	to {
		transform: translateY(100vh) rotate(1800deg);
	}
}

page {
	width: 100%;
	height: 100%;
	position: fixed;
}

.snowflakes {
	width: 100%;
	height: 100%;
	z-index: -1;
	overflow: hidden;
	position: absolute;

	.snowflake {
		width: 10px;
		height: 10px;
		display: block;
		position: absolute;
		animation: fall linear infinite;
	
		&::before,
		&::after {
			content: '';
			position: absolute;
			background: rgba(255, 122, 155, .8);
		}
		
		&::before {
			top: 45%;
			left: 0;
			width: 100%;
			height: 10%;
		}
		
		&::after {
			left: 45%;
			width: 10%;
			height: 100%;
		}
	}
}