/* ------------- "generic" styles */

body {
	margin: 0; padding: 0;
	/*background: #E3EDC2; color: #333;*/
	font: small "Lucida Grande", Arial, sans-serif;
	background-image: url(../images/background.gif) ;
}

html, body {
    height: 100%;
}


a {
	text-decoration: none;
}

a img {
	border: 0;
}

img {
	display: block;
}



p {
	margin: 0 0 1em;
}


#wrapper { 
	margin: 0 auto;
	width: 1074px;
	padding: 5px 24px;
	height: 100%;
	background: #fff;
}

/* ------------- masthead styles */



#masthead {
	background: #E2DED5;;
}

#sub-nav-wrapper {
	float: left;
	width: 260px;
	height: 31px;
	background: #E2DED5;
	
}



#top_images {
	background: #fff;
	margin: 0em 0em 0em; padding: 0em 0 0em 0em;
}

#image_top_01-2 {
	float: left;
	margin: 0em 0em 0em; padding: 0em 0 0em 0em;
	width: 44px;
	height: 74px;
}

#subnav-pad-l{
	float: left;
	width: 30px;
	height: 21px;
	display: inline;
}

#subnav-pad-r{
	float: left;
	width: 72px;
	height: 21px;
	display: inline;
}


#image_top_01 {
	float: left;
	margin: 0em 0em 0em; padding: 0em 0 0em 0em;
	width: 315px;
	height: 74px;
}


#image_top_02 {
	float: left;
	margin: 0em 0em 0em; padding: 0em 0 0em 0em;
	width: 479px;
	height: 74px;
}


#image_top_03 {
	float: left;
	margin: 0em 0em 0em; padding: 0em 0 0em 0em;
	width: 291px;
	height: 74px;
}

#image_top_04 {
	float: left;
	margin: 0em 0em 0em; padding: 0em 0 0em 0em;
	width: 1073px;
	height: 4px;
}




#homelink {
	float: left;
	margin: 0em 0em 0em; padding: 0em 0 0em 0em;
	width: 304px;
	background: #fff;
}




/* ------------- sub nav styles */

#nav-sub-frame {
	float: left;
	width: 260px;
	background: #E2DED5;
	display: inline;
	
}


#nav-sub {
	
	margin: 0;
	padding: 0;
	height: 21px;
	list-style: none;
	display: inline;
	overflow: hidden;
	background: #E2DED5;
	}

#nav-sub li {
	margin: 0; 
	padding: 0;
        list-style: none;
	display: inline;
	}

#nav-sub a {
	float: left;
	padding: 21px 0 0 0;
	overflow: hidden;
	height: 0px !important; 
	height /**/ :21px; /* for IE5/Win only */ 
	}
	
#nav-sub a:hover {
	background-position: 0 -21px;
	}

#nav-sub a:active, #nav a.selected {
	background-position: 0 -21px;
	}

#nav-contact a  {
	width: 72px;
	background: url(../images/contact.gif) top left no-repeat;
	}

#nav-resume a  {
	width: 65px;
	background: url(../images/resume.gif) top left no-repeat;
	}


#nav-cv a  {
	width: 31px;
	background: url(../images/cv.gif) top left no-repeat;
	}
/*
#sub-filler {
	float: left;
	width: 254px;
	height: 10px;
	background: yellow;
	display: inline;
	 this makes it work on IE7 */


/* ------------- main nav styles */

#nav-frame {
	float: left;
	width: 770px;
	background: #fff;
}


#nav {
	
	margin: 0;
	padding: 0;
	height: 24px;
	list-style: none;
	display: inline;
	overflow: hidden;
	}

#nav li {
	margin: 0; 
	padding: 0;
        list-style: none;
	display: inline;
	}

#nav a {
	float: left;
	padding: 24px 0 0 0;
	overflow: hidden;
	height: 0px !important; 
	height /**/   :24px; /* for IE5/Win only */ 
	}
	
#nav a:hover {
	background-position: 0 -24px;
	}

#nav a:active, #nav a.selected {
	background-position: 0 -24px;
	}

#nav-web a  {
	width: 96px;
	background: url(../images/web.jpg) top left no-repeat;
	}

#nav-interactive a  {
	width: 96px;
	background: url(../images/interactive.jpg) top left no-repeat;
	}

#nav-motion a  {
	width: 96px;
	background: url(../images/motion.jpg) top left no-repeat;
	}

#nav-brand a  {
	width: 96px;
	background: url(../images/brand.jpg) top left no-repeat;
	}

#nav-archive a  {
	width: 96px;
	background: url(../images/archive.jpg) top left no-repeat;
	}
	
	
/* ------------- content styles */


#content { 
	width: 1074px;
	padding: 0px;
	height: 100%;
	background: #E2DED5;
}

#words-img {
	float: left;
	width: 316px;
	}
	
#fill {
	float: left;
	width: 304px;
	height: 200px;
	}
	
#thumbs {
	float: left;
	width: 96px;
	}		
	
	
/* ------------- web nav styles */	
	
	
#thumb-nav {
	
	margin: 0;
	padding: 0;
	height: 58px;
	list-style: none;
	display: inline;
	overflow: hidden;
	}

#thumb-nav li {
	margin: 0; 
	padding: 0;
        list-style: none;
	display: inline;
	}

#thumb-nav a {
	float: left;
	padding: 58px 0 0 0;
	overflow: hidden;
	height: 0px !important; 
	height /**/   :58px; /* for IE5/Win only */ 
	}
	
#thumb-nav a:hover {
	background-position: 0 -58px;
	}

#thumb-nav a:active, #thumb-nav a.selected {
	background-position: 0 -58px;
	}

#web-nav-01 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_iw.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}

#web-nav-02 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_lowdown.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}

#web-nav-03 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_panel.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	
#web-nav-04 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_police.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}

#web-nav-05 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_ecycle.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	
#web-nav-06 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_qtv.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	
#web-nav-07 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_barista.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	
#web-nav-08 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_tiptop.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	
#web-nav-09 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-web_vodem.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	

	
	
/* ------------- interactive nav styles */	


#interactive-nav-01 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-interactive_awwwsum.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	
#interactive-nav-02 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-interactive_vaka.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}

#interactive-nav-03 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-interactive_ieat.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}

#interactive-nav-04 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-interactive_nzbio.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}


/* ------------- motion nav styles */	

#motion-nav-01 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-motion_reel.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}

#motion-nav-02 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-motion_invest.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}


#motion-nav-03 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-motion_airbus.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	
#motion-nav-04 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-motion_v3d.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}


#motion-nav-05 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-motion_telecom.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}



/* ------------- brand nav styles */	

#brand-nav-01 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-brand_logos.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}
	
#brand-nav-02 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-brand_ecycle.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}

#brand-nav-03 a  {
	width: 94px;
	background: url(../images/thumbs/thumb-brand_serato.jpg) top left no-repeat;
	margin: 0px 0px 2px 0px;
	}