@charset "utf-8";
@import "palette";

/* Set basic element styles */
img { border: none; }

a {
	text-decoration: none;
	color: $link-normal;
}

a:visited { color: $link-visited; }
a:hover { color: $link-hover; }

body {
	position: relative; /* Make IE not hate positioned elements */

	margin: auto;
	padding: 14px;

	background-color: $background;

	font-size: 0.8em;
	font-family: $font-stack;
}

/* Set default widths for page boxes */
body div {
	position: relative;
	margin: auto;
	width: 700px;
}
body div div { width: auto; }

/* Make the headers look nice */
h1 { margin: 0; }

h2 {
	text-align: left;
	color: $text-accent;
}

/* Create special elements and classes */
h2, .blackbar {
	height: 18px; /* Take that, old gecko! */
	margin: 0;
	padding: 0 1ex;

	overflow: hidden;
	background-color: black;

	font-size: 16px;
	font-weight: 150;
	font-family: monospace;
	letter-spacing: 0.5ex;
}

h2 span, .blackbar span {
	display: block;
	width: 100%;
	height: 100%;
}

.clearer { clear: both; }
br.clearer { line-height: 0; }
.leftcol { float: left }
.rightcol { float: right }

.nl {
	margin: 0;
	padding: 0;

	background-color: $nl-background;
	text-align: center;

	list-style-type: none;
}

.nl li {
	display: inline;
	margin: 0px;
	padding: 0em 0.5ex;
	color: $text-normal;
}

.nl a { color: $text-normal; text-decoration: none; }
.nl a:link, .nl a:visited { color: $text-normal; }
.nl a:hover { color: $link-hover; }

.content {
	margin-top: 1em;
	margin-bottom: 1em;
	background-color: $nl-background;
	color: $text-normal;
}

.content div {
	/* Satisfy internal floated elements */
	overflow: hidden;
	height: 100%;

	border: solid 5px $nl-background;
	background-color: $infobox;
	padding: 5px;
}

.content .clearer {
	border: none;
	padding: 0px;
}

/* Correct a word wrapping bug in the ad bar */
#adbar {
	position: relative;
	height: 90px;
	text-align: center;
	font-size: 1px;
	letter-spacing: 500px;
}

#adbar #megagear-ad {
	position: absolute;
	top: 14px;
	left: 0px;
}

#adbar #kickstarter-ad {
	position: absolute;
	top: 14px;
	left: 115px;
}

#adbar #cologuys-ad {
	position: absolute;
	top: 14px;
	right: 0px;
}

#adbar .glowwrap {
	position: absolute;
	display: block;
	top: 0px;
	left: 50%;
	width: 468px;
	margin-left: -246px;

	background-image: url(../parts/banner_bg.gif);
	padding: 14px 12px;
}

/* Style the top banner */
#banner {
	background-color: $nl-background;
	text-align: center;
}

#banner h2 {
	color: $text-normal;
	font-family: $banner-font;
}

#banner .nl {
	padding-bottom: 5px;
	padding-top: 5px;
}

/* Style the footer */
#credits {
	background-color: $foreground;
	color: $text-credits;
	padding-bottom: 0.5ex;
	margin-top: 1em;
}

#credits p {
	margin: 0px;
	text-align: center;
	padding: 0.5ex;
	font-family: $credits-font;
	font-size: x-small;
}

/* Overload header texts */
#banner .blackbar span { background: url(../parts/mt3-bar-comic.gif) no-repeat }
#credits h2 span { background: url(../parts/mt-blk_bar-credits.png) no-repeat }