/* HACKS */
/* ----- */

/* NUR IE 6*/
* html #id {

}

/* IE 7 und FF */
html>body #id {

}

/* NUR IE 7*/
*+html #id {

} 



/* STRUKTUR */
/* -------- */

* {
	margin: 0;
	padding: 0;
}

html {
	height: 100%;
}

body {
	font-family: Verdana, Arial, Helvetica, Geneva, sans-serif;
	color: #000;
	text-align: center; /* Horizontale Zentrierung für IE <7 Win im Quirks */
	font-size: 68.5%;
	background: url(images/tile.jpg) left top repeat;
	height: 100%;
}

img {
	border: 0;
}

#abstand { 
	width: 1px;
	height: 50%;
	background-color: #fff;
	margin-bottom: -290px; /* Hälfte der Höhe des Containers */
	float: left;
}

#container {
	margin: 0 auto;
	position: relative; /* bringt Container vor Abstand */
	text-align: left;
	height: 580px;
	width: 800px;
	clear: left;
	z-index: 1;
	overflow: auto;
}

#header {
	float: right;
	height: 90px;
	width: 700px;
	background: url(images/header.jpg) left top no-repeat; 
}

#cont {
	float: right;
	margin: 0 0 0 92px;
	background: url(images/bg.jpg) center no-repeat; 
	width: 700px;
	height: 490px;	
}

/* NUR IE 6*/
* html #cont {
	margin: 0 0 0 23px;
}

#navi {
	position: absolute;
	z-index: 999;
	width: 145px;
	height: 350px;
	margin: 225px 0 0 25px;
}

/* NUR IE 6*/
* html #navi {
	position: absolute;
	z-index: 999;
	visibility: visible !important;
	width: 130px;
	margin: 140px 0 0 -2px;
}

/* NUR IE 7*/
*+html #navi {
	margin: 140px 0 0 25px;
} 

#subnav {
	height: 40px;
	width: 600px;
	margin: 80px 0 0 90px;
	float: left;
}

/* NUR IE 6*/
* html #subnav {
	margin: 80px 0 0 45px;
}

#backer {
	float: left;
	width: 550px;
	height: 330px;
	margin: 0 0 0 90px;
	background: url(images/bg_cont.jpg) center no-repeat;
}

/* NUR IE 6*/
* html #backer {
	margin: 0 0 0 45px;
}

#content {
	padding: 16px 20px 20px 20px;
	width: 510px;
	height: 294px;
	overflow: auto;
	float: left;
}

/* NUR IE 6*/
* html #content {
	margin-left: 0;
}


/* Navigation */
/* ---------- */
#navi ul {
	list-style: none;
	margin: 0;
}

* html #navi ul {
	list-style: none;
	margin-left: 4px;
}

#navi ul li {
	margin: 0;
	float: left;
}


#navi ul li a {
	padding: 10px;
	background: url(images/bg_mainnav.jpg) left top no-repeat; 
	width: 120px;
	height: 29px;
	display: block;
	text-indent: -9999px;
}


#navi ul li#first a { height: 27px; }
#navi ul li#second a { background-position: left -47px; }
#navi ul li#third a { background-position: left -97px; }
#navi ul li#fourth a { background-position: left -147px;}
#navi ul li#fifth a { background-position: left -198px; height: 45px; }
#navi ul li#sixth a { background-position: left -265px; }


#navi ul li#first strong a, #navi ul li#first a:hover { background-image: url('images/bg_mainnav_a.jpg'); }
#navi ul li#second strong a, #navi ul li#second a:hover { background: url('images/bg_mainnav_a.jpg') left -47px; }
#navi ul li#third strong a, #navi ul li#third a:hover { background: url('images/bg_mainnav_a.jpg') left -97px; }
#navi ul li#fourth strong a, #navi ul li#fourth a:hover { background: url('images/bg_mainnav_a.jpg') left -147px; }
#navi ul li#fifth strong a, #navi ul li#fifth a:hover { background: url('images/bg_mainnav_a.jpg') left -198px; height: 45px; }
#navi ul li#sixth strong a, #navi ul li#sixth a:hover { background: url('images/bg_mainnav_a.jpg') left -265px; }

#subnav ul {
	float: left;
	list-style: none;
}

#subnav ul li {
	float: left;
}

#subnav ul li a, #subnav ul li a:visited {
	background: url(images/bg_subnav.jpg) left top no-repeat; 
	width: 97px;
	height: 35px;
	display: block;
	text-indent: -999px;
	overflow: hidden;
}

#subnav ul li a:hover, #subnav ul li a:active {
	background: url(images/bg_subnav_a.jpg) left top no-repeat; 
	overflow: hidden;
}

#subnav ul li#sub2 a { background-position: -96px top; width: 80px; }
#subnav ul li#sub3 a { background-position: -175px top; width: 90px; }
#subnav ul li#sub4 a { background-position: -272px top; width: 100px; }
#subnav ul li#sub5 a { background-position: -372px top; width: 100px; }
#subnav ul li#sub6 a { background: url(images/bg_subnav_downloads.jpg) no-repeat; width: 70px; }
#subnav ul li#sub7 a { background: url(images/bg_subnav_downloads.jpg) no-repeat -72px top; width: 65px; }
#subnav ul li#sub8 a { background: url(images/bg_subnav_downloads.jpg) no-repeat -137px top; width: 102px; }
#subnav ul li#sub9 a { background: url(images/bg_subnav_downloads.jpg) no-repeat -238px top; width: 116px; }
#subnav ul li#sub10 a { background: url(images/bg_subnav_downloads.jpg) no-repeat -354px top; width: 140px; }
#subnav ul li#sub11 a { background: url(images/bg_subnav_beruf.jpg) no-repeat; width: 72px; }
#subnav ul li#sub12 a { background: url(images/bg_subnav_beruf.jpg) no-repeat -72px top; width: 112px; }
#subnav ul li#sub13 a { background: url(images/bg_subnav_beruf.jpg) no-repeat -186px top; width: 80px; }
#subnav ul li#sub14 a { background: url(images/bg_subnav_beruf.jpg) no-repeat -266px top; width: 106px; }
#subnav ul li#sub15 a { background: url(images/bg_subnav_beruf.jpg) no-repeat -376px top; width: 130px; }
#subnav ul li#sub16 a { background: url(images/bg_subnav_pinn.jpg) no-repeat; width: 72px; }
#subnav ul li#sub17 a { background: url(images/bg_subnav_pinn.jpg) no-repeat -72px top; width: 124px; }
#subnav ul li#sub18 a { background: url(images/bg_subnav_pinn.jpg) no-repeat -195px top; width: 72px; }
#subnav ul li#sub20 a { background: url(images/bg_subnav_pinn.jpg) no-repeat -366px top; width: 126px; }

#subnav ul li#sub1 strong a { background: url(images/bg_subnav_a.jpg) left top no-repeat; }
#subnav ul li#sub2 strong a { background: url(images/bg_subnav_a.jpg) left top no-repeat; background-position: -96px top; width: 80px; }
#subnav ul li#sub3 strong a { background: url(images/bg_subnav_a.jpg) left top no-repeat; background-position: -175px top; width: 90px; }
#subnav ul li#sub4 strong a { background: url(images/bg_subnav_a.jpg) left top no-repeat; background-position: -272px top; width: 100px; }
#subnav ul li#sub5 strong a { background: url(images/bg_subnav_a.jpg) left top no-repeat; background-position: -372px top; width: 100px; }
#subnav ul li#sub6 strong a, #subnav ul li#sub6 a:hover { background: url(images/bg_subnav_downloads_a.jpg) no-repeat; width: 70px; }
#subnav ul li#sub7 strong a, #subnav ul li#sub7 a:hover { background: url(images/bg_subnav_downloads_a.jpg) no-repeat -72px top; width: 65px; }
#subnav ul li#sub8 strong a, #subnav ul li#sub8 a:hover { background: url(images/bg_subnav_downloads_a.jpg) no-repeat -137px top; width: 102px; }
#subnav ul li#sub9 strong a, #subnav ul li#sub9 a:hover { background: url(images/bg_subnav_downloads_a.jpg) no-repeat -238px top; width: 116px; }
#subnav ul li#sub10 strong a, #subnav ul li#sub10 a:hover { background: url(images/bg_subnav_downloads_a.jpg) no-repeat -354px top; width: 140px; }
#subnav ul li#sub11 strong a, #subnav ul li#sub11 a:hover { background: url(images/bg_subnav_beruf_a.jpg) no-repeat; width: 72px; }
#subnav ul li#sub12 strong a, #subnav ul li#sub12 a:hover { background: url(images/bg_subnav_beruf_a.jpg) no-repeat -72px top; width: 112px; }
#subnav ul li#sub13 strong a, #subnav ul li#sub13 a:hover { background: url(images/bg_subnav_beruf_a.jpg) no-repeat -186px top; width: 80px; }
#subnav ul li#sub14 strong a, #subnav ul li#sub14 a:hover { background: url(images/bg_subnav_beruf_a.jpg) no-repeat -266px top; width: 106px; }
#subnav ul li#sub15 strong a, #subnav ul li#sub15 a:hover { background: url(images/bg_subnav_beruf_a.jpg) no-repeat -376px top; width: 130px; }
#subnav ul li#sub16 strong a, #subnav ul li#sub16 a:hover { background: url(images/bg_subnav_pinn_a.jpg) no-repeat; width: 72px; }
#subnav ul li#sub17 strong a, #subnav ul li#sub17 a:hover { background: url(images/bg_subnav_pinn_a.jpg) no-repeat -72px top; width: 124px; }
#subnav ul li#sub18 strong a, #subnav ul li#sub18 a:hover { background: url(images/bg_subnav_pinn_a.jpg) no-repeat -195px top; width: 72px; }
#subnav ul li#sub20 strong a, #subnav ul li#sub20 a:hover { background: url(images/bg_subnav_pinn_a.jpg) no-repeat -366px top; width: 126px; }

/* HEADLINES */
/* --------- */
h1 {
	font-size: 1.6em;
	color: #4A0A31;
	margin-bottom: 20px;
	text-decoration: none;
}

h2 {
	font-size: 1.3em;
	color: #073E44;
	margin: 0 0 8px 0;
}

h3 {
	font-size: 1.2em;
	color: #073E44;
	font-weight: normal;
	margin-top: 5px;
	text-align: center;
}


/* Text */
/* --------- */
p {
	margin: 6px 0 6px 0;
}

p.songtext {
	margin: 10px 0 10px 0;
}

p.message {
	font-weight: bold;
	color: #f00;
}

.kon_img {
	float:left; 
	width: 124px;
	margin: 5px 20px 5px 0;
	text-align: center;
}

* html .kon_img {
	margin: 5px 10px 5px 0;
}

.kon_img2 {
	float:left; 
	width: 180px;
	margin: 0 10px 0 0;
	text-align: center;
}

* html .kon_img2 {
	margin: 0 5px 0 0;
}

.kon_img3 {
	float:left; 
	width: 125px;
	margin: 0 20px 0 15px;
	text-align: center;
}

* html .kon_img3 {
	margin: 0 10px 0 7px;
}

.kon_img4 {
	float:left; 
	width: 305px;
	margin: 5px 20px 5px 15px;
	text-align: center;
}


a, a:visited {
	color: #000;
	text-decoration: underline;
	font-weight: bold;
}

a:hover, a:active {
	color: #000;
	text-decoration: none;
}

/* FORMULARE */
/* --------- */

label {
	margin-right: 5px;
	width: 150px;
	float: left;
}

input, textarea, select {
	font-size: 1em;
	font-weight: normal;
	background-color: #ffffff;
	width: 270px;
}

input:hover, input:active, input:focus,
textarea:hover, textarea:active, textarea:focus,
select:hover, select:active, select:focus,
input.checkbox:hover, input.checkbox:active, input.checkbox:focus {
	background-color: #DCF1F2;
}

fieldset {
	padding: 4px;
	margin: 4px;
	width: 461px;
	border-color: #4A0A31;
}

legend {
	padding: 0 5px;
}

.clearform {
	clear: both;
	height: 5px;
	line-height: 1px;
}

.clear {
	clear: both;
	height: 15px;
	line-height: 1px;
}


#postit {
	width: 250px; text-align: left
}

#postit_header {
	background: url("images/postit_top.png") left top no-repeat;
	width: 250px;
	height: 73px;
}

* html #postit_header {
	background: none;
	background-color: transparent;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/postit_top.png', sizingMethod='scale'); /* Pfadangabe immer vom Webroot aus */
}


#postit_footer {
	background: url("images/postit_bot.png") left top no-repeat;
	width: 250px;
	height: 51px;
}

* html #postit_footer {
	background: none;
	background-color: transparent;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/postit_bot.png', sizingMethod='scale'); /* Pfadangabe immer vom Webroot aus */
}

#postit_flexible {
	background: url("images/postit_bg.png") left top repeat-y;
	width: 250px;
	padding: 5px 10px 0 20px;
	color: #333;
}

* html #postit_flexible {
	background: none;
	background-color: transparent;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/postit_bg.png', sizingMethod='scale'); /* Pfadangabe immer vom Webroot aus */
	padding: 5px 10px 0 20px;
	width: 220px;
}

#postit2 {
	width: 350px; 
	text-align: left;
	margin-left: 10px;
}

#postit2_header {
	background: url("images/postit_top2.png") left top no-repeat;
	width: 450px;
	height: 53px;
}

* html #postit2_header {
	background: none;
	background-color: transparent;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/postit_top2.png', sizingMethod='scale'); /* Pfadangabe immer vom Webroot aus */
}


#postit2_footer {
	background: url("images/postit_bot2.png") left top no-repeat;
	width: 450px;
	height: 65px;
}

* html #postit2_footer {
	background: none;
	background-color: transparent;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/postit_bot2.png', sizingMethod='scale'); /* Pfadangabe immer vom Webroot aus */
}

#postit2_flexible {
	background: url("images/postit_bg2.png") left top repeat-y;
	width: 450px;
	padding: 5px 40px 0 30px;
	color: #333;
}

* html #postit2_flexible {
	background: none;
	background-color: transparent;
	filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/postit_bg2.png', sizingMethod='scale'); /* Pfadangabe immer vom Webroot aus */
	width: 380px;
}

#text {
	width: 380px;
}

#uebrigens {
	width: 240px;
	height: 90px;
	display: block;
	float: right;
	margin: -6px -6px 0 0;
	background: url("images/uebrigens.png") left top no-repeat;
}
