/********************************** Overall **********************************/

header, section, footer, aside, nav, main, article, figure, vidio, audio {
	display: block;
}

img {
	border: none;
}

body {
	-webkit-font-smoothing: subpixel-antialiased;
}

html, body {
	margin: 0;
	padding: 0;
	height: 90%;
}

@font-face {
	font-family: 'KhulaWeb';
	src: url('/fonts/Khula-Regular.woff') format('woff');
	font-weight: normal;
	font-style: normal;
}

@font-face {
	font-family: 'KhulaWeb';
	src: url('/fonts/Khula-Bold.woff') format('woff');
	font-weight: bold;
	font-style: normal;
}

@font-face {
	font-family: 'KhulaWeb';
	src: url('/fonts/Khula-Light.woff') format('woff');
	font-weight: 200;
	font-style: normal;
}

body {
	background-image: url("/img/style/games/planetventure/background.jpg");
	background-attachment: fixed;
	color: #fff;
	background-color: #170015;
	font-family: "KhulaWeb", "Khula", sans-serif;
	max-width: 90em;
	margin: auto;
}

a {
	color: #92CA52;
	font-weight: bold;
	text-decoration: none;
}

a:hover, a:focus {
	color: orange;
	text-decoration: underline;
}

h3 {
	margin: .25rem 0rem;
}

img {
	display: inline-block;
	overflow: hidden;
	text-align: center;
}

abbr {
	border: 0em;
	text-decoration: none;
}

body > header, article, nav, footer {
	background: -ms-linear-gradient(#0444cc, #033399);
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0444cc), color-stop(100%,#033399));
	background: -webkit-linear-gradient(#0444cc, #033399);
	background: -o-linear-gradient(#0444cc, #033399);
	background: -moz-linear-gradient(#0444cc, #033399);
	background: linear-gradient(#0444cc, #033399);
	background-color: #0444cc;
	margin: .5em;
	text-align: left;
	padding: .5em;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	border: 2px solid #000;
}

/********************************** Header **********************************/

h1 {
	font-size: 3rem;
	margin: 0em;
}

h2 {
	font-size: 2rem;
	margin: 0em;
	display: inline-block;
}

/********************************** Main **********************************/

main {
	text-align: center;
}

section {
	margin: 0em 0.5em;
}

#col1 {
	float: left;
	display: inline-block;
	width: 32%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0em;
}

#col2 {
	display: inline-block;
	width: 32%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0%;
	margin-left: 2%;
	float: left;
}

#col3 {
	float: right;
	display: inline-block;
	width: 32%;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	margin: 0em;
}

article {
	margin: 0.5em 0em;
}

img {
	max-width: 90%;
}

video {
	max-width: 95%;
	border: none;
	border: 2px solid #000;
}

video:fullscreen {
	max-width: 100%;
	border: 0px;
}

dd {
	margin: 0em 0em 0em 2.5em;
}

dd ul {
	padding-left: 0em;
}

dl p {
	margin: 0em;
}

dt {
	font-weight: bold;
	font-size: 1.1rem;
}

.icon, .screenshot, .artwork {
	border: 2px solid #000;
}

dd, p, li {
	font-weight: 200;
}

ul ul {
	padding-left: 1em;
	font-size: .9em;
	color: #ccc;
}

.pixal {
	image-rendering: crisp-edges;
	image-rendering: optimizeSpeed;
	image-rendering: -moz-crisp-edges;
	image-rendering: -o-crisp-edges;
	image-rendering: -webkit-optimize-contrast;
	image-rendering: pixelated;
	image-rendering: optimize-contrast;
	-ms-interpolation-mode: nearest-neighbor;
}

/********************************** Sidebar **********************************/

nav ul, nav li {
	display: inline-block;
	padding: 0em;
}

nav li:before {
	content: "\2756";
	padding: 0em .5em;
}

/********************************** Footer **********************************/

footer {
	clear: both;
}

footer ul, footer li {
	display: inline-block;
	padding-left: 0em;
}

footer li:before {
	content: "\2756";
	padding: 0em .5em;
}

address {
	font-style: normal;
}

/********************************** Responsive Settings **********************************/

@media only all and (max-width: 58em), screen and (orientation: portrait) {
	#col1 {
		float: none;
		display: inline-block;
		width: 99%;
	}

	#col2 {
		display: inline-block;
		width: 99%;
		margin: 0;
	}

	#col3 {
		float: none;
		display: inline-block;
		width: 99%;
	}
}

@media only all and (max-width: 45em) {
	nav ul {
		padding: 0em;
	}

	nav li {
		width: 45%;
		display: inline-block;
		padding: 0em;
	}

	dd {
		margin-left: 1.5em;
	}
}

@media only all and (max-width: 30em) {
	h1 {
		font-size: 2rem;
		margin: 0em;
	}

	h2 {
		font-size: 1.5rem;
		margin: 0em;
	}

	footer ul {
		padding: 0em;
	}

	footer li {
		width: 45%;
		display: inline-block;
		padding: 0em;
	}
}