/*(c) TN com2 GmbH 2005*/
.header{}
/* --------------------------------------------------------------------
							HTML TAGS
 --------------------------------------------------------------------*/
html, body, textarea {font-family: Arial, Helvetica, sans-serif; color: #000;}
body {font-size: .75em;} td {_font-size: .75em; _f\ont-size: 100%;}
input, textarea, select {font-size: 100%;}


html, body { height: 100%; margin: 0; padding: 0; }

body { background: #fff url(../images/chrome/pagebg.gif) repeat-y;}

input:focus, SELECT:focus, TEXTAREA:focus { border: 1px solid #df002b; }
input, select, textarea { border: 1px solid #ccc; }

form {margin:0px; display: inline}/* entfernen des abstandes bei Form-Elementen */
th {text-align: left; font-weight: 700; }
img {border:none;}

/*  allgemeine HEADliNE-Styles -  Größe bezieht sich immer auf Elternelement */
h1 {display: inline; margin: 0; padding: 0;}
h2 {font-size: 1.1em; font-weight: bold; color: #000; margin: 0 0 21px 0; text-transform: uppercase;  font-family: Trebuchet MS, Helvetica, sans-serif;}
#leftBottom h2, #rightCol h2 { border-bottom: 1px solid #ccc; line-height: 90%; vertical-align: baseline; padding: 0; margin-top: 10px; }
#leftBottom h2 { margin: 10px 0 5px 0; }
h3 {font-size: 1em; font-weight: bold; color: #df002b; margin: 0 0 21px 0;  font-family: Trebuchet MS, Helvetica, sans-serif;}
h4 {font-size: 1em; font-weight: bold; color: #000; margin: 0; clear: both; display: inline;  font-family: Trebuchet MS, Helvetica, sans-serif;}
h5 {font-size: 1em; font-weight: bold; color: #616161; margin-bottom: 0; clear: both;  font-family: Trebuchet MS, Helvetica, sans-serif;}


hr{ height:1px; color: #D8D7D6; background: #D8D7D6; border: none}
legend { color: #6C6969; }
/* -------------------------------------------------------------------------------
							STANDARD CLASSES
 -------------------------------------------------------------------------------------*/

.smaller {font-size:.8em;} /* bezieht sich immer auf Elternelement */
.failed { color: #df002b;}  /* für FORM eingabe-validierung */

.dachberatung { display: none;}
.dachdeckereinkauf { display: none;}

a:link, a:visited { color : #000; text-decoration: none; font-weight: bold;}
a:hover, a:active { color: #df002b;}	


/* ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~ TABELLEN ~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/

caption { font-size: 1em; font-weight: bold; color: #df002b; font-style: italic; text-align: left; }

table.optic1 { width: 524px; border-collapse: separate; }
table.optic1 td, table.optic1 th{ border-collapse: separate; }
table.optic1 thead th{
	border-bottom: 2px solid #000;
	border-top: 1px solid #cecdcd;
	background: #cecece url(../images/table-head.gif);
	padding: 3px;
}
table.optic1 TD, table.optic1 TH {
	border-bottom: 1px solid #CECDCD;
	padding: 3px;
}
table.optic1 TFOOT{
	background-color: #ececec;
	font-size: .9em;
}
table.optic1 A:link, table.optic1 A:visited,
table.optic1 A:hover, table.optic1 A:active { color: #6C6969; font-weight: bold; text-decoration: none;}

table.optic1 A:hover, table.optic1 A:active, table.optic1 A:focus { text-decoration: underline;}

table.optic1 td.header{
	border-bottom: 2px solid #000 !important;
	border-top: 1px solid #cecdcd;
	background: #cecece url(../images/table-head.gif);
	padding: 3px;
	text-align: left; 
	font-weight: 700;
}

div.news p{ margin-bottom: 5px;} /*news rechts auf der homepage*/
div.news strong {color: #0f4b7b}

p.box {
	border: 1px solid #ccc;
	text-transform: uppercase;
	font-weight: bold;
	font-family: Trebuchet MS, Helvetica, sans-serif;
	padding: 5px;
} /*boxen rechts auf der homepage*/
	p.box img{ margin: 0 auto; display: block;}
	
img.rechts {
	float: right;
	border: 1px solid #0f4b7b;
	margin: 0 0 10px 10px;
}

img.links {
	float: left;
	border: 1px solid #0f4b7b;
	margin: 0 10px 10px 0;
}

/* ----------------- news anzeige im Presse-bereich --------------------*/

#listedNews h3 { margin-bottom: 0; clear: left;}
	#listedNews hr { clear: right; }
	#listedNews p.image { float: right; margin: 0 0 3px 5px; }
	#listedNews p.image img { border: 1px solid #D8D7D6;}


/*~###################################################################################################
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
                         								LAYOUT
----------------------------------------------------------------------------------------------------*/								

#upperHead{ background: #fff;  font-family: Trebuchet MS, Helvetica, sans-serif;} /*streifen oberhalb des bildbereichs*/
	#upperHead ul { float:right; margin: 2px; padding: 0;} /*func-nav*/
		#upperHead ul li { display: inline; }
		#upperHead ul #searchLI { padding: none; margin: none; }
			#upperHead ul a:link, #upperHead ul a:visited, #upperHead ul a:hover, #upperHead ul a:focus, #upperHead ul a:active {
				text-transform: uppercase; font-weight: bold; font-size: .9em; text-decoration: none;
			}
			#upperHead ul a:hover, #upperHead ul a:focus, #upperHead ul a:active { color: #df002b; }
			#upperHead input{ background: #f2f2f2; }

	
#head{
	background: #f2f2f2 url(../images/chrome/headbg.jpg) repeat-x;
} /*bildbereich*/
#mainTable{ border-collapse: separate; border: none; width: 985px;} /*tabelle, die die 3 spalten beinhaltet*/
	#mainTable td{ border-collapse: separate; border: none; vertical-align: top; }
	#menu{ width: 250px; }/*hauptnav*/
		#menu ul{ margin: 7px 11px; padding: 0; list-style: none; font-family: Trebuchet MS, Helvetica, sans-serif; }
			#menu ul li{ margin: 0; padding: 0; display: inline; position: relative; _position: static; /*für positionierung layer moz*/}
			#menu ul li:hover, #menu ul li.hover { _position: relative; /*für positionierung layer ie*/}
				#menu ul a:link, #menu ul a:visited, #menu ul a:hover, #menu ul a:active {
					padding: 4px 4px 4px 10px;
					display: block;
					line-height: 100%;
					text-decoration: none;
					text-transform: uppercase;
					font-weight: bold;
					background: transparent url(../images/chrome/nav1bg.gif) -50px 0 no-repeat;
				}
				#menu ul li.active a:link, #menu ul li.active a:visited, #menu ul li.active a:hover, #menu ul li.active a:active,
				#menu ul a:hover, #menu ul a:active, #menu ul a:focus {
					color: #df002b;
					background-position: 0 center;
				}
				#menu ul li:hover a:link, #menu ul li:hover a:visited, #menu ul li:hover a:hover, #menu ul li:hover a:active,
				#menu ul li.hover a:link, #menu ul li.hover a:visited, #menu ul li.hover a:hover, #menu ul li.hover a:active {
					background-color: #e0e0e0; /*soll nur beim hovern sein*/
				}
		
/* 2te ebene */
					#menu li ul{
						left: 215px;
						_left: 205px;
						top:-7px;
						=top:-4px;
						z-index: 10;
						display: none;
						position: absolute;
						width: 192px;
						background: #e0e0e0;  
						wborder: 1px solid #ccc;
					} /*zweite nav-ebene*/
					
					#menu li.active ul{
						margin: 0 11px 7px 25px;
						display: block;
						position: static;
						width: auto;
						background: none;
						border: none;
					} /*zweite nav-ebene als Layer*/
						#menu li:hover ul, #menu li.hover ul{display: block;  } /*aufkjlappen der 2ten ebene beim mouse-over*/
						#menu li.wait:hover ul{display: none;  } /*warte auf js-basiertes timeout-hover*/
						#menu li li{ position: static; display: inline;}

							#menu li li a:link, #menu li li a:visited, #menu li li a:hover, #menu li li a:active,
							#menu li.active li a:link, #menu li.active li a:visited, #menu li.active li a:hover, #menu li.active li a:active, 
							#menu li:hover li a:link, #menu li:hover li a:visited, #menu li:hover li a:hover, #menu li:hover li a:active,
							#menu li.hover li a:link, #menu li.hover li a:visited, #menu li.hover li a:hover, #menu li.hover li a:active {
								background: transparent url(../images/chrome/nav1bg.gif) -50px center no-repeat;
								color: #000;
							}
							#menu li li.active a:link, #menu li li.active a:visited, #menu li li.active a:hover, #menu li li.active a:active, 
							#menu li li a:hover, #menu li li a:active, #menu li li a:focus {
								color: #df002b !important;
								wbackground-position: 0 center !important;
							}

/* 3te ebene */
								#menu ul ul ul {display: none !important;  } /* 3te ebene  wird nie angezeigt.. ausser: */
								#menu li li.active ul {display: block !important;  } /* :wenn li darüber active ist */
							
									#menu li li li a:link, #menu li li li a:visited, #menu li li li a:hover, #menu li li li a:active{
										text-transform: none;
										font-weight: normal;
										padding: 1px;
									}

									#menu li li.active li a:link, #menu li li.active li a:visited, #menu li li.active li a:hover, #menu li li.active li a:active {
										color: #000 !important; /* reset der farbe auf standard*/
									}
									#menu li li.active li a:hover, #menu li li.active li a:active {
										color: #df002b !important; /* hover in 3ter ebene */
									}
									#menu li li li.active a:link, #menu li li li.active a:visited, #menu li li li.active a:hover, #menu li li li.active a:active {
										color: #df002b !important; /* active in 3ter ebene */
										font-weight: bold;
									}
									

							
					
		
	
	#leftBottom {
		clear: left;
		margin-top: 25px;
		vertical-align: bottom;
		padding: 0 21px !important;
		color: #616161; font-size: .9em;
		
	}	
	#leftBottom input{ width: 165px; margin-bottom: 5px;}
	#leftBottom input.button{
	 	wmargin-bottom: 3px;
		height: 17px;
		width: auto;
		margin-left: 2px;
		background: #ececec !important;
		border: 1px solid #c5c5c5  !important;
		-moz-border-radius: 0;
		font-weight: bold;
		font-family: Trebuchet MS, Helvetica, sans-serif;
	}


	#content { padding: 10px 15px; }/*data*/
	#rightCol{ width: 210px; } /*teaser, news etc auf homepage*/





/*======================= CSSFORMS: Breiten der spalten ================================*/

.cssForm fieldset{width: 490px;} /* [A]*/
.cssForm label { width: 120px;} /* [B] */
.cssForm .rightCol {padding-left:125px; /* [B]+5px */ width: 350px; /* [A]-20-[B]=[C] */}
.cssForm input, .cssForm select,
.cssForm textarea, .cssForm .exInput,
.cssForm .exTextarea { width: 350px; /* [C] */ }

 /* TWINROW: eine zeile beinhaltet label>input>label>input */
.cssForm .twinRow input, .cssForm .twinRow select,
.cssForm .twinRow textarea, .cssForm .twinRow .exInput,
.cssForm .twinRow .exTextarea { width: 91px; /* ([C]-[B]-18)/2 */ margin-right: 10px; _margin-right: 9px;  }

.cssForm .assignment select {width: 200px;}

/*======================= CSSFORMS: Optik der Buttons ================================*/

input.button {
	font-weight: normal;
	-moz-border-radius: 3px;
	color: #000;
	background: #DFDFD9 url(../images/chrome/cssf_btnbg.gif) !important;
	border: 1px solid #B0B1AE !important; /*A5ACB2 ist WinXP Style*/
	padding:0;
	margin: 0;
}


			
/*#####################################################################################################
                                    SPECIAL FÜR TEXTBROWSER
------------------------------------------------------------------------------------------------------*/	

.textonly{	display:none;} /* Element erscheint nur, wenn im Textbrowser.. */