body{
	margin: 0px;
	overflow: hidden;
}





canvas{
	/*//position:absolute;*/
	box-shadow: 0px 0px 0px rgba(0, 0, 0, 0.0);
}

canvas.active{
	-webkit-transition: box-shadow 2s;
	box-shadow: 0px 25px 55px rgba(0, 0, 0, 0.25);
}


#keys{
	position: absolute;
	width: 100%;
	height: 20%;
  	bottom: 0;
  	z-index: -1;
}

.MyApp{
	line-height:0px;	
}

/*.zoom-in{
	display:none;
}*/


.face{
	visibility: hidden;
  	position: absolute;
    width: 100px;
    right: 0px;
    bottom: 20.5%;
}

.face > img {
	pointer-events: none;
}

/*.face.active{*/
	/*-webkit-transition: transform 2s;
	transform: translateY( 0px );*/
/*}*/


/*.face > img{
	position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%) rotate(-90deg);
	width: 40%;
}*/

/*
.face > .asleep{
	background-image: url( ../media/face-asleep.svg );
}

.face > .awake{
	background-image: url( ../media/face-awake.svg );
}*/