#content{
	width:750px;
}

#header-image{
	position:absolute;
	top:5px;
	left:0px;
	background-image: url('/images/portfolio/header.png');
	width:67px;
	height:15px;
	
}

.portfolio-container{
	
}

#loading-container{
	position:absolute;
	z-index: 300;
}

#portfolio-project-list{
	float:right;
	display:inline;
	position:relative;
	margin-right:15px;
	width:233px;
	overflow:visible;
	z-index:500;
}

#portfolio-project-list .trigger{
	background-image: url('/images/portfolio/client-list-title.png');
	width:233px;
	height:25px;
	cursor: pointer;
}

#portfolio-project-list .list{
	position:absolute;
	top:25px;
	left:0px;
	width:100%;
	height:250px;
	overflow: auto;
	z-index:500;
}

#portfolio-project-list .list-item{
	padding:2px;
	background-color: white;
	cursor: pointer;
}

#portfolio-project-list .list-item-over{
	background-color: #9a8c7e;
	color: white;
}

#portfolio-navigation{
	float:right;
	display:inline;
	margin-right:17px;
	width:235px;
	height:25px;
	background-color:white;
}

#portfolio-navigation #portfolio-previous{
	float:left;
	display:inline;
	background-image: url('/images/portfolio/prev_page_OFF.png');
	width:54px;
	height:25px;
}
#portfolio-navigation #portfolio-previous:hover{
	background-image: url('/images/portfolio/prev_page_ON.png');
}

#portfolio-navigation #portfolio-paging{
	float:left;
	display:inline;
	padding-top:3px;
	width:127px;
	text-align:center;
	font-weight:bold;
	color: #9a8c7e;
}

#portfolio-navigation #portfolio-next{
	float:right;
	display:inline;
	background-image: url('/images/portfolio/next_page_OFF.png');
	width:54px;
	height:25px;
}
#portfolio-navigation #portfolio-next:hover{
	background-image: url('/images/portfolio/next_page_ON.png');
}

#back-to-project{
	float:right;
	display:inline;
	margin-right:15px;
	width:38px;
	height:25px;
	background-image: url('/images/portfolio/back_to_list_OFF.png');
}

#back-to-project:hover{
	background-image: url('/images/portfolio/back_to_list_ON.png');	
}

#browse-container{
	float:right;
	display:inline;
	width:108px;
	height:25px;
}

#browse-next{
	float:right;
	display:inline;
	width:54px;
	height:25px;
	background-image: url('/images/portfolio/browse_right_OFF.png');	
}
#browse-next:hover{
	background-image: url('/images/portfolio/browse_right_ON.png');
}

#browse-previous{
	float:left;
	display:inline;
	width:54px;
	height:25px;
	background-image: url('/images/portfolio/browse_left_OFF.png');	
}
#browse-previous:hover{
	background-image: url('/images/portfolio/browse_left_ON.png');	
}

/* Project Pages */
.portfolio-projects-container{
	margin-top:20px;	
}
.portfolio-project-container{
	float:left;
	display:inline;
	overflow: hidden;
	margin-right:15px;
	margin-bottom: 40px;
	width:235px;
	height:235px;
	cursor: pointer;
}

.portfolio-project-container .image{
	width:225px;
	height:139px;
	border: 5px solid white;
	overflow: hidden;
}

.portfolio-project-container .ext-el-mask{
	background-color: #E6E6E6;
}
	

.portfolio-project-container-over .image{
	border-color: #0f4657;	
}

.portfolio-project-container .image img{
	width:225px;
	height:139px;
}

.portfolio-project-container .title{
	margin-left:5px;
	margin-top:9px;
	font-size:14px;
	font-weight:bold;
	color:#0f4657;
}
.portfolio-project-container .title a{
	color:#0f4657;
}

.portfolio-project-container .description{
	margin-left:5px;
	margin-top:5px;
	color:#333333;
}

/* Single Item */
#portfolio-item-animation-container{
	width:720px;
	margin:0 auto;
}

.portfolio-item-container{
	padding-top:20px;
}

.portfolio-item-container .left{
	float:left;
	display:inline;
	width:595px;
}

.portfolio-item-title{
	margin-top:18px;
	margin-bottom:10px;
}

.portfolio-item-title .title{
	float:left;
	display:inline;
	color:#0f4657;
	font-weight:bold;
	font-size:21px;
	line-height:24px;
}

.portfolio-item-title .link{
	float:right;
	display:inline;
	background-image: url('/images/portfolio/visit_site_OFF.png');
	width:83px;
	height:25px;
}


.portfolio-item-title .link:hover{
	background-image: url('/images/portfolio/visit_site_ON.png');
}

.portfolio-item-content{
		
}

.portfolio-item-container .image-container{
	margin-right:20px;
	border: 5px solid white;
	width:585px;
	height:364px;
}

.portfolio-item-container .image{
	background-color:#929292;
	width:585px;
	height:364px;
}

.portfolio-item-container .thumbnail-container{
	float:left;
	display:inline;
	margin-left:15px;
	width:110px;
}

.portfolio-item-container .thumbnail{
	width:100px;
	height:75px;
	margin-bottom:10px;
	background-color:#929292;
	border: 5px solid white;
	cursor: pointer;
}

.portfolio-item-container .thumbnail-over{
	border-color: #0f4657;
}