/****************** 
    INDEX PAGE
******************/
#portfolio_pane {
	position: relative;
	overflow: auto;
	width: 498px;
	height: 210px;
	background: url('../img/portfolio_pane_bg.png') no-repeat;
	margin: 0 2px;
}
#portfolio_pane_top {
	position: absolute;
	top: 0;
	left: 0;
	z-index: 6;
	width: 498px;
	height: 25px;
}
#portfolio_pane_bottom {
	position: absolute;
	left: 0;
	bottom: 0;
	z-index: 6;
	width: 478px;
	height: 18px;
	padding: 7px 10px 0 10px;
	background: url('../img/portfolio_pane_bottom.png') repeat-x;
}
#portfolio_pane_bottom {
	color: #fff;
	font-size: 11px;
}
#spinner {
	height: 22px;
	margin-top: -3px;
}
#portfolio_pane_left, #portfolio_pane_right {
	position: absolute;
	z-index: 7;
	top: 50px;
	width: 2px;
	height: 210px;
}
#portfolio_pane_left {
	left: 0;
	background: url('../img/portfolio_pane_left.png') repeat-y;
}
#portfolio_pane_right {
	left: 498px;
	background: url('../img/portfolio_pane_right.png') repeat-y;
}

/* Project Boxes */
#zipframe_content {
	position: absolute;
	top: 35px;
	left: 10px;
	z-index: 5;
}
.portfolio_group {
	clear: left;
}
.portfolio_project {
	float: left;
	width: 101px;
	height: 134px;
	font-size: .8em;
	padding: 3px 6px 6px 3px;
	margin: 0 5px 20px 0;
	background: url('../img/portfolio_itembox.png') no-repeat;
}
.portfolio_project img {
	border: 1px solid #000;
}
.portfolio_project div {
	margin: 5px;
}
.portfolio_project .date {
	font-size: .9em;
}

/* Navigation */
#portfolio_prev, #portfolio_next {
	position: absolute;
	top: -50px;
	z-index: 7; 
}
#portfolio_prev {
	left: 0;
}
#portfolio_next {
	left: 476px;
}
#portfolio_pane_top ul {
	margin: 0;
}
#portfolio_pane_top li {
	display: block;
	float: left;
	height: 25px;
	color: #fff;
	font-size: 11px;
}
#portfolio_pane_top a {
	display: block;
	height: 18px;
	text-align: center;
	opacity: .5;
	padding: 7px 0 0 0;
	border: 0;
}
#portfolio_pane_top a:hover {
	text-decoration: none;
	height: 20px;
	padding: 5px 0 0 0;
	opacity: .85;
}
#nav {
	height: 25px;
	color: #fff;
	font-size: 11px;
	text-align: center;
	background: url('../img/nav_bg.png') repeat-x;
}
#nav span {
	display: block;
	margin: 7px 0 0 0;
	opacity: .85;
}
#nav .corner {
	float: left;
	width: 10px;
	height: 25px;
	background: url('../img/nav_corner.png');
}
#nav .odd {
	float: left;
	height: 25px;
	background: url('../img/nav_bg2.png') repeat-x;
}
#nav .even {
	float: left;
	height: 25px;
	padding-left: 20px;
	background: url('../img/nav_odd2even.png') no-repeat;
}
#nav1 {
	background: url('../img/portfolio_nav_1.png') no-repeat;
}
#nav1 a {
	width: 96px;
}
#nav2 {
	background: url('../img/portfolio_nav_2.png') no-repeat;
	margin-left: 1px;
}
#nav2 a {
	width: 101px;
}
#nav3 {
	background: url('../img/portfolio_nav_3.png') no-repeat;
	margin-left: 1px;
}
#nav3 a {
	width: 88px;
}
#nav4 {
	background: url('../img/portfolio_nav_4.png') no-repeat;
	margin-left: 1px;
}
#nav4 a {
	width: 71px;
}
#nav5 {
	background: url('../img/portfolio_nav_5.png') no-repeat;
	margin-left: 1px;
}
#nav5 a {
	width: 57px;
}
#nav6 {
	background: url('../img/portfolio_nav_6.png') no-repeat;
	margin-left: 1px;
}
#nav6 a {
	width: 78px;
}

/****************** 
    VIEW PAGES
******************/
#body_view {
	background-color: #9C570B;
}
#body_pane .right {
	float: right;
	width: 220px;
}
#body_pane .left {
	font-size: .9em;
	margin-right: 240px;
}

#project_description {
	margin: 1em 0;
}
#project_tags {
	font-size: .9em;
}