#PhotoGalleryContainer img
{
	border-style:none;
}
#PhotoIcons img
{
	height:49px;
}
#PhotoGalleryLeft
{
	background-image:url(/images/background/photoGalleryLeftBorder.jpg);
	background-repeat:no-repeat;
	height:576px;
	width:9px;
	float:left;
	background-color:Transparent;
}
#PhotoGalleryRight
{
	background-image:url(/images/background/photoGalleryRightBorder.jpg);
	background-repeat:no-repeat;
	height:576px;
	width:9px;
	float:right;
	background-color:Transparent;
}
#PhotoGalleryBody
{
	background-image:url(/images/background/photoGalleryGradientBG.jpg);
	background-repeat:repeat-x;
	width:641px;
	height:576px;
	float:left;
	background-color:Transparent;
	overflow:hidden;
}
#PhotoIcons
{
	margin:20px 0;
}
.prevPage
{
	background-image:url(/images/galleryleftarrow.gif);
	background-repeat:no-repeat;
	background-position:center;
	position:relative;
	z-index:2;
	float:left;
	height:50px;
	width:26px;
	cursor:pointer;
}
.prevPage.disabled, .nextPage.disabled
{
	opacity:0.4; /*for proper browsers*/
	filter:alpha(opacity=40); /*for IE*/
	cursor:default;
}

.nextPage
{
	background-image:url(/images/galleryrightarrow.gif);
	background-repeat:no-repeat;
	background-position:center;
	position:relative;
	z-index:2;
	float:right;
	height:50px;
	width:26px;
	cursor:pointer;
}
.clear
{
	clear:both;
	margin:0;
	padding:0;
}
/* 
    root element for the scrollable. 
    when scrolling occurs this element stays still. 
*/ 
div.scrollable { 
 
    /* required settings */ 
    position:relative; 
    overflow:hidden; 
    width: 589px; 
    height:49px; 
    float:left; /* this makes it possible to add next button beside scrollable */
    margin-bottom:10px;
} 
 
/* 
    root element for scrollable items. Must be absolutely positioned 
    and it should have a extremely large width to accomodate scrollable items. 
    it's enough that you set width and height for the root element and 
    not for this element. 
*/ 
div.scrollable div.items { 
    /* this cannot be too large */ 
    width:20000em; 
    position:absolute; 
}

div.items a img
{
	opacity:0.4; /*for proper browsers*/
	filter:alpha(opacity=40) /*for IE*/
}
div.items a.active img
{
	opacity:1;
	filter:alpha(opacity=100)
}
div#PhotoGalleryImage
{
	text-align:center;
	margin: 0 auto;
	width: 641px;
	height: 480px;
	overflow:hidden;
	clear:left;
}
div#PhotoGalleryImage img
{
	overflow:hidden;
}
#fadeLeft
{
	
	left:280px;
	z-index:10;
	background-position: -18px center;
	cursor:pointer;
}
#fadeRight
{
	right:65px;
	background-position: -72px center;
}
.fade
{
	position:absolute;
	z-index:10;
	background-image: url(/images/background/fade.png);
	background-repeat: no-repeat; 
	width:35px;
	height:51px;
}