html,
body
{
	width:  100%;
	height: 100%;
	margin: 0px;
	font-family: sans-serif;
	font-size: 12px;
}

input,
select
{
	font-family: sans-serif;
	font-size: 12px;
}

a
{
    text-decoration: none;
    border-bottom: dotted 1px #ffffff;
    color: #ffffff;
}

h1
{
	margin: 0;
	font-size: 15px;
	text-shadow: #888 0px 1px 0;
	text-align: center;
	background: url(../media/logo.png) no-repeat top center;
	padding-top: 1em;
	margin: 0.5em 0;
}

h2
{
	margin: 0;
	font-size: 12px;
	padding-left: 3px;
}

canvas
{
	float: left;
	background-color: #7BACFF;
	background: -webkit-gradient(linear, 0% 0%, 0% 100%, from(#7BACFF), to(#ffffff));
	background: linear-gradient(#7BACFF, #ffffff);
}

joystick
{
 	display:none;
 	height: 50px;
 	width: 50px;
 	border-radius: 50%;
}

#joystick 
{
	background-color:red;
	position: fixed;
	left: 100px;
	bottom: 100px;
}

#controls
{
	position: absolute;
	right: 0;
	top: 0;
	bottom: 0;
	background: #222;
	width: 200px;
	color: #fff;
	overflow-x: hidden;
	overflow-y: auto;
}

form
{
	padding: 0;
	margin: 0;
}

ul
{
	padding-left: 2em;
}