@charset "UTF-8";

#leinwand {
	background-color: grey;
	width: 500px;
	height: 400px;
	border: solid black 1px;
	text-align: center;
}

.abacuswert {
	font-size: 20px;
}

#rechne {
	font-size: 20px;
	position: absolute;
	top: 355px;
	left: 320px;	
}

#unten {
	font-size: 20px;
	position: absolute;
	top: 355px;
	left: 90px;
}

#rechnemit {
	font-size: 20px;
	position: absolute;
	top: 355px;
	left: 200px;
}

#warnmeldung {
	font-size: 10px;
	font-family: Arial;
	position: absolute;
	top: 390px;
	left: 200px;
}

 
.kugel {
	width: 30px;
	height: 30px;
	border: solid black 1px;
	border-radius: 15px;
	font-size: 20px;
	line-height: 30px;
	text-align: center;
	transition: left 1s;
}

.einer {
	background-color: red;
	position: absolute;
	top: 280px;
}

.zehner {
	background-color: green;
	position: absolute;
	top: 230px;
}

.hunderter {
	background-color: blue;
	position: absolute;
	top: 180px;
}

.tausender {
	background-color: yellow;
	position: absolute;
	top: 130px;	
}

.zehntausender {
	background-color: orange;
	position: absolute;
	top: 80px;			
}