.galleriffic_content { display: block; float: right; width: 525px; overflow: hidden; }
.galleriffic_navigation { width: 525px; float: left; }
.galleriffic_content a, .galleriffic_navigation a { text-decoration: none; color: #777; }
.galleriffic_content a:focus, .galleriffic_content a:hover, .galleriffic_content a:active { text-decoration: underline; }
.controls { margin-top: 5px; height: 23px; }
.controls a { padding: 5px; }
.ss-controls { float: left; }
.nav-controls { float: right; }
.slideshow-container { position: relative; clear: both; height: 390px; /* This should be set to be at least the height of the largest image in the slideshow */
	/*
	background-color: rgba(0, 0, 0, 0.9);
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	*/ }
.loader { position: absolute; top: 0; left: 0; background-image: url('/typo3conf/ext/mbkdimagelightbox/res/js/galleriffic-2.0/css/loader.gif'); background-repeat: no-repeat; background-position: center; width: 550px; height: 502px; /* This should be set to be at least the height of the largest image in the slideshow */ }
.slideshow { }
.slideshow span.image-wrapper { display: block; position: absolute; top: 0; left: 0; }
.slideshow a.advance-link { display: block; width: 525px; text-align: center; height: 390px; /* This should be set to be at least the height of the largest image in the slideshow */
	/*line-height: 502px;*/ /* This should be set to be at least the height of the largest image in the slideshow */ }
.slideshow a.advance-link:hover, .slideshow a.advance-link:active, .slideshow a.advance-link:visited { text-decoration: none; }
.slideshow img { vertical-align: middle; }
.slideshow img {/*border: 1px solid #ccc;*/
	/*
	-webkit-box-shadow: 0px 0px 10px rgba(255,255,255,0.5);
	-moz-box-shadow: 0px 0px 10px rgba(255,255,255,0.5);
	box-shadow: 0px 0px 10px rgba(255,255,255,0.5);
	*/
	/*
	-webkit-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	-moz-box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	box-shadow: 0px 0px 10px rgba(0,0,0,0.5);
	*/}
.slideshow img { max-width: 100%; max-height: 100%; width: auto; height: auto; }
.download { float: right; }
.caption-container { position: relative; clear: left; /*height: 75px;*/ }
span.image-caption { display: block; position: absolute; width: 550px; top: 0; left: 0; }
.caption { padding: 12px; }
.image-title { font-weight: bold; font-size: 1.4em; }
.image-desc { line-height: 1.3em; padding-top: 12px; }
.thumbs { clear: both; margin: 0; padding: 0; }
.galleriffic_thumbs .thumbs li { float: left; padding: 0 !important; margin: 0px 10px 5px 0 !important; list-style: none !important; background: none !important; }
a.thumb { padding: 2px; display: block; border: 1px solid #ccc; }
.thumbs li.selected a.thumb { background: #000; }
a.thumb:focus { outline: none; }
.thumbs img { border: none; display: block; }
.pagination { clear: both; }
.galleriffic_navigation .top { margin-bottom: 12px; height: 11px; }
.galleriffic_navigation .bottom { margin-top: 12px; }
.pagination a, .pagination span.current, .pagination span.ellipsis { display: block; float: left; margin-right: 2px; padding: 4px 7px 2px 7px; border: 1px solid #ccc; }
.pagination a:hover { background-color: #eee; text-decoration: none; }
.pagination span.current { font-weight: bold; background-color: #000; border-color: #000; color: #fff; }
.pagination span.ellipsis { border: none; padding: 5px 0 3px 2px; }


@media (-webkit-min-device-pixel-ratio: 1.25) {
	.galleriffic_content { float: none; width: 100%; }
	.slideshow a.advance-link { width: 100%; height: auto; }
	.galleriffic_navigation { width: 100%; }
	.slideshow-container { height: auto; }
	.slideshow span.image-wrapper { position: relative; }
	.galleriffic_thumbs { margin-top: 40px; }
}