/* µCSS Demos — Glittery sparkle. */

.demo-page--glittery .demo-canvas {
	cursor: pointer;
}

.demo-page--glittery .demo-canvas div.glittery {
	position: absolute;
}

@keyframes glittery {
	from {
		background-position-x: -0px;
	}

	to {
		background-position-x: -1056px;
	}
}

div.glittery {
	position: fixed;
	pointer-events: none;
	mix-blend-mode: screen;
	z-index: 12000;
	animation: glittery 0.5s;
	background-image: url(imgs/sprites.png);
	background-image: image-set(url(imgs/sprites.png)1x, url(imgs/sprites@2x.png)2x);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin: -23.5px 0px 0px -23px;
	animation-timing-function: steps(22);
	width: 48px;
	height: 49px;
}

div.glittery.hidden {
	display: none;
	animation: none;
}