div.content {display: none; float: left; }
	/* The display of content is enabled using jQuery so that the slideshow content won't display unless javascript is enabled. */
div.content a, div.navigation a {text-decoration: none;}

div.content a:focus, div.content a:hover, div.content a:active {text-decoration: underline; outline: none;}
div.controls {float: left; margin: 50px; height: 23px; position: relative}
div.controls a {padding: 0px; float: left;}
div.ss-controls {float: left;}
div.nav-controls {float: right;}

div.slideshow-container {float: left; height: 355px; position: relative /* This should be set to be at least the height of the largest image in the slideshow */}
div.loader {background-image: url('loader.gif'); background-repeat: no-repeat; background-position: center; width: 446px;
height: 338px; /* This should be set to be at least the height of the largest image in the slideshow */
outline: none;}

div.slideshow {outline: none;}

div.slideshow span.image-wrapper {float: left; margin: 18px 0 0 0; padding: 0}
div.slideshow a.advance-link {width: 446px;
	height: 338px; /* 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 */}
div.slideshow a.advance-link:hover, div.slideshow a.advance-link:active, div.slideshow a.advance-link:visited { text-decoration: none; outline: none;}
div.slideshow img {width: 446px; height: 338px; margin: 0; padding: 0; float: left; position: relative}


div.caption-container {float: left;	height: 75px; position: relative; color: #007ac2; font-size: 11px; background: #ff3}
div.caption-container a:link, div.caption-container a:hover, div.caption-container a:visited {background: url(../gfx/main/arrow1b.jpg) no-repeat; padding: 0 0 0 10px; font-size: 10px}
span.image-caption {position: absolute;	width: 446px; top: 0; left: 0;}
div.caption {background: #fff}

div.navigation {margin: 0 0 0 450px;  position: absolute;} /* The navigation style is set using jQuery so that the javascript specific styles won't be applied unless javascript is enabled. */

ul.thumbs {width: 220px; height: 230px; margin: 0; padding: 0; font-weight: bold;}
ul.thumbs li {float: left; padding: 0 2px 2px 0; list-style: none;}
a.thumb {display: block;border: none;}

ul.thumbs li.selected a.thumb {background: #fff;}
a.thumb:focus {outline: none; border: none;}
ul.thumbs img {border: none; display: block;}

div.pagination {text-align: center;}
div.navigation {}
div.navigation div.bottom {}
div.pagination a, div.pagination span.current, div.pagination span.ellipsis {display: inline; margin-right: 2px; padding: 4px 7px 2px 7px; color: #007ac2}

div.pagination a:hover {
	background-color: #eee;
	text-decoration: none;
}
div.pagination span.current {background-color: #007ac2;	color: #fff;
}
div.pagination span.ellipsis {
	border: none;
	padding: 5px 0 3px 2px;
}

ul.thumbs.noscript
{float: left; width: 240px; height: 230px; margin: 0; padding: 0; font-weight: bold; font-size: 8px}
ul.thumbs.noscript li {display: none}

.descr {width: 210px;margin: 245px 0 0 450px; float: left; font-size: 10px; line-height: 12px;  color: #545454; position: absolute}
.descr h2 {color: #007ac2; font-size: 11px; line-height: 14px; margin:0; font-weight: normal}
.descr p {margin: 0}
.descr a {display: block; margin: 5px 0 0 0}
img.logo {width: 229px; height: 102px; margin: 255px 0 0 444px; float: left; font-size: 10px; line-height: 12px;  color: #545454; position: absolute}

