* {margin: 0; padding: 0;}

body {
	background: #000;
	}
body.homepage {
	background: #000 url(../images/home_bkg.gif) top left repeat-x;
	}
/* ==========================================
/
/ POSITIONING AND LAYOUT
/
/ ===========================================*/
div#wrapper {
	width: 890px;
	margin: 0 auto;
	}
div#wrapper2 {
	width: 430px;
	margin: 0 auto;
	}
a img {
	border: none;
	}	
div#header {
	position: relative;
	margin-top: 20px;
	z-index: 999;
	}
div#homelogo {
	position: absolute;
	top: 420px;
	left: 0;
	padding-bottom: 5px;
	}
div#logo {
	position: absolute;
	top: 0;
	left: 0;
	width: 890px;
	padding-bottom: 5px;
	border-bottom: 1px solid #fff;
	}
div#logo2 {
	position: absolute;
	top: 0;
	left: 0;
	width: 430px;
	padding-bottom: 5px;
	border-bottom: 1px solid #fff;
	}
#content {
	background: #000;
	padding-top: 80px;
	position: relative;
	}
#content2 {
	background: #000;
	padding-top: 40px;
	position: relative;
	}
#content #bigcol {
	float: left;
	width: 890px;
	}
#content #leftcol {
	float: left;
	width: 430px;
	}
#content #rightcol {
	float: right;
	width: 430px;
	}
#content2 #leftcol2 {
	float: left;
	width: 215px;
	}
#content2 #rightcol2 {
	float: right;
	width: 215px;
	}
#content #portfolio_image_hor {
	margin-bottom: 30px;
	}
#content #portfolio_description_hor {
	margin-left: 460px;
	}
#content #portfolio_image_vert {
	}
#content #portfolio_description_vert {
	width: 430px;
	position: absolute;
	top: 470px;
	bottom: 0;
	right: 0;
	margin-bottom: -6px;
	z-index: 99;
	}
#content h1.project_title {
	display: inline;
	margin-right: 4px;
}
#content ul.project_links {
	display: inline;
}
#content ul.project_links li {
	list-style-type: none;
	font-family: Arial, sans-serif;
	font-size: 12px;
	line-height: 18px;
	text-transform: uppercase;
	letter-spacing: .1em;
	display: inline;
	margin-left: 4px;
	font-weight: bold;
}
#content #csau_image {
	margin-bottom: 3px;
	}
#content #shop_img {
	margin-bottom: 15px;
	}
#content ul.csau_links {
	display: line-item;
}
#content ul.studio_links li {
	list-style-type: none;
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	line-height: 2px;
	color: #777;
	display: list-item;
	margin-bottom: 18px;
	}
#content2 ul.shop_links {
	display: inline;
	}
#content2 ul.shop_links li {
	list-style-type: none;
	font-family: Arial, sans-serif;
	font-size: 14px;
	line-height: 18px;
	display: inline;
	margin-left: 4px;
	font-weight: bold;
	}
#content img {
	margin-bottom: 18px;
	}
#footer {
	width: 890px;
	margin: 60px auto;
	position: absolute;
	;
	}
#footerhome {
	position: absolute;
	top: 575px;
	left: 0;
	}
/* ==========================================
/
/ MAIN AND SUB-NAVIGATION
/
/ ===========================================*/
#homenav {
	height: 16px;
	list-style: none;
	display: inline;
	overflow: hidden;
	position: absolute;
	top: 425px;
	right: 0;
	}
#mainnav {
	height: 16px;
	list-style: none;
	display: inline;
	overflow: hidden;
	position: absolute;
	top: 5px;
	right: 0;
	}	
#subnav {
	height: 16px;
	list-style: none;
	display: inline;
	overflow: hidden;
	position: absolute;
	top: 36px;
	right: 0;
	}
#mainnav li, #subnav li, #homenav li {
    list-style: none;
	float:left;
	margin-left: 10px;
	}	
#mainnav a, #subnav a, #homenav a {
	float: left;
	padding: 16px 0 0 0;
	overflow: hidden;
	height: 0px !important; 
	height /**/:16px; /* for IE5/Win only */
	}	
#mainnav a:hover, #subnav a:hover, #mainnav a.selected {
	background-position: 0 -16px;
	}
#mainnav a:active, #subnav a:active, #subnav a.selected {
	background-position: 0 -32px;
	}	
#profile a  {
	width: 43px;
	background: url(../images/b_profile.gif) top left no-repeat;
	}
#portfolio a  {
	width: 54px;
	background: url(../images/b_portfolio.gif) top left no-repeat;
	}
#news a  {
	width: 33px;
	background: url(../images/b_press.gif) top left no-repeat;
	}
#contact a  {
	width: 50px;
	background: url(../images/b_contact.gif) top left no-repeat;
	}
#studio a  {
	width: 43px;
	background: url(../images/b_studio.gif) top left no-repeat;
	}
#blog a  {
	width: 28px;
	background: url(../images/blog3.gif) top left no-repeat;
	}
#csau a  {
	width: 37px;
	background: url(../images/b_csau.gif) top left no-repeat;
	}
#gallery a  {
	width: 43px;
	background: url(../images/b_gallery.gif) top left no-repeat;
	}
#games a  {
	width: 44px;
	background: url(../images/b_games.gif) top left no-repeat;
	}
#shop a  {
	width: 32px;
	background: url(../images/b_shop.gif) top left no-repeat;
	}
#lab a  {
	width: 27px;
	background: url(../images/b_lab.gif) top left no-repeat;
	}
#csa_u a  {
	width: 51px;
	background: url(../images/b_csa_u.gif) top left no-repeat;
	}
#close a{
	width: 87px;
	background: url(../images/b_close.gif) top left no-repeat;
	}
/* ==========================================
/
/ TYPOGRAPHY
/
/ ===========================================*/
#content h1, #content2 h1 {
	font-family: Arial, sans-serif;
	font-size: 20px;
	font-weight: normal;
	line-height: 28px;
	color: #99c525;
	margin-bottom: 18px;
	}
#content h2 {
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	color: #777;
	margin-bottom: 18px;
	}
#content h3 {
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	color: #99c525;
	margin-bottom: 18px;
	}
#content p {
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
	color: #777;
	margin-bottom: 18px;
	}
	
.shop_images{
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
	color: #777;
	margin-bottom: 18px;
	text-decoration:none;
	}
	a.shop_images:hover{
	text-decoration:underline;
	color: #99c525;
	}
#content p.large {
	font-family: Arial, sans-serif;
	font-size: 20px;
	font-weight: normal;
	line-height: 28px;
	color: #777;
	margin-bottom: 28px;
	}
#content p.byline {
	font-family: Arial, sans-serif;
	font-size: 10px;
	font-weight: normal;
	line-height: 18px;
	color: #b2b2b2;
	text-transform: uppercase;
	letter-spacing: .1em;
	margin-bottom: 18px;
	}
#content p.caption{
	font-family: Arial, sans-serif;
	font-size: 12px;
	font-weight: normal;
	line-height: 18px;
	color: #777;
	margin-bottom: 18px;
	}
#footer p, #footerhome p {
	font-family: Arial, sans-serif;
	font-size: 10px;
	font-weight: normal;
	line-height: 18px;
	color: #777;
	width: 890px;
	margin: 0 auto;
	}
/* ==========================================
/
/ LINKERY
/
/ ===========================================*/
a {
	color: #99c525;
	text-decoration: underline;
	}
a:hover {
	color: #000;
	text-decoration: underline;
	}
#footer a, #footerhome a {
	color: #777;
	text-decoration: underline;
	}
#footer a:hover, #footerhome a:hover {
	color: #000;
	text-decoration: underline;
	}
#content ul.project_links li a {
	color: #b2b2b2;
	text-decoration: none;
	}
#content ul.project_links li a:hover {
	color: #99c525;
	text-decoration: underline;
	cursor: default;
	}
#content ul.studio_links li a {
	color: #99c525;
	text-decoration: none;
	}
#content ul.studio_links li a:hover, #content2 ul.shop_links li a:hover {
	color: #444444;
	text-decoration: none;
	cursor: default;
	}
#content2 ul.shop_links li a {
	color: #b2b2b2;
	text-decoration: none;
	cursor: default;
	}

/* ==========================================
/
/ HACKERY
/
/ ===========================================*/
	
/* here follows the brillant "no-extra-markup" clearing method devised by Tony Aslett - www.csscreator.com */
/* simply add the clearfix class to any containter that must enclose floated elements */
/* read the details of how and why this works at http://www.positioniseverything.net/easyclearing.html */
.clearfix:after {
    content: ".";              /* the period is placed on the page as the last thing before the div closes */
	display: block;          /* inline elements don't respond to the clear property */ 
    height: 0;                  /* ensure the period is not visible */
    clear: both;               /* make the container clear the period */
    visibility: hidden;	     /* further ensures the period is not visible */
}

.clearfix {display: inline-block;}   /* a fix for IE Mac */

/* next a fix for the dreaded Guillotine bug in IE6 */
/* Hides from IE-mac \*/
* html .clearfix {height: 1%;}
.clearfix {display: block;}
/* End hide from IE-mac */
/* end of "no-extra-markup" clearing method */