/*	BoxNinja - Master Screen Style Sheet
============================================================================ */

/*	Reset
---------------------------------------------------------------------------- */

	html, body, div, span, applet, object, iframe,
	h1, h2, h3, h4, h5, h6, p, blockquote, pre,
	a, abbr, acronym, address, big, cite, code,
	del, dfn, em, font, img, ins, kbd, q, s, samp,
	small, strike, strong, sub, sup, tt, var,
	dl, dt, dd, ol, ul, li,
	fieldset, form, label, legend, input, select, textarea,
	table, caption, tbody, tfoot, thead, tr, th, td {
		margin: 0;
		padding: 0;
		border: 0;
		outline: 0;
		font-weight: normal;
		font-style: normal;
		font-size: 100%;
		font-family: inherit;
		vertical-align: baseline;
		text-decoration: none;
	}
	:focus { outline: 0; }
	body { line-height: 1; color: black; background: white; }
	ol,ul { list-style: none; }
	table { border-collapse: separate; border-spacing: 0; }
	caption, th, td { text-align: left; font-weight: normal; }
	blockquote:before, blockquote:after, q:before, q:after { content: ""; }
	blockquote, q { quotes: "" "";}
	em, i { font-style: italic; }
	strong, b { font-weight: bold; }
	label { cursor:pointer; }
	hr { display: none; }
	img { display: block; }

/*	Global Classes
---------------------------------------------------------------------------- */

	.hidden { display: none; }
	.invisible { visibility: hidden; }
	.clear { clear: both; }
	.clear-right { clear: right; }
	.clear-left { clear: left; }
	.float-left { float: left; }
	.float-right { float: right; }
	.matte { border: 1px solid #DDD; padding: 4px; }
	.img-left { float: left; padding: 0 20px 20px 0; }
	.img-left-no-bottom { float: right; padding: 0 20px 0 0; }
	.img-left-sm { float: left; padding: 0 10px 10px 0; }
	.img-right { float: right; padding: 0 0 20px 20px; }
	.img-right-no-bottom { float: right; padding: 0 0 0 20px; }
	.img-right-sm { float: right; padding: 0 0 10px 10px; }
	.bold { font-weight: bold; }
	.italic { font-style: italic; }
	.lowercase { text-transform: lowercase; }
	.uppercase { text-transform: uppercase; }
	.capitalized { text-transform: capitalize; }
	.smallcaps { font-variant: small-caps; }
	.text-left { text-align: left; }
	.text-right { text-align: right; }
	.text-center { text-align: center; }
	.text-justify { text-align: justify; }
	.inline { display: inline; }
	.block { display: block; }

/*	Typography
---------------------------------------------------------------------------- */
	
	/* General */
	body { font-size: 75%;}
	html>body { font-size: 12px; }
	
	/* Font Families*/
	.sans-serif { font-family: Arial, Helvetica, "Lucida Grande", Verdana, sans-serif; }
	.serif { font-family: "Times New Roman", Times, Georgia, serif; }
	.monospace { font-family: Monaco, "Andale Mono", Courier, "Courier New", monospace; }
	
	/* Headlines */
	h1 { font-size: 3.333em;  line-height: 1.000em;  margin: 0 0 .5em 0; }
	h2 { font-size: 2.499em;  line-height: 0.666em;  margin: 0.666em 0;  }
	h3 { font-size: 1.666em;  line-height: 1.000em;  margin: 0 0 1em 0;  }
	h4 { font-size: 1.249em;  line-height: 1.333em;  margin: 1.333em 0;  }
	h5 { font-size: 1.249em;  line-height: 1.333em;  margin: 1.333em 0;  }
	h6 { font-size: 1.249em;  line-height: 1.333em;  margin: 1.333em 0;  }
	h1,h2,h3,h4,h5,h6 { color: #000; }
	
	/* Paragraphs and Body Copy */
	p,span,q { color: #555; font-size: 1em; line-height: 1.666em; margin: 1.666em 0; overflow: hidden; clear: both; }

	small, .small { font-size:0.8333em; line-height: 2em; }
	big { } /* Note: Any size above 1.666em currently creates 1px increase in line height. Bug? */
	.footnote { margin: .25em 0; font-size: .833em; line-height: 1.66em; }

	hr { display: block; color:#DDD; background:#DDD; height: 1px; border: none; margin: -1px 0 0 0; clear:both; overflow: hidden; }
	
	/* Links */
	a { color: #2E7E9F; }
	a:hover { color: #3FAFDD; }
	
	/* Quotations and Cites */
	blockquote { margin: 0 1.666em; }
	blockquote cite { display: block; margin: 0.833em 0 0 0; }
	cite { font-style: italic; }
	
	/* Monospaced */
	code, pre, kbd, tt, samp, var { margin: 1.666em 0; font-size: 1em; line-height: 1.666em; color: #222; font-family: Monaco, "Andale Mono", Courier, "Courier New", monospace; }
	code { background: #eee; }
	pre { background: #eee; }
	
	/* Lists */
	ul,ol,li,dl,dd,dt { color: #555; font-size: 1em; line-height: 1.666em; margin: 1.666em 0; }
	ul ul, ul ol, ol ul, ol ol { margin: 0; }
	ul { list-style:disc; }
	ul.none { list-style:none; }
	ol { list-style: decimal; }
	ol li, ul li, dd { margin: 0 0 0 1.666em; }
	dd,dt { color: #555; font-size: 1em; line-height: 1.666em; margin:0; }

	/* Tables */
	table { color: #555; font-size: 1em; line-height: 1.666em; margin: 1.666em 0; width:100%; }
	table caption { }
	table thead {}
	table tbody {}
	table tfoot {}
	tr { }
	th { font-size: 1em; line-height: 1.666em; margin: 1.666em 0; padding: 0 1.666em 0 0; font-weight:bold; color:#333; }
	td { font-size: 1em; line-height: 1.666em; margin: 1.666em 0; padding: 0 1.666em 0 0; }
	
	/* Accronyms and Abbreviations */
	abbr, acronym { cursor: help; text-transform: lowercase; font-variant: small-caps; font-size: 1.166em; font-style: italic; line-height: 1em; letter-spacing: 0.083em; }
	
	/* Deletions and Insertions */
	del { color: #999; text-decoration: line-through; }
	ins { color: #222; }
	del, ins { cursor: help; }
	
	/* Subscript and Superscript */
	sub { position: relative; top: 0.5em; font-size: 0.8333em; }
	sup { position: relative; bottom: 0.5em; font-size: 0.8333em; }
	
	/* Definition */
	dfn { font-style: italic; cursor: help; }

/*	Navigation
---------------------------------------------------------------------------- */

	/* Horizontal */
	ul.nav-horiz { clear: both; list-style: none; overflow: hidden; }
	ul.nav-horiz li { display: block; float: left; margin: 0 0.833em 0 0; }
	ul.nav-horiz li a { background: #EEE; display: block; float: left; height: 2.499em; line-height: 2.499em; padding: 0 0.833em; }
	ul.nav-horiz li a:hover, ul.nav-horiz li.selected a { background: #888; color: #FFF; }
	/* ul#nav-horiz > li:last-child { margin: 0; } /* Note: Not Supported in -IE6 */
	
	/* Vertical */
	ul#nav-vert { clear: both; overflow: hidden; list-style: none; }
	ul#nav-vert li { display: block; float: left; margin: 0 0 0.833em 0; clear: left; }
	ul#nav-vert li a { float: left;  display: block; height: 2.499em; line-height: 2.499em; padding: 0 0.833em; background: #EEE; }
	ul#nav-vert li a:hover, ul#nav-vert li.selected a { background: #888; color: #FFF; }
	/* ul#nav-vert > li:last-child { margin: 0; } /* Note: Not Supported in -IE6 */

/*	Forms
---------------------------------------------------------------------------- */

	form { margin: 0 0 1.666em 0; }
	form legend { display: none; }	
	form dl { margin: 0; padding: 0; }
	form dl dt, form dl dd { float: left; padding: 0; margin: 0; overflow: hidden; margin: 0 0 0.833em 0; }
	form dl dt { clear: left; }
	form dl dt label { padding: 0 1.666em 0 0; display: block; width: 12em; float: left; font-size: 1em; line-height: 1.666em; }	
	form dl dt label span.req { color: #D23A3A; }	
	form dl dd input, form dl dd textarea, form dl dd select { background: #222; color: #FFF; width: 300px; }
	form dl dd input:focus, form dl dd textarea:focus { background: #999; color: #FFF;}
	form dl dd input { display: block; float: left; height: 1.666em; line-height: 1.666em;  }	
	form dl dd select { height: 1.666em; }
	form dl dd select:focus option.message { display: none; }	
	form dl dd textarea { line-height: 1.666em; height: 6.666em; }
	/* form dl > dd:last-child, form dl > dt:last-child { margin: 0; } /* Note: Not Supported in -IE6 */
	
	/* Validation Errors */
	form dl dd label.error { width: 280px; display: block; clear: both; background: #D23A3A; font-size: 0.8333em; line-height: 2em; padding: 0 10px 0 10px; color: #FFB9B9; }
	
	/* Buttons and Submit Inputs */
	form dl dd.submit { clear: both; overflow: hidden; padding: 0 0 0 13.666em; }
	button, input.submit { line-height: 2.499em; height: 2.499em; padding: 0 0.833em; width: auto; float: left; }

/*	Piwik
---------------------------------------------------------------------------- */
	
	a#piwik { display: none; }
	
/*	Columns
---------------------------------------------------------------------------- */
	
	/* Column Container */
	div.column_container_top, div.column_container { clear: both; overflow: hidden; margin: 0; padding: 0; }
	
	/* Two Column */
	div.twocol_left_column, div.twocol_right_column { margin: -20px 0 0 0; float: left; width: 320px; }
	div.twocol_left_column { margin: -20px 20px 0 0; }
	
	/* Four Column */
	div.fourcol_one_column, div.fourcol_two_column, div.fourcol_three_column, div.fourcol_four_column { margin: -20px 20px 0 0; float: left; width: 150px; }
	div.fourcol_four_column { margin: -20px 0 0 0; }
	
/*	Gallery
---------------------------------------------------------------------------- */

	ul.gallery { float: left; margin: -20px -20px 0 0; padding: 20px 0 0 0; clear: both; overflow: hidden; }
	ul.gallery li { float: left; margin: 0 20px 20px 0; list-style: none; }
	ul.gallery li img { display: block; }
	
/*	General Layout and Typography
---------------------------------------------------------------------------- */

	body { background: #000 url(bg_logo.jpg) top center no-repeat;  }
	
	div#wrapper { overflow: hidden; clear: both; width: 775px; margin: 120px auto 0; }
	
	h1 { text-indent: -30000px; width: 120px; height: 0px; background: none; float: left; clear: none; }
	h2, h3 { color: #FFF; text-transform: uppercase; font-weight: bold; }
	h2 { font-size: 30px; margin: 0; line-height: 30px; margin: 20px 20px 0 20px; }
	h3 { font-size: 16px; margin: 0; line-height: 20px; }
	
	p { color: #EEE; padding: 0 20px 0 20px; font-size: 14px; margin: 10px 0 20px 0; }
	
	ul { margin: 0; }
	
	div#mainmenu { clear: both; width: 775px; overflow: hidden; }

	ul.nav-horiz { clear: none; list-style: none; overflow: hidden; float: right; margin: 85px 40px 20px 0;}
	ul.nav-horiz li { display: block; float: left; margin: 0 0 0 12px; }
	ul.nav-horiz li a { color: #000; font-size: 16px; font-weight: bold; text-transform: uppercase; background: none; display: block; float: left; height: 30px; line-height: 30px; padding: 0 10px; }
	ul.nav-horiz li a:hover, ul.nav-horiz li a.current { background: #000; color: #FFF; }
	
	div#banner, div#content, div#sidebar, div#other div { border: 1px solid #FFF; padding: 20px; float: left; background: #000; }
	
/*	Home
---------------------------------------------------------------------------- */

	div#banner { width: 773px; margin: 0 0 20px 0; border-top-width: 5px; padding: 0; }
	div#banner ul { margin: 0; padding: 20px; background: #FFF; clear: both; overflow: hidden; height: 40px;}
	div#other div { width: 205px; margin: 0 20px 0 0; }
	div#banner ul li { list-style: none; float: left; margin: 0 20px 0 0; }
	a#brochure, a#email { text-align: center; display: block; height: 40px; line-height: 40px; width: 140px; background: blue; color: white; }
	a#email { background: red; }
	
/*	About
---------------------------------------------------------------------------- */

	div#sidebar { width: 153px; margin: 0 20px 0 0; }
	div#sidebar ul li a.current { color: red;}
	div#content { width: 518px; }