/* main vertical scroll */
.galleryWrapper {
width:854px;
position:relative;
margin:0 auto;
}

.category {
clear:both;
width:852px;
height:502px; /* 502 */
border:1px solid #666;
}

.intro {
padding:50px 50px 0 50px;
position:absolute;
top:48px;
right:0;
width:458px;
height:392px; /* 392 */
z-index:6;
background:#fff;
border:1px solid #666;
font-family:Arial, Helvetica, sans-serif;
font-size:12px;
color:#999;
}

.intro h1 {
margin-top:0;
color:#19304f;
font-size:24px;
font-weight:normal;
}

.intro strong {
color:#222d4d;
}

.intro ul {
width:224px;
padding:10px 0px;
margin:0;
list-style:square outside url(images/bullet-e.gif);
float:left;
}

.intro li {
width:160px;
padding:0 10px 0 10px;
margin-left:20px;
margin-bottom:3px;
}

.clearIntro {
float:right;
margin-top:15px;
margin-right:40px;
cursor:pointer;
}

.main {
	position:relative;
	overflow:hidden;
	height: 492px;
}

/* root element for pages */
.pages {
	position:absolute;
	height:20000em;
}

/* single page */
.page {
	padding:20px 0 0 0;
	height: 492px;
	background:#fff;
	width:560px;
	position:relative;
}

.desc-toggle {
background:#777474;
text-align:center;
position:absolute;
left:518px;
height:20px;
width:37px;
color:white;
z-index:3;
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
border:1px solid #ccc;
margin-right:8px;
padding-top:7px;
cursor:pointer;
}

.description {
background:#999;
position:absolute;
top:0px; /* top:310px; */
left:0px;
width:560px;
z-index:2;
opacity:0.9;filter:alpha(opacity=90);
font-size:12px;
font-family:Arial, Helvetica, sans-serif;
}

.excerpt {
padding:10px;
color:white;
opacity:1;filter:alpha(opacity=100);
}

.more {
padding: 0 10px 10px;
color:white;
opacity:1;filter:alpha(opacity=100);
display:none;
}

/* root element for horizontal scrollables */
.scrollable {
	position:relative;
	overflow:hidden;
	width: 560px;
	height: 450px;
}

/* root element for scrollable items */
.scrollable .items {
	width:20000em;
	position:absolute;
	clear:both;
}

/* single scrollable item */
.item {
	float:left;
	cursor:pointer;
	width:560px;
	height:450px;
	padding:8px 0;
}



/* left navigator */

.up_button {
top:170px;
border:0;
left:20px;
z-index:2;
position:absolute;
background:white;
display:block;
width:222px;
}

.down_button {
top:620px;
z-index:2;
position:absolute;
background:white;
display:block;
left:20px;
width:222px;
}

.left_scroll_wrap {
	float:left;
	padding:0 0px 0 20px !important;
	margin: 45px 0 0 0px !important;
	height:415px;
	overflow:hidden; 
	width:250px;
	position:relative; 
	background:#fff;
}

.left_items {
position:absolute;
clear:left;
width: 20000em;
}

.left_items div.project {

	background-color:#dedede;
	border-top:3px solid #fff;
	clear:both;
	color:#333;
	font-size:12px;
	height:60px;
	list-style-type:none;
	padding:10px;
	width:200px;
	cursor:pointer;
	
}

.left_items div.project div.content {
width:180px;
}

.left_items div.project:hover {
	background-color:#19304F;
	color:#fff;
}

.left_items div.active {
	background-color:#19304F;
	color:#fff;
}

.left_items img {
	float:left;
	margin-right:10px;
	height:60px;
	width:60px;
}

.left_items strong {
	display:block;
}

.main div.navi {
	cursor:pointer;
	height:auto;
	width:auto;
	margin-left:10px;
	margin-top:5px;
	float:left;
}

.page {
align:center;
}

.imgnav {
float:left;
line-height:16px;
height:20px;
max-height:20px;
}

.left_button, .right_button {
margin-top:2px;
float:left;
cursor:pointer;
font-size:10px;
color:#666;
}

.left_button {
margin-left:240px;
}

.right_button {
margin-left:10px;
}

.imgnav .left_button {
margin-left:0;
}


#tabs { 
float:right;
margin:0;
padding:0;
font-size:12px;
height: 28px;
}

#tabs li {
list-style:none; 
float:left;
margin:0 0 0 1px;
padding:0;
height:23px;
line-height:23px;
background-color:#dedede;
border-bottom:solid white 5px;
}

#tabs li a {
text-decoration:none;
color:#666;
margin:0;
padding: 0px 10px;
line-height:23px;
}

#tabs li a.current {
text-decoration:none;
color:#fff;
background:#19304F;
border-bottom:solid #19304F 5px;
}

.visible {
display:block !important;
}

.invisible {
display:none;
}

.description a {
color:#fff;
}

a img {
border:0;
}

div.navi a {
	background:url(images/nav-squares.gif) 0 0 no-repeat;
}

.imgnav {
visibility:hidden;
}

.pagenav {
font-family:Arial;
font-size:17px;
color:#222d4d;
line-height:36px;
margin-right:6px;
margin-top:25px;
float:right;
padding-left:36px;
}

.pagenav a {
text-decoration:none;
color:#222d4d;
}

.pagenav img {
vertical-align:middle;
}

#footer {
	font-size: 8px;
	color: #242E50;
	text-align: right;
	padding-top: 10px;
	margin-right: 4px;
	margin-bottom: 0px;
	clear:right;
}
#footer a {
	text-decoration: none;
}

#home .pagenav, #home #footer {
margin-right:30px;
}



/***********************************
 
home page 

***********************************/

.projectnav {
margin:35px 0 35px 35px;
}

.projectnav .project {
width:257px;
padding-right:10px;
float:left;
position:relative;
}

.projectnav .project h1 {
text-align:center;
font-family:arial;
font-size:15px;
color:#999;
font-weight:normal;
height:15px;
line-height:15px;
margin-bottom:15px;
margin-top:0;
}

.projectnav .project h1 a {
color:#999;
text-decoration:none;

}

.projectnav .project img {
padding:10px;
border: 1px solid black;
}

.projectnav .project .obscure {
position:absolute;
top:41px;
left:10px;
width:235px;
height:235px;
z-index:2;
background:#222d4d;
opacity:0.5;filter:alpha(opacity=50);
}
