* {
	margin: 0px;
	padding: 0px;
	font-family: consolas;
}
.thickBorder {
	padding: 20px;
	background:
		url("../img/border/thick/topleftcorner.png"),
		url("../img/border/thick/toprightcorner.png"),
		url("../img/border/thick/bottomleftcorner.png"),
		url("../img/border/thick/bottomrightcorner.png"),
		url("../img/border/thick/left.png"),
		url("../img/border/thick/right.png"),
		url("../img/border/thick/top.png"),
		url("../img/border/thick/bottom.png");
	background-repeat:
		no-repeat,
		no-repeat,
		no-repeat,
		no-repeat,
		repeat-y,
		repeat-y,
		repeat-x,
		repeat-x;
	background-position:
		top left,
		top right,
		bottom left,
		bottom right,
		top left,
		top right,
		top left,
		bottom left;
}
.thinBorder {
	padding: 10px;
	background:
		url("../img/border/thin/topleftcorner.png"),
		url("../img/border/thin/toprightcorner.png"),
		url("../img/border/thin/bottomleftcorner.png"),
		url("../img/border/thin/bottomrightcorner.png"),
		url("../img/border/thin/left.png"),
		url("../img/border/thin/right.png"),
		url("../img/border/thin/top.png"),
		url("../img/border/thin/bottom.png");
	background-repeat:
		no-repeat,
		no-repeat,
		no-repeat,
		no-repeat,
		repeat-y,
		repeat-y,
		repeat-x,
		repeat-x;
	background-position:
		top left,
		top right,
		bottom left,
		bottom right,
		top left,
		top right,
		top left,
		bottom left;
}
#gameContainer {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -320px;
	margin-top: -280px;
	z-index: 100;
	width: 600px;
	height: 400px;
}
#gameCanvas {
	background-image:
		url("../img/sky.png"),
		linear-gradient(to bottom,  #000000 55%,#777 100%);
	background-repeat: repeat-x;
	position: absolute;
	width: 600px;
	height: 400px;
	z-index: 100;
}
#statusContainer {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -320px;
	margin-top: 140px;
	z-index: 100;
	width: 600px;
	height: 80px;
	background-color: #90a4ae;
}
#headContainer {
	position: absolute;
	z-index: 99;
	width: 80px;
	height: 100px;
	left: 50%;
	margin-left: -40px;
}
#playerHead {
	width: 80px;
	height: 80px;
	image-rendering: pixelated;
	image-rendering: -moz-crisp-edges;
}
#infoContainer {
	position: absolute;
	right: 0%;
	top: 0%;
	margin-right: 20px;
	margin-top: 20px;
	z-index: 99;
	width: 80px;
	height: 80px;
}
#infoContainer > div {
	height: 20px;
}
#infoContainer img {
	display: block;
	float: left;
	max-height: 20px;
}
#infoContainer span {
	display: block;
	float: right;
	text-align: center;
	font-size: 23px;
	height: 20px;
	font-family: Courier New;
	font-weight: bold;
}
#weaponContainer {
	position: absolute;
	left: 0%;
	top: 0%;
	margin-left: 20px;
	margin-top: 20px;
	z-index: 99;
	width: 140px;
	height: 80px;
}
#weaponContainer img {
	zoom: 2;
	-moz-transform: scale(2);
    image-rendering: pixelated;
	position: absolute;
	margin: auto;
	top: 0;
	bottom: 0;
	left: 0;
	right: 0;
}
#mapCanvas {
	position: absolute;
	background-color: black;
	width: 600px;
	height: 400px;
	z-index: 99;
}
#dialogWindowContainer {
	width: 600px;
	height: 50px;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -300px;
	margin-top: -260px;
	background-color: transparent;
	z-index: 101;
	pointer-events: none;
}
#dialogWindow {
	width: 570px;
	height: 50px;
    color: #18FF62;
    text-shadow: 
    	0px 0px 8px black,
    	0px 0px 8px black,
    	0px 0px 8px black,
    	0px 0px 8px black,
    	0px 0px 8px black,
    	0px 0px 8px black,
    	0px 0px 8px black,
    	0px 0px 8px black,
    	0px 0px 8px black;
    font-family: monospace;
    padding: 5px;
    overflow: hidden;
}
.dialogSpan {
	display: block;
	margin-bottom: 5px;
	font-size: 16px;
}
#interactHelp {
	display: none;
    position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -290px;
	margin-top: 100px;
	z-index: 101;
}
#bloodScreen {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -300px;
	margin-top: -260px;
	z-index: 102;
	width: 600px;
	height: 400px;
	background-image: url("../img/bloodScreen.png");
	pointer-events: none;
}
#gameOverScreen, #gameCompletedScreen {
	position: absolute;
	font-family: "Comic Sans MS";
	left: 50%;
	top: 50%;
	margin-left: -300px;
	z-index: 102;
	width: 600px;
	height: 100px;
	font-size: 50px;
	color: white;
    background: transparent;
    text-align: center;
    line-height: 50px;
    display: none;
}
#gameCompletedScreen {
	margin-top: 90px;
}
#gameOverScreen {
	margin-top: 110px;
}
/*Loader*/
#loaderScreen {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -320px;
	margin-top: -280px;
	background-color: black;
    text-align: center;
	z-index: 102;
	width: 640px;
	transition: opacity 1s;
	pointer-events: none;
	height: 540px;
}
#loaderScreen #loaderText {
	color: white;
    text-shadow: 0px 0px 9px rgba(0, 0, 0, 1);
    line-height: 540px;
}
#loaderScreen #loaderBar {
	position: absolute;
	height: 30px;
	width: 80%;
	top: 55%;
	left: 10%;
	right: 10%;
	background-color: white;
}
#loaderLoadedBar {
	width: 0%;
	height: 100%;
	background-color: red;
}
/*Gui*/
#guiContainer {
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -320px;
	margin-top: -280px;
	background-image: url("../img/guibg.png");
	z-index: 101;
	width: 640px;
	pointer-events: none;
	transition: opacity 1s;
	height: 540px;
}
.menuItem {
	font-family: "Helvetica";
    text-align: center;
	color: black;
	background-color: white;
	font-size: 60px;
	width: 500px;
	margin-left: auto;
	margin-right: auto;
	margin-top: 40px;
	padding-bottom: 6px;
	border-radius: 3px;
}
.menuItem.current {
	background-color: coral;
	color: white;
}
#pauseMenu {
	display: none;
}
#multiplayerMenu {
	display: none;
}
#inMultiplayerMenu {
	display: none;
}
#tips {
	background-color: #DDF;
	background: linear-gradient(to bottom,  #FFF 10%,#CCF 100%);
	position: absolute;
	bottom: 0;
	width: 100%;
	overflow: hidden;
	max-height: 0;
	transition: max-height 1s;
	z-index: 103;
	border-top: 3px solid black;
}
#tipToggle {
	position: absolute;
	right: 0;
	bottom: 0;
	color: black;
	background-color: white;
	border-top-left-radius: 10px;
	padding-left: 5px;
	padding-top: 3px;
	cursor: pointer;
	border-left: 1px solid black;
	border-top: 1px solid black;
	z-index: 104;
}
#tipToggle:hover {
	color: white;
	background-color: black;
}