/* Basisvorlage CSS
Perle Stadtmagazin
www.perle-stadtmagazin.de
Start: 05.05.2010
Letzte Aenderung: 24.04.2012
*/

/* Farbschema
--------------------------------------------------------------------------------------- */

/*
Farbton (gelb): #Fed300
Farbton (blau): #003c7c
Farbton (blau heller): #005aa2
Farbton (dunkelgrau): #535450
Farbton (hellgrau): #babbb9
*/

/* Reset
--------------------------------------------------------------------------------------- */
* {
	padding: 0;
	margin: 0;
	border: 0;
}
/* Globals und Typo 
--------------------------------------------------------------------------------------- */

html {
/* Wahlweise Grid-Hintergrund
Rasterhintergrund, der die Breite bis 100 Pixel und eine Höhe bis 950 Pixel anzeigt. Die Breite von 960 Pixel ist markiert. Der Hintergrund ist transparent, muss also nicht nur mit #fff verwendet werden. Es wird eine Schriftgröße von 75% oder 12px festgelegt.
	background: #fff url(bilder/grid.png) top left no-repeat;
*/	
	background: #fff;
}

body {
/* Wahlweise Linienhintergrund
Linienhintergrund abgestimmt auf eine Schriftgröße von 12px.	
	background: transparent url(bilder/line-height.gif) top left;
	*/	
	background: #fff;
	font-size: 75%;
}

html>body {
	font-size: 14px;
}

a:link {
	color: #213e8b;
	text-decoration: none;
}

a:visited {
	color: #213e8b;
	text-decoration: none;
}

a:hover {
	color: #3366cc;
	text-decoration: underline;
}

/* Macht die gepunktete Linie um geklickte Links unsichtbar
--------------------------------------------------------------------------------------- */
a:focus {
    outline: none;
}


/* Vertikaler Rhythmus basierend auf 12px Basisgröße für den Fließtext
--------------------------------------------------------------------------------------- */
p {
	font: 1em/1.4em Verdana, Arial, Tahoma, sans-serif;
	margin-top: 1.5em;
	margin-bottom: 1.5em;
}

h1 {
	font: 1.6em/1em Verdana, Arial, Tahoma, sans-serif;
	color: #fff;
	font-weight: bold;
}

h1 span {
	display: none;
}

h2 {
	font: 1.6em/0.3em Verdana, Arial, Tahoma, sans-serif;
	margin-top: 0.7em;
	margin-bottom: 0.3em;
	font-weight: bold;
}

h3 {
	font: 1.25em/1.4em Verdana, Arial, Tahoma, sans-serif;
	margin-top: 0.7em;
	font-weight: bold;
}

h4 {
	font: 1.05em/1.8em Verdana, Arial, Tahoma, sans-serif;
	margin-top: 0.9em;
	margin-bottom: 0.3em;
	color: #fff;
	font-weight: bold;
	background-color: #babbb9;
	width: 100%;
	text-transform: uppercase;
	text-indent: 15px;
	letter-spacing: 0.15em;
	height: 30px;
}

h5 {
	font: 1.0em/1.4em Verdana, Arial, Tahoma, sans-serif;
	font-weight: bold;
}

h6 {
	margin-top: 0.9em;
	margin-bottom: 0.3em;
	color: #Fed300;
	font-weight: bold;
	background-color: #005aa2;
	width: 100%;
	font-family: Verdana, Arial, Tahoma, sans-serif;
	font-size: 1.17em;
	line-height: 1.6em;
	text-transform: uppercase;
	text-indent: 15px;
	letter-spacing: 0.15em;
	height: 25px;
}

h7 {
	margin-top: 0.9em;
	margin-bottom: 0.3em;
	color: #fff;
	font-weight: bold;
	background-color: #babbb9;
	width: 100%;
	font-family: Verdana, Arial, Tahoma, sans-serif;
	font-size: 1.17em;
	line-height: 1.6em;
	text-transform: uppercase;
	text-indent: 15px;
	letter-spacing: 0.15em;
	height: 25px;
}

/* Bilder und verlinkte Bilder ohne Rahmen 
--------------------------------------------------------------------------------------- */
img, a img {
	border: 0;
}

/* Links- bzw. Rechtsausrichtung für Elemente
--------------------------------------------------------------------------------------- */
.links {
	float: left;
	margin: 0 0.5em 0.5em 0;
}

.rechts {
	float: right;
	margin: 0 0 0.5em 0.5em;
}

/* Layoutelemente
Verwenden Sie overflow: hidden; um nötige Foats aufzulösen.
--------------------------------------------------------------------------------------- */
#wrapper {
	margin: 0 auto;	
	position: relative;
	width: 80em;
	max-width: 960px;
}

#metainformation {
	clear: both;
	background: url(../bilder/logo_fond.png) top left no-repeat;
	padding: 20px 20px 0 0;	
}

#navi {
	clear: both;
}

#teaserfoto {
	background: transparent url(../bilder/teaser2.png) top left no-repeat;
	width: 213px;
	height: 290px;
	position: absolute;
	top: 0px;
	left: 650px;
	z-index: 999;
}

#hauptinformation {
	clear: both;
	float: left;
	width: 580px;
	color: #535450;
	padding: 10px 20px 20px 20px;
}

/* Details */

.intro {
	float: left;
	width: 280px;
	padding: 0 20px 0 0;
}

.intro-s {
	float: right;
	width: 280px;
}

.intro-b {
	float: left;
	width: 560px;
		padding: 0 20px 0 0;
}

.intro-u {
	clear: both;
	float: left;
	width: 580px;
}

#hauptinformation ul li {
	list-style-type: none;
	border-bottom: 1px dotted #cc9966;
	padding: 10px 0;
	font: 1em/1.5em Verdana, Arial, Tahoma, sans-serif;
}

#nebeninformation {
	float: right;	
	width: 300px;
	color: #535450;
	padding: 0px 20px 20px 20px;	
}

#nebeninformation ul li {
	list-style-type: none;
	border-bottom: 1px dotted #cc9966;
	padding: 10px 0;
	font: 1em/1.5em Verdana, Arial, Tahoma, sans-serif;
}

#nebeninformation p {
	margin: 0;
	padding: 0;
}

#siteinformation {
	clear: both;	
	background: #babbb9;
	color: #fff;
	padding: 1px 20px 60px 20px;
}