@charset "utf-8";

body {background:#b6d9f2 url('images/bg.jpg') repeat-x;font-size:12px}
div {text-align:left}

img {border:0;vertical-align:middle}
p,form,h1,h2,h3,hr {margin:0px;padding:0px}

h1,h2,h3 {font-size:100%}
h3 {font-size: 14px;margin-bottom:2px;line-height:16px}

a {text-decoration:none}
a:hover {text-decoration:underline}

.bold {font-weight:bold}
.italic {font-style:italic}
.small,small {font-size:11px}
.big {font-size:105%}

.center,body,#frame,#mainnav,#subnav,#footer {text-align:center}
.right,#header .frame,#topnav {text-align:right}
.justify {text-align:justify}

.grey,#footer,div.list .small, div.list .small a,div.squares .small {color:#777}
a,.red,h3 {color:#ca0c0c}
.black,.title a,body,a.black,select,input {color:#444}
.green {color:green}

.float {float:left}
div.float20 {float:left;width:19.99%}
div.float25 {float:left;width:24.99%}
div.float33 {float:left;width:33.32%}
div.float40 {float:left;width:39.99%}
div.float50 {float:left;width:49.99%}
div.float60 {float:left;width:59.99%}
div.float66 {float:left;width:66.65%}
div.float75 {float:left;width:74.99%}
div.float80 {float:left;width:79.99%}
.clear,.clearer {clear:both}

.padding2 {padding:2px}
.padding5 {padding:5px}
.padding10,.msgbox {padding:10px}
.padding20 {padding:20px}

input.input {background:#fff url(images/form-field-background.gif) no-repeat left top;border: 1px solid #c7c5c5;line-height: 16px;padding: 4px 0 3px 4px;margin-bottom:5px}
select {background: #ffffff;border: 1px solid #c7c5c5;line-height: 16px;padding: 3px 3px 3px 3px;margin: 0 0 5px 0}
input.button {background: #e8e8e8 url(images/form-button-background.gif) repeat-x left top;border: 1px solid #c7c5c5;line-height: 16px;padding: 3px 5px 3px 5px;margin: 0}
textarea {background: #ffffff url(images/form-field-background.gif) no-repeat left top;
	border: 1px solid #c7c5c5;
	font-size: 12px;
	color: #444444;
	line-height: 16px;
	padding: 4px 0 3px 4px;
	margin: 0 0 5px 0;}

.overflow,.title,.list h3 {white-space:nowrap;overflow:hidden}
.box,.title,.msgbox,div.squares table,table.border td {border:1px solid #ccc}

.highlight, a.highlight {color:#330;background:#ff9}

/* Elements */
#content {background:url('images/content-background.gif')}

.title {background:transparent url(images/content-box-title.gif) repeat-x left top;padding: 0 0 0 10px;height: 27px;line-height: 19px;border-bottom:0;margin:0 10px}
.title span {float:left;padding: 4px 0 5px 0}
.title a {
	background: transparent url(images/content-box-title-link.gif) repeat;margin: 4px 4px 0 0;float: right;line-height: 17px;
	font-weight: normal;padding: 0 5px 0 5px;border: 1px solid #c7c5c5;text-decoration: none
}

div.box, div.content-slider, div.margin {margin:0 10px 20px 10px}

div.box {padding:11px}
div.list {padding:0;border-bottom:0}
div.list div {border-bottom:1px solid #ccc;padding:7px 10px}
div.list div div {padding:0;border:0}
div.list h3 {margin-top:5px}
div.list .float20 {border-right:1px solid #eee;margin-right:20px}
div.list .small a {text-decoration:underline}
div.list .small a:hover {text-decoration:none}
div.squares {padding:0;border:0}
div.squares table {width:100%;border-spacing:0}
div.squares table td {border:1px solid #eee;padding:6px 10px;width:50%}
div.squares table td h3 {margin-top:12px}
div.form {padding:0 11px}
div.form .float {padding-top:5px}
div.form .input {margin:0}
div.form div {border-bottom:1px solid #eee;padding:5px 0}
div.form div div {border:0;padding:0}

.progressBar {height:16px;background:url('images/progressbar.jpg');text-align:center;color:#fff;border:1px solid #fff;white-space:nowrap}

.msgbox {background:#fafafa url('images/msgbox.png') no-repeat;background-position:8px 11px;padding-left:32px;margin:0 10px 20px 10px}
.info {background:#fafafa url('images/msgboxInfo.png') no-repeat;background-position:8px 11px}

/* ONETIMERS */
a#content-teaser-new { background: transparent url(images/content-teaser-new.gif) repeat;display: block;width: 300px;height: 122px;margin:0 0 20px 10px}
a#content-teaser-register { background: transparent url(images/content-teaser-register.gif) repeat;display: block;width: 300px;height: 122px;margin:0 0 20px 10px}


/* NEW STUFF */

* {font-family: Arial, Helvetica, sans-serif;}

body {
	background: #d9d9d9 url(images/background.gif) repeat-x left top;
	margin: 21px auto 30px auto;
}

.hide,#header span {display:none}
div#site {margin: 0 auto 0 auto;width: 964px}

/* header */
div#header {height:125px;width:964px}
div#header a#header-logo {background:transparent url(images/header-logo.gif) repeat;height:125px;float:left;display:block;width:280px}
div#header div#header-claim {background: transparent url(images/header-claim.gif) no-repeat left top;float: right;height: 125px;width: 684px}
div#header div#header-claim div {font-size: 11px;color: #fff;float: right;line-height: 27px;padding: 9px 12px 0 0;margin: 0 2px 0 0;border-bottom: 1px solid #989c9f}
div#header div#header-claim div a {color: #fff;text-decoration: none;padding:0 4px}
div#header div#header-claim div a:hover {color: #dbdcdd;text-decoration: none}
div#header div#header-claim a#header-rss {background: transparent url(images/header-rss.gif) no-repeat left top;height: 28px;display: block;float: right;clear: right;width: 104px;margin-top:42px}

/* navigation */
ul#navigation {background: transparent url(images/navigation.gif) no-repeat left top;height: 43px;display: block;margin: 0;padding: 0 2px 0 2px;list-style-type: none}

ul#navigation li {padding: 0;margin: 0;float:left;line-height:32px;height:32px}
ul#navigation li p {height:32px;overflow:hidden;text-align:center}
ul#navigation li p:hover {overflow:visible;height:auto;background:#f3f3f3;position:relative;z-index:99;border-bottom:1px solid #ccc}
ul#navigation li.navigation-item-active p {background:#c60a0a url(images/navigation-item-over.gif) repeat-x left top}
ul#navigation li.navigation-item-active p a {display: block;padding: 0 13px 0 12px;border-right: 0;font-size: 12px;color: #fff;text-decoration: none}
ul#navigation li.navigation-item-active p:hover, ul#navigation li.navigation-item-active p:hover a {background:#f3f3f3;color:#444}
ul#navigation li a {display: block;padding: 0 12px 0 12px;border-right: 1px solid #e7e7e7;font-size: 12px;color: #444;text-decoration: none}
ul#navigation li a:hover, ul#navigation li.navigation-item-active p:hover a:hover {background:transparent url(images/navigation-item-over.gif) repeat left top;padding: 0 13px 0 12px;border-right: 0;color: #fff}

ul#navigation li.navigation-account {padding: 0 12px 0 0;display:block;float:right;line-height:32px;height:32px;font-size:12px;color:#444}
ul#navigation li.navigation-account a {display:inline;padding:0;border-right:0;color:#ca0c0c}
ul#navigation li.navigation-account a:hover {text-decoration:underline;background:none}

/* content */
#content-top {background:transparent url(images/content-top.gif) no-repeat left top;height: 33px}

#content-top ul {line-height:31px;display:block;float:left;margin: 0;padding: 1px 0 0 2px;list-style-type: none}
#content-top ul li {padding: 0;margin: 0;display: block;float: left;line-height: 31px;height: 31px;}
#content-top ul li a {display: block;padding: 0 12px 0 12px;border-right: 1px solid #e7e7e7;font-size: 12px;color: #444;text-decoration: none}
#content-top ul li a:hover {background: transparent url(images/content-top-item-over.gif) repeat;color: #ca0c0c}
#content-top ul li.subnavigation-item-active a {background: transparent url(images/content-top-item-over.gif) repeat;display: block;padding: 0 12px 0 12px;border-right: 1px solid #e7e7e7;font-size: 12px;color: #ca0c0c;text-decoration: none}

#content-top form {background:transparent url(images/content-top-search.gif) no-repeat left top;float:right;height:33px;width:322px}
#content-top form table {margin:6px 0 0 0;padding:0}
#content-top form input#search-field {font-size:11px;color:#777;margin-left:23px;border:0;width:220px}

#content-footer {color: #777;background: transparent url(images/content-footer.gif) no-repeat left top;clear: left;height: 35px}
#content-footer div#content-footer-copyright {line-height: 33px;float: left;padding: 0 0 0 14px}
#content-footer div#content-footer-links {line-height: 33px;float: right;padding: 0 2px 0 0}
#content-footer div#content-footer-links a {color: #777;text-decoration: none;display: block;float: left;padding: 0 12px 0 0}
#content-footer div#content-footer-links a:hover {text-decoration: underline}

.content-slider {border: 1px solid #c7c5c5}
.content-slider-item {padding: 6px 30px 8px 10px;color: #444;line-height: 16px}
.content-slider-item .float {width:160px;border-right:1px solid #eee;margin-right:25px}
.content-slider-item h3 {font-size: 16px;font-weight: bold;margin:20px 10px 2px 0;line-height: 18px}
.content-slider-item small {color: #777;margin-bottom:10px;line-height: 16px;display: block}
.content-slider-item small a {color:#777;text-decoration: underline}
.content-slider-item small a:hover {text-decoration: none}
.content-slider-bar {height: 48px;text-align: left;font-size: 12px;line-height: 16px;color:#777}
.content-slider-bar div {height: 48px;float:left;cursor:pointer;width: 199px}
.content-slider-bar div span {display: block;padding: 8px 0 0 47px}
.content-slider-bar div.content-slider-bar-1,
.content-slider-bar div.content-slider-bar-1-active {background: url(images/content-slider-1.gif) no-repeat left top}
.content-slider-bar div.content-slider-bar-1-active {background: url(images/content-slider-1-active.gif) no-repeat left top;color: #444}
.content-slider-bar div.content-slider-bar-2,
.content-slider-bar div.content-slider-bar-2-active {background: url(images/content-slider-2.gif) no-repeat left top}
.content-slider-bar div.content-slider-bar-2-active {background: url(images/content-slider-2-active.gif) no-repeat left top;color: #444}
.content-slider-bar div.content-slider-bar-3,
.content-slider-bar div.content-slider-bar-3-active {background: url(images/content-slider-3.gif) no-repeat left top;width: 200px}
.content-slider-bar div.content-slider-bar-3-active {background: url(images/content-slider-3-active.gif) no-repeat left top;color: #444}

.content-box-detail-pictures {background: transparent url(images/content-box-detail-pictures.gif) repeat-x left top;padding:11px 22px}
.content-box-detail-pictures div div {background:#fff;border:1px solid #ccc}

/***/


.content-box-detail {padding: 7px 30px 7px 7px;color: #444444;line-height: 16px}
.content-box-detail .side p {display: block;border-bottom: 1px solid #eeeded;padding: 0 0 0 3px;line-height: 24px;margin: 0 7px 0 0}
.content-box-detail h3 {color: #ca0c0c;font-size: 16px;font-weight: bold;margin: 0 0 2px 0;line-height: 18px;padding: 0}
.content-box-detail small {color: #777777;font-size: 11px;margin: 0 0 10px 0;line-height: 16px;padding: 0;display: block}
.content-box-detail small a {color: #777777;text-decoration:underline}
.content-box-detail small a:hover {text-decoration:none}

div#content a.arrow-link {background: transparent url(images/arrow-link.gif) no-repeat right center;padding: 0 6px 0 0}


/* LIGHTBOX */

#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; }
#imageContainer>#hoverNav{ left: 0;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%	; }

#imageData{	padding:0 10px; color: #666; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
