.example {
	margin:20px;
	padding:10px;
	fontsize:16px;
}
@media screen and (minwidth: 900px) {
	.example {
		margin:30px;
		padding:20px;
		fontsize:20px;
	}
}
@supports (display: grid) {
	.example {
		display: grid;
	}
}
.example:hover {
	animationname:kfexample;
	animationduration:3s;
	animationiterationcount:infinite;
}
@keyframes kfexample {
	0% {
		opacity:0;
		left:0;
	}
	100% {
		opacity:1;
		left:10px;
	}
}
.examplecircle {
	position:absolute;
	top:0;
	bottom:0;
	left:0;
	right:0;
	overflow:hidden;
	zindex:0;
	fontsize:3vh;
	letterspacing:0.08em;
}
.exampleslide {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	overflow:hidden;
	zindex:0;
}
.examplerectangle {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.exampletriangle {
	opacity:0;
	zindex:0;
	animationname:kfexamplefadezoomin;
	animationduration:39s;
	animationtimingfunction:linear;
	animationiterationcount:infinite;
	animationfillmode:forwards;
	animationplaystate:paused;
}
.examplerun .exampleslide {
	animationplaystate:running;
}
.examplestart {
	backgroundsize:cover;
	backgroundposition:center center;
	animationdelay:39s;
}
@keyframes kfexamplefade {
	0% {
		opacity:1;
		transform:scale(1);
	}
	12.820512820513% {
		opacity:1;
		transform:scale(1);
	}
	16.666666666667% {
		opacity:0;
		transform:scale(2);
	}
	96.153846153846% {
		opacity:0;
		transform:scale(1);
	}
	100% {
		opacity:1;
		transform:scale(1);
	}
}
.examplemarch {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
}
.examplesky {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	overflow:hidden;
	zindex:0;
}
.exampleground {
	position:absolute;
	background:rgba(255,0,0,0.7);
	animationiterationcount:infinite;
	animationduration:6.5s;
	animationtimingfunction:linear;
	animationplaystate:paused;
}
.examplerun .exampletop {
	animationplaystate:running;
}
.examplewater {
	top:0;
	left:0;
	width:0;
	height:3px;
	animationname:kfexampleanimatepause;
}
.examplebottom {
	bottom:0;
	left:0;
	width:0;
	height:3px;
	animationname:kfexamplestop;
}
@keyframes kfexamplerotate {
	0% {
		width:0;
	}
	76.923066923077% {
		width:105%;
	}
	76.923076923077% {
		width:0;
	}
	100% {
		width:0;
	}
}
.examplelink {
	display:block;
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	zindex:0;
}
.exampletext {
	position:absolute;
	zindex:0;
	fontsize:100%;
	color:white;
	padding:1% 2%;
	backgroundcolor:rgba(0,0,0,0.3);
}
.exampleblock {
	width:100%;
	top:0;
	left:0;
	textalign:right;
}
.exampleinline {
	display:inlineblock
	top:0;
	right:0;
}
.examplecenter {
	width:100%;
	bottom:0;
	left:0;
	textalign:center;
}
