/* ######################################################################################################
** # www.kuehl-beschallung.de ###########################################################################
** ######################################################################################################
** 
**  Dateiversion: 07.05.06 
**  letztes Update: 08.05.06   
**  Datei       : content.css
**  Funktion    : Formatierung der Inhalte (Texte, Grafiken, Links, Listen, Tabellen usw.)
**
*/

body { font-family: Verdana, Helvetica, Arial, sans-serif; }

h1,h2,h3,h4 {font-family: Verdana, Arial, sans-serif; line-height: 1.2em;}

h1 {font-size: 1.7em; font-weight: normal; color: #003F8E;  margin: 0.4em 0 1em 0; }
html > body h1 {margin-top: 0; }
h2 {font-size: 1.0em; font-weight:bold; color: #FF6D05; margin: 0.3em 0 0.2em 0; letter-spacing: 0.1em;}
h3 {font-size: 1.0em; font-weight:bold; color: #000; margin:0.4em 0 0.3em 0;}
h4 {font-size: 1.0em; font-weight:bold; color: #888; margin:0.4em 0 0.3em 0; border-bottom: 1px #ccc solid;}

#col2_content h1 { color: red; font-family: Arial, Helvetica, Verdana, sans-serif; }
#col2_content h2 { color: #003F8E; font-size: 120%; font-weight: bold; margin: 2px 8px 1px 12px; padding: 0; letter-spacing: 0em;}
#col1_content h3 { color: #000; font-size: 100%; margin: 15px 0 0 0;}

#col1_content h1.news-index {margin: 0 0 0.7em 0; }
#col1_content h1.referenz-index { font-size: 1.5em; float: right; width: 514px; text-align: left; margin: -4px 0 0.1em 0; }

ul {line-height: 1.5em;}
p {line-height: 1.5em; margin: 0 0 1em 0; }


#col1_content p {
	line-height: 170%;
}

#col2_content p {
	padding: 0 15px 10px 12px;
	margin: 0;
}

#col1_content p.news-index {padding: 0; margin: 0 0 20px 0;}
#col1_content p.news-einleitung {font-weight: bold;}
#col1_content p.referenz-index {padding: 0; margin: 0 0 0 120px; font-size: 95%;}
#col2_content p.abbildung {margin-top: -7px;} 

.gallery p {font-size: 90%; margin: 10px 0 0 0;}
.panorama p {font-size: 90%; margin: 18px 0 0 0;}

/* diverse Breiten - die in verschiedenen Bereichen zur Anwendung kommen */
.width50 {width: 50px;}
.width170 {width: 170px;}
.width200 {width: 200px;}
.width230 {width: 230px;}
.width250 {width: 250px;}
.width280 {width: 280px;}
.width360 {width: 360px;}
.width430 {width: 430px;}
.width460 {width: 470px;}

span.datum {
	font-size: 80%;
	line-height: 130%;
	color: #818181;
}

#col2 span.datum {color: #5F5F5F; display: none;}

strong,b {font-weight: bold;}
em,i { font-style:italic; }


hr { 
	width: 99%; 
	display: block; clear: both;
	margin: 19px 0 27px 0; 
	background-color: #FFF; 
	border-top: 1px solid #EDB679; border-left: none; border-right: none; border-bottom: none; 
	color: #FFF; font-size: 1px; line-height: 1px; 
}

acronym, abbr {
	letter-spacing: .07em;
	border-bottom: 1px dashed #c00;
	cursor: help;
}

#col1_content ul	{ 	
	line-height: 170%; 
	list-style-image: url("../../gfx//bullet-01.gif");
	margin: 12px 15px 15px 10px; padding: 2px 15px 2px 10px; 
	}

#col1_content ul li {margin-bottom: 0.4em; background-image: none;}

ul.linklist {
 list-style-type: none;
}

ul.linklist li {margin:0;}


/* Thumbnail Ansichten Referenzen */

div.gallery {
	float: left;
	width: 260px;
}

#col1 div.panorama {
	clear: both;
	padding: 5px 0 15px 0;
	width: 100%;
}

/* ######################################################################################################
** ### Bildpositionierung links- und rechtsbündig als Fließobjekte ######################################
** ######################################################################################################
*/

img {
	border: none;
}

img.news-index, img.referenz-index {
	float: left;
	margin-top: 0; margin-bottom: 2em;
	border:0;
}

.gallery img {
	margin-top: -5px;
}

.panorama img {
	margin-top: -5px;
}

/* Abbildungen in der rechten Spalte */

#col2_content p.abbildung img {
	border: 2px solid #F4D2AC;
}

#col2 #col2_content img.abbildung:hover {
	border: 2px solid #FFF;
}

/* ######################################################################################################
** ### Auszeichnung lokaler und Externer Links ##########################################################
** ######################################################################################################
*/

#col1 a {color: #013D7B;}
#col1 a:visited {color: #526B81; }

#col2_content a, #col2_content a:visited {
	color: #013D7B;
	display: block; margin: 5px 0 0 10px;
}

#col2_content p a, #col2_content p a:visited {
	display: inline; margin: 0;
}

#col1_content a:active, #col1_content a:hover, #col1_content a:focus,
#col2_content a:active, #col2_content a:hover, #col2_content a:focus {
	color: #D42E08;
}

#header a, #header a:visited, col3 a, col3 a:visited {
	text-decoration: none;
}

#col2_content p.abbildung a, #col2_content p.abbildung a:visited  {
	display: block; margin-top: 3px; text-align:center; width: 100%;
}

div.gallery a.link-zoom, div.gallery a:visited.link-zoom {
	width: 100%; display: block;
}

#col1 div.panorama a, #col1 div.panorama a:visited {
	width: 100%;
	display: block;
}

/* ######################################################################################################
** ### Formulare ########################################################################################
** ######################################################################################################
*/

/* Kontaktformular */

#col1 form {
	clear: both;
	margin-bottom: 1em;
}

#col1 input
 {
	margin-top: 0.8em;
	height: 1.2em; padding: 1px 0 0 3px;
	line-height: 1.5em; font-size: 120%;
	background: #FAFAFA;
	border: 1px solid #F0B06A;
}

#col1 select#anrede {
	margin-top: 0.8em;
	width: 9em;
	padding:0;
	font-size: 120%;
}

#col1 input:focus {
	margin-top: 0.8em; padding-left: 3px;
	border: 1px dotted #000000;
	background: #FFF;
	font-size: 120%;
}

#col1 textarea {
	margin-top: 0.8em; padding: 0.3em;
	background: #FAFAFA;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	border: 1px solid #F0B06A;
	font-size: 1em; line-height: 1.3em;
}

#col1 textarea:focus {
	background-color: #FFFFFF;
	background-image: none;
	border: 1px dotted #000000;
}

.pflichtfeld {color: #FF0033; cursor: help }

#col1 input.checkbox {
	_background: #FFFFFF;
	border-style: none;
}

#col1 legend {
	font-weight:bold;
	padding: 0.4em;
	text-align:center;
	color: #3D3D3D;
}

#col1 fieldset {
	border: 1px solid #ccc;
	padding-bottom: 1em;
	display: block;
	width: 490px;
	margin: 1.5em 0 1em;
	padding: 8px 0 25px 8px;
}

#col1 label	{
	float: left;
	text-align: right;
	width: 8em;
	margin-right: .5em;
	margin-top: 1em;
	cursor: pointer;
}

#col1 label.no-float	{float: none;}

#col1 form br	{ clear:left;}

#col1 fieldset.button {
	width: 490px;
	text-align: center;
	padding-top: 1em;
	padding-bottom: 1em;
	margin: 0px;
}

#col1 .button .submitter {
	margin: 7px auto;
	display: block;
	width: 8em;
	border-color: #FFF #777 #777 #FFF;
	background: #FECB9B;
	font-size: 115%; padding-top: 1px; line-height: 0.8em; height: 1.8em;
	cursor: pointer;
}

#col1 #col1_content input.mail-error, #col2 #col2_content input.mail-error {
	border: 1px solid red;
}

p.mail-error {color: #CA0000;}

#col1 pre, #col2 pre {font-size: 12px; color: #000;}

div.mail-return {
	padding: 3px 7px 4px 7px; 
	font-family: "Courier New", Courier, monospace; font-size: 12px; 
	border: 1px solid #F0B06A;
	background: #FFF;
}

#col1 #col1_content a.formstart, #col1 #col1_content a.formstart:visited, #col2 #col2_content a.formstart, #col2 #col2_content a.formstart:visited{
	border: none; text-decoration: none; display: inline; background: none;
}