/******************************
styles for slideshows

!!! 
this css has been added to content.css temporarily - it needs to be re-instated as a 
seperate stylesheet - miks
!!!

1)	strangely, IE needs both the following selectors to implement hover styles on images within links: 
	#ssTileSelector a.ssTileLink:hover, #ssTileSelector a.ssTileLink:hover img (also in sectional stylesheets)
2)	cursor: default; on current tile - so link which cannot be followed LOOKS like it cannot be followed

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

#ssSlideshow
{
	width: 100%;
	margin-bottom: 14px;
	border:1px solid #ccc;
	font-family: Verdana, Arial, Helvetica, sans-serif;
}

#ssTileSelector 
{  
	text-align: center;
	padding: 5px 0px;
	background-color: #ccc;

}
#ssTileSelector a{
	border-bottom: 0px !important;
}
#ssTileSelector img {
	display: inline;
	margin: 2px;
	border-width: 2px;
	border-color: #ccc;		/* same as bg so not visible */
	width: 74px;
	height: 74px;
}
#ssTileSelector img.ssCurrTileImage {border-color:#39c}
#ssControls
{	font-size:0.7em;
	text-align: left;
	padding: 5px 0 10px 10px;
	background-color:#FFFFFF;
}
.ssSlide 
{
	padding:10px;
	margin-bottom: 0px;
	background: #fff;
	display:block;
}
.ssSlide p
{
	padding: 5px;
	margin: 9px 0px;
	color:#61635E;
	font-size:0.9em;
	display:inline;
}
.ssSlide img
{
	padding: 0px;
	margin: 0 0 10px 0;
}

#ssPagination {clear:both; width:100%; text-align:right; font-family:Verdana; font-size:0.8em; color:#ccc;}
#ssPagination a {text-decoration:none;}

/* ----- hover styles (Note 1) ----- */
#ssTileSelector a.ssCurrTileLink:hover, #ssTileSelector a.ssTileLink:hover img.ssCurrTileImage
{
	cursor: default;		/* see Note 2 */
}

/* ----- menubar ----- */
div.ssMenubar {   
	overflow: auto;		/* MACs need this - without it, in safari the menu bg collapses, and in IE5 content migrates out of the container! - CHECK THIS STILL TRUE (comes from page.css) */	
}

div.ssMenubar ul 
{
	display: inline; 
	margin: 0px;
	padding:0px;
}
div.ssMenubar ul li 
{
	float: center;
	display: inline;
	margin: 0px 5px 0px 20px;
	list-style: none;
	background:none;
}
div.ssMenubar ul li a:hover
{
	text-decoration: none;
}

#ssControls.ssMenubar ul li a.pointRight, #ssControls.ssMenubar ul li a.pointRight:hover
{
	color: #333;
	text-decoration:none;
	background-image: url(/icons/slideshow/button_fwd.gif);
	background-repeat: no-repeat;
	background-position: right center;
	padding:1px;
	padding-left:3px;
	padding-right:17px;
	border:1px solid #CCCCCC;
	display:block;
	float:left;
	margin-left:5px;
	font-size:10px;
}
#ssControls.ssMenubar ul li a.pointCenter, #ssControls.ssMenubar ul li a.pointCenter:hover
{
	color: #333;
	text-decoration:none;
	background-image: url(/icons/slideshow/button_play.gif);
	background-repeat: no-repeat;
	background-position: right center;
	padding:1px;
	padding-left:3px;
	padding-right:15px;
	border:1px solid #CCCCCC;
	display:block;
	float:left;
	margin-left:5px;
	font-size:10px;
}
#ssControls.ssMenubar ul li a.pointLeft, #ssControls.ssMenubar ul li a.pointLeft:hover
{
	color: #333;
	text-decoration:none;
	background-image: url(/icons/slideshow/button_back.gif);
	background-repeat: no-repeat;
	background-position: left center;
	padding:1px;
	padding-left:20px;
	padding-right:3px;
	border:1px solid #CCCCCC;
	display:block;
	float:left;
	font-size:10px;
}
#ssControls.ssMenubar ul li a.disabled, #ssControls.ssMenubar ul li a.disabled:hover {color:#ccc; cursor:pointer;}

#ssSlideshow.flickr {width:270px;}

.createPage #ssSlideshow.flickr {
float:right;
margin-left:14px;
width:270px;
}


#ssSlideshow.flickr .ssSlide { height:320px; overflow:visible}


/* Added by CHRIS to make the Fade In effect work 7/9/07 */
/*#ssSlideshow { visibility: hidden; }*/