/***********************************/
/*           Basiswerte            */
/* Hellblau:   637ac6              */
/* Grau:       6a6b6c              */
/* Dunkelgrau: 212324              */
/* Schwarz:    0c0c0d              */
/***********************************/
body { margin: 0; padding: 0; color: #fff; background: #000 url(layout/bg_htmlbody.jpg) no-repeat top center; text-align: center; font: 10pt arial, helvetica, serif; }
a { font-weight: bold; color: #637ac6; text-decoration: none; }
a:hover { color: #637ac6; }
#wrapper { margin: 0 auto; padding: 0; width: 990px; }
img { border: 0px; padding: 0px; margin: 0px; }



/***********************************/
/*           Grundlayout           */
/***********************************/
#head { margin: 0; padding: 0; width: 990px; height: 127px; }
#logo { margin: 0; padding: 0; width: 300px; height: 127px; background: url(layout/logo_ssk.png) no-repeat top left; float: left; }
#teaser { margin: 0; padding: 0; width: 690px; height: 95px; background: url(layout/logo_slogan.png) no-repeat bottom right; float: left; }
#menu { margin: 0; padding: 0; width: 690px; height: 32px; background: url(layout/bg_menubalken.gif) repeat-x top left; float: left; }

#mainnav { float: left; list-style: none; padding: 0; margin: 0 0 1em 0; width: 680px; font-size: 20px;	font-weight: bold; }
#mainnav a { display: block; text-decoration: none; padding: 0; color: #fff; }
#mainnav a:hover { color: #637ac6; }
#mainnav li { float: left; padding: 0 10px 0 10px; margin: 4px 0 0 0; border-left: 2px solid #6a6b6c; }
#mainnav li#first { border-left: none; }

#page { margin: 0 auto; padding: 5px; width: 980px; background: url(layout/bg_transparent_white20p.png) repeat top left; text-align: center; }
#slideshowframe { margin: 0 auto; padding: 4px; width: 970px; height: 350px; background-color: #212324; border-top: 1px solid #6a6b6c; border-right: 1px solid #0c0c0d; border-bottom: 1px solid #0c0c0d; border-left: 1px solid #6a6b6c; float: left; }

#submenu { margin: 5px 0 0 0; padding: 0; width: 200px; background-color: #212324; border-top: 1px solid #6a6b6c; border-right: 1px solid #0c0c0d; border-bottom: 1px solid #0c0c0d; border-left: 1px solid #6a6b6c; float: left; text-align: left; }
#subnav { list-style: none; padding: 0; margin: 0; width: 200px; font-weight: bold; }
#subnav li { padding: 0 0 15px 0; margin: 0; }
#subnav li a { display: block; text-decoration: none; color: #637ac6; width: 190px; padding: 5px; }
#subnav li a:hover { background-color: #000; color: #fff; }
#subnav li#active { display: block; width: 190px; padding: 5px; margin: 0 0 15px 0; color: #fff; background-color: #000; }
#mainframe { margin: 5px 0 0 5px; padding: 10px; width: 750px; background-color: #212324; border-top: 1px solid #6a6b6c; border-right: 1px solid #0c0c0d; border-bottom: 1px solid #0c0c0d; border-left: 1px solid #6a6b6c; float: left; text-align: left; }

#mainframe h2 { margin: 0; padding: 0 0 10px 0; font-size: 1.5em; }

.clear { clear: both; }
#foot { margin: 0; padding: 0; width: 990px; height: 45px; background: url(layout/bg_footer.png) repeat-x top left; font-size: 10px; }
#date { margin: 0; padding: 16px 0 0 20px; float: left; }
#minilogo { margin: 0; padding: 0; float: left; }
#copyright { margin: 0; padding: 16px 0 0 5px; float: left; }
#disclaimer { margin: 0; padding: 16px 0 0 380px; float: left; text-align: right; }

#contactform fieldset { width: 750px; padding: 0 5px 5px 0; margin: 0; border: 0; }
#contactform legend { display: none; }
#contactform .standardfields label, #contactform .optionalfields label { display: block; float: left; margin: 0; padding: 5px 5px 5px 0; vertical-align: middle; }
#contactform .standardfields label, #contactform .optionalfields label { width: 160px; }
#contactform p { margin: 0px; padding: 5px 0px 5px 5px; clear: left; color: #fff; font-size: 10pt; }
#contactform p.warning { background-color: #e20000; color: #fff; font-weight: bold; }
#contactform input { margin: 0; padding: 3px 3px; width: 300px; background: #212324 url(layout/bg_form_metal.jpg) no-repeat top left; font-size: 10pt; font-weight: bold; color: #fff; }
#contactform textarea { margin: 0; padding: 3px 3px; width: 300px; height: 390px; background: #212324 url(layout/bg_form_metal.jpg) no-repeat top left; font: bold 10pt arial, helvetica, serif;; color: #fff; }
#contactform .selectbar { margin: 3px 0; padding: 0; font-size: 10pt; }
#contactform input.smallfield { width: 20px; }
#contactform .standardformbutton { display: block; width: 150px; background: #0c0c0d; color: #fff; font-weight: bold; margin: 2px 0 2px 10px; padding: 3px; border-top: 1px solid #6a6b6c; border-right: 1px solid #000; border-bottom: 1px solid #000; border-left: 1px solid #6a6b6c; }
#contactform .select { border: 0; display: block; }
#contactform .radio, #contactform .checkbox { margin: 0; paddin: 0; width: 20px; border: 0; }


/***********************************/
/*        Tabs / Slideshow         */
/***********************************/
/* container for slides */
.images {
	background:#fff url(/img/global/gradient/h300.png) repeat-x;
	border:1px solid #666;
	position:relative;	
	height:350px;
	
	width:970px;
	float:left;	
	margin:0px;
	cursor:pointer;
	
	/* CSS3 tweaks for modern browsers */
	-moz-border-radius:5px;
	-webkit-border-radius:5px;
	-moz-box-shadow:0 0 25px #666;
	-webkit-box-shadow:0 0 25px #666;	
}

/* single slide */
.images div {
	display:none;
	position:absolute;
	top:0;
	left:0;		
	margin:0px;
	padding:0px;
	height:350px;
	width:970px;
	font-size:12px;
}

/* header */
.images h3 {
	font-size: 30px;
	font-weight:normal;
	text-align: right;
	margin: 10px 10px 10px 10px;
	color:#fff;
}

/* tabs (those little circles below slides) */
.tabs {
	clear:both;
	margin-left:330px;
}

/* single tab */
.tabs a {
	width:8px;
	height:8px;
	float:left;
	margin:3px;
	background:url(/tools/img/scrollable/arrow/navigator.png) 0 0 no-repeat;
	display:block;
	font-size:1px;		
}

/* mouseover state */
.tabs a:hover {
	background-position:0 -8px;      
}

/* active state (current page state) */
.tabs a.current {
	background-position:0 -16px;     
} 	


/* prev and next buttons */
.forward, .backward {
	float:left;
	margin-top:140px;
	background:#fff url(/tools/img/scrollable/arrow/hori_large.png) no-repeat;
	display:block;
	width:30px;
	height:30px;
	cursor:pointer;
	font-size:1px;
	text-indent:-9999em;	
}

/* next */
.forward 				{ background-position: 0 -30px; clear:right; }
.forward:hover 		{ background-position:-30px -30px; }
.forward:active 	 	{ background-position:-60px -30px; } 


/* prev */
.backward:hover  		{ background-position:-30px 0; }
.backward:active  	{ background-position:-60px 0; }

/* disabled navigational button. is not needed when tabs are configured with rotate: true */
.disabled {
	visibility:hidden !important;		
}