/*****************************************************************
	Description: Master stylesheet for 
	Author: 420 Creative - 420creative
	Version: November 2009
	
	TOC:
		Global
		Masthead (& Nav)
		Content Structure (Columns)
		Footer
		IE
*****************************************************************/

@import url(/css/reset.css);
@import url(/css/typography-v2.css);






/*	Global
-------------------------------------------------------------------*/
body {
	background: #ab3823 url(/images/global/bg-body.jpg) left top repeat-x;
	
}

img {
	border: 0;
}

.clearfix:after {
	content: ".";
	clear: both;
	display: block;
	height: 0;
	visibility: hidden;
}







/*	Masthead
-------------------------------------------------------------------*/
#masthead {
	width: 840px;
	height: 405px;
	margin: 0 auto;
	background: #082442 url(/images/global/bg-masthead.jpg) center top no-repeat;
}

#masthead img#header-home {
	float: right;
	margin-right: 30px;
	margin-top: 120px;
}

#masthead img#header-subpage {
	float: left;
	margin-left: 170px;
	margin-top: 60px;
}

#nav {
	float: right;
	padding-top: 20px;
}

#nav li {
	display: block;
	float: left;
	height: 24px;
	margin-right: 30px;
}

#nav li a {
	display: block;
	height: 24px;
}

#nav li#nav-home a {
	width: 52px;
	background: url(/images/global/nav-home.png) no-repeat 0 0;
}

#nav li#nav-about a {
	width: 62px;
	background: url(/images/global/nav-about.png) no-repeat 0 0;
}

#nav li#nav-events a {
	width: 67px;
	background: url(/images/global/nav-events.png) no-repeat 0 0;
}

#nav li#nav-downloads a {
	width: 101px;
	background: url(/images/global/nav-downloads.png) no-repeat 0 0;
}

#nav li#nav-faq a {
	width: 41px;
	background: url(/images/global/nav-faq.png) no-repeat 0 0;
}

#nav li a span {
	display: block;
	text-indent: -9999em;
}

#nav li#nav-home a:hover,
#nav li#nav-about a:hover,
#nav li#nav-events a:hover,
#nav li#nav-downloads a:hover,
#nav li#nav-faq a:hover {
	background-position: 0 -24px;
	border: 0;
}







/*	Content / Structure
-------------------------------------------------------------------*/
#content-top,
#content,
#content-bottom {
	width: 840px;
	margin: 0 auto;
}

#content-top {
	position: relative;
	height: 78px;
	background: url(/images/global/bg-contenttop.png) no-repeat center top;
}

#content-top.home { margin-top: -140px; }

#content-top.subpage { margin-top: -225px; }

#content-top img {
	position: absolute;
	top: -140px;
	left: 20px;
}

#content {
	background: url(/images/global/bg-content.png) repeat-y center top;
	padding-top: 2em;
}

#content-bottom {
	background: url(/images/global/bg-contentbottom.png) no-repeat center top;
	padding-top: 40px;
	margin-bottom: 2.5em;
}

#col-primary {
	width: 460px;
	float: left;
	margin-left: 30px;
}

#col-secondary {
	width: 270px;
	float: right;
	margin-right: 30px;
	position: relative;
	
}

#col-secondary img.keyimg {
	margin-top: -65px;
	margin-left: 10px;
}

ul#subnav {
	margin-bottom: 2em;
}










/*	Footer
-------------------------------------------------------------------*/
#content-bottom {
	width: 840px;
	margin: 0 auto;
}

p#copyright {
	width: 470px;
	float: left;
	margin-left: 20px;
}

p#credits {
	width: 240px;
	float: right;
	margin-right: 20px;
}







/*	IE6 specific divs
-------------------------------------------------------------------*/
#iemessage-outer {
	width: 100%;
	background: #000;
}

#iemessage-inner {
	width: 960px;
	margin: 0 auto;
	color: #fff;
	font-size: 1.5em;
}

#iemessage-inner p {
	width: 550px;
	float: left;
}

#iemessage-inner ul {
	width: 600px;
	float: right;
}

#iemessage-inner ul {
	width: 300px;
	float: right;
}

#iemessage-inner ul li {
	width: 60px;
	height: 80px;
	display: block;
	float: left;
}

#iemessage-inner ul li a,
#iemessage-inner ul li span {
	width: 60px;
	height: 80px;
	display: block;
}

#iemessage-inner ul li span { text-indent: -9999em; }

#iemessage-inner ul li#safari { background: url(/images/global/browser-safari.png) no-repeat; }
#iemessage-inner ul li#chrome { background: url(/images/global/browser-chrome.png) no-repeat; }
#iemessage-inner ul li#firefox { background: url(/images/global/browser-firefox.png) no-repeat; }
#iemessage-inner ul li#opera { background: url(/images/global/browser-opera.png) no-repeat; }
#iemessage-inner ul li#explorer { background: url(/images/global/browser-ie.png) no-repeat; }