#cat_galleriffic { direction:ltr;position:relative;width:690px; }

#cat_galleriffic .noscript { display: none; }

/* CONTENT */
#cat_galleriffic div.content { display: none; float: right; width: 550px; }
#cat_galleriffic div.content a, div.navigation a { text-decoration: none; color: #777; }
#cat_galleriffic div.content a:focus, #cat_galleriffic div.content a:hover, #cat_galleriffic div.content a:active { text-decoration: underline; }

#cat_galleriffic div.controls { margin-top: 5px; height: 23px; }
#cat_galleriffic div.controls a { padding: 5px; }
#cat_galleriffic div.ss-controls { float: left; }
#cat_galleriffic div.nav-controls { float: right; }

/* IMAGE */
#cat_galleriffic div.slideshow img { width:550px; height:440px; border:0px; }

/* NAVIGATION */
#cat_galleriffic div.navigation { width:170px;height:500px;position:absolute;left:0px;top:0px;
    /* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */
}

#cat_galleriffic div.slideshow-container { position: relative; clear: both; height: 400px; }
/* This should be set to be at least the height of the largest image in the slideshow */

#cat_galleriffic div.loader {
	position: absolute;
	top: 0;
	left: 0;
	background-image: url('loader.gif');
	background-repeat: no-repeat;
	background-position: center;
	width: 470px;
	height: 402px; /* This should be set to be at least the height of the largest image in the slideshow */
}

#cat_galleriffic div.slideshow {  }

#cat_galleriffic div.slideshow span.image-wrapper { display: block; position: absolute; top: 0; left: 0; }

#cat_galleriffic div.slideshow a.advance-link {
	display: block;
	height: 440px; /* This should be set to be at least the height of the largest image in the slideshow */
	line-height: 0px; /* This should be set to be at least the height of the largest image in the slideshow */
	text-align: center;
}

#cat_galleriffic div.slideshow a.advance-link:hover, #cat_galleriffic div.slideshow a.advance-link:active, #cat_galleriffic div.slideshow a.advance-link:visited {
	text-decoration: none;
}

#cat_galleriffic div.download { float: right; }

#cat_galleriffic div.caption-container { position: relative; clear: left; }
#cat_galleriffic span.image-caption { display: block; position: absolute; width: 470px; top: 0; left: 0; }
#cat_galleriffic div.caption { padding: 12px; }
#cat_galleriffic div.image-title { font-weight: bold; font-size: 1.4em; }
#cat_galleriffic div.image-desc { line-height: 1.3em; padding-top: 12px; }

#cat_galleriffic ul.thumbs { clear: both; margin: 0; padding: 0; }
#cat_galleriffic ul.thumbs li { float: left; padding: 0; margin: 2px; list-style: none; }
#cat_galleriffic a.thumb { padding: 2px; display: block; }
#cat_galleriffic ul.thumbs li.selected a.thumb { }
#cat_galleriffic a.thumb:focus { outline: none; }
#cat_galleriffic ul.thumbs img { border: none; display: block; width:100px; }

#cat_galleriffic div.pagination { clear: both; }

#cat_galleriffic div.navigation div.top { margin-bottom: 12px; height: 11px; }
#cat_galleriffic div.navigation div.bottom { margin-top: 12px; }

#cat_galleriffic div.pagination a, #cat_galleriffic div.pagination span.current, #cat_galleriffic div.pagination span.ellipsis {
	display: block;
	float: left;
	margin-right: 2px;
	padding: 4px 7px 2px 7px;
}

#cat_galleriffic div.pagination a:hover { background-color: #eee; text-decoration: none; }
#cat_galleriffic div.pagination span.current { font-weight: bold; color: #A58B67; background-color: #fff; }
#cat_galleriffic div.pagination span.ellipsis { border: none; padding: 5px 2px 3px 2px; }
