/********************************************************************************/
/* webdesign: Cogneus - Userfriendly Design, www.cogneus.com
/* author: Katharina Gattermann
/* website: www.impuls-philosophie.de
/* zuletzt geändert 19/03/2010
/********************************************************************************/
/* Farbdefinitionen
/* ----------------
/* Dunkelblau für Links und Navigation: #003366
/* Grau für Text und Überschriften: #666666
/* dunkleres Grau für Überschriften: #333333
/* helles Grau für Hintergrund und Trennlinien: #999999

/********************************************************************************/
/************************** Hauptelemente ***************************************/
/********************************************************************************/
* {
	margin: 0;
	padding: 0;
}
body {
	margin: 0;
	padding: 0;
	text-align: center;
	font-family: "Arial", Arial, Verdana, Helvetica, sans-serif;
	background-image: url(../files/bg_body.gif);
	background-repeat: repeat-x;
	background-color: #999999;
}
#wrapper {
	width: 1000px;
	position: relative;
	margin: 0 auto 0 auto;
	text-align: left;
	background-image: url(../files/bg_wrapper.png);
	background-repeat: repeat-y;
}
/* ------- linke Spalte --------- */
#left {
	width: 200px;
	height: auto;
	float: left;
}
/* linker Teil des Header-Bildes, über Artikel einsetzen */
#left_pic {		
	width: 200px;
	height: 150px;
	position: relative;
}
/* ------- mittlere Spalte --------- */
#content {
	width: 600px;
	height: auto;
	float: left;
	background-color: #ffffff;
	padding-bottom: 20px;
}
/* metafile des artikels wird über das template als hintergrundbild geladen */
#content_pic {		
	width: 600px;
	height: 240px;
	float: left;
	margin-bottom: 20px;
	background-repeat: none; /*!*/
}
/* ------- rechte Spalte --------- */
#right {
	width: 200px;
	height: auto;
	float: left;
}
/* rechter Teil des Header-Bildes, über Artikel einsetzen */
#right_pic {		
	width: 200px;
	height: 150px;
	position: relative;
}
/* Nächste Veranstaltung */
/* Inhalte händisch über Artikel „Rechte Spalte“ */
#news {
	width: 200px;
	height: auto;
	padding-top: 10px;
	padding-bottom: 10px;
	background-image: url(../files/bg_re3.gif);
	background-repeat: repeat-y;
}
/* Themenbereiche */
/* Kategorie-Listen, per Modul ausgelesen bzw. händisch angelegt */
.teaser {
	width: 200px;
	height: auto;
	background-image: url(../files/bg_re.gif);
	background-repeat: repeat-y;
}
/********************************************************************************/
/************************** Formatierungen **************************************/
/********************************************************************************/

/* ------- Hauptnavigation links --------- */
#left ul {
	list-style-type: none;
}
#left ul li {
	display: block;
	width: 200px;
	border-bottom: 1px solid #999999;
}
#left ul li a, 				
#left ul li a:link, 
#left ul li a:visited, 
#left ul li a:active {
	display: block;
	width: 190px;
	padding: 15px 15px 15px 15px;
	text-decoration: none;
	color: #003366;
	font-size: 15px;
	font-weight: bold;
	background-image: url(../files/bg_li.gif);
	background-repeat: repeat-y;
}
#left ul li a:hover {
	background-image: url(../files/bg_li2.gif);
	background-repeat: repeat-y;
}
#left ul li.current a {
	background-image: url(../files/bg_li2.gif);
	background-repeat: repeat-y;
}

/* ------- Subnavigation im Contentbereich --------- */
.vlist ul {
	list-style-type: none;
}
.vlist ul li {
	display: block;
	margin-top: 10px;
	margin-bottom: 10px;
	margin-left: 30px;
}
.vlist ul li a, 
.vlist ul li a:link, 
.vlist ul li a:visited, 
.vlist ul li a:active {
	text-decoration: none;
	color: #003366;
	font-weight: normal;
}
.vlist ul li a:hover {
	color: #666666;
}
.vlist ul li.current2 a {
	color: #666666;
}

/* --------- Formatierungen Contentbereich ---------- */

/******* Artikel-Text *******/
p {
	font-size: 16px;
	line-height: 20px;
	margin-left: 30px;
	margin-right: 20px;
	margin-top: 10px;
	color: #666666;
}
#content h1 {
	font-size: 20px;
	line-height: 24px;
	margin-left: 30px;
	margin-top: 5px;
	font-weight: bold;
	color: #666666;
}
#content h2 {
	font-size: 18px;
	line-height: 24px;
	margin-left: 30px;
	margin-top: 10px;
	font-weight: bold;
	color: #666666;
}
#content h3 {
	font-size: 18px;
	line-height: 24px;
	margin-left: 30px;
	margin-top: 3px;
	font-weight: normal;
	color: #333333;
}
#content h4 {
	font-size: 16px;
	line-height: 24px;
	margin-left: 30px;
	margin-top: 30px;
	font-weight: bold;
	color: #666666;
}
#content h5 {
	font-size: 16px;
	line-height: 24px;
	margin-left: 30px;
	margin-top: 5px;
	font-weight: normal;
	color: #333333;
}
#content a, 						
#content a:link, 
#content a:visited, 
#content a:active {
	text-decoration: none;
	color: #003366;
}
#content ul li a:hover {
	color: #666666;
}
#content ul {
	list-style-type: disc;
}
#content ul li {
	font-size: 16px;
	line-height: 20px;
	margin-left: 45px;
	margin-right: 20px;
	margin-top: 10px;
	color: #666666;
}
/* Weiße Überschriften im mittleren Headerbild*/
#content_pic h1 {
	font-size: 22px;
	line-height: 24px;
	margin-left: 30px;
	margin-right: 20px;
	margin-top: 150px;
	font-weight: normal;
	color: #ffffff;
}
#content_pic h2 {
	font-size: 22px;
	line-height: 24px;
	margin-left: 30px;
	margin-right: 20px;
	font-weight: normal;
	color: #ffffff;
}


/* --------- Formatierungen Rechte Spalte ---------- */

/***** Listenelemente in den Teaser Divs *****/
#right ul {
	list-style-type: none;
	margin: 0;
}
#right ul li {
	display: block;
	width: 200px;
	border-bottom: 1px solid #999999;
}
#right ul li a, 							
#right ul li a:link, 
#right ul li a:visited, 
#right ul li a:active {
	display: block;
	width: 180px;
	padding: 15px 10px 15px 10px;
	text-decoration: none;
	color: #003366;
	font-size: 14px;
	line-height: 18px;
	font-weight: normal;
	background-image: url(../files/bg_re.gif);
	background-repeat: none;
}
#right ul li a:hover {
	background-image: url(../files/bg_re2.gif);
	background-repeat: none;
}
/****** Themenbereiche ******/
.teaser h2 {
	font-size: 16px;
	line-height: 24px;
	padding: 15px 10px 15px 10px;
	font-weight: bold;
	color: #003366;
	background-image: url(../files/bg_re.gif);
	background-repeat: none;
}
/************************/
#news h2 {
	font-size: 16px;
	line-height: 24px;
	margin-left: 10px;
	margin-top: 5px;
	font-weight: bold;
	color: #333333;
}
#news h3 {
	font-size: 16px;
	line-height: 24px;
	margin-left: 10px;
	margin-top: 5px;
	font-weight: bold;
	color: #333333;
}
#news p {
	font-size: 14px;
	line-height: 18px;
	margin-left: 10px;
	margin-top: 5px;
	font-weight: normal;
	color: #333333;
}


/*********************************************************************************/
/********************** Ergänzungen **********************************************/
/*********************************************************************************/

/* gehört zum Modul Texteingabe mit Option Bild im Fließtext */
.flLeft {
	float: left;
	margin: 10px 10px 10px 30px;
}
.flRight {
	float: right;
	margin: 10px 20px 10px 10px;
}

/* sorgt dafür, dass der Wrapper alles umschließt */
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
* html .clearfix {
	height: 1%;
}
.clearfix {
	display: block;
}
/*********************************************************************************/
/********************** Kontaktformular ******************************************/
/*********************************************************************************/
/* Div das das Formular umschliet */
.formgen {
	font-size: 16px;
	line-height: 20px;
	margin-left: 30px;
	margin-right: 20px;
	margin-top: 10px;
	color: #666666;
}
/* Was passiert wenn auf das Label geklickt wird? */
label,
select,
input[type=checkbox],
input[type=radio],
input[type=button],
input[type=submit]
{
cursor : pointer;
}
.formgen form {
line-height : 120%;
}
/* Wie sehen die einzelnen Blöcke aus? */
.formgen .formblock {
	margin-bottom: 20px;
	margin-top: 20px;	
}
.forminfo {
	width: 380px;
	margin-bottom: 20px;
	font-size: 16px;
	font-weight: bold;
	border: 0;
}
/*Verhalten von br-Tags*/
.formgen br {
clear : both;
}
/* --------- FORMULAR-OBJEKTE ------------ */

/* Mehrzeiliges Eingabefeld */
.formgen .formtextfield {
	width: 270px;
	height: 150px;
	border: 1px solid #666666;
	margin-top: 20px;
}

/* Textfeld */
.formgen .formtext {
	width: 270px;
	padding-bottom: 4px;
	font-size: 1em;
	border: 1px solid #666666;
	margin-top: 20px;
}

.formgen input:focus, .formgen input:hover,
.formgen select:focus, .formgen select:hover, 
.formgen textarea:focus, .formgen textarea:hover {
	background-color: #cccccc;	
}

/* Label */
.formgen label {
	width: 150px;
	clear: left;
	float: left;
	height: 20px;
	margin-top: 20px;
}

/* Aussehen der Select-Ausgabe */
.formgen .formselect {
	width: 200px;
	background-color: #003366;
	margin-left: 4px;
	color: #000000;
}

/* Sende-Button */
.formgen .formsubmit {
	width: 270px;
	height: 30px;
	text-align: center;
	font-size: 16px;
	background-color: #003366;
	border: 0;
	margin-left: 150px;
	float: left;
	color: #ffffff;
}

/* Fieldsetbeschriftung */
.formgen legend {
color: #333333;
}

/* -------------- AUSGABEN / Fehlermeldungen --------*/


/* Markierung der Labels bei Fehler */
.formgen .formerror {
	border-bottom-width: 1px;
	color: #003366;
}

.formgen .formcaptcha {
	border: 2px solid #990000;
	vertical-align: top;
	float: left;
	margin-right: 10px;
}