@charset "utf-8";
/* CSS Document */

/* =reset.css */

body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, 
pre, form, fieldset, input, p, blockquote, address, th, td {
		margin: 0;
		padding: 0;}
		
h2, h3, h4, h5, h6 {
		font-size: 100%;
		font-weight: normal;}
		
ol, ul {
		list-style-type: none;}

table {
		border-collapse: collapse;
		border-spacing: 0;}
		
caption, th {
		text-align: left;}
		
fieldset, img {
		border: 0;}
		
dt, address, caption, cite, code, dfn, em, i, strong, b, th, var {
		font-style: normal;
		font-weight: normal;}										
		
/* ---------- */
/* =blocktext */

h2, h3, h4, h5, p, ul {
		margin: 0;
		padding: 0;}
		
/* --------- */
/* =css.doc */

/* Remove annoying border on linked images. */
a img { border: none; }

/*Positioning Elements */

body {
	width:914px;
	position:relative;
	left:50%;
	margin-left:-457px;
	background-color:#eeeeee;
	background-image:url('../images/footerBg.jpg');
	background-repeat:repeat-y;
	background-position:center;}

#header {
	width:900px;
	height:174px;
	background-color:#FFFFFF;}
	
#title {
	width:399px;
	height:61px;
	position:absolute;
	margin-top:96px;
	margin-left:-30px;}
		
#nav {
	width:246px;
	height:37px;
	position:absolute;
	margin-left:634px;
	margin-top:120px;}
	
#mainWrapper {
	width:914px;
	float:left;
	background-color:#eeeeee;}
	
#content {
	width:914px;}
	
#portfolioContent {
	width:914px;
	background-image:url('../images/portfolioContentBackground.jpg');
	background-repeat:repeat-y;
	margin-top:10px;}
	
#contactContent {
	width:914px;
	background-image:url('../images/contactContentBackground.jpg');
	background-repeat:repeat-y;
	margin-top:10px;}		
	
.portfolioPreview {
	width:900px;
	height:210px;
	float:left;
	margin-top:10px;
	padding-bottom:10px;
	border-bottom:2px dotted #666666;
	/*border-bottom-width:900px;*/}
	
a#boots {
	width:914px;
	height:210px;
	float:left;
	background-image:url('../images/bootsPreview.jpg');
	background-position:top;
	background-repeat:no-repeat;}
	
a#vso {
	width:914px;
	height:210px;
	float:left;
	background-image:url('../images/vsoPreview.jpg');
	background-position:top;
	background-repeat:no-repeat;}
	
a#myspace {
	width:914px;
	height:210px;
	float:left;
	background-image:url('../images/myspacePreview.jpg');
	background-position:top;
	background-repeat:no-repeat;}

a#eskills {
	width:914px;
	height:210px;
	float:left;
	background-image:url('../images/eskillsPreview.jpg');
	background-position:top;
	background-repeat:no-repeat;}
	
a#microsoft {
	width:914px;
	height:210px;
	float:left;
	background-image:url('../images/microsoftPreview.jpg');
	background-position:top;
	background-repeat:no-repeat;}
	
a#jandj {
	width:914px;
	height:210px;
	float:left;
	background-image:url('../images/jandjPreview.jpg');
	background-position:top;
	background-repeat:no-repeat;}
	
a#disney {
	width:914px;
	height:210px;
	float:left;
	background-image:url('../images/disneyPreview.jpg');
	background-position:top;
	background-repeat:no-repeat;}						

a#harper {
	width:914px;
	height:210px;
	float:left;
	background-image:url('../images/harperPreview.jpg');
	background-position:top;
	background-repeat:no-repeat;}											
	
a#boots:hover, a#vso:hover, a#myspace:hover, a#eskills:hover, a#microsoft:hover, a#jandj:hover, a#disney:hover, a#harper:hover {
	background-position:bottom;}			

#bottom {
	width:900px;
	height:46px;
	float:left;
	background-color:#FFFFFF;
	margin-top:10px;}
	
#bottomNav {
	width:860px;
	height:20px;
	margin-left:20px;
	margin-top:12px;}
	
#nextPage a {
	width:48px;
	height:20px;
	float:left;
	margin-left:735px;
	background-image:url('../images/nextPage.gif');}
	
#nextPage a:hover {
	background-position:bottom;}
	
#previousPage a {
	width:86px;
	height:20px;
	float:left;
	margin-left:705px;
	background-image:url('../images/previousPage.gif');}
	
#previousPage a:hover {
	background-position:bottom;}	

#bottomspacer {
	width:900px;
	height:2px;
	margin-top:10px;
	padding-bottom:10px;
	border-top:2px dotted #666666;}	
	
#footer {
	width:914px;
	height:100%;
	float:left;
	padding:20px 25px 50px 25px;
	background-image:url('../images/footerBg.jpg');
	background-repeat:repeat-y;}
	
#colA {
	float:left;}
	
#colB {
	float:left;
	margin-left:106px;}
	
#colC {
	float:left;
	margin-left:90px;}
	
#colD {
	float:left;
	margin-left:20px;}	
	
a#processor {
	width:161px;
	height:19px;
	float:left;
	margin-top:7px;
	background-image:url('../images/processor.jpg');}
	
a#processor:hover {
	background-position:bottom;}					
	
/* Main Navigation */
		
ul#navMain {
		list-style: none;
		font-size:1px;
		position:relative;}
		
ul#navMain li {
		float:left;
		padding-right:0px;}
		
ul#navMain a {
		display:block;
		text-decoration:none;}	
		
ul#navMain a:hover {
		display:block;
		text-decoration:none;
		color:#000000;}		
		
/* Portfolio */
		
#portfolio #navMain .portfolio a {
		width:124px;
		height:37px;
		background-image:url('../images/portfolioNav.gif');
		background-position:bottom;}
		
#navMain .portfolio a {
		width:124px;
		height:37px;
		background-image:url('../images/portfolioNav.gif');}

#navMain .portfolio a:hover {
		background-position:bottom;}

/* Contact */
		
#contact #navMain .contact a {
		width:108px;
		height:37px;
		margin-left:14px;
		background-image:url('../images/contactNav.gif');
		background-position:bottom;}
		
#navMain .contact a {
		width:108px;
		height:37px;
		margin-left:14px;
		background-image:url('../images/contactNav.gif');}

#navMain .contact a:hover {
		background-position:bottom;}
		
/* Portolio Navigation */
		
ul#navPortfolio {
		list-style: none;
		font-size:1px;
		position:relative;}
		
ul#navPortfolio li {
		float:left;
		padding-right:0px;}
		
ul#navPortfolio a {
		display:block;
		text-decoration:none;
		background:none;}	
		
ul#navPortfolio a:hover {
		display:block;
		text-decoration:none;
		color:#000000;}		
		
/* Page One */
		
#one #navPortfolio .one a {
		width:19px;
		height:20px;
		background-image:url('../images/pageOne.gif');
		background-position:bottom;}
		
#navPortfolio .one a {
		width:19px;
		height:20px;
		background-image:url('../images/pageOne.gif');}

#navPortfolio .one a:hover {
		background-position:bottom;}

/* Page Two */
		
#two #navPortfolio .two a {
		width:19px;
		height:20px;
		background-image:url('../images/pageTwo.gif');
		background-position:bottom;}
		
#navPortfolio .two a {
		width:19px;
		height:20px;
		background-image:url('../images/pageTwo.gif');}

#navPortfolio .two a:hover {
		background-position:bottom;}
		
/* Page Three */
		
#three #navPortfolio .three a {
		width:19px;
		height:20px;
		background-image:url('../images/pageThree.gif');
		background-position:bottom;}
		
#navPortfolio .three a {
		width:19px;
		height:20px;
		background-image:url('../images/pageThree.gif');}

#navPortfolio .three a:hover {
		background-position:bottom;}
		
/* Portfolio */

#leftCol {
	width:538px;
	float:left;
	background-color:#FFFFFF;}
	
#leftCol img {
	margin:20px 0px 20px 20px;}

.leftBox {
	width:498px;
	margin:20px 0px 20px 20px;
	background-color:#eeeeee;
	}
	
#rightCol {
	width:352px;
	float:left;
	margin:0px 0px 0px 10px;}
	
#portfolioTitle {
	width:346px;
	height:150px;
	margin:20px 0px 20px 20px;
	background-image:url('../images/portfolioTitleBackground.gif');}

#portfolioTitle img {
	margin:20px 0px 20px 20px;}
	
#portfolioDesc {
	width:280px;
	margin:35px 0px 20px 40px;}
	
#portfolioDesc p {
	width:280px;
	margin-bottom:10px;}
	
#portfolioDesc a.play {
	width:296px;
	height:20px;
	float:left;
	background-image:url('../images/portfolioClickHere.gif');
	margin-top:30px;}
	
#portfolioDesc a.play:hover {
	background-position:bottom;}
	
#portfolioDesc a.youtube {
	width:295px;
	height:20px;
	float:left;
	background-image:url('../images/portfolioVisitYoutube.gif');
	margin-top:30px;}
	
#portfolioDesc a.youtube:hover {
	background-position:bottom;}	
	
#portfolioDesc a.twitter {
	width:297px;
	height:20px;
	float:left;
	background-image:url('../images/portfolioVisitTwitter.gif');
	margin-top:15px;
	margin-bottom:15px;}
	
#portfolioDesc a.twitter:hover {
	background-position:bottom;}
	
#portfolioDesc a.bebo {
	width:296px;
	height:20px;
	float:left;
	background-image:url('../images/portfolioVisitSite.gif');
	margin-top:15px;
	margin-bottom:15px;}
	
#portfolioDesc a.bebo:hover {
	background-position:bottom;}																									
								
#previousProject a {
	width:162px;
	height:20px;
	float:left;
	margin-right:565px;
	margin-top:2px;
	background-image:url('../images/previousProject.gif');}
	
#previousProject a:hover {
	background-position:bottom;}
	
#nextProject a {
	width:125px;
	height:20px;
	float:left;
	margin-top:2px;
	background-image:url('../images/nextProject.gif');}
	
#nextProject a:hover {
	background-position:bottom;}	
		
/* Contact */
		
/* Typography */
	
h1 {
	font-size:1px;
	display:none;}
	
h2 {
	font-size:1px;
	display:none;}	

p {
	font-family:Arial, Helvetica, sans-serif;
	font-size:15px;
	color:#666666;}
	
a { 
	color:#666666;
	text-decoration:none;
	text-indent:-99999px;}
	
p span {
	color:#d43a3a;}		

a img {
	text-indent:0px;} /* Weird IE 6 */
	
a#mailto {
	text-indent:0px;} /* IE 6 AGAIN */		
	
a:hover {
	color:#d43a3a;}									
	
/* Clear */
	
.clear {
	clear:both;}