@charset "utf-8";

#portfolio {
	position:relative;
	width:980px;
	height:499px;
	overflow:hidden;
	margin-top:-29px;
}

.pf-content {
	float:left;
	width:980px;
	height:470px;
	overflow:hidden;
}

#pf-strip {
	position:absolute;
	top:30px;
	left:0px;
}

.pf-thumb {
	float:left;
	width:210px;
	height:200px;
	margin:0 46px 40px 0;
	font-size:0.9em;
	line-height:1em;
	text-transform:uppercase;
}

.last-thumb {
	margin-right:0px;
}

.pf-thumb a, .pf-thumb a:visited {
	color:#666666;
	text-decoration:none;
}

.pf-thumb a:hover {
	color:#FF0000;
}

.pf-thumb a img {
	display:block;
	border:1px solid #CCCCCC;
	margin-bottom:5px;
}

.pf-thumb a:hover img {
	border:1px solid #000000;
}

#pf-nav {
	height:19px;
	margin-bottom:10px;
}

#pf-nav-old, #pf-nav-new {
	float:right;
	width:19px;
	height:19px;
	background:url(../images/pf-nav.gif) 0px -19px no-repeat #003659;
	margin-left:1px;
}

#pf-nav-old {
	background-position:0px -57px;
}

#pf-loader {
	float:right;
	height:16px;
	width:19px;
	background:url(../images/loader-16.gif) top left no-repeat;
	margin:2px 2px 1px 2px;
}

#pf-nav-old a, #pf-nav-old a:visited, #pf-nav-old a:hover, #pf-nav-new a, #pf-nav-new a:visited, #pf-nav-new a:hover {
	display:block;
	width:19px;
	height:19px;
}

#projectImages {
	width:600px;
	padding-right:20px;
}

#caseImageWrap {
	width:616px;
	height:480px;
	position:relative;
	overflow:hidden;
}

#caseImage {
	position:absolute;
	top:0px;
	left:0px;
	width:600px;
}

.track {
    position:relative;
    float:right;
    top:11px; 
    width:11px;
    font-size:0;
    z-index:3;
    background:#DDDDDD;
}

.drag_bar {
    position:absolute;
    width:100%;
	height:10px;
    cursor:pointer;
    z-index:4;
    background:#999999;
}

.scrollUpArrow, .scrollDownArrow {
	position:absolute;
	width:11px;
	height:10px;
	font-size:0;
	background:url(../images/scroll-arrows.gif) 0px 0px no-repeat #999999;
	cursor:pointer;
	z-index:100;
}

.scrollDownArrow {
	background-position:0px -10px;
	z-index:101;
}

#caseDetail {
	float:right;
	width:164px;
	height:500px;
	margin-top:-20px;
}

#caseDetail2 {
	margin:0;
	padding:0 20px 20px 20px;
	width:315px;
	border:5px solid #EFEFEF;
	border-width:5px 0 2px 0;
	background-color:#F5F5F5;
}

#caseDetail dl, #caseDetail2 dl {
	margin:0;
	padding:0;
}

#caseDetail dl dt, #caseDetail2 dl dt {
	margin:0;
	padding:20px 0 0 0;
	font-size:1.4em;
	font-weight:bold;
	color:#333333;
}

#caseDetail dl dd, #caseDetail2 dl dd {
	margin:0;
	font-size:1.2em;
	line-height:1.4em;
}

#caseDetail dl dd.list-item, #caseDetail2 dl dd.list-item {
	background:url(../images/gray-square.gif) 0px 5px no-repeat;
	padding-left:10px;
}

#caseImageNav {
	font-size:1.2em;
	padding-top:5px;
	height:15px;
	overflow:hidden;
}

#portfolio2 {
	width:980px;
}

#projectImages2 {
	float:right;
	width:600px;
	padding-left:20px;
}

#loader-bar {
	position:absolute;
	left:272px;
	top:204px;
	width:32px;
	height:32px;
	padding:20px;
	border:2px solid #999999;
	background:url(../images/loader-32.gif) 50% 50% no-repeat #FFFFFF;
}