@charset "UTF-8";
@import "/css/reset.css";

/* CSS Document */

body { font: 16px/24px Helvetica, Arial, sans-serif; color: #ffe; background: #121 url(/media/layout/bg.jpg); }

h1 { font-size: 32px; line-height: 48px; margin: 0; color: #ffc; }
h2 { font-size: 26px; line-height: 39px; }

a { color: #fff; }
a:hover, a:active { color: #ffa; }


#wrapper { margin: 20px auto; width: 960px; }

#header { background: transparent url(/media/layout/hire-me-plz.gif) right top no-repeat; }
	#blurb { text-align: right; }
	a#gocheckoutmysite { display: block; width: 960px; height: 84px; }

#main {  }
	#legend-top { padding-left: 62px; }
	#legend-left { width: 60px; float: left; margin-right: 10px; }
		div.legend-container { height: 125px; margin-top: 5px; }
			div.legend { font-size: 12px; text-align: right; height: 25px; }
	#matrix { width: 780px; float: left; }
		div.matrix-group { float: left; width: 125px; height: 125px; border: 1px solid #444; margin: 3px 3px 0 0; }
			div.matrix-cell { float: left; width: 23px; height: 23px; border: 1px solid #444; text-align: center; overflow: hidden; color: #fff; }
	#legend-right { width: 90px; float: right; font: 16px/21px "Times New Roman", Times, serif; font-style: italic; margin-left: 10px; color: #fff; }

#footer {  }

	----------------------------
	CLASSES
	____________________________
*/
div.clear { overflow: hidden; height: 1px; clear: both; }
img.alignRight { float: right; margin: 0 0 15px 15px; }
img.alignLeft { float: left; margin: 0 15px 15px 0; }
.error { color: #800; }

.small { font: 11px/17px Arial, sans-serif; }
.medium { color: #aaa; }
.bright { color: #f7d99f; }

.redBG { background-color: #400; font-weight: bold; }