/* Basic */

html, body {margin:0;padding:0;}
body{text-align: center;font-family: "Lucida Grande", "Lucida Sans Unicode", Verdana, Helvetica, Arial, sans-serif;background-color: #eee;color: #444;font-size: 75%;}
a{color: #663399;text-decoration: underline;}
a:focus, a:hover, a:active {color: #333;text-decoration: underline;}
p, li {line-height: 1.4em;}
h1, h2 {font-family: "Trebuchet MS", Verdana, sans-serif;margin: 0 0 2px 0;letter-spacing:1px;}
h1 {padding: 0;font-size: 3em;color: #333;}
h2 {padding: 2px 0 0 5px;font-size:1.2em;color: #999;}
pre {font-size: 1.2em;line-height: 1.2em;overflow-x: auto;}
div#page {width: 960px;height: 100%;background-color: #fff;margin: 0 auto;text-align: left;border-color: #ddd;border-style: none solid solid;border-width: medium 1px 1px;}
#header{border-color: #ddd;border-style: none none solid;border-width: 1px;height: 100px;padding-top: 20px;}
div#page .logo-section {float: left;padding-left: 10px;width: 500px;}
div#page .logo-section .logo {background: url(../images/logo.jpg) no-repeat top;width: 212px;height: 52px;text-indent: -9999px;}
div#page .contact-section {color: #999;float: right;padding-right: 10px;text-align: right;}
div#gallery-section {width: 740px;background-color: #fff;margin-left:100px;}
div#container {padding: 20px;}
div#ads {clear: both;padding: 12px 0 12px 66px;}
div#footer {clear: both;color: #777;width: 960px;padding: 20px 0 40px;text-align: left;}
div#footer .top{background: url(../images/footer-dots.png) repeat-x;border-color: #ddd;border-style: none none solid;border-width: 1px;height: 94px;width: 100%;}
div#footer .left{float: left;padding-left: 10px;}
div#footer .centre{float: left;text-align:center;width:700px;}
div#footer .right{float: right;padding-right: 10px;text-align: right;}
.line{border-bottom: 1px solid #ccc;}

/* Gallery */

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

/* jScrollPane */

a.jScrollArrowUp {background: url(../images/basic_arrow_up.gif) repeat-x 0 0;}
a.jScrollArrowUp:hover {background-position: 0 -15px;}
a.jScrollArrowDown {background: url(../images/basic_arrow_down.gif) repeat-x 0 0;}
a.jScrollArrowDown:hover {background-position: 0 -15px;}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {background-position: 0 -30px;}
.orange-bar .jScrollPaneTrack {background: #f60;}
.orange-bar .jScrollPaneDrag {background: #00f url(../images/drag_grab.gif) no-repeat 50% 50%;}
.orange-bar .scroll-pane {background: #69f;}
.holder {float: left;margin: 10px;}
.scroll-pane {width: 200px;height: 400px;overflow: auto;}
.wide {width: 200px;}
.super-wide {width: 200px;}
.tall {height: 400px;}
#pane1 {}
.jScrollPaneContainer {float: right;position: relative;overflow: hidden;z-index: 1;margin: 20px 0 0 40px;}
.jScrollPaneTrack {position: absolute;cursor: pointer;right: 0;top: 0;height: 100%;background: #aaa;}
.jScrollPaneDrag {position: absolute;background: #666;cursor: pointer;overflow: hidden;}
.jScrollPaneDragTop {position: absolute;top: 0;left: 0;overflow: hidden;}
.jScrollPaneDragBottom {position: absolute;bottom: 0;left: 0;overflow: hidden;}
a.jScrollArrowUp {display: block;position: absolute;z-index: 1;top: 0;right: 0;text-indent: -2000px;overflow: hidden;/*background-color: #666;*/height: 9px;}
a.jScrollArrowUp:hover {/*background-color: #f60;*/}
a.jScrollArrowDown {display: block;position: absolute;z-index: 1;bottom: 0;right: 0;text-indent: -2000px;overflow: hidden;/*background-color: #666;*/height: 9px;}
a.jScrollArrowDown:hover {/*background-color: #f60;*/}
a.jScrollActiveArrowButton, a.jScrollActiveArrowButton:hover {/*background-color: #f00;*/}