/* GENERAL SET-UP */

html, body { height: 100%; }

body {
	background-color: #2989cc;
	background: url('../img/sky.png') repeat-x;
	color: black;
	margin: 0px;
	padding: 0px;
	overflow: hidden;
	font-family: "8bitemul8r";
}

.gameContainer {
	z-index: 1;
}


/* INTERFACE ELEMENTS */

#laps {
	font-size: 1.5em;
	color: #000;
	margin: 0px;
	padding: 0px;
	top: 10px;
	left: 10px;
	position: absolute;
	z-index: 10;
}

#time {
	font-size: 4em;
	color: #FFF;
	margin: 0px;
	padding: 0px;
	top: 10px;
	right: 10px;
	left: 10px;
	position: absolute;
	z-index: 10;
	text-align: center;
}

#best {
	font-size: 1.5em;
	color: #000;
	margin: 0px;
	padding: 0px;
	top: 10px;
	right: 10px;
	position: absolute;
	z-index: 10;
}


/* GAME ELEMENTS */

.track {
background: url('../img/marioTrack.png');
width: 1024px;
height: 1024px;
}

.mario {
background: url('../img/marioSheet.png');
width: 50px;
height: 46px;
}

#colMap {
display: none;
}

.banner {
background: url('../img/banner.png');
width: 107px;
height: 41px;
}

.grid {
background: url('../img/grid.png');
width: 1024px;
height: 22px;
}

.wall {
background: url('../img/wall.png');
width: 128px;
height: 12px;
}

/* WEB FONT */

@font-face {
    font-family: '8bitemul8r';
    src: url('../fonts/8bit.eot');
    src: url('../fonts/8bit.eot?#iefix') format('embedded-opentype'),
         url('../fonts/8bit.woff') format('woff'),
         url('../fonts/8bit.ttf') format('truetype'),
         url('../fonts/8bit.svg#8bitemul8r') format('svg');
    font-weight: normal;
    font-style: normal;

}

