/* CSS Document */

* { /* removes defaults from all elements */
	margin: 0;
	padding: 0;
	
	}

sup{font-size:8px;}
.clear{
	clear:both;
	height:1px;
	overflow:hidden;
	margin-top:-2px;
	font-size:1px;
	}

img {
	border: 0; /* removes border in case images get anchors around them */
	}
	
body{background:#395398; font-family: Arial, Helvetica, sans-serif; font-size:12px;}


#top h1 {
	position: relative;
	height: 44px;
	display: block;
	}

/* setting up the top nav
==============================================================================*/
#navcontainer{
	position: relative;
	width: 480px;
	height: 24px;margin:0 auto;
	}

/* nav */
#nav {
	height: 24px;
	list-style: none;
	}
#nav li {
padding-right:4px;
	float: left;
	height: 24px;
	overflow: hidden; /* if text-resize, this'll keep the nav the same size */
	}
#nav li a {
	display: block;
	line-height: 24px;
	text-indent: -5000px;
	overflow: hidden;
	background-position: center top; /* horizontally centers the background image */
	}
	#navHome {
		width: 92px;
		background: url(img/nav_1.gif) no-repeat;
		}
	#navWork {
		width: 92px;
		background: url(img/nav_2.gif) no-repeat;
		}
	#navPlay {
		width: 92px;
		background: url(img/nav_3.gif) no-repeat;
		}
	#navContact {
		width: 92px;
		background: url(img/nav_4.gif) no-repeat;
		}
	#navFriends {
		width: 92px;
		background: url(img/nav_5.gif) no-repeat;
		}
	
#nav li a:hover {
	background-position: 50% -24px;
	}
#home #navHome,
#work #navWork,
#Play #navPlay,
#contact #navContact,
#friends #navFriends {
	background-position: 50% -24px;
	}


#contentcontainer{position: relative;
		width:808px;
		margin:0 auto;
		background:transparent url(img/main_bg.gif) top left repeat-y;
		min-height:300px;
		_height:300px;
		}
#top{position: relative;
		width:800px;
		margin:0 auto;
		background:transparent url(img/top_bg.jpg) top left no-repeat;
		min-height:68px;
		_height:68px;
		}
#content{position: relative;
		width:800px;
		margin:0 auto;
		background:#011955 url(img/content_bg.jpg) top left no-repeat;
		min-height:569px;
		_height:569px;
		padding-bottom:10px;
		}
		
/* home
==============================================================================*/
#home #contentcontainer #content table{width:100%; min-height:560px; height:560px;background:transparent url(img/home_illustrations.gif) bottom center no-repeat;}
#home #contentcontainer #content table>td{vertical-align:middle; }
/* work
==============================================================================*/
#work #contentcontainer #content table{width:100%; min-height:560px; height:560px; }
#work #contentcontainer #content table>td{vertical-align:middle; }
		
		
		/* worknav
==============================================================================*/
#worknavcontainer{
	position: relative;
	width: 578px;
	height: 33px;margin:0 auto;
	}

/* worknav */
#worknav {
	height: 33px;
	list-style: none;
	}
#worknav li {
	margin:0 20px;
	float: left;
	height: 33px;
	overflow: hidden; /* if text-resize, this'll keep the nav the same size */
	}
#worknav li a {
	display: block;
	line-height: 33px;
	text-indent: -5000px;
	overflow: hidden;
	background-position: center top; /* horizontally centers the background image */
	}
	#navRendering {
		
		width: 118px;
		background: url(img/nav_work1.gif) no-repeat;
		}
	#navStoryboard {
		
		width: 167px;
		background: url(img/nav_work2.gif) no-repeat;
		}
	#navFinished {
		width: 143px;
		background: url(img/nav_work3.gif) no-repeat;
		}
	
	
#worknav li a:hover {
	background-position: 50% 0px;
	}

/* end worknav
==============================================================================*/

.rendering #content .box{display:inline; float:left; width:600px; text-align:center; padding-top:20px; }
.rendering #content .box2{display:inline; float:left; width:200px;padding-top:20px;}
.rendering #content .box2 .title{display:block; padding-bottom:20px;}
.rendering #content .box2 .section{display:inline;float:left; text-align:center;width:30px;}
.rendering #content .box2 .thumbs{display:inline;float:left;width:170px;}
.rendering #content .box2 .thumbs img{margin-right:0px;}
			


.showing{margin-bottom:20px;}
.showimg img{border:1px solid #4DAFFF;}
.showimg:hover img{border:1px solid #FFFFFF;}
.showimg:hover{color:#FFFFFF;border: 0px;}


#contactcontainer{ position:relative;width:600px; margin: 0 auto;color:#CACACA; font-size:12px; font-weight:bold; padding-top:50px; }
#contactcontainer table{width:500px;}
#contactcontainer table td{padding:2px;}
#contactcontainer table input{width:250px;}
#contactcontainer h3{font-size:12px; padding-bottom:10px;}

#contactcontainer table input.submitbttn{width:70px;}
#contactcontainer table h4{color:#FFCC00; font-size:11px; font-weight:bold; margin-bottom:3px;}
#contactcontainer table a{color:#FFCC00; font-size:12px; font-weight:bold; margin-bottom:3px; text-decoration:none;}
#contactcontainer table a:hover{text-decoration:underline;}
#contactcontainer table textarea{width:500px; height:150px;}

#friendscontainer{ position:relative;width:600px; margin: 0 auto;color:#CACACA; font-size:12px; font-weight:bold; padding-top:50px; }
#friendscontainer table{width:600px; border:0; padding:0; margin:0;}
#friendscontainer table tr.tbhead { background:#395398; padding:6px; font-size:14px;}
#friendscontainer table td {padding:4px; font-weight:normal;}
#friendscontainer table a{color: #aa9261; font-size:12px; font-weight:bold; text-decoration:none;}
#friendscontainer table a:hover{text-decoration:underline;}
#friendscontainer table tr.row2 { background: #395398; padding:4px;font-weight:normal;}
#friendscontainer table tr.tbhead td {font-weight:bold;}
#friendscontainer table tr.tbhead td{padding:6px; font-size:14px;}

p.legal{font-size:11px; padding-top:20px; font-weight:normal;}

#footer{position: relative;
		width:800px;
		margin:0 auto;
		background:#010A33;
		min-height:63px;
		_height:63px;
		}
	#footer .wrapper, #footer .wrapper a{color:#aa9261;text-align:center; padding-top:9px; font-weight:bold; text-decoration:none; letter-spacing:2px;}
	#footer .wrapper a:hover{text-decoration:underline;}
#bottom{position: relative;
		width:808px;
		margin:0 auto;
		background:transparent url(img/bg_bottom.gif) top left no-repeat;
		min-height:4px;
		_height:4px;
		}