/**
 * style.css
 */
 
body, html {
	color: #333;
	font-family: "Arial";
	font-size: 12px;
	line-height: 16px;
	margin: 0;
	padding: 0;
}

body {
	background: url('../img/komplex/background_streifen.png');
	background-repeat: repeat-x;
}

img { 
	border: 0;
}

a {
	color: #e30057;
	outline: none;
}
a.backlink {
	background: url('../img/komplex/back.png');
	background-repeat: repeat-x;
	bottom: 10px;
	color: #e30057;
	display: block;
	font-size: 14px;
	height: 33px;
	left: 20px;
	position: absolute;
	width: 32px;
	z-index: 10;
}


.left {
	text-align: left;
}
.right {
	text-align: right;
}
.center {
	text-align: center;
}

.bold {
	font-weight: bold;
}
.normal {
	font-weight: normal !important;
}

.clear {
	clear: both;
}


/**
 * Form
 */
label {font-weight:bold;}
fieldset {padding:2px; margin:10px 0;border:0px solid #ccc;}
legend {font-weight:bold;font-size:12px; margin-left: 10px;}
input.text, input.title, textarea, select {margin:2px 0;border:1px solid #bbb;}
input.text:focus, input.title:focus, textarea:focus, select:focus {border:1px solid #666;}
input.text, input.title {width:300px;padding:3px;}
input.title {font-size:1.5em;}
textarea {width:390px;height:250px;padding:5px;}
.error, .notice, .success, #kontakt .errors {padding:.8em;margin-bottom:1em;border:2px solid #ddd;}
.error, .errors {background:#FBE3E4;color:#8a1f11;border-color:#FBC2C4;}
.notice {background:#FFF6BF;color:#514721;border-color:#FFD324;}
.success {background:#E6EFC2;color:#264409;border-color:#C6D880;}
.error a {color:#8a1f11;}
.notice a {color:#514721;}
.success a {color:#264409;}


/**
 * Main
 */
#container {
	margin: 0 auto;
	overflow: hidden;
	position: relative;
	padding-bottom: 20px;
}

#stage {
	height: 670px;
	margin: 0 auto;
	position: relative;
	width: 957px;
}

#boden {
	background: url('../img/komplex/boden.png');
	height: 172px;
	left: 40px;
	position: absolute;
	top: 500px;
	width: 881px;
	z-index: 0;
}

#regal {
	background: url('../img/komplex/regal.png');
	height: 442px;
	left: 173px;
	position: absolute;
	top: 39px;
	width: 610px;
	z-index: 1;
}

#lampe1 {
	background: url('../img/komplex/lampe_aktiv.png');
	height: 285px;
	left: 185px;
	position: absolute;
	top: 16px;
	width: 41px;
	z-index: 20;
}
#lampe2 {
	background: url('../img/komplex/lampe_aktiv.png');
	height: 285px;
	right: 188px;
	position: absolute;
	top: 16px;
	width: 41px;
	z-index: 20;
}

#logo {
	height: 118px;
	left: 80px;
	position: absolute;
	top: 30px;
	width: 100px;
	z-index: 1;
}

#frau {
	background: url('../img/komplex/projektbeschreibung.png');
	cursor: pointer;
	height: 149px;
	left: 433px;
	position: absolute;
	top: 264px;
	width: 117px;
	z-index: 10;
}
#frau:hover,
#stage .frau_aktiv {
	background: url('../img/komplex/projektbeschreibung_aktiv.png') !important;
}

#frau_logo {
	background: url('../img/komplex/arbeit_und_leben_logo-aonly.png');
	cursor: pointer;
	height: 10px;
	left: 480px;
	position: absolute;
	top: 350px;
	width: 10px;
	z-index: 11;
}
#frau_logo:hover {
	background: url('../img/komplex/arbeit_und_leben_logo-aonly_aktiv.png');
}

#tafel {
	background: url('../img/komplex/teilnahmebedingung.png');
	cursor: pointer;
	height: 237px;
	left: 107px;
	position: absolute;
	top: 345px;
	width: 112px;
	z-index: 11;
}
#tafel:hover,
#stage .tafel_aktiv {
	background: url('../img/komplex/teilnahmebedingung_aktiv.png') !important;
}

#bild {
	background: url('../img/komplex/projektgestalter.png');
	cursor: pointer;
	height: 72px;
	right: 115px;
	position: absolute;
	top: 245px;
	width: 54px;
	z-index: 12;
}
#bild:hover,
#stage .bild_aktiv {
	background: url('../img/komplex/projektgestalter_aktiv.png') !important;
}

#nummernapparat {
	background: url('../img/komplex/teilnehmen.png');
	cursor: pointer;
	height: 213px;
	right: 110px;
	position: absolute;
	top: 380px;
	width: 63px;
	z-index: 13;
}
#nummernapparat:hover,
#stage .nummernapparat_aktiv {
	background: url('../img/komplex/teilnehmen_aktiv.png') !important;
}

#telefon {
	background: url('../img/komplex/kontakt.png');
	cursor: pointer;
	height: 60px;
	right: 270px;
	position: absolute;
	top: 378px;
	width: 75px;
	z-index: 14;
}
#telefon:hover,
#stage .telefon_aktiv {
	background: url('../img/komplex/kontakt_aktiv.png') !important;
}

#aul_logo {
	background: url('../img/komplex/arbeit_und_leben_logo-small.png');
	cursor: pointer;
	display: none;
	height: 22px;
	position: absolute;
	top: 80px;
	right: 67px;
	width: 100px;
	z-index: 14;
}



/**
 * Theke
 */
#theke {
	background: url('../img/komplex/theke.png');
	cursor: pointer;
	height: 165px;
	left: 208px;
	position: absolute;
	top: 388px;
	width: 540px;
	z-index: 1;
}

#theke_1,
#theke_2,
#theke_3,
#theke_4
#theke_5 {
	outline: none;
}

#theke_1 {
	background: url('../img/komplex/theke_1.png');
	cursor: pointer;
	height: 165px;
	left: 208px;
	position: absolute;
	top: 388px;
	width: 117px;
	z-index: 2;
}
#theke_1:hover {
	background: url('../img/komplex/theke_1_aktiv.png');
}

#theke_2 {
	background: url('../img/komplex/theke_2.png');
	cursor: pointer;
	height: 165px;
	left: 325px;
	position: absolute;
	top: 388px;
	width: 93px;
	z-index: 3;
}
#theke_2:hover {
	background: url('../img/komplex/theke_2_aktiv.png');
}

#theke_3 {
	background: url('../img/komplex/theke_3.png');
	cursor: pointer;
	height: 165px;
	left: 418px;
	position: absolute;
	top: 388px;
	width: 96px;
	z-index: 4;
}
#theke_3:hover {
	background: url('../img/komplex/theke_3_aktiv.png');
}

#theke_4 {
	background: url('../img/komplex/theke_4.png');
	cursor: pointer;
	height: 165px;
	left: 514px;
	position: absolute;
	top: 388px;
	width: 109px;
	z-index: 5;
}
#theke_4:hover {
	background: url('../img/komplex/theke_4_aktiv.png');
}

#theke_5 {
	background: url('../img/komplex/theke_5.png');
	cursor: pointer;
	height: 165px;
	left: 623px;
	position: absolute;
	top: 388px;
	width: 125px;
	z-index: 6;
}
#theke_5:hover {
	background: url('../img/komplex/theke_5_aktiv.png');
}


/**
 * Content
 */
#stage .content {
	background: #fff url('../img/komplex/box_background.png');
	background-repeat: repeat-x;
	display: none;
}

#stage .content .box {
	background-color: #fff;
	margin: 15px;
	padding: 5px 10px;
	padding-bottom: 40px;
	min-height: 300px;
}

#stage .content h2 {
	color: #e30057;
	font-size: 12px;
	font-weight: bold;
	line-height: 18px;
	margin: 0 0 10px;
}
#stage .content h3,
#stage .content h4 {
	color: #e30057;
	font-size: 11px;
	font-weight: bold;
	line-height: 17px;
	margin: 0;
	margin-top: 12px;
}

#stage .content p,
#stage .content ul li {
	font-size: 11px;
	line-height: 15px;
	font-weight: bold;
}
#stage .content p.small {
	font-size: 10px;
}


/**
 * Kontakt
 */
#kontakt {
	position: absolute;
	left: 200px;
	top: 25px;
	padding-bottom: 50px;
	width: 550px;
}
#kontakt .box {
	height: 450px;
}
#kontakt .impressum_container {
	height: 450px;
}
#kontakt ul.nav {
	list-style-type: bullet;
}
#kontakt ul.nav, 
#kontakt ul.nav li {
	margin: 0;
	margin-right: 20px;
	padding: 0;
}
#kontakt ul.nav li,
#kontakt ul.nav li h2,
#kontakt ul.nav li h2 a {
	color: #333;
	display: block;
	float: left;
	padding: 0;
}
#kontakt ul.nav li h2 a {
	padding: 5px;
	padding-left: 12px;
}
#kontakt ul.nav li h2 a:hover,
#kontakt ul.nav li h2 a.active {
	color: #e30057;
	background: url('../img/komplex/ul_active.png') 0 5px;
	background-repeat: no-repeat;
	text-decoration: underline;
}
#kontakt .impressum_box {
	display: none;
}
#kontakt .impressum_box {
	position: absolute;
	height: 450px;
	width: 505px;
	left: 30px;
	overflow: auto;
}
#kontakt .impressum_box h3 {
	margin: 20px 0 -5px;
}
#kontakt .impressum_box p strong {
	color: #e30057;
}
#kontakt .impressum_box p a {
	color: #333;
}

#kontakt .backlink {
	margin-top: 60px;
	
}



/**
 * Kontakt - Form
 */
#contactForm {
	margin-top: 20px;
	position: relative;
}
#contactForm div {
	clear: both;
}
#contactForm label {
	display: block;
	float: left;
	font-weight: bold;
	font-size: 11px;
	line-height: 15px;
	margin-right: 5px;
	margin-top: 6px;
	text-align: right;
	width: 120px;
}
#contactForm input, 
#contactForm textarea {
	font-size: 11px;
	line-height: 15px;
}
#contactForm input.text {
	width: 300px;
}
#contactForm textarea {
	height: 100px;
	width: 296px;
	padding: 4px;
}
#contactForm div.submit {
	text-align: right;
}
#contactForm input[type="submit"] {
	background: #fff;
	border: 1px solid #97c3c4;
	color: #e30057;
	margin-top: 10px;
	margin-right: 75px;
	padding: 4px;
}
#contactForm input[type="submit"]:hover {
	background: #e30057;
	border: 1px solid #97c3c4;
	color: #fff;
}
#contactForm ul.errors {
	width: 285px;
	margin-left: 125px;
	list-style-type: none;
}
#contactForm ul.errors li {
	font-weight: bold;
}



/**
 * Teilnahmebedingungen
 */
#teilnahmebedingungen {
	position: absolute;
	left: 200px;
	top: 25px;
	width: 550px;
}
#kontakte_table table {
	display: none;
}

/**
 * Anmeldung
 */
#anmeldung {
	position: absolute;
	left: 200px;
	top: 25px;
	width: 550px;
}
#anmeldung h3 {
	margin: 30px 0 10px;
}
#anmeldung .teilnahmeinfo {
	bottom: 10px;
	position: absolute;
	right: 20px;
}

/**
 * Anmeldung - Form
 */
#anmeldungForm {
	margin-top: 20px;
	position: relative;
}
#anmeldungForm div {
	clear: both;
}
#anmeldungForm label {
	display: block;
	float: left;
	font-weight: bold;
	font-size: 11px;
	line-height: 15px;
	margin-right: 5px;
	margin-top: 6px;
	text-align: right;
	width: 120px;
}
#anmeldungForm input, 
#anmeldungForm select, 
#anmeldungForm textarea {
	font-size: 11px;
	line-height: 15px;
}
#anmeldungForm input.text {
	width: 150px;
}
#anmeldungForm input.plz {
	width: 50px;
}
#anmeldungForm input.ort {
	width: 250px;
}
#anmeldungForm input.large {
	width: 311px;
}
#anmeldungForm textarea {
	height: 80px;
	width: 307px;
}
#anmeldungForm input#projekt_teilnahmebedingungen {
	margin-top: 20px;
}
#anmeldungForm input[type="submit"] {
	background: #fff;
	border: 1px solid #97c3c4;
	color: #e30057;
	margin-top: 10px;
	margin-left: 125px;
	padding: 4px;
}
#anmeldungForm input[type="submit"]:hover {
	background: #e30057;
	border: 1px solid #97c3c4;
	color: #fff;
}
#anmeldungForm .errorlist {
	height: 30px;
	overflow: auto;
}
#anmeldungForm .errorlist div {
	margin: 2px 0;
}
#anmeldungForm .errorlist ul {
	margin: 4px 0;
}



/**
 * Beteiligte
 */
#beteiligte {
	position: absolute;
	left: 200px;
	top: 25px;
	width: 550px;
}
#beteiligte .box {
	height: 400px;
}

#beteiligte ul {
	list-style-type: bullet;
}
#beteiligte ul, 
#beteiligte ul li {
	margin: 0;
	margin-right: 20px;
	padding: 0;
}
#beteiligte ul li,
#beteiligte ul li h2,
#beteiligte ul li h2 a {
	color: #333;
	display: block;
	float: left;
	padding: 0;
}
#beteiligte ul li h2 a {
	padding: 5px;
	padding-left: 12px;
}
#beteiligte ul li h2 a:hover,
#beteiligte ul li h2 a.active {
	color: #e30057;
	background: url('../img/komplex/ul_active.png') 0 5px;
	background-repeat: no-repeat;
	text-decoration: underline;
}

#beteiligte a.backlink {
	position: absolute;
	bottom: 20px;
	left: 25px;
}


/**
 * Beteiligte Carousel
 */
#beteiligte_carousel {
	height: 175px;
	width: 400px;
}
#beteiligte_carousel div {
	font-size: 12px;
	height: auto;
	line-height: 16px;
	width: auto;
}
#beteiligte .tabs {
	margin-left: 200px;
}
#beteiligte .forward,
#beteiligte .backward {
	margin-top: 85px;
	background-color: transparent;
}


/**
 * Beteiligte Ansprechpartner Förderer
 */
#beteiligte .ansprechpartner_box,
#beteiligte .foerderer_box {
	display: none;
}
#beteiligte .beteiligte_box,
#beteiligte .ansprechpartner_box,
#beteiligte .foerderer_box {
	position: absolute;
	width: 500px;
	left: 25px;
}
#beteiligte .ansprechpartner_box h3 {
	margin: 10px 0 20px;
}
#beteiligte .foerderer_box p {
	text-align: center;
}
#beteiligte .foerderer_box p img {
	padding: 10px;
}


/**
 * Main Information (Frau)
 */
#information {
	position: absolute;
	left: 220px;
	top: 25px;
	width: 550px;
}
#information p {
	margin: 2px 0 10px;
}

/**
 * Logo Information
 */
#logo_information {
	position: absolute;
	left: 200px;
	top: 25px;
	width: 550px;
}


/**
 * Produkte
 */
.produkt {
	height: 40px;
	left: 1px;
	position: absolute;
	top: 1px;
	width: 40px;
	z-index: 10;
}
.produkt_1 {
	background: url('../img/komplex/produkte/fernseher.png');
}
.produkt_1:hover {
	background: url('../img/komplex/produkte/fernseher_aktiv.png');
}
.produkt_2 {
	background: url('../img/komplex/produkte/auto.png');
}
.produkt_2:hover {
	background: url('../img/komplex/produkte/auto_aktiv.png');
}
.produkt_3 {
	background: url('../img/komplex/produkte/kamera.png');
}
.produkt_3:hover {
	background: url('../img/komplex/produkte/kamera_aktiv.png');
}
.produkt_4 {
	background: url('../img/komplex/produkte/naehmaschine.png');
}
.produkt_4:hover {
	background: url('../img/komplex/produkte/naehmaschine_aktiv.png');
}
.produkt_5 {
	background: url('../img/komplex/produkte/radio.png');
}
.produkt_5:hover {
	background: url('../img/komplex/produkte/radio_aktiv.png');
}

.produkt a {
	display: block;
	height: 40px;
	text-decoration: none;
	width: 40px;
}

#produkt_content_containter .fancybox_content {
	display: none;
}
#produkt_backlink {
	display: none;
}


#produkt_1 {
	left: 235px;
	top: 50px;
}
#produkt_38 {
	left: 285px;
	top: 50px;
}
#produkt_15 {
	left: 335px;
	top: 50px;
}
#produkt_23 {
	left: 385px;
	top: 50px;
}
#produkt_28 {
	left: 435px;
	top: 50px;
}
#produkt_6 {
	left: 480px;
	top: 50px;
}
#produkt_16 {
	left: 530px;
	top: 50px;
}
#produkt_41 {
	left: 580px;
	top: 50px;
}
#produkt_35 {
	left: 630px;
	top: 50px;
}
#produkt_10 {
	left: 677px;
	top: 50px;
}


#produkt_26 {
	left: 237px;
	top: 100px;
}
#produkt_12 {
	left: 287px;
	top: 100px;
}
#produkt_47 {
	left: 335px;
	top: 100px;
}
#produkt_40 {
	left: 385px;
	top: 100px;
}
#produkt_3 {
	left: 435px;
	top: 100px;
}
#produkt_7 {
	left: 480px;
	top: 100px;
}
#produkt_17 {
	left: 530px;
	top: 100px;
}
#produkt_25 {
	left: 580px;
	top: 100px;
}
#produkt_33 {
	left: 630px;
	top: 100px;
}
#produkt_20 {
	left: 677px;
	top: 100px;
}

#produkt_43 {
	left: 239px;
	top: 148px;
}
#produkt_22 {
	left: 530px;
	top: 148px;
}
#produkt_4 {
	left: 578px;
	top: 148px;
}
#produkt_46 {
	left: 627px;
	top: 148px;
}
#produkt_18 {
	left: 677px;
	top: 148px;
}

#produkt_11 {
	left: 239px;
	top: 195px;
}
#produkt_27 {
	left: 625px;
	top: 195px;
}
#produkt_5 {
	left: 675px;
	top: 195px;
}

#produkt_29 {
	left: 239px;
	top: 240px;
}
#produkt_30 {
	left: 388px;
	top: 240px;
}
#produkt_49 {
	left: 435px;
	top: 240px;
}
#produkt_32 {
	left: 530px;
	top: 240px;
}
#produkt_19 {
	left: 578px;
	top: 240px;
}
#produkt_34 {
	left: 625px;
	top: 240px;
}
#produkt_9 {
	left: 675px;
	top: 240px;
}

#produkt_36 {
	left: 239px;
	top: 285px;
}
#produkt_37 {
	left: 290px;
	top: 285px;
}
#produkt_2 {
	left: 338px;
	top: 285px;
}
#produkt_39 {
	left: 385px;
	top: 285px;
}
#produkt_14 {
	left: 528px;
	top: 285px;
}
#produkt_8 {
	left: 578px;
	top: 285px;
}
#produkt_42 {
	left: 625px;
	top: 285px;
}
#produkt_21 {
	left: 675px;
	top: 285px;
}

#produkt_44 {
	left: 242px;
	top: 330px;
}
#produkt_45 {
	left: 290px;
	top: 330px;
}
#produkt_24 {
	left: 338px;
	top: 330px;
}
#produkt_13 {
	left: 385px;
	top: 330px;
}
#produkt_48 {
	left: 577px;
	top: 330px;
}
#produkt_31 {
	left: 625px;
	top: 330px;
}
#produkt_50 {
	left: 675px;
	top: 330px;
}



/**
 * Tooltips
 */
.fancybox_content {
	padding: 5px;
}

.fancybox_content h2 {
	color: #e30057;
	font-size: 14px;
	font-weight: bold;
	line-height: 18px;
	margin: 10px 0 0;
}

.fancybox_content p, 
.fancybox_content li {
	font-size: 11px;
	font-weight: bold;
	line-height: 15px;
	padding-right: 10px;
}
.fancybox_content p.small {
	font-size: 10px;
	line-height: 14px;
}

#fancy_content table td {
	width: 223px;
}


.qtip-title {
	font-size: 12px;
	padding-left: 9px !important;
}

.qtip-content {
	font-size: 11px;
	line-height: 16px;
	font-weight: bold;
}




/**
 * JS disabled
 */
.js_disabled {
	position: relative;
}

.js_disabled #regal {
	display: none;
}
.js_disabled #lampe1 {
	display: none;
}
.js_disabled #lampe2 {
	display: none;
}
.js_disabled #theke,
.js_disabled #theke_1,
.js_disabled #theke_2,
.js_disabled #theke_3,
.js_disabled #theke_4,
.js_disabled #theke_5 {
	display: none;
}
.js_disabled #frau {
	display: none;
}
.js_disabled #frau_logo {
	display: none;
}
.js_disabled #tafel {
	display: none;
}
.js_disabled #nummernapparat {
	display: none;
}
.js_disabled #telefon {
	display: none;
}
.js_disabled #bild {
	display: none;
}
.js_disabled #aul_logo  {
	display: block;
}


/**
 * JS disabled - Produkt
 */
.js_disabled .produkt {
	display: none;
}
.produkte_active #produkt_content_containter {
	height: 520px;
	margin-left: 200px;
	padding: 20px 0;
	overflow: auto;
	position: relative; 
	width: 570px;
}

.produkte_active #produkt_backlink {
	display: block !important;
	left: 200px;
	position: absolute;
	margin-top: 20px;
	z-index: 10;
}

.produkte_active .fancybox_content {
	display: block !important;
}


/**
 * JS disabled - Information
 */
.information_active #theke {
	display: block;
	left: -330px !important;
}
.information_active #frau {
	display: block;
	left: 50px !important;
}
.information_active #information {
	display: block;
}

/**
 * JS disabled - Information
 */
.projekt_information_active #logo_information {
	display: block;
}

/**
 * JS disabled - Anmeldung
 */
.anmeldung_active #nummernapparat {
	display: block;
	right: 70px !important;
}
.anmeldung_active #anmeldung {
	display: block;
}

/**
 * JS disabled - Teilnahmebdeingungen
 */
.teilnahmebedingungen_active #tafel {
	display: block;
	left: 50px !important;
}
.teilnahmebedingungen_active #teilnahmebedingungen {
	display: block;
}

/**
 * JS disabled - Kontakt
 */
.kontakt_active #theke,
.impressum_active #theke {
	display: block;
	left: -340px !important;
}
.kontakt_active #telefon,
.impressum_active #telefon {
	display: block;
	right: 810px !important;
}
.kontakt_active #kontakt,
.impressum_active #kontakt {
	display: block;
}

/**
 * JS disabled - Beteilgte
 */
.beteiligte_active #bild, 
.ansprechpartner_active #bild, 
.foerderer_active #bild {
	display: block;
	right: 80px !important;
}
.beteiligte_active #beteiligte, 
.ansprechpartner_active #beteiligte, 
.foerderer_active #beteiligte {
	display: block;
}

.beteiligte_active #beteiligte .beteiligte_box {
	display: block;
}
.beteiligte_active #beteiligte .ansprechpartner_box,
.beteiligte_active #beteiligte .foerderer_box {
	display: none;
}

.ansprechpartner_active #beteiligte .ansprechpartner_box {
	display: block;
}
.ansprechpartner_active #beteiligte .beteiligte_box,
.ansprechpartner_active #beteiligte .foerderer_box {
	display: none;
}
.ansprechpartner_active #beteiligte .forward, 
.ansprechpartner_active #beteiligte .backward, 
.ansprechpartner_active #beteiligte .tabs {
	display: none;
}
.ansprechpartner_active #beteiligte #beteiligte_carousel {
	height: 145px;
	margin-left: 50px;
	overflow: auto;
}
.ansprechpartner_active #beteiligte #beteiligte_carousel div {
	position: relative;
	display: block;
}

.foerderer_active #beteiligte .foerderer_box {
	display: block;
}
.foerderer_active #beteiligte .beteiligte_box,
.foerderer_active #beteiligte .ansprechpartner_box {
	display: none;
}


/**
 * JS disabled - Kontakt / Impressum
 */
.kontakt_active #kontakt .kontakt_box {
	display: block;
}
.kontakt_active #kontakt .impressum_box {
	display: none;
}
.impressum_active #kontakt .kontakt_box {
	display: none;
}
.impressum_active #kontakt .impressum_box {
	display: block;
}


/**
 * JS disabled - Kategorien
 */
.kategorien_active #kategorien_active_box {
	display: block;
	position: absolute;
	left: 220px;
	top: 25px;
	height: 590px;
	width: 550px;
}
.kategorien_active #kategorien_active_box .box {
	overflow: auto;
	height: 500px;
}
.kategorien_active #theke_1_content, 
.kategorien_active #theke_2_content, 
.kategorien_active #theke_3_content , 
.kategorien_active #theke_4_content , 
.kategorien_active #theke_5_content  {
	display: block;
}