/* 
Portfolio 
*/

/* General */

#portfolio {
	padding-top: 213px;
}

/* Menu */

#portfolio_menu, #portfolio_menu a {
	background-image: url("/images/portfolio/portfolio_menu.png") !important;
	background-image: url("/images/portfolio/portfolio_menu_alt.png");
}

#portfolio_menu {
	width: 375px;
	height: 42px;
	position: absolute;
	top: 162px;
	left: 72px;
	background-repeat: no-repeat;
	background-position: right top;
}

#portfolio_menu a {
	position: absolute;
	top: 3px;
	height: 34px;
	display: block;
	background-position: left -42px;
	background-repeat: no-repeat;
	outline-style: none;
}

#portfolio_menu .current a {
	cursor: default;
}

#portfolio_menu span {
	display: none;
}

#portfolio_web a {
	left: 18px;
	width: 86px;
}

#portfolio_web a:hover, #portfolio_web.current a {
	background-position: 0 top;
}

#portfolio_print a {
	left: 120px;
	width: 120px;
}

#portfolio_print a:hover, #portfolio_print.current a {
	background-position: -86px top;
}

#portfolio_film a {
	left: 252px;
	width: 105px;
}

#portfolio_film a:hover, #portfolio_film.current a {
	background-position: -206px top;
}

/* Projects */

.project {
	background: url("/images/portfolio/artwork_bg.png") no-repeat left bottom;
	position: relative;
	padding-bottom: 38px;
	margin-bottom: 10px;	
}

.project.last {
	margin-bottom: 0;
}

.project h2 {
	font-size: 12px;
	color: #fff;
	font-weight: normal;
	padding: 1.1em 0.9em 0.9em 0.9em;
	margin: 0 7px;
	background: url("/images/portfolio/artwork_bg.png") repeat-x left top;
}

.artwork {
	position: relative;
	width: 734px;
	background-color: rgb(0,0,0);
	top: 10px;
}

.artwork p {
	margin: 0;
}

.artwork .images {
	padding: 1px 7px 7px 7px;
}

.artwork .images img {
	display: block;
}

.artwork img.extra {
	margin-top: 7px;
}

.artwork .url {
	position: absolute;
	top: 12px;
	right: 19px;
	color: rgb(255,255,255);
}

#portfolio .artwork .url a {
	font-size: 11px;
	color: rgb(255,255,255);
	text-decoration: none;
	border-bottom: 1px solid rgb(236,0,140);
	position: relative;
}

#portfolio .artwork .url a:hover {
	border-bottom: 1px solid rgb(255,255,255);
}

.artwork .url span {
	font-size: 11px;
	color: rgb(255,255,255);
}

/* Details */

.project .details, 
.project .details_inner, 
.project .details li, 
.project .info, 
.project .info_inner, 
.project p.action,
.project a.visit {
	background-image: url("/images/portfolio/info_box.png") !important;
	background-image: url("/images/portfolio/info_box_alt.png");
}

.project .details {
	position: absolute;
	top: 0;
	right: 0;
	width: 210px;
	color: rgb(0,0,0);
	background-repeat: no-repeat;
	background-position: 0 top;
	padding-top: 17px;
}

.project .details.first {
	margin-top: 40px;
}

.project .details_inner {
	background-repeat: no-repeat;
	background-position: -420px bottom;
	padding-bottom: 19px;
}

.project .info {
	background-repeat: repeat-y;
	background-position: -210px center; 
	width: 100%;
}

.project .info_inner {
	background-repeat: repeat-y;
	background-color: rgb(255,255,255);
	background-position: -219px top;
	margin: 0 9px;
	padding: 0;	
}

.project .summary {
	background-image: url("/images/portfolio/summary_bg.png");
	background-repeat: repeat-y;
	background-position: bottom left;
	background-color: rgb(0,0,0);
	color: rgb(255,255,255);
	padding: 0.7em 1.2em 0 1.2em;
	font-size: 11px;
	line-height: 1.4em;
	margin: 0 6px 1em 6px;
}

.project .summary p {
	padding: 0 0 1.1em 0;
	margin: 0;
}

.project .details ul {
	color: rgb(93,93,93);
	margin: 0 9px;
	padding-bottom: 1em;
}

.project .details li {
	background-repeat: no-repeat;
	background-position: -1040px 4px;
	padding: 0.2em 1em 0.2em 2.3em;
}

.project p.action {
	margin: 0 8px 0 0;
	padding: 0.8em 0 0.5em 0;
	background-repeat: no-repeat;
	background-position: -630px top;
}

.project a.visit {
	margin: 0 auto;
	width: 100px;
	height: 40px;
	display: block;
	background-repeat: no-repeat;
	background-position: -840px top;
	outline-style: none;
}

.project a.visit:hover {
	background-position: -940px top;
}

.project a.visit span {
	display: none;
}

/* Additional Details */

.project .details h3 {
	font-size: 12px;
	margin: 1.3em 0 2px 0;
	font-weight: normal;
	padding: 0.5em 1em;
}

.project .details a {
	text-decoration: underline;
}

.project .details a:hover {
	text-decoration: none;
}

.project .details ul.samples {
	margin-top: 0;
	padding: 0.8em 0 1em 0;
}

.project .details ul.samples li {
	padding: 0.3em 1.1em;
	margin-bottom: 0;
	background-image: none;
}

.project .footnote a {
	color: rgb(191,191,191);
}

.project .footnote a:hover {
}