
#container {
	width: 990px;
	margin: 0 auto;
	padding-top: 92px;
/* 	overflow: hidden; */
}

#sidebar {
	width: 162px;
	float: left;
	display: inline;
}

#main {
	width: 828px;
	float: left;
	display: inline;
}

h1 { margin: 92px 0 82px 0; }

p, li { font-size: 1em; }

#logo a, #nav a {
	display: block;
	overflow: hidden;
	text-indent: -999em;
}

#logo a {
	width: 162px;
	height: 10px;
	background: url(../img/sprites.png) 0 0 no-repeat;
}

#home-logo {
	display: none;
	float: left;
	margin: 183px 0 0 162px;
	width: 233px;
	height: 20px;
	overflow: hidden;
	text-indent: -999em;
	background: url(../img/engineered.png) no-repeat;
	cursor: pointer;
	
}


/* Navigation */

#nav li { margin-bottom: 12px; }

#nav li.selected { overflow: hidden; }

#nav a {
	height: 10px;
	background: url(../img/sprites.png) 0 0 no-repeat;
}

#nav #nav-work { 			background-position: 0px -10px; 	width: 74px; }
#nav #nav-work:hover { 		background-position: 0px -20px; }
#nav #nav-contact { 		background-position: 0px -30px; 	width: 74px; }
#nav #nav-contact:hover { 	background-position: 0px -40px; }
#nav #nav-bio { 			background-position: 0px -50px; 	width: 74px; }
#nav #nav-bio:hover { 		background-position: 0px -60px; }

#nav .selected #nav-work {
	background-position: 0px -20px;
	float: left;
	display: inline;
}
#nav .selected #nav-contact { 		background-position: 0px -40px; }
#nav .selected #nav-bio { 			background-position: 0px -60px; }

#nav ul #nav-retouching { 			background-position: 0px -70px; 	width: 88px; }
#nav ul #nav-retouching:hover { 	background-position: 0px -80px; }
#nav ul #nav-3d { 					background-position: 0px -90px; 	width: 88px; }
#nav ul #nav-3d:hover { 			background-position: 0px -100px; }
#nav ul .nav-back { 				background-position: 0px -110px;	width: 20px; }
#nav ul .nav-back:hover { 			background-position: -20px -110px; }

#nav ul .selected #nav-retouching { 	background-position: 0px -80px; }
#nav ul .selected #nav-3d { 			background-position: 0px -100px; }
#nav ul .selected .nav-back { 			background-position: 0px -110px; }

#nav .hidden { display: none; }

#nav ul {
	display: block;
	width: 88px;
	float: left;
	display: inline;
	overflow: hidden;
	padding-top: 22px;
	background: url(../img/divider.png) 0 4px no-repeat;
	display: none;
}


/* Grid */

#grid { overflow: hidden; }

.work3d #grid {
	margin-right: 276px;
	margin-top: 92px;
}

#grid li {
	float: left;
	display: inline;
	margin-left: 4px;
	margin-bottom: 4px;
	position: relative;
	font-size: 1em;
}

#grid a, #grid a span {
	display: block;
	width: 88px;
	height: 88px;
}

#grid a span {
	position: absolute;
	top: 0;
	left: 0;
	color: #fff;
	background: #000;
	display: none;
}

#grid strong {
	display: block;
	padding: 5px;
	font-weight: normal;
}


/* Image page */

.thumbs {
	width: 100px;
	margin-left: 48px;
	margin-top: 184px;
	overflow: hidden;
	float: left;
	display: inline;
}

.thumbs li {
	display: block;
	margin-bottom: 4px;
	position: relative;
	width: 44px;
}

.thumbs .nav-back {
	display: block;
	overflow: hidden;
	text-indent: -999em;
	height: 10px;
	width: 20px;
	background: url(../img/sprites.png) 0px -110px no-repeat;
	margin-top: 18px;
}

.thumbs .nav-back:hover { background: url(../img/sprites.png) -20px -110px no-repeat; }

.thumbs .selected {
	display: block;
	overflow: hidden;
	text-indent: -999em;
	width: 44px;
	height: 44px;
	background: #eee url(../img/sprites.png) 0 -170px no-repeat;
}

.thumbs span {
	display: block;
	width: 44px;
	height: 44px;
	background: #000;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
}

#image {
	float: left;
	display: inline;
	width: 680px;
/* 	overflow: hidden; */
}

#image img.large { display: block; }

.meta {
	margin-left: 0;
	padding-top: 19px;
	position: relative;
}

.extras a, .credits strong {
	display: block;
	overflow: hidden;
	text-indent: -999em;
	height: 10px;
	background: url(../img/sprites.png) no-repeat;
}

.extras {
	display: block;
	overflow: hidden;
	height: 150px;
}

.extras li {
	float: left;
	display: inline;
	margin-right: 25px;
}

.extras .credits { 			background-position: 0 -120px; width: 56px; }
.extras .credits:hover { 	background-position: 0 -130px; }
.extras .elements { 		background-position: 0 -140px; width: 119px; }
.extras .elements:hover { 	background-position: 0 -150px; }

ul.credits {
	color: #666;
	display: block;
	overflow: hidden;
	display: none;
	position: absolute;
	top: 71px;
	left: 0;
}

.credits li {
	float: left;
	display: inline;
	margin-right: 44px;
	margin-bottom: 22px;
}

.credits strong {
	font-weight: normal;
	height: 5px;
	margin-bottom: 3px;
}

.credits .client {			background-position: 0 -225px; width: 35px; }
.credits .agency {			background-position: 0 -230px; width: 40px; }
.credits .photographer {	background-position: 0 -235px; width: 82px; }
.credits .art-director {	background-position: 0 -240px; width: 75px; }
.credits .photography {		background-position: 0 -245px; width: 75px; }
.credits .cgi {				background-position: 0 -250px; width: 15px; }

img.elements {
	display: none;
	position: absolute;
	top: 71px;
	left: 0;
}


/* Vertical image layout */

#image.vert img.large {
	float: left;
	display: inline;
	margin-right: 22px;
}

.vert .meta {
	float: left;
	display: inline;
	margin-left: 0;
	padding-top: 90px;
}

.vert .extras li {
	float: none;
	display: block;
	margin-bottom: 17px;
}

.vert ul.credits { top: 184px; }

.vert .credits li {
	float: none;
	display: block;
	margin-bottom: 22px;
	width: 180px;
}

.vert img.elements { top: 184px; }


/* Bio */

#basic {
	padding-top: 184px;
	margin-left: 96px;
}

#basic .content {
	width: 364px;
	float: left;
}

#basic .content p, #basic .content li {
	color: #666;
	font-size: 1.1em;
}

.biopic {
	float: right;
}

#basic .contact-details {
	overflow: hidden;
	width: auto;
}

.contact-details li {
	float: left;
	display: inline;
	width: 184px;
}

.contact-details li.online {
	width: 250px;
}

.contact-details h3 {
	height: 10px;
	width: 10px;
	margin: 0 0 8px 0;
	background: url(../img/sprites.png) no-repeat;
	overflow: hidden;
	text-indent: -999em;
}

h3.address 		{ background-position: 0 -160px; }
h3.email 		{ background-position: -10px -160px; }
h3.phone 		{ background-position: -20px -160px; }

.contact-details a, .contact-details a:visited {
	text-decoration: none;
	color: #666;
}

.contact-details a:hover { color: #000; }


.copyright {
	clear: both;
	float: right;
	display: block;
	overflow: hidden;
	text-indent: -999em;
	height: 10px;
	width: 107px;
	background: url(../img/sprites.png) 0 -215px no-repeat;
	margin: 44px 0 0 0;
}

.work3d .copyright { margin-right: 276px; }