@charset "utf-8";

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

img, div, h1, h2, h3, h4 { behavior: url("iepngfix.htc") }

div#flash {
   /*position:absolute;
   top:0px;
   left:0px;*/
   height:100%;
   width:100%;
}
a,
a:visited {
	color:#c81146;
	text-decoration:none;
}
a:hover,
a:active {
	color:#c81146;
	text-decoration:underline;
}

:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background: white;
}
ol, ul {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
/*************************************************************************/
/* =site */
/*************************************************************************/

html {
	background:url(../images/bg-html.jpg) left bottom repeat-x;
}
body {
	background:url(../images/bg-body.jpg) left bottom no-repeat;
	font:12px/22px Arial, Helvetica, sans-serif;
	color:#4e5256;
}
html, body {
	height: 100%;
}
.clear {
	float:none;
	clear:both;
}
div#site-container {
	margin:0 auto;
	width:100%;
}
/*************************************************************************/
/* =header */
/*************************************************************************/

div#header-container {
	width:100%;
	height:120px;
	position:relative;
	background:url(../images/bg-header-container.png) 0 0 repeat-x;
}
div#header-container h1#branding {
	width:194px;
	height:89px;
	display:block;
	position:absolute;
	top:15px;
	left:60px;
	background:url(../images/logo.png) 0 0 no-repeat;
}
div#header-container h1#branding a {
	width:194px;
	height:89px;
	display:block;
	text-indent:-9000px;
}
div#header-container h1#branding2 {
	width:89px;
	height:89px;
	display:block;
	position:absolute;
	top:15px;
	right:60px;
	background:url(../images/logo-stiftung.png) 0 0 no-repeat;
}
div#header-container h1#branding2 a {
	width:89px;
	height:89px;
	display:block;
	text-indent:-9000px;
}
div#header-container ul#navigation {
	width:500px;
	height:40px;
	display:block;
	position:absolute;
	bottom:12px;
	left:300px;
}
div#header-container ul#navigation li {
	display:inline;
	height:40px;
	float:left;
	font:14px/22px Arial, Helvetica, sans-serif;
	font-weight:normal;
	text-transform:uppercase;
}
div#header-container ul#navigation li a {
	padding:0 20px 0 0;
	height:40px;
	line-height:40px;
	text-align:center;
}
div#header-container ul#navigation li a, div#header-container ul#navigation li a:visited {
	color:#999;
	text-decoration:none;
}
div#header-container ul#navigation li a:hover, div#header-container ul#navigation li a:active, div#header-container ul#navigation li a.active {
	color:#c81146;
	text-decoration:none;
}
/*************************************************************************/
/* =error */
/*************************************************************************/

#mask {
	position:absolute;
	left:0;
	top:0;
	z-index:9000;
	background-color:#000;
	display:none;
}
#boxes .window {
	position:absolute;
	left:0;
	top:0;
	width:440px;
	height:200px;
	display:none;
	z-index:9999;
	padding:20px;
}
#boxes #dialog {
	width:375px;
	height:203px;
	padding:0px;
	background:transparent url(../images/bg-dialog.png) left bottom no-repeat;
	position:absolute;
}
#boxes #dialog h4 {
	height:20px;
	background:transparent url(../images/bg-dialog-h4.png) 0 0 no-repeat;
	padding:3px 10px 3px 10px;
	font:14px/22px Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#fff;
	position:relative;
}
#boxes #dialog h4 a {
	display:block;
	height:14px;
	width:14px;
	position:absolute;
	top:8px;
	right:10px;
	background:url(../images/bg-dialog-close.png) 0 0 no-repeat;
	text-indent:-9000px;
}
#boxes #dialog p {
	margin:10px;
	font:12px/22px Arial, Helvetica, sans-serif;
	color:#000;
}

#boxes #dialog img.icon-error {
	margin:2px 15px 50px 0;
	float:left;
}
/*************************************************************************/
/* =header */
/*************************************************************************/

div#content-container {
	width:600px;
	height:60%;
	position:absolute;
	top:185px;
	left:30%;
	background:#fff;
	padding:20px;
}
div#content {
	overflow:auto;
	height:100%;
	padding:0 20px 0 0;
}
* html div#content {
	overflow:auto;
	height:360px;
	padding:0 20px 0 0;
}

h3#content-title {
	width:600px;
	height:36px;
	display:block;
	position:absolute;
	top:155px;
	left:30%;
	background:transparent url(../images/bg-content-h3.png) 0 0 no-repeat;
	padding:0px 20px 0px 20px;
	font:18px/22px Arial, Helvetica, sans-serif;
	color:#fff;
	line-height:29px;
}

div#content p {
	margin:0 0 15px 0;
	font:12px/22px Arial, Helvetica, sans-serif;
	color:#4a4c4e;
}
div#content p strong {
	font-weight:bold;
}
div#content a,
div#content a:visited {
	color:#c81146;
	text-decoration:none;
}
div#content a:hover,
div#content a:active {
	color:#c81146;
	text-decoration:underline;
}
div#content h4 {
	font:14px/22px Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#c81146;
}

div#content h5 {
	font:12px/22px Arial, Helvetica, sans-serif;
	font-weight:bold;
	color:#c81146;
}

div#content img.image {
	margin:10px 5px 15px 15px;
	float:right;
}
/* -------------- Contact form CSS -------------
##### Change these styles at whim to match your own site layout and look #### */



/* ---------- Styles for the form element itself  ---------- */
form#Kontaktformular {
	margin:0 0 20px 0;
	padding:0 0 10px 0;
}


/* ---------- Shared styles for labels, input fields, textareas, select lists  ---------- */
form#Kontaktformular label, form#Kontaktformular input, form#Kontaktformular textarea, form#Kontaktformular select {	
	color:#000;
	font:1em Arial, Helvetica, sans-serif;
	margin:0 0 10px 0;
	padding:2px;
	width:280px;

	/* ---- These are here for a reason - don't remove if not necessary ---- */
	display:block;
	float:left;
}


/* ---------- Special styles for input fields, select lists and textareas only ---------- */
form#Kontaktformular input, form#Kontaktformular textarea , form#Kontaktformular select{
	background:#fcfcfc;
	border:1px solid #7c8084;
}

form#Kontaktformular textarea {
	height:150px;
}

/* ---------- For better usability, change the look of your form fields when they are focused ---------- */
form#Kontaktformular input:focus, form#Kontaktformular textarea:focus {
	background:#fff;
	border:1px solid #bd1c3b;	
}



/* ---------- Label styles ---------- */
form#Kontaktformular label {
	margin-right:5px;
	padding:2px 15px 2px 0;		
	width:120px;						
}


/* ---------- If you want to display legends, just remove the display:none here and add your own styles ---------- */
form#Kontaktformular legend {
	display:none;
}


/* ---------- Fieldsets can be made visible by removing the default style here ---------- */
form#Kontaktformular fieldset {
	border:none;
}



/* ---------- Radio buttons ---------- */
form#Kontaktformular input.radio {
	background:transparent;
	border:none;
	width:20px;
}

form#Kontaktformular label.radio {
	width:auto;
}



/* ---------- Checkboxes ---------- */
form#Kontaktformular input.checkbox {
	background:transparent;
	border:none;
	width:20px;
}

form#Kontaktformular label.checkbox {	
	width:90px;
}


/* ---------- Select lists - make them a bit larger than your input fields ---------- */
form#Kontaktformular select {
	width:286px;
}





/* ---------- Submit button ---------- */
form#Kontaktformular input#submit {
	background:#be193b;
	border:none;
	color:#fff;
	cursor:pointer;
	font-size:12px;
	font-weight:bold;
	
	/* Watch out! IE6 will double the left margin if the submit button is floated. To prevent this, either provide only half the margin value to IE6 or set the button to display:inline. */
	display:inline;
	margin:0 0 0 140px;
	
	padding:5px;
	width:12em;
}


/* ---- Won't show in IE6 - but why should everyone else miss all the fun? ---- */
form#Kontaktformular input#submit:hover {
	background:#d43f55;
}





/* ---------- Remove the following styles if you don't need the field "Rueckruf" ---------- */
form#Kontaktformular label#label-telefon {
	width:55px;
}

form#Kontaktformular label#label-rueckruf {
	width:118px;
}

form#Kontaktformular input#Telefon {
	width:187px;
}





/* ---------- Class for required fields - add colors, an image, or whatever you wish ---------- */
form#Kontaktformular label.required {
	background:url(../images/icon-required.png) center right no-repeat;	
}



/* ---------- On user errors, required labels are style with these ---------- */
.error {
	color:#bf173a !important;
	font-weight:bold !important;
}



/* ---------- The error message - make it huge and hard to miss! :) ---------- */
p#fehlermeldung {
	background:#efefef;
	display:none;
	margin:0 0 15px 0;
	padding:20px;
	width:300px;
}



/* ---------- Since by default labels and form fields are floated, the cleared br elements are required to keep them all in place ---------- */
form#Kontaktformular br {
	clear:left;
}


/* ---------- Without these styles, some browsers show a huge gap where the hidden fields are. Don't remove them unless you know what you're doing! ---------- */
form#Kontaktformular fieldset.hidden, form#Kontaktformular input[type=hidden] {
	display:none;
	border:0;
	padding:0;
}
