/*
*		Eye Candy Animation CSS Document
*	
*		@media:		screen
*		@author:	Icelab (icelab.com.au)
*
===============================================*/


#wrapper {
text-align: left;
position: relative;
padding: 0;
margin: 0 auto 30px;   /* Centers layout */
width: 960px;     /* Total width - Padding */
}

/* Clear fix */
#wrapper:after, #header:after, #main:after, #footer:after, #main .folio-nav:after,
.folio #main #latest:after, .folio #main #archive:after, #main .col3 .award:after,
#main .col2 .person:after,
.news #main #archive:after, .news #main #single:after { 
  content:  "."; 
  display: block;
  height: 0;
  clear: both;
  line-height: 0;
  visibility: hidden;
}

body {
background: #000;
color: #e6e6e6;
font: normal 12px/16px Helvetica, Verdana, Arial, sans-serif;
line-height: 15px;
}


/* Grids are good for structure
===============================================*/

.col1, .col2, .col3 {
float: left;
padding: 15px 0;
width: 280px;
}
	.col2 {
	margin: 0 60px;
	}
.col1-2 {
float: left;	
margin: 0 60px 0 0;
padding: 15px 0;
width: 620px;
}

#main {
background: transparent url(../img/bg-main.jpg) top center no-repeat;
padding: 0 0 2em;
}

#footer {
background: transparent url(../img/bg-footer.gif) top center no-repeat;

}


/* Header stuff
===============================================*/
#header {
background: transparent url(../img/bg-header.jpg) bottom center no-repeat;
padding: 20px 0 14px;
}

h1 {
float: left;
height: 61px;
overflow: hidden;
text-indent: -999em;
width: 280px;
}
	h1 a, h1 a:link, h1 a:visited {
	background: url(../img/logo-eyecandy.gif) top center no-repeat;
	display: block;
	height: 61px;
	width: 280px;
	}
		h1 a:hover {
		background-position: bottom center;
		}

#header .award {
float: left;
margin-left: 60px;
overflow: hidden;
position: relative;
width: 280px;
}
	#header .award a, #main .award a {
	background: transparent url(../img/icon-view.gif) 0 -500px no-repeat;
	display: block;
	height: 500px;
	overflow: hidden;
	text-indent: -999em;
	position: absolute;
	width: 280px;
	z-index: 2;
	}
		#header .award a:hover, #main .award a:hover {
		background-position: top left;	
		}
#main .award {
margin: 0 0 20px;
overflow: hidden;
position: relative;
}
	#header .award img, #main .award img {
	float: left;
	}
	#header .award p, #main .award p {
	margin: 5px 0 0 60px;
	}
	#header .award p.competition {
	font-size: 11px;	
	}
	#header .award p.placing, #main .award p.placing {
	color: #e1d6a3;
	font: normal 11px/1em Georgia, Palatino, 'Times New Roman';
	letter-spacing: 0.4em;
	text-transform: uppercase;
	}
	#main .award p.competition, #header .award p.competition {
	color: #e1d6a3;
	}
	#main .award p, #header .award p {
	font-size: 10px;
	line-height: 12px;
	}
		#main .award p em, #header .award p em {
		font-style: italic;	
		}

/* Headings
===============================================*/

#main h2, #footer h2 {
color: #e1d6a3;
font: normal 11px/1em Georgia, Palatino, 'Times New Roman';
letter-spacing: 0.5em;
margin: 6px 0 14px;
text-align: center;
text-transform: uppercase;
}
	#main h3 {
	color: #e1d6a3;
	font-size: 14px;
	font-weight: bold;
	margin: 0.1em 0 0.9em;
	text-shadow: #000 0 0 0;
	}

/* Typography
===============================================*/

p {
margin: 0.1em 0 0.9em;
}
	p a, p a:link, .vcard a.email, .vcard a:link.email {
	border-bottom: 1px #3b341e solid;
	color: #e4c972;
	text-decoration: none;
	}
		p a:visited, .vcard a:visited.email {
		color: #c6af69;		
		}
		p a:hover, .vcard a:hover.email {
		border-bottom: 1px #e4c972 solid;
		color: #ff9;
		}
	
p.intro, .folio-nav p {
color: #f7da7e;
font: normal 16px/22px Georgia;
text-shadow: #000 0 0 0;
}
	p.intro a, p.intro a:link, p.intro a:visited,
	.folio-nav p a, .folio-nav p a:link, .folio-nav p a:visited {
	border-bottom: 1px #3b341e solid;
	color: #fef7db;
	}
		.folio-nav p a:hover {
		color: #fff;
		border-color: #fef7db;
		}

p.moreinfo {
background: transparent url(../img/bullet-arrow.gif) 0 0.3em no-repeat;
padding-left: 22px;
}

p em {
font-style: italic;
}

/* Miscellaneous
===============================================*/

#section-image {
width: 730px;
height: 300px;
float: left;
}

span.hr {
border-top: 1px #26271b dotted;
display: block;
height: 0;
overflow: hidden;
margin: 6px auto 18px;
width: 90px;
}

span.hr-deco {
background: transparent url(../img/hr-deco.gif) top center no-repeat;
border-top: 1px #26271b dotted;
display: block;
height: 15px;
overflow: hidden;
margin: 18px auto;
width: 90px;
}

img.fl-left {
float: left;
margin: 0 10px 5px 0;
}
img.fl-right {
float: right;
margin: 0 0 5px 10px;
}



/* Flash navigation/replacement
===============================================*/

#mainnav {
background: transparent url(../img/bg-nav.jpg) top center no-repeat;
height: 300px;
}
	#mainnav ul {
	float: left;
	height: 249px;
	margin: 20px 0 0 40px;
	width: 172px;
	}
		#mainnav ul li a {
		background: transparent url(../img/nav-noflash.gif) no-repeat;
		display: block;
		overflow: hidden;
		text-indent: -999em;
		}
			#mainnav ul li#nav-profile a {
			background-position: 0 0;
			height: 75px;
			line-height: 75px;
			}
			#mainnav ul li#nav-portfolio a {
			background-position: 0 -75px;
			height: 92px;
			line-height: 92px;
			}
			#mainnav ul li#nav-contact a {
			background-position: 0 -168px;
			height: 83px;
			line-height: 83px;
			}
				body.profile #mainnav ul li#nav-profile a, #mainnav ul li#nav-profile a:hover { background-position: -172px 0; }
				body.folio #mainnav ul li#nav-portfolio a, #mainnav ul li#nav-portfolio a:hover { background-position: -172px -75px; }
				body.contact #mainnav ul li#nav-contact a, #mainnav ul li#nav-contact a:hover { background-position: -172px -168px; }


/* Footer/Contact
===============================================*/

.vcard {
padding: 0 8px;
}
	.vcard .org { 
	display: none;
	}
	.vcard .adr {
	margin: 10px 0 0;
	display: block;
	}

#footer .col2 a img {
border: 0;
}

#footer .col1 ul {
float: left;
width: 139px;
margin-bottom: 24px;
}
	#footer .col1 ul.second {
	border-left: 1px #191a13 solid;
	border-right: 0;
	float: right;
	}

	#footer .col1 ul li {
	}
		#footer .col1 ul li a {
		color: #e4c972;
		display: block;
		font-size: 14px;
		margin: 0;
		padding: 3px 16px;
		text-align: right;
		text-shadow: #000 0 0 0;
		text-decoration: none;
		}
			#footer .col1 ul.second li a {
			text-align: left;
			}
			#footer .col1 ul li a:hover {
			text-decoration: underline;
			color: #ffc;
			}


/* Home page specific
===============================================*/

.home #main .col1 p {
font-size: 14px;
line-height: 18px;
text-shadow: #000 0 0 0;
}
	.home #main .col1 p.intro { /* Need to reset the intro */
	font-size: 16px;
	line-height: 22px;
	}
.home #main .col2 span.hr-deco, .folio #main #latest span.hr-deco, .folio #main #archive span.hr-deco {
margin: 6px auto 18px;
}




/* Latest News stuff
===============================================*/

#main h3 a, #main h3 a:link {
color: #e4c972;
text-decoration: none;
}
	#main h3 a:visited {
	color: #c6af69;
	}
	#main h3 a:hover {
	color: #ff9;
	border-bottom: 1px #39321d solid;	
	}

.news #main #archive h2,
.awards_archive #main #archive h2 {
margin-top: 0;
padding: 20px 0 0;
}

.news #main #single .col1-2 img {
float: left;
margin: 0 8px 8px 0;
}

	
.news #main #archive ul, .news #main #single .col3 ul {
border-top: 1px #2c2920 dotted;
}
	.news #main #single .col3 ul {
	margin-bottom: 20px;
	}
	.news #main #archive ul li, .news #main #single .col3 ul li, body.client #content ul {
	margin: 0;
	padding: 0;
	}
		.news #main #archive ul li a, .news #main #single .col3 ul li a, body.client #content ul li a {
		color: #e4c972;
		border-bottom: 1px #2c2920 dotted;
		display: block;
		font-size: 12px;
		font-weight: normal;
		padding: 5px 0 6px;
		text-shadow: none;
		text-decoration: none;
		}
		.news #main #archive ul li a:visited, .news #main #single .col3 ul li a:visited {
		color: #c6af69;
		}
			body.client #content ul li a:visited {
			color: #999;
			}
			.news #main #archive ul li a:hover, .news #main #single .col3 ul li a:hover, body.client #content ul li a:hover {
			border-bottom: 1px #ffc solid;	
			color: #ffc;
			}
			.news #main #archive ul li a span.date,  .news #main #single .col3 ul li a span.date, body.client #content ul li a span.date, body.client #content ul li a span.size {
			color: #666;
			font-family: monaco, 'courier new', verdana;
			font-size: 9px;
			padding: 2px 1px;
			}
				body.client #content ul li a span.size {
				color: #ccc;
				}

.news #main #single .col3 h2 {
padding: 10px 0 6px;
}
.news #main #single .col1-2 h2 {
font-size: 24px;
letter-spacing: 0;
line-height: 28px;
margin-bottom: 4px;
text-align: left;
text-transform: none;
text-shadow: #000 0 0 0;
}
	.news #main #single .col1-2 h3 {
	font-size: 12px;
	font-weight: normal;	
	}
	.news #main #single .col1-2 p {
	font-size: 14px;
	line-height: 18px;
	text-shadow: #000 0 0 0;
	}
	.news #main #single .project_link {
	float: right;
	height: 114px;
	margin: 0 0 10px 10px;
	width: 114px;
	}
		.news #main #single .project_link img {
		border: 0;
		}
/* Portfolio stuff
===============================================*/
.folio-item {
text-align: center;
}
	.folio-item a, .folio-item a:link, .folio-item a:visited {
	color: #e4c972;
	display: block;
	font-weight: bold;
	text-decoration: none;
	text-shadow: #000 0 0 0;
	}
		.folio-item a:hover {
		color: #ffc;
		}
		.folio-item a img, .folio-item a:link img, .folio-item a:visited img {
		border: 2px #2a2101 solid;
		display: block;
		margin: 0 auto 0.5em;
		}
			.folio-item a:hover img {
			border: 2px #796e4a solid;
			}
			
.folio #main .folio-nav {
background: transparent url(../img/bg-latest.gif) no-repeat bottom center;
padding: 0 0 14px;
}
.folio-nav .col1, .folio-nav .col2, .folio-nav .col3 {
padding-bottom: 0;
}
	.folio-nav .col3 {
	text-align: center;
	}

.folio-nav .col2 span.hr {
margin: 0 auto 12px;
}


.folio-nav .col2 ul {
}
	.folio-nav .col2 ul li {
	float: left;	
	text-align: center;
	width: 140px;
	}
		.folio-nav .col2 ul li a {
		border-bottom: 1px #3b341e solid;
		color: #fef7db;
		font: normal 11px/1em Georgia, Palatino, 'Times New Roman';
		letter-spacing: 0.35em;
		text-decoration: none;
		text-transform: uppercase;
		padding: 2px 0;
		}
			.folio-nav .col2 ul li a.active-tab {
			border-bottom: 1px #000 solid;
			color: #c1bda3;
			}
			.folio-nav .col2 ul li a:hover {
			color: #fff;
			border-bottom: 1px #fef7db solid;
			}
.folio #latest, .folio #archive {
padding-top: 15px;
}
	.folio #latest .col1, .folio #latest .col2, .folio #latest .col3,
	.folio #archive .col1, .folio #archive .col2, .folio #archive .col3 {
	padding: 0 0 10px;
	}

.folio-nav a#link_reel {
background: url(../img/icon-reel.gif) no-repeat top center;
display: block;
height: 116px;
line-height: 116px;
overflow: hidden;
text-indent: -999em;
width: 240px;
}
	.folio-nav a:hover#link_reel {
	background-position: bottom center;
	}
.project_link a {
background: url(../img/icon-launch.gif) no-repeat top center;
display: block;
height: 114px;
line-height: 114px;
overflow: hidden;
text-indent: -999em;
width: 114px;
}
	.project_link a:hover {
	background-position: bottom center;
	}

#nav_doubleup {
display: none;
margin: 20px auto;
width: 280px;
}
	#nav_doubleup li {
	text-align: center;
	}
		#nav_doubleup li a {
		border-bottom: 1px #3B341E dotted;
		border-top: 1px #3B341E dotted;
		display: block;
		color: #E4C972;
		font: normal 11px/1em Georgia, Palatino, 'Times New Roman';
		letter-spacing: 0.4em;
		text-align: center;
		text-decoration: none;
		text-transform: uppercase;
		padding: 8px 0;
		}
			#nav_doubleup li a:hover {
			border-bottom: 1px #3B341E solid;
			border-top: 1px #3B341E solid;
			color: #ffc;
			}
			#nav_doubleup li a.active-tab {
			display: none;
			}

		
/* Media-viewer
===============================================*/

#mv {
background: #161616 url(../img/bg-mediaviewer.gif) center repeat-y;
}

#media p {
background: #540000;
position: absolute;
padding: 15px 0;
text-align: center;
width: 576px;
}

.media-viewer {
width: 576px;
margin: 0 auto;
}
	.media-viewer #media {
	line-height: 0;
	padding: 0;
	}
	.media-viewer .details {
	background: #090909;
	padding: 14px 20px 20px;
	}
		.media-viewer h3 {
		border-bottom: 1px #2c270a dotted;
		color: #f7da7e;
		font: normal 16px/22px Georgia;
		text-shadow: #000 0 0 0;
		padding: 0 0 6px;
		margin: 0 0 12px;
		}
		.media-viewer .meta {
		float: left;
		margin: 0 10px 0 0;
		width: 180px;
		}
			.media-viewer .meta h4 {
			color: #e1d6a3;
			font-size: 11px;
			font-weight: normal;
			margin: 0;
			}
			.media-viewer .meta p {
			font-size: 11px;
			line-height: 13px;
			margin: 0 0 0.5em;
			}
		.media-viewer .description {
		margin-left: 200px;
		}
			.media-viewer .description p {
			color: #ccc;
			line-height: 15px;
			}
				.media-viewer .description p.moreinfo {
				margin-top: 1.4em;
				margin-bottom: 0;
				}
#return_nav {
position:absolute;
left:50%;
margin: 0 0 0 -534px;
overflow: hidden;
width: 200px;
padding: 24px 20px 16px;
}
	#return_nav a {		
	background: url(../img/logo-eyecandy.gif) top center no-repeat;
	display: block;
	height: 61px;
	width: 200px;
	border:0;
	text-indent: -999em;
	}
		#return_nav a:hover {
		background-position: bottom center;
		}

/* Profile
===============================================*/

#main .col2 .person { margin: 10px 0; }
	#main .col2 .person img {
	border: 1px #2a2101 solid;
	float: left;
	margin: 0 10px 0 0;
	}
	
	#main .col2 .person h3 {
	margin: 0 0 0.3em 72px;
	padding-top: 10px;
	}
	#main .col2 .person h4 {
	color: #948e75;
	margin: 0 0 10px 72px;
	}
	#main .col2 .person p {
	margin: 0.1em 0 0.9em;
	}

	.profile #main .col2 p.intro, .profile #main .col3 p.intro, .home #main .col3 p.intro {
	color: #e6e6e6;
	font-size: 14px;
	font-family: Helvetica, Verdana, Arial, sans-serif;
	line-height: 18px;
	text-shadow: #000 0 0 0;
	}
	.profile #main .col1 p {
	font-size: 14px;
	line-height: 18px;
	text-shadow: #000 0 0 0;
	}
		.profile #main .col1 p.intro { /* Need to reset the intro */
		font-size: 16px;
		line-height: 22px;
		}
.accordion_toggle {
border-right: 3px #000 solid;
height: 62px;
}
	.accordion_toggle * {
	cursor: pointer;
	}
.accordion_toggle:hover,
.accordion_toggle_active {
border-right: 3px #2a2101 solid;
background: #161616;
}
	.accordion_content {
	clear: both;
	overflow: hidden;
	}

		
/* Client Pages
===============================================*/

body.client {
background: #161616 url(../img/bg-mediaviewer.gif) center repeat-y;
}
	body.client #wrapper {
	width: 576px;
	margin: 0 auto;	
	}


	body.client h1 {
	border-bottom: 3px #161616 solid;
	float: none;
	height: 61px;
	overflow: hidden;
	text-indent: -999em;
	width: 576px;
	padding: 30px 0;
	}
		body.client h1 a, body.client h1 a:link, body.client h1 a:visited {
		background: url(../img/logo-eyecandy.gif) top center no-repeat;
		display: block;
		height: 61px;
		width: 576px;
		}		
			body.client h1 a:hover {
			background-position: bottom center;				
			}
	body.client #content {
	padding: 35px;
	border-bottom: 3px #161616 solid;
	}
		body.client #content p {
		font-size: 14px;
		text-shadow: #000 0 0 0;
		}
			body.client #content ul li a {
			background: transparent url(../img/icon-document.gif) no-repeat 0 0.35em;
			font-size: 14px;
			text-shadow: #000 0 0 0;
			padding-left: 24px;
			}
				body.client #content ul li.dir a {	background-image: url(../img/icon-dir.gif); }
				body.client #content ul li.document a {	background-image: url(../img/icon-document.gif); }
				body.client #content ul li.image a {	background-image: url(../img/icon-camera.gif); }
				body.client #content ul li.zip a {	background-image: url(../img/icon-open.gif); }
				body.client #content ul li.movie a {	background-image: url(../img/icon-tv.gif); }
				body.client #content ul li.flash a {	background-image: url(../img/icon-flash.gif); }
				body.client #content ul li.audio a {	background-image: url(../img/icon-music.gif); }
			
			
	body.client span.hr {
	margin:  18px auto 14px;
	}
	
	

#footer .col1 ul.client {
   width: 278px;
}

#footer .col1 ul.client li a {
text-align: center;
}

/*#footer .col1 span.hr-deco {
margin-bottom: 5px;
}*/