@charset "UTF-8";
/* CSS Document */

<!--
body {
	font: 0.8em/1.5em Lucida Sans, Arial, Helvetica, sans-serif;
	background: #42413C;
	margin: 0;
	padding: 0;
	color:#555;
	background-color: #FFF;
}
/* ~~ Element-/Tag-Selektoren ~~ */
ul, ol, dl { /* Aufgrund von Abweichungen zwischen verschiedenen Browsern empfiehlt es sich, die Auffüllung und den Rand in Listen auf 0 einzustellen. Zu Konsistenzzwecken können Sie die gewünschten Werte entweder hier oder in den enthaltenen Listenelementen (LI, DT, DD) eingeben. Beachten Sie, dass diese Angaben auch für die .nav-Liste gültig sind, wenn Sie keinen spezifischeren Selektor festlegen. */
	padding: 0;
	margin: 0;
}

h2, h3, h4, h5, h6, p {
	margin-top: 0;
	padding-right: 15px;
	padding-left: 15px;
}

h1 {
	margin-top: 0;
	padding-right: 15px;
	padding-left: 15px;
	font: 1.8em/1.2em Times, serif;
	letter-spacing: 0.05em;
	color:#2B2B2B;

}

a img { /* Dieser Selektor entfernt den standardmäßigen blauen Rahmen, der in einigen Browsern um ein Bild angezeigt wird, wenn es von einem Hyperlink umschlossen ist. */
	border: none;
}
/* ~~ Die Reihenfolge der Stildefinitionen für die Hyperlinks der Site, einschließlich der Gruppe der Selektoren zum Erzeugen des Hover-Effekts, muss erhalten bleiben. ~~ */
a:link {
	color: #888;
	text-decoration: none; /* Sofern Ihre Hyperlinks nicht besonders hervorgehoben werden sollen, empfiehlt es sich, zur schnellen visuellen Erkennung Unterstreichungen zu verwenden. */
}
a:visited {
	color: #888;
	text-decoration: none;
}
a:hover, a:active, a:focus { /* Durch diese Gruppe von Selektoren wirdbei Verwendung der Tastatur der gleiche Hover-Effekt wie beim Verwenden der Maus erzielt. */
	text-decoration: none;
	color: #2B2B2B;
}
/* ~~ Dieser Container fester Breite umgibt alle anderen Blockelemente. ~~ */
.container {
	width: 960px;
	background: #FFFFFF;
}	
.wrapper {
	width: 960px;
	position: absolute;
	background: #FFFFFF;
	left: 50%;
	margin-left: -480px;
	height: 100%;
	/* Durch die Angabe der Breite und Verwendung des Werts "auto" für die Seiten wird das Layout zentriert. */

}
/* ~~ Für die Kopfzeile wird keine Breite angegeben. Sie erstreckt sich über die gesamte Breite des Layouts. ~~ */
header {
	background: #FFF;
}

headerbild {
	background: #FFF;
	height:200px;
}
.sidebar1 {
	width: 280px;
	float:left;	
	height: 400px;
	background: #FFF;
}
.content {
	width: 570px;
	float:left;
	display:block;
	padding-top: 30px;
}
.content2 {
	width: 570px;
	float:left;
	display:block;
	padding-top: 10px;
}
aside {
	float: left;
	width: 220px;
	background: #FFF;
	padding: 10px 0;
}

teamheaderbild {
	background: #FFF;
	height:393px;
}

/* ~~ Mit diesem gruppierten Selektor werden die Listen im .content-Bereich angesprochen. ~~ */
.content ul, .content ol {
	padding: 0 0 0 35px;
}

/* ~~ Stile für die Navigationslisten (können entfernt werden, wenn Sie ein vordefiniertes Ausklappmenü wie Spry verwenden) ~~ */
nav ul {
	list-style: none; /* Hiermit wird die Listenmarkierung entfernt. */  margin-bottom: 15px; /* Hiermit wird der Abstand zwischen den Navigationselementen und den darunter angeordneten Inhalten erstellt. */
}
nav ul li {
	text-align:right;
	/*border-bottom: 1px solid #666; /* Hiermit wird die Trennung der Schaltflächen erstellt. */
}
nav ul a, nav ul a:visited { /* Durch Gruppieren dieser Selektoren wird sichergestellt, dass die Hyperlinks auch nach dem Aufrufen das Erscheinungsbild einer Schaltfläche beibehalten. */
	padding: 5px 45px 5px 15px;
	display: block; 
	width: 200px; 
	text-decoration: none;
	background: #FFF;
	color:#888;
	
}
nav ul a:hover, nav ul a:active, nav ul a:focus { /* Hiermit wird der Hintergrund und die Textfarbe bei der Navigation mit der Maus und der Tastatur geändert. */
	background: #FFF;
	background-image: url(../images/image_highlight.gif);
	background-position: right;
	background-repeat:no-repeat;
	color: #2B2B2B;
}


nav p {
	margin-top: 0;
	padding-right: 0px;
	padding-left: 0px;
}


/* ~~ Fußzeile ~~ */
footer {
	padding-top: 50px;
	background:#FFF;
	clear: both;
	background-image:url(../images/footer_logo.gif);
	background-repeat:no-repeat;
	height:200px;
}

footer a:link {
	color:#888;	
}

footer a:hover {
	color:#d32427;	
}
/* ~~ Verschiedene float/clear-Klassen ~~ */
.fltrt {  /* Mit dieser Klasse können Sie ein Element auf der Seite nach rechts schweben lassen. Das schwebende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* Mit dieser Klasse können Sie ein Element auf der Seite nach links schweben lassen. Das schwebende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* Diese Klasse kann einem <br />-Tag oder einem leeren Blockelement als abschließendes Element nach dem letzten schwebenden Block (innerhalb von .container) zugewiesen werden, wenn die Fußzeile entfernt oder aus .container verschoben wird. */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;
}

/*Unterstützung für HTML 5 - Legt für die neuen HTML 5-Tags die Eigenschaft "display:block" fest, damit die Tags in den Browsern korrekt dargestellt werden. */
header, section, footer, aside, nav, article, figure, headerbild {
	display: block;
}
-->

.accordionButton {	
	text-align: right;
	color:#888;
	background: #FFF;
	cursor: pointer;
	font: 1.3em Lucida Sans, Arial, Helvetica, sans-serif;
	letter-spacing:0.2em;
	line-height:2.0em;
	color:#888;
	width: 220px;
	}
	
.accordionButton a:hover { /* Durch Gruppieren dieser Selektoren wird sichergestellt, dass die Hyperlinks auch nach dem Aufrufen das Erscheinungsbild einer Schaltfläche beibehalten. */
	padding: 0px 40px 0px 10px;
	display: block; 
	width: 210px; 
	text-decoration: none;
	background: #FFF;
	color:#C2B2B2B;
	background-image: url(../images/image_highlight3.gif);
	background-position:right bottom;
	background-repeat:no-repeat;
}
.accordionContent {	
	width: 220px;
	float: left;
	_float: none; /* Float works in all browsers but IE6 */
	background: #FFF;
	}

.footermenu {
	width: 220px;
	float: left;
	text-align: right;
	font: 0.8em Lucida Sans, Arial, Helvetica, sans-serif;
	color: #888;
	letter-spacing: 0.1em;
}

.footeraddress {
	float:left;
	padding-left: 60px;
	font: 1.0em Lucida Sans, Arial, Helvetica, sans-serif;
	color:#2B2B2B;
}

.footerzeiten {
	float: left;
	padding-left: 40px;
	font: 1.0em Lucida Sans, Arial, Helvetica, sans-serif;
	color:#2B2B2B;
}

color {
	color:#0061AA;
}

.bold {
	color:#0061AA;
}

.aerzte {
	color:#0061AA;
	padding-left: 15px;
	padding-top: 5px;
}



.overlay {
	position: fixed;
	width: 100%;
	height: 100%;
	opacity: 0.9;
    filter: alpha(opacity=90);
    background-color: #FFF;
    z-index: 10;
    text-align: center;

}

.overlay-content {
	position: fixed;
	display: inline-block;
	top: 100px;
	width: 100%;
	z-index: 11;
	text-align: center;
}


	.trauer-bild {
		margin-bottom: 40px;
	}

.imprint-wrapper {
	width: 570px;
	position: relative;
}

.half-size {
	float: left;
	width: 270px;
	position: relative;
}

.half-size:first-child {
	font-weight: bold;
}

.clearing {
	margin-bottom: 20px;
	clear: both;
}

.content h1,p {
	padding: 0;
}

.content2 .aerzte {
	padding: 0;
}

.content2 .AccordionAerzte {
	padding-left: 0;
	margin: 0 0 15px 0;
}