/* Reset CSS - Fixes differences in browsers */
body {
	color:#000;
	background: #FFF;
	}
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,textarea,p,blockquote,th,td {
	margin:0;
	padding:0;
	}
table {
	border-collapse:collapse;
	border-spacing:0;
	}
fieldset,img {
	border:0;
	}
address,caption,cite,code,dfn,th,var {
	font-style:normal;
	font-weight:normal;
	}
li {
	list-style:none;
	}
caption,th {
	text-align:left;
	}
h1,h2,h3,h4,h5,h6 {
	font-weight:normal; 
	}
q:before,q:after { content:''; }
abbr,acronym {
	border:0;
	font-variant:normal;
	}
sup,sub{
	line-height:-1px;
	vertical-align:text-top;
	}
sub{ vertical-align:text-bottom; }
input, textarea, select{ 
	font-family:inherit;
	font-size:inherit;
	font-weight:inherit; 
	}

/* Main */
body{ 
	background: url(/images/top-bg.gif) top left repeat-x;
	font: 85%/1.5em Verdana, Arial, sans-serif;
	color: #393939;
	}
p { 
  margin-bottom: 18px; 
}
h1 { 
  font-size: 24px; 
  line-height: 36px;
  margin-bottom: 18px; 
}
h2 { 
  font-size: 18px; 
  line-height: 18px; 
  margin-bottom: 18px;
}
h3 { 
  font-size: 14px; 
  line-height: 12px;
  margin-bottom: 10px;
}
table{ width: 100%; }
table tr.cat td{ background-color: #F47A20; color: #ffffff; font-weight: bold;}
table td{ padding: 4px; border: 1px solid #D3D3D3; }


/* Misc */
.left{ float: left; margin: 0 1em .5em 0;}
.right{ float: right; margin: 0 0 .5em 1em;}

a:link,a:visited,a:hover,a:active{ color: #F79B58; }
a:hover{ text-decoration: none;}

#main-container{ width: 822px; margin: 0px auto; position: relative;}
#container{ width: 822px; position: absolute; top: 125px; clear: both;}
#footer{ width: 822px; display: block; clear: both;}

/* Navigation */

#header h1 a{ 
	display: block; 
	width: 225px; 
	height: 100px; 
	z-index: 100; 
	position: relative; 
	text-indent: -3000px; 
	top: 25px;
	}

#top-nav{ position: absolute; top: 2px; right: 0; font-size: 12px; color: #ffffff; }
#top-nav ul li{ float: left; margin-right: 5px;}
#top-nav ul li a{ color: #ffffff; text-decoration: none;}

#main-nav{ position: absolute; top: 25px; height: 100px; background: url(/images/main-nav.jpg) no-repeat; z-index: 90; width: 822px;}
#main-nav ul{ width: 596px; height: 100px; margin-left: 228px; }
#main-nav ul li{ display: block; float: left;}
#main-nav ul li a{ display: block; height: 100px; text-indent: -3000px; }

#main-nav #nav-id-home{ background: url(/images/main-nav.jpg) -228px 0 no-repeat; width: 72px;}
#main-nav #nav-id-about{ background: url(/images/main-nav.jpg) -300px 0 no-repeat; width: 114px; }
#main-nav #nav-id-inaction{ background: url(/images/main-nav.jpg) -414px 0 no-repeat; width: 140px;}
#main-nav #nav-id-who{ background: url(/images/main-nav.jpg) -554px 0 no-repeat; width: 129px;}
#main-nav #nav-id-how{ background: url(/images/main-nav.jpg) -683px 0 no-repeat; width: 141px;}

#main-nav #nav-id-home:hover{ background-position: -228px -100px;}
#about #main-nav #nav-id-about, #main-nav #nav-id-about:hover{ background-position: -300px -100px; }
#inaction #main-nav #nav-id-inaction, #main-nav #nav-id-inaction:hover{ background-position: -414px -100px;}
#who #main-nav #nav-id-who, #main-nav #nav-id-who:hover{ background-position: -554px -100px;}
#how #main-nav #nav-id-how, #main-nav #nav-id-how:hover{ background-position: -683px -100px; }



#footer { padding-top: 40px; color: #6E6E6E; font-size: 10px; }
#footer .row{ text-align: center;}
#footer ul li{ display: inline; background: url(/images/foot-separator.gif) right center no-repeat; margin: 0 2px 0 0; padding: 0 10px 0 0;}
#footer ul li.last-child{ background-image: none; padding: 0; margin: 0;}
#footer a{ color: #6E6E6E; text-decoration: none;}

/* Home */
#home #main-flash{ border: 1px solid #D3D3D3; margin:0px; padding: 0px;}
#home #primary-content{ 
	width: 391px; 
	height: 225px; 
	border: 1px solid #D3D3D3; 
	background: url(/images/home/home-pc-promo.jpg) no-repeat; 
	margin-top: 12px;
	float: left;
	padding: 25px 25px 0 85px;
	}
#home #primary-content h2{ background: url(/images/home/home-pc-hdr.jpg) -3px 0 no-repeat; width: 397px; height: 27px; text-indent: -3000px;}
#home #main-buttons{ position: absolute; top: 310px; left: 332px; width: 475px; height: 85px;}
#home #main-buttons ul li a{ float: left; display: block; width: 149px; height: 82px; text-indent: -3000px; margin-right: 13px;}
#home #main-buttons ul li.last-child{ margin: 0;}
#home #secondary-content{
	width: 300px;
	height: 250px;
	border: 1px solid #D3D3D3;
	margin-top: 12px;
	background: url(/images/home/promo-bg2.jpg) no-repeat;
	float: left;
	position: relative;
	}
#home #secondary-content h2{ background: url(/images/home/promo-hdr2.jpg) no-repeat; text-indent: -3000px; width:  250px; height: 21px; margin: 27px 0 0 20px;}
#home #secondary-content p { font-size: .9em; position: absolute; top:10px;}
#home #secondary-content .promolink{ display: block; position: absolute; width: 300px; height: 250px; top: 0; left: 0; text-indent: -3000px;}


/* Second-tier */
#banner{ 
	border: 1px solid #D3D3D3; 
	height: 135px;
	overflow: hidden;
	width: 822px;
	}
.banner-about{
	background: url(/images/banner-about.jpg) no-repeat; 
}
.banner-howtoget{
	background: url(/images/banner-howtoget.jpg) no-repeat; 
}
.banner-products{
	background: url(/images/banner-products.jpg) no-repeat; 
}
.banner-videos{
	background: url(/images/banner-videos.jpg) no-repeat; 
}
#banner p{
	color: #ffffff;
	font-weight: bold;
	font-size: 14px;
	padding: 35px 35px 0 265px;
	}
	
#nav-sub{ 
	margin: 12px 0;
	width: 206px;
	border: 1px solid #D3D3D3; 
	}
#nav-sub ul li a{ 
	background: #EF6423 url(/images/nav-sub-bg.jpg) left bottom no-repeat; 
	display: block; 
	width: 174px;
	padding: 8px 16px;
	color: #ffffff;
	text-decoration: none;
	}
#nav-sub ul li a:hover,
#nav-sub ul li a.active{ 
	background: #F1D014 url(/images/nav-sub-bg-over.jpg) left bottom no-repeat;
	color: #D16531;
	} 

/* This is the styles that control the 3rd tier subnavigation */
#tier3spacer {
margin-left:5px;
}
	
#nav-sub ul li a.subnav:hover	{
text-indent:20px; 
	background: #F1D014 url(/images/nav-sub-bg-over.jpg) left bottom no-repeat;
	color: #D16531;
	}

#nav-sub ul li a.subnav{ 
text-indent:20px;
	background: #F1D014 url(/images/nav-sub-newsubnav.jpg) left bottom no-repeat;
	color: #D16531;
	} 
	
#nav-sub ul li a.subnav-active:hover	{
text-indent:20px; 
	background: #F1D014 url(/images/nav-sub-bg-over.jpg) left bottom no-repeat;
	color: #D16531;
	}

#nav-sub ul li a.subnav-active{ 
text-indent:20px;
	background: #F1D014 url(/images/nav-sub-bg-over.jpg) left bottom no-repeat;
	color: #D16531;
	} 
	
/* end of styles */	
	

#primary-content{ border: 1px solid #D3D3D3; width: 600px; float: right; margin: 12px 0 0;}
#secondary-content{ width: 206px; float: left;}

#primary-content .content{ padding: 45px; }
#primary-content .content h2{ color: #F58B3C;}
#primary-content .content h3{ color: #F26522;}
#primary-content ul{ margin: 0 0 18px 14px; }
#primary-content ul li { list-style-type: disc;}
#primary-content ul li ul li{ list-style-type: circle;}


body.video #banner{ border: 0;}
body.video #primary-content{ width: 820px; border: 1px solid #D3D3D3; float: none; margin: 0;}
body.video #primary-content .flash{ margin:12px 0 2px 2px;}

/* form styles - thanks khoi */

form {
	width: 360px;
	text-align: left;
}

fieldset {
	margin: 0;
	border: 0;
	padding: 0;
}

legend {
	display: none;
}

form h3 {
	clear: both;
	padding: 5px 0px 10px 0px;
	font-size: 14px;
}

form label {
	display: block;
	width: 310px;
	font-size: 12px;
	line-height: 14px;
	padding: 0px 0px 12px 0px;
}

form input {
	display: block;
	margin-top: 3px;
}

form select {
	float: left;
	display: block;
}

form label.field-first,
form label.field-address,
form label.field-address2,
form label.field-company,
form label.field-city,
form label.field-email {
	clear: left;
}


form label.field-first,
form label.field-last,
form label.field-city,
form label.field-email,
form label.field-email2,
form label.field-phone,
form label.field-company,
form label.field-title,
form label.field-fax {
	float: left;
	margin: 0px 10px 0px 0px;
	width: 150px;
}

form label.field-phone {
	clear: left;
	margin: 0px 10px 0px 0px;
	width: 150px;
}

form label.field-phone input {
	float: left;
	width: 150px;
	padding: 0px;
}


form label.field-first input,
form label.field-last input,
form label.field-email input,
form label.field-email2 input,
form label.field-city input,
form label.field-phone input,
form label.field-company input,
form label.field-title input {
	float: left;
	width: 150px;
	padding: 0px;
}

form label.field-state {
	float: left;
	margin-right: 10px;
	width: 70px;
}

form label.field-state select {
	width: 70px;
	float: left;
	margin-top: 3px;
}

form label.field-country {
	clear: left;
	float:left;
	width: auto;
	height:auto;
}

form label.field-country select {
	width: auto;
	margin-top: 3px;
}

form label.field-zip {
	float: left;
	width: 80px;
}

form label.field-zip input {
	float: left;
	width: 80px;
}


form label.field-tradeclass {
	width:200px;
	float: left;
	margin-top: 3px;
}

form label.field-tradeclass select {
	width:200px;
	float: left;
	margin-top: 3px;
}

form .menu-state,
form .menu-tradeclass {
	font-family:Arial, Helvetica, sans-serif;
	font-size:11px;
	color:#333333;
}


form label.field-address,
form label.field-address2,
form label.field-organization {
	float: left;
	width: 310px;
	margin: 0px 0px 0px 0px;
}

form label.field-address input,
form label.field-address2 input,
form label.field-organization input {
	float: left;
	width: 310px;
	padding: 0px;
}

form label.field-story {
	clear:left;
	width: 310px;
	height: 100px;
	margin-bottom:15px;
}

form label.field-story textarea {
	clear:left;
	width: 310px;
	height: 100px;
}

form input#radiobutton_1,
form input#radiobutton_2,
form input#radiobutton_3,
form input#radiobutton_4 {
	clear: left;
	float: left;
	padding: 0px;
	margin: 0px 0px 0px 0px;
}

form label.radioitem {
	clear: none;
	margin: 0px 0px 0px 25px;
	padding: 0px 0px 15px 0px;
}

textarea {
	display: block;
}

form input#checkbox_1,
form input#checkbox_2,
form input#checkbox_3 {
	clear: both;
	float: left;
	padding: 0px;
	margin: 0px;
}

form label.field-checkbox {
	clear: none;
	float:left;
	margin: 0px 0px 0px 25px;
	padding: 0px 0px 15px 0px;
}

form textarea {
	margin-top: 3px;
}

.errors { 
	font-size: 14px; 
  	line-height: 18px;
  margin-bottom: 10px; }

/* NEOS */
#boxcheckbox { display:block; position:relative; width:420px; clear:both; float:left; }

.required { font-size:10px; line-height:12px; clear:both; }

#spacer { margin: 0 0 2px 0; }

#primary-content h2, p { margin-left: 8px; }

#formmargin { margin:0px; margin-left: 10px;  }

#noborder { float:left;  }
#nbright { float:left; margin-left: 5px; margin-bottom:10px; width:300px; }

#pwmessage { border: #CCCCCC dashed 4px; padding:10px; background-color:#DEDEDE; }

a.gamelink { background-color: #F47A20; color: #ffffff; font-weight: bold; text-decoration:none;}
a.gamelink:visited { background-color: #F47A20; color: #ffffff; font-weight: bold; text-decoration:none;}
a.gamelink:active { background-color: #F47A20; color: #ffffff; font-weight: bold; text-decoration:none;}
a.gamelink:hover { background-color: #F47A20; color: #ffffff; font-weight: bold; text-decoration:underline;}