html, body {
	padding: 0;
	margin: 0;
	font-family: "Georgia, serif";
	font-size: 12px;
	background: black;
}

#main-frame{
	margin: auto;
	position: absolute;
	top: 0; left: 0; bottom: 0; right: 0;
	display: block;
	width: 960px;
	height: 540px;
}

#title-bar{
	margin: auto;
	position: absolute;
	top: 0;
	
	width: 100%;
	height: 32px;
	display: block;
	background: grey;
	border: 1px solid dimgrey;
	border-radius: 4px;
	
	color: white;
	font-size: 24px;
	text-align: center;
	font-weight: bolder;
	letter-spacing: 2px;
}

#game-canvas-frame {
	position: absolute;
	top: 40px; height: 496px;
	width: 496px;
	border: 1px solid dimgrey;
	border-radius: 4px;
}

#game-canvas {
	position: absolute;
	top: 8px; left: 8px;
}

#ingame-message {
	position: absolute;
	top: 24px;
	left: 24px;
	background: rgba(0,255,0,0.2);
	color: green;
	text-align: center;
	letter-spacing: 2px;
}

#info-area-frame {
	position: absolute;
	top: 40px; left: 504px;
	height: 496px;
	width: 456px;
	border: 1px solid dimgrey;
	border-radius: 4px;
}

#pause-message, #middle-message {
	display: none;
	position: absolute;
	top: 160px;
	left: 0px;
	right:0px;
	margin-left: auto;
	text-align: center;
	color: white;
	letter-spacing: 2px;
	font-size: 16px;
}

#combat-death-message{
	display: none;
	position: absolute;
	width: 512px;
	top: 160px;
	left: 256px;
	color: white;
	background: darkred;
	letter-spacing: 2px;
	text-align: center;
	font-size: 16px;
	border: 1px solid red;
}

.death-title {
	position: block;
	background: red;
	padding: 4px;
}

#total-carnage, #your-carnage, #hits {
	position: absolute;
	display: inline-block;
	left: 16px;
	color: red;
}

#coor {
	position: absolute;
	display: inline-block;
	left: 16px;
	color: white;
	top: 80px;
}

#help{
	position: absolute;
	display: inline-block;
	left: 16px;
	top: 110px;
	color: white;
	font-size: 16px;
}

#total-carnage{top: 20px;}
#your-carnage{top: 40px;}
#hits{top: 60px;}

#total-carnage-count, #your-carnage-count, #hits-count{
	color: darkred;
}