/* Programming by DouWère, s.p.r.l. — www.douwere.com */
/* © 2013, Frédéric Blondiau */

@font-face {
	font-family: 'VeraMono';
	font-style: normal;
	font-weight: 400;

	src: url('../rsrc/VeraMono.eot');
	src: local('VeraMono'), url('../rsrc/VeraMono.eot')
			format('embedded-opentype'),
			url(../rsrc/VeraMono.ttf) format('truetype');
}
@font-face {
	font-family: 'VeraMono';
	font-style: normal;
	font-weight: 700;

	src: url('../rsrc/VeraMoBd.eot');
	src: local('VeraMoBd'), url('../rsrc/VeraMoBd.eot')
			format('embedded-opentype'),
			url(../rsrc/VeraMoBd.ttf) format('truetype');
}
#emulator {
	font-family: 'VeraMono';
	color: rgb(0,0,128);

	position: relative;
	left: 4px;
}
#answer {
	font-weight: 400;
	height: 24px;
	padding-left: 6px;
/* 
	background-color: white;
 */
}
#query {
	font-weight: 700;
	height: 24px;
	padding-left: 6px;
/* 
	background-color: white;
 */
}
#inputField {
	width: 320px;

	font-weight: 700;
	height: 32px;
	padding-left: 6px;
/* 
	background-image: url(../rsrc/inputCellBackground.png);
 */
}
@-webkit-keyframes blinking {
	0% { opacity: 1; }
	40% { opacity: 1; }
	60% { opacity: 0; }
	90% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes blinking {
	0% { opacity: 1; }
	40% { opacity: 1; }
	60% { opacity: 0; }
	90% { opacity: 0; }
	100% { opacity: 1; }
}
#cursor {
	animation-name: blinking;
	animation-duration: 1s;
	animation-timing-function: linear;
	animation-iteration-count: infinite;
	animation-direction: linear;
	animation-play-state: running;

	-webkit-animation-name: blinking;
	-webkit-animation-duration: 1s;
	-webkit-animation-timing-function: linear;
	-webkit-animation-iteration-count: infinite;
	-webkit-animation-direction: linear;
	-webkit-animation-play-state: running;
}
#post {
	color: gray;
}
#keyboard {
	position: absolute;
	width: 312px;
	height: 216px;
}
#clickToPlay {
	transition-property: opacity;
	transition-duration: 0.5s;

	-webkit-transition-property: opacity;
	-webkit-transition-duration: 0.5s;
}
.key {
	position: absolute;
	opacity:0;

	transition-property: transform, opacity;
	transition-duration: 0.3s, 0.5s;
	transition-timing-function: ease-out, ease-out;
	transition-delay: 0s, 0.25s;

	-webkit-transition-property: -webkit-transform, opacity;
	-webkit-transition-duration: 0.3s, 0.5s;
	-webkit-transition-timing-function: ease-out, ease-out;
	-webkit-transition-delay: 0s, 0.25s;
}