#photo_album {
	width: 718px;
}

#photo_view {
	width: 718px;
	margin-top: 15px;
}

#photo_cont {
	width: 600px;
	margin: 0 auto;
}

#photo_title {
	text-align: center;
	font-size: 11px;
	color: #333333;
	padding: 8px;
}

#photo_img {
	text-align: center;
	position: relative;
	width: 600px;
}

#photo_img img {
	cursor: hand;
	cursor: pointer;
}

#photo_dscr {
	font-size: 10px;
	color: #333333;
	padding: 5px;
	text-align: center;
}

div.scrollable.horizontal {
	position: relative;
	overflow: hidden;	 	
	width: 600px;	
	height: 115px;
	padding: 0;	
	margin: 0;
}

div.scrollable.horizontal div.items {	
	width: 20000em;	
	position: absolute;
	clear: both;	
	margin-left: 0px;
}

div.scrollable.horizontal div.items div {
	float: left;
	text-align: center;
	width: 100px;
	height: 100px;
	padding: 0;
	border: 1px solid #ffffff;
	margin-right: 22px;
}

div.scrollable.horizontal div.items div a {
	height: 102px;
	width: 102px;
	vertical-align: middle;
}

div.scrollable div.items div a img {
	display: block;
	margin: 0px auto;
}

/* active item */
div.scrollable div.items div.active {
	border:1px solid #333333;		
}

div#scroll_image {
	margin-left: -45px;
	text-align: center;
	margin-top: 20px;
}

div#scroll_image img {
	border: 3px solid #333333;
}


/* this makes it possible to add next button beside scrollable */
div.scrollable.horizontal {
	float:left;
}

/* prev, next, prevPage and nextPage buttons */
#photo_album a.prev, 
#photo_album a.next, 
#photo_album a.prevPage, 
#photo_album a.nextPage {
	width: 18px;
	height: 18px;
	background: url(../images/left.png) no-repeat;
	float: left;
	margin: 50px 10px;
	cursor: pointer;
	font-size: 1px;
}

#photo_album a.prev {
	margin-left: 32px;
}

/* mouseover state */
#photo_album a.prev:hover, 
#photo_album a.next:hover, 
#photo_album a.prevPage:hover, 
#photo_album a.nextPage:hover {
	background-position: 0px -18px;		
}

/* disabled navigational button */
#photo_album a.disabled {
	visibility:hidden !important;		
}

/* next button uses another background image */
#photo_album a.next, 
#photo_album a.nextPage {
	background-image:url(../images/right.png);
	clear:right;	
}

/*********** navigator ***********/


/* position and dimensions of the navigator */
div.navi {
	margin: 0 auto;
	height:20px;
	text-align:center;
}


/* items inside navigator */
div.navi a {
	width:8px;
	height:8px;
	display:inline-block;
	margin:3px;
	background:url(../images/navigator.png) 0 0 no-repeat;
	font-size:1px;
}

/* mouseover state */
div.navi a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
div.navi a.active {
	background-position:0 -16px;     
} 	


#content_container #photo_album {
	width: 530px;
}

#content_container #photo_album div.scrollable {
	width: 475px;
	height: 160px;
}

#content_container #photo_album div.scrollable div.items div {
	width: 150px;
	height: 150px;
	margin: 10px 10px 0px 0px;
}

#content_container #photo_album div.scrollable div.items div img {
	width: 140px;
	height: 140px;
}


#content_container #photo_album a.prev,
#content_container #photo_album a.next {
	display: block;
	width: 9px;
	height: 16px;
	background: url(../images/left_right.gif) no-repeat;
	cursor: pointer;
	margin: 70px 9px 0px 9px;
}

#content_container #photo_album a.prev {
	background-position: 0px -48px;
}

#content_container #photo_album a.prev:hover {
	background-position: 0px -16px;	
}

#content_container #photo_album a.next {
	background-position: 0px -32px;
}

#content_container #photo_album a.next:hover {
	background-position: 0px 0px;
}

#content_container #photo_album div.photo {
	margin: 12px 12px 0px 0px;
	float: left;
	width: 120px;
	height: 120px;
}

#content_container #photo_album div.photo img {
	width: 120px;
	height: 120px;
}