section{
	width: 450px;
	margin: 30px auto;
	font-family: "KVBD" "MENROB";
}
input[type="radio"]{display:none;}
.stopwatch{text-align: center;}
.stopwatch .cell{
	width: 35px;
	height: 35px;
	text-align: center;
	overflow: hidden;
	display: inline-block;
}
.stopwatch .cell .num {
	font-size: 35px;
	line-height: 35px;
	color: #fff;
	display: block;
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
}
.control {
	text-align: center;
	margin-top: 30px;
}
.control label {
	border: 5px solid;
	font-size:30px;
	font-weight: 600;
	padding: 10px;
	margin: 0 10px;
	display: inline-block;
	cursor: pointer;
	width: 90px;
	letter-spacing: 1px;
	-webkit-transition: all 1s ease-in-out;
	        transition: all 1s ease-in-out;
}
.control label[for="start"] {
	color: green;
}
.control label[for="stop"] {
	color: white;
}
.control label[for="reset"] {
	color: orange;
}

.ten{
	-webkit-animation-name: ten;
	animation-name: ten;
	-webkit-animation-timing-function: steps(10);
	animation-timing-function: steps(10);
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
}
@-webkit-keyframes ten {
	0%{margin-top: 0;}
	100%{margin-top: -350px;}
}
@keyframes ten {
	0%{margin-top: 0;}
	100%{margin-top: -350px;}
}
.sex{
	-webkit-animation-name: sex;
	animation-name: sex;
	-webkit-animation-timing-function: steps(6);
	animation-timing-function: steps(6);
	-webkit-animation-iteration-count: infinite;
	animation-iteration-count: infinite;
}
@-webkit-keyframes sex {
	0%{margin-top: 0;}
	100%{margin-top: -210px;}
}
@keyframes sex {
	0%{margin-top: 0;}
	100%{margin-top: -210px;}
}

.mill {
	-webkit-animation-duration: 0.01s;
	animation-duration: 0.01s;
}
.ten_mill {
	-webkit-animation-duration: 0.1s;
	animation-duration: 0.1s;
}
.hund_mill {
	-webkit-animation-duration: 1s;
	animation-duration: 1s;
}
.sec {
	-webkit-animation-duration: 10s;
	animation-duration: 10s;
}
.ten_sec {
	-webkit-animation-duration: 60s;
	animation-duration: 60s;
}
.minu {
	-webkit-animation-duration: 600s;
	animation-duration: 600s;
}
.ten_minu {
	-webkit-animation-duration: 3600s;
	animation-duration: 3600s;
}
.hour {
	-webkit-animation-duration: 36000s;
	animation-duration: 36000s;
}
.ten_hour {
	-webkit-animation-duration: 360000;
	animation-duration: 360000;
}

#start:checked~.stopwatch .num{
	-webkit-animation-play-state: running;
	animation-play-state: running;
}
#stop:checked~.stopwatch .num{
	-webkit-animation-play-state: paused;
	animation-play-state: paused;
}
#reset:checked~.stopwatch .num{
	-webkit-animatione: none;
	-webkit-animation: none;
	        animation: none;
}