/* CSS Document */
/* by Wild Wild Web :: Internetservices :: Heiko Hänsge, www.wild-wild-web.de */

/* Stile für Javascript-Kalender-Popup importieren */
@import url(/javascript/jscalendar/calendar-system.css);

/*<![CDATA[*/

/* ######################################################################################################
** ### COLORS ###########################################################################################
** ######################################################################################################

background 			#505050
Text 				#EEE
grün 				#
navi 				#ccc
*/

/* ######################################################################################################
** ### HTML tags & Hacks ################################################################################
** ######################################################################################################
*/

* { margin:0; padding:0; font-size: 100%; }
option {padding-left: 0.4em}

HTML, BODY {font: 13px 'Lucida Grande', Verdana, Arial, Sans-Serif; }

html {height:100%;} 

body {
    min-height: 101%; /* Scrollbalken rechts immer erzeugen */
    font-size: 100.01%;
    position: relative;
    color: #EEEEEE;
    background: #333333; 
		text-align: left;
		/* Scrollbalken für IE einfärben */
		scrollbar-arrow-color: #999;
		scrollbarBaseColor: #bbb;
		scrollbar-track-color: #777;
		scrollbar-face-color: #666;
		scrollbar-highlight-color: #777;
		scrollbar-3dlight-color: #999;
		scrollbar-darkshadow-color: #333;
		scrollbar-shadow-color: #666;
}

table { border-collapse:collapse; /* width: 100%; */ margin-bottom: 0.5em; }

form { overflow:hidden; }

fieldset, img { border:0; }

fieldset { padding: 8px; }

legend { padding: 3px; }

select, input, textarea {
	font-size: 99%;
	font: 'Lucida Grande', Verdana, Arial, Sans-Serif;
	color: #505050 ; 
	background: #EEE ; 
	}

input[type=radio] { background: none; }

/* Überschriften, Fließtexte */

h1 {font-size: 1.1em; color: #EEE; margin: 0 0 0.25em 0; padding-top: 1.5em; font-weight:bold; }
h2 {font-size: 1.1em; color: #EEE; margin: 0 0 0.25em 0; padding-top: 1.5em; font-weight:bold; }
h3 {font-size: 1.1em; color: #EEE; margin: 0 0 0.25em 0; padding-top: 1.5em; font-weight:bold; }
h4 {font-size: 1.0em; color: #EEE; margin: 0 0 0.30em 0; padding-top: 1em; font-weight:bold; border-bottom: 1px dashed #EEE; }
h5 {font-size: 1.0em; color: #888; margin: 0 0 0.30em 0; font-style:italic; font-weight:normal; }
h6 {font-size: 1.0em; color: #888; margin: 0 0 0.30em 0; font-style:italic; font-weight:normal; }

p,ul,dd,dt { line-height: 1.5em; }
p { line-height: 1.5em; margin: 0 0 1em 0; font-weight:normal; }

P, TD, LI, H1, H2, H3, H4, legend, NOBR { 
	font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif; 
	color: #EEE;
	text-align: left;
	line-height: 1.5em;
	}
sub {font-size: 0.7em;}
strong,b { font-weight: bold; }
em,i { font-style:italic; }
pre, code { font-family: "Courier New", Courier, monospace; }
address { font-style:normal; line-height: 1.5em; margin: 0 0 1em 0; }

HR {
	clear: both;
	color: #EEEEEE;
	height: 1px;
	margin: 20px 0;
	}

/* Standard-Formatierungen für Listen & Zitate */
ul, ol, dl { margin: 0 0 1em 1em }
li { margin-left: 1.5em; line-height: 1.5em; }

dt { font-weight: bold; }
dd { margin: 0 0 1em 2em; }

blockquote, cite { margin: 0 0 1em 1.5em; font-size: 0.93em; width: auto;}

/* IE Disappearing List Background Bug Hack */
* html ul { position: relative }
* html ol { position: relative }
* html dl { position: relative }
* html blockquote { zoom:1 }

/* -----------------------------------------------------------------------------------------
	Auszeichnung lokaler und Externer Links
   ---------------------------------------------------------------------------------------*/

a, a em.file {text-decoration:underline; /*background:transparent;*/ color:#EEE;}
a:hover {text-decoration:none; /*background:transparent;*/ color:#FFF;}
a:focus {text-decoration:none; /*background:transparent;*/}

/* Auszeichnung externer Hyperlinks */
#main a[href^="http:"],
#main a[href^="https:"]
{
  padding-left: 12px;
  background-image: url('../images/ext_link.gif');
  background-repeat: no-repeat;
  background-position: 0 0.2em;
}

/* -----------------------------------------------------------------------------------------
	Markupfreie CSS-Floatclearing-Lösungen
   ---------------------------------------------------------------------------------------*/

	/* Clearfix-Methode zum Clearen der Float-Umgebungen */
	 .clearfix:after {
		content: "."; 
		display: block; 
		height: 0; 
		clear: both; 
		visibility: hidden;
	}
	
	/* Diese Angabe benötigt der Safari-Browser zwingend !! */
	.clearfix { display: block; } 
	
	/* Overflow-Methode zum Clearen der Float-Umgebungen */
	.floatbox { overflow:hidden; }
	
	/* IE-Clearing: Benötigt nur der Internet Explorer und über iehacks.css zugeschaltet */
	#ie_clearing { display: none; }

	/* .floatbox-Anpassung für IE #/
	/* Hides from IE-mac \*/
	* html .floatbox {width:100%;}
	/* End hide from IE-mac */


/* -----------------------------------------------------------------------------------------
	IE-Clearing bis YAML V2.4
   ---------------------------------------------------------------------------------------*/
/* 
** Die CSS-Definition des IE-Clearings, welches bis YAML 2.4 verwendet wurde, ist aus Gründen der 
** Abwärtskompatibilität des Basis-Stylesheets weiterhin enthalten.
*/
	/* Clearen der 3 Inhaltsspalten mittels dieses speziellen hr-Tags */
	hr.clear_columns {	
		clear: both; 
		float: left; 
		content: "."; 
		display: block;  
		height: 0; 
		line-height: 0px; 
		visibility: hidden; 
		border: 0; 
		padding: 0;
		margin: -1.1em 0 0 0; /* erforderlich damit kein Leerraum zwischen Spalten und Footer entsteht */
	}


/* ######################################################################################################
** ### Page & Pics ######################################################################################
** ######################################################################################################
*/

#page, #header, #nav, #main, #footer { zoom: 1; }

/* Festlegung der Layoutbreite und Zentrierung*/
#page {
	position: relative;
	width: 960px;
	margin: 20px auto 0px auto;
	max-width:none;  /* min-width für fixes Layout abschalten */
	min-width:inherit;  /* max-width für fixes Layout abschalten */
	/* IE5/WIN workaround zur Zentrierung im Browser */
	text-align:left;
	background: #555555;
	border-left: 1px #888888 solid;
	border-right: 1px #888888 solid;
	}

/* ######################################################################################################
** ### Formatierung der Kopfbereiches ###################################################################
** ######################################################################################################
*/

#header {
	position:relative;
	height: 150px;
	background: url('../images/header-bg.jpg') repeat-x center top;
}

#header img.logo {
	margin-left: 20px;
}

/* ######################################################################################################
** ### Formatierung der Navigation ######################################################################
** ######################################################################################################
*/

#nav_top {
	position:relative;
	float:right;
	margin:50px 30px 0 0;
}

#nav_main {
	clear:both; width: auto;
	float:right;
	height:30px;
	width:623px;
	position:relative;
	margin:10px 0;
	text-align:left;
	padding-left:0px;
}

/* Commented Backslash Hack
   hides rule from IE5-Mac \*/
#nav_main a {float:none;}
/* End IE5-Mac hack */

#nav_main ul {
  list-style-type:none;
  margin-left:32px;
}

#nav_main ul li {
  float: left;
  text-align: center;
}

#nav_main a {
  color:#ccc;
  background: transparent;
  padding:3px 3px;
  text-transform: none;
  text-decoration:none;
  font-weight:normal;
}

#nav_main a:hover { 
    color:#fff;
    background-color: transparent;
}

#nav_main .current {
  color:#fff;
}

#nav_main .current a {
  color:#fff;
}

/* ######################################################################################################
** ### Inhalts-Bereich ##################################################################################
** ######################################################################################################
*/

#main {
	clear:both; width: auto;
	position: relative;
}


/* ######################################################################################################
** ### Inhalts-Spalten ##################################################################################
** ######################################################################################################
*/

/* Double Float-Margin Bug Hack & Expandierende Boxen im Internet Explorers Hack & IE Italics Problem Hack */
* html #col1 { display: inline; word-wrap: break-word; overflow:visible; }
* html #col2 { word-wrap: break-word; /*overflow:visible;*/ }

/* linke Spalte */
#col1 {
	z-index: 3;
	position: relative;
	float: left;
	width: 240px; /* Standard-Wert, falls keine anderen Vorgaben gemacht werden */
	/* margin-left: 20px; */
}

#col1 IMG.teaserText {
	position: relative;
	margin: 10px 0 20px 28px;
}

/* nur benötigt falls teaserimage ein Bild ist
#col1 IMG.teaserImage {
	position: relative;
	margin: 50px 0 50px 100px;
}
*/

#main #col1 a[href^="http:"],
#main #col1 a[href^="https:"]
{
  padding-left: 12px;
  background:none;
}

/* Rechte Spalte */
#col2 {
	z-index: 1;
	position: relative;
	clear:right;
	width:610px;
	margin-left: 320px; /* Standard-Wert, falls keine anderen Vorgaben gemacht werden */
	/* margin-right: 20px; Standard-Wert, falls keine anderen Vorgaben gemacht werden */
	padding: 0;
	font: 1em Arial, Helvetica, sans-serif;
	color: #EEE;
}

#col2 H1, #col2 H2, #col2 H3 {
	padding: 0 0 0 20px;
	background: url('../images/square_gray.gif') no-repeat left; 
	margin-bottom: 10px;
	color: #EEE;
}

#col2 P {
	padding: 0 0 0 20px;
	color: #EEE;
}

#col2 P.align-right {
	text-align: right;
	padding-right: 10px;
}

#col2 P.align-center {
	text-align: center;
}

#nav_bottom, #nav_bottom a {
	color:#ccc;
}

#nav_bottom {
	clear:both;	/* Backup für IE-Clearing */ 
	text-align: center;
	margin: 20px auto;
	font-size: 85%;
}

/* ######################################################################################################
** ### tt_news ##########################################################################################
** ######################################################################################################
*/

.news-latest-morelink, .news-list-morelink, .news-single-timedata, .news-list-date, .news-list-category, 
P.bodytext{
	font-size: 1em;
}

.news-latest-container, .news-latest-container H2, .news-list-container, .news-list-container H2, .news-list-item, 
.news-list-date, .news-latest-item, .news-single-item, .news-single-backlink, .news-catmenu, .news-single-related {
	margin:0 0 5px 0;
	padding: 0;
	background: transparent;
	background-image: none;
	border: none;
}

.news-catmenu, .news-single-related {
	margin-bottom: 20px;
}

#col2 .news-latest-item H3, #col2 .news-latest-item H3 A, .news-single-backlink, .news-list-category, 
.news-latest-category, #col2 .news-catmenu-ACT, #col2 .news-catmenu-NO, 
.tx-ttnews-browsebox, .news-single-additional-info { 
	margin: 0 0 0 20px;
	padding: 0;
	background: transparent;
	background-image: none;
	font-size: 1em;
	font-weight: normal;
	border: none;
	color: #EEE;
}

#col2 .news-list-item H3, #col2 .news-list-item H3 A { 
	background: transparent;
	/*background-image: none;*/
	font-size: 1em;
	font-weight: normal;
	border: none;
	color: #EEE;
}

#col2 .news-single-category, #col2 .news-single-author, #col2 .news-single-timedata { 
	font-size: 0.8em;
	font-weight: normal;
}

#col2 .news-single-item H3 {
	margin: 0 0 20px 20px;
	padding: 0;
	/*
	background: none;
	background-image: none; 
	font-size: 0.8em;
	*/
	font-weight: normal;
}

.news-list-item, .news-latest-item {
	margin-bottom:10px;
	/* IE7 hack */
	height: auto;
	line-height: 1.3;
	/* IE hack end */
}

#col2 .news-catmenu, #col2 .news-single-additional-info, #col2 .news-single-item H2, .news-single-backlink A { 
	font-size: 1em;
}

.news-single-backlink div { 
	float:right;
	width:50%;
}

/* ausgeblendete Daten */

div.news-list-category, div.news-list-date, div.news-list-morelink, div.news-latest-date, div.news-latest-gotoarchive, .c-recIcon, HR.clearer  {
	display: none;
}

#col2 .news-catmenu-NO {
	font-weight: normal;
	font-size: 1em;
}

#col2 .news-catmenu-ACT {
	font-weight: bold;
	font-size: 1em;
}

.news-list-category, .news-latest-category {
	float: left;
}

#col2 P.news-catmenu-header {
	padding: 0 0 0 30px;
	background: url('../images/square_gray.gif') no-repeat left; 
	margin-bottom: 10px;
	color: #EEE;
	font-size: 1em;
}

.tx-ttnews-browsebox, #col2 .tx-ttnews-browsebox P, #col2 .tx-ttnews-browsebox-SCell P  { 
	padding: 3px;
}

.tx-ttnews-browsebox-SCell {
	background: #5B5B5B;
}

/* ######################################################################################################
** ### Kontaktseite und Kontaktformular #################################################################
** ######################################################################################################
*/

TABLE.kontaktformular, TABLE.kontakt { 
	margin: 0 0 0 20px;
	width: 90%;
}


TABLE.kontaktformular TD, TABLE.kontakt TD { 
	padding: 2px;
	margin: 2px;
	vertical-align:top;
}

/* Popup-Kalender über alle Elemente legen */
#page_kontaktformular div.calendar { 
	z-index: 100;
}

body .calendar { 
	color: #333;
}

#col2 H2.error {
	color: #C00;
}

/* ######################################################################################################
** ### Formular Rechtberatung ###########################################################################
** ######################################################################################################
*/

.csc-mailform-field {
	text-align: right;
	width: 85%;
	padding: 5px 0;
}

.csc-mailform-field LABEL {
	float: left;
	text-align: left; 	
}

.csc-mailform-field INPUT.csc-mailform-check {
	float: left;
	margin-left: 100px;
}

/* ######################################################################################################
** ### Formular Unterhaltsberechnung ####################################################################
** ######################################################################################################
*/

.error {
	color: #C00;
	font-weight: bold;
}

div.error {
	padding: 10px;
	margin-bottom: 20px;
	border: 1px #C00 solid;
	background-color: #ddd;
}

table.TabelleAngaben {
	margin: 0 0 1em 20px;
}

table.TabelleAngaben td {
	padding: 2px;
}

.hilfetext {
	padding: 5px;
	border: 1px #fff solid;
}

/* ######################################################################################################
** ### Formular Kostenrechner ###########################################################################
** ######################################################################################################
*/

TABLE.kostenrechner { 
	margin: 0 0 0 30px;
	width: 90%;
}

/* ######################################################################################################
** ### Formatierung der Fußzeile ########################################################################
** ######################################################################################################
*/

#footer { 
	clear:both;	/* Backup für IE-Clearing */ 
	text-align: center; 
	height: 40px;
	min-height: 0px; /* IE  */
	position: relative; /* required */ 
	margin-top: -0px;
	background: url('../images/footer-bg.jpg') repeat-x center top;
	padding-top: 18px;
}

#footer img {  
	/*margin-top: 25px;*/
}

/* Ungeordnete Listen ohne Listenpunkt */ 
ul.linklist { list-style-type: none; margin: 0 0 1em 0; }
ul.linklist li { margin: 0 0 1em 0; }


/* ######################################################################################################
** ### Formatierung des Teasers der Startseite ##########################################################
** ######################################################################################################
*/

#page_1 #col2, #page_1 #col2 p {width: 960px; margin-left:0px; text-align:center;}

#teaser {
	z-index: 1;
	text-align:center;
	position: relative;
	margin-top: 20px;
	#margin-left: 250px;
	width:480px;
	height: 190px;
}

#teaser div {float:left; width: auto; margin-right: 1em; }
#startseite #header {text-align:center;}

/* ######################################################################################################
** ### Formatierung der Rubriken-Farben #################################################################
** ######################################################################################################
*/

/* Information #E3D79B #F7ECAE */

/*#page_6 a, .parent_6 a {color: #E3D79B;}*/
#page_6 a:hover, .parent_6 a:hover {color: #FFF;}
#page_6 #nav_main a {color: #cccccc;}
#page_6 #col2 h1, #page_6 #col2 h2, #page_6 #col2 h3,
 .parent_6 #col2 h1, .parent_6 #col2 h2, .parent_6 #col2 .news-list-item h3, .parent_6 #col2 h3, 
 .parent_6 #col2 p.news-catmenu-header, 
 .parent_7 #col2 h1, .parent_27 #col2 h1, .parent_28 #col2 h1, .parent_33 #col2 h1 
 {background: url('../images/square_E3D79B.gif') no-repeat left;}
#page_6 #col2 h1, .parent_6 #col2 h1, .parent_7 #col2 h1,
 .parent_27 #col2 h1, .parent_28 #col2 h1, .parent_33 #col2 h1 {border-bottom:1px solid #E3D79B;}
#page_6 #col2 .news-single-item h3, .parent_6 #col2 .news-single-item h3 {background-image:none;}
#page_6 #nav_main, #page_6 #nav_main a:hover, .parent_6 #nav_main, .parent_6 #nav_main a:hover {color:#E3D79B;}
#page_6 #nav_main span.current, .parent_6 #nav_main span.current {padding:2px 4px; color:#555; background-color:#E3D79B;}

/* Online-Rechtsberatung #488866 */

/*#page_4 a, .parent_4 a {color: #488866;}*/
#page_4 a:hover, .parent_4 a:hover {color: #FFF;}
#page_4 #nav_main a {color: #cccccc;}
#page_4 #col2 h1, #page_4 #col2 h2, #page_4 #col2 h3, 
 .parent_4 #col2 h1, .parent_4 #col2 h2, .parent_4 #col2 h3, 
 .parent_4 #col2 p.news-catmenu-header {background: url('../images/square_488866.gif') no-repeat left;}
#page_4 #col2 h1, .parent_4 #col2 h1 {border-bottom:1px solid #488866;}
#page_4 #col2 .news-single-item h3, .parent_4 #col2 .news-single-item h3 {background-image:none;}
#page_4 #nav_main, #page_4 #nav_main a:hover, .parent_4 #nav_main, .parent_4 #nav_main a:hover {color:#488866;}
#page_4 #nav_main span.current, .parent_4 #nav_main span.current {padding:2px 4px; color:#ddd; background-color:#488866;}

/* Internet-Scheidung #C72F3C */

/*#page_5 a, .parent_5 a {color: #C72F3C;}*/
#page_5 a:hover, .parent_5 a:hover {color: #FFF;}
#page_5 #nav_main a {color: #cccccc;}
#page_5 #col2 h1, #page_5 #col2 h2, #page_5 #col2 h3, 
 .parent_5 #col2 h1, .parent_5 #col2 h2, .parent_5 #col2 h3, 
 .parent_44 #col2 h1, .parent_44 #col2 h2, .parent_44 #col2 h3,  
 .parent_5 #col2 p.news-catmenu-header {background: url('../images/square_C72F3C.gif') no-repeat left;}
#page_5 #col2 h1, .parent_5 #col2 h1 {border-bottom:1px solid #C72F3C;}
#page_5 #col2 .news-single-item h3, .parent_5 #col2 .news-single-item h3 {background-image:none;}
#page_5 #nav_main, #page_5 #nav_main a:hover, .parent_5 #nav_main, .parent_5 #nav_main a:hover {color:#C72F3C;}
#page_5 #nav_main span.current, .parent_5 #nav_main span.current {padding:2px 4px; color:#ddd; background-color:#C72F3C;}

/* Verkehrsrecht #E5B64E */

/*#page_39 a, .parent_39 a {color: #E5B64E;}*/
#page_39 a:hover, .parent_39 a:hover {color: #FFF;}
#page_39 #nav_main a {color: #cccccc;}
#page_39 #col2 h1, #page_39 #col2 h2, #page_39 #col2 h3, 
 .parent_39 #col2 h1, .parent_39 #col2 h2, .parent39 #col2 h3, 
 .parent_39 #col2 p.news-catmenu-header {background: url('../images/square_E5B64E.gif') no-repeat left;}
#page_39 #col2 h1, .parent_39 #col2 h1 {border-bottom:1px solid #E5B64E;}
#page_39 #col2 .news-single-item h3, .parent_39 #col2 .news-single-item h3 {background-image:none;}
#page_39 #nav_main, #page_39 #nav_main a:hover, .parent_39 #nav_main, .parent_39 #nav_main a:hover {color:#E5B64E;}
#page_39 #nav_main span.current, .parent_39 #nav_main span.current {padding:2px 4px; color:#ddd; background-color:#E5B64E;}

/* Mediation #349B9A */

/*#page_40 a, .parent_40 a {color: #349B9A;}*/
#page_40 a:hover, .parent_40 a:hover {color: #FFF;}
#page_40 #nav_main a {color: #cccccc;}
#page_40 #col2 h1, #page_40 #col2 h2, #page_40 #col2 h3, 
 .parent_40 #col2 h1, .parent_40 #col2 h2, .parent_40 #col2 h3, 
 .parent_40 #col2 p.news-catmenu-header {background: url('../images/square_349B9A.gif') no-repeat left;}
#page_40 #col2 h1, .parent_40 #col2 h1 {border-bottom:1px solid #349B9A;}
#page_40 #col2 .news-single-item h3, .parent_40 #col2 .news-single-item h3 {background-image:none;}
#page_40 #nav_main, #page_40 #nav_main a:hover, .parent_40 #nav_main, .parent_40 #nav_main a:hover {color:#349B9A;}
#page_40 #nav_main span.current, .parent_40 #nav_main span.current {padding:2px 4px; color:#ddd; background-color:#349B9A;}

/* Kontakt #AD4F1C */

/*#page_8 a, .parent_8 a {color: #AD4F1C;}*/
#page_8 a:hover, .parent_8 a:hover {color: #FFF;}
#page_8 #nav_main a {color: #cccccc;}
#page_8 #col2 h1, #page_8 #col2 h2, #page_8 #col2 h3, 
 .parent_8 #col2 h1, .parent_8 #col2 h2, .parent_8 #col2 h3 {background: url('../images/square_AD4F1C.gif') no-repeat left;}
#page_8 #col2 h1, .parent_8 #col2 h1 {border-bottom:1px solid #AD4F1C;}
#page_8 #col2 .news-single-item h3, .parent_8 #col2 .news-single-item h3 {background-image:none;}
#page_8 #nav_main, #page_8 #nav_main a:hover, .parent_8 #nav_main, .parent_8 #nav_main a:hover {color:#AD4F1C;}
#page_8 #nav_main span.current, .parent_8 #nav_main span.current {padding:2px 4px; color:#ddd; background-color:#AD4F1C;}