body { /* this applies to the entire document */
	font-family:serif; /* Select font with serifs */
	background-image:url('webbg.png');
}

h1 { /* this applies to big header text */
	text-align:center; /* align title centered */
	font-size:400%; /* make the font really big */
	text-shadow:#888 4px 4px 4px; /* add a fancy shadow effect */
	padding:0px; /* disable padding (inner margins)  */
	margin:0px; /* disable margins */
}

canvas { /* this applies to our game area */
	border:2px solid black; /* set thick black border */
	box-shadow:#888 4px 4px 16px; /* add a fancy shadow effect */
	margin: 10px auto; /* center horizontally and add a bit of margin vertically */
	display:block; /* display as a non-inline block */
}
 
#debug { /* this applies to debug box */
	text-align:left; /* align text to the left */
	width:620px; /* set width to 630 pixels */
	height:460px; /* set height to 460 pixels */
	border:2px solid black; /* draw border around the box */
	font: 16px monospace; /* change fonto to monotype */
	overflow: auto; /* enable scrollbars */
	background-color:#ffc; /* change bg color to yellowish */
	box-shadow:#888 4px 4px 16px; /* fancy shadow fx */
	margin: 10px auto; /* center horizontally and space vertically */
	padding:10px; /* pad a bit for readibility */
}

#footer { /* this is a footer*/
	text-align:center; /* you never imagined what would happen if youi removed this! */
}