/* ====================================================================
   Sauerland-Design
   Projekt: MarsSolar GmbH
   Dokument: basic.css
   Autor: Pascal Vorsmann
   erstellt: 2009-09-18
===================================================================== */
img, div, td { behavior: url(../jscripte/iepngfix.htc) }
*{
	margin:0px;
	padding:0px;
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
}
body {
	margin: 0px;
	background:transparent url(../images/hg_body.gif) top left repeat-x;
}
h1{
	font-size:16px;
	margin-bottom:15px;
}
h1.startseite{
	font-size:20px;
}
h2{
	font-size:14px;
	color:#9d003e;
}
h2.uline{
	padding-bottom:5px;
	margin:25px 0 10px 0;
	border-bottom:1px solid #bbbbbb;
}
a.more{
	color:#9d003e;
	background:#fcbf04 url(../images/hg_more.gif) right 5px no-repeat;
	padding:0 18px 0 3px;
	line-height:20px;
	font-size:11px;
	font-weight:bold;
	text-decoration:none;
}
a.morewhite{
	color:#9d003e;
	background:#ffffff url(../images/hg_more.gif) right 5px no-repeat;
	padding:0 18px 0 3px;
	line-height:20px;
	font-size:11px;
	font-weight:bold;
	text-decoration:none;
}
a.download{
	color:#9d003e;
	background:#fcbf04 url(../images/hg_download.gif) right 5px no-repeat;
	padding:0 18px 0 3px;
	line-height:30px;
	font-size:11px;
	font-weight:bold;
	text-decoration:none;
}
a.arrowback{
	color:#9d003e;
	background:#ffffff url(../images/arrow_back.gif) left 5px no-repeat;
	padding:0 3px 0 18px;
	line-height:20px;
	font-size:11px;
	font-weight:bold;
	text-decoration:none;
}
a.more2{
	color:#9d003e;
	background:#fcbf04;
	padding:0 3px 0 3px;
	line-height:20px;
	font-size:11px;
	font-weight:bold;
	text-decoration:none;
}
a.print{
	display:block;
	line-height:21px;
	height:21px;
	font-size:11px;
	text-decoration:none;
	margin-top:30px;
	background:#9d003e url(../images/btn_print.gif) 411px 4px no-repeat;
	padding:0 20px 0px 435px;
	text-transform:uppercase;
	color:#ffffff;
}
.pink{
	color:#9d003e;
}
p.mini{
	font-size:10px;
}
/* ====================================================================
   AUFBAU GRUNDGERÜST
===================================================================== */
div#container{
	margin:0 auto;
	width:985px;
	height:202px;
	background:transparent url(../images/hg_top.jpg) top center no-repeat;
	}
	div#container div#logo{
		position:absolute;
		margin-top:18px;
		margin-left:21px;
		width:271px;
		height:81px;
	}
	div#container div#page{
		position:absolute;
		width:965px;
		margin:104px 10px 20px 10px;
	
		}
		div#container div#page div#content{
			padding:10px;
			background:#ffffff;
			border:1px solid #bbbbbb;
			}
			div#container div#page div#content div#moodbild img{
				border:1px solid #bbbbbb;
			}
			div#container div#page div#content div#inhalt{
				margin:10px 0 0 0;
				min-height:200px;
				height:auto !important;
				height:200px;
				background:transparent url(../images/hg_content.jpg) top left repeat-y;
			}
		div#footer{
			text-align:center;
			color:#9d003e;
			font-weight:bold;
			padding:20px 0 20px 0;
		}
/* ====================================================================
   AUFBAU INHALTSSPALTEN
===================================================================== */
#colLeft{
	float:left;
	width:205px;
	margin-right:20px;
	}
	#colLeft .bereich{
		background:transparent url(../images/hg_bereich.jpg) top left repeat-y;
		border-bottom:1px solid #ffffff;
		font-size:16px;
		text-transform:uppercase;
		color:#8c2320;
		text-align:right;
		display:block;
		padding:10px;
	}
	#colLeft .headline{
		text-align:right;
		color:#9d003e;
		text-transform:uppercase;
		font-weight:bold;
		overflow:hidden;
		padding-right:14px;
		margin-top:24px;
	}
	#colLeft .line{
		height:3px;
		background:transparent url(../images/line_dotted_h3.gif) top left repeat-x;
	}
	#colLeft .box{
		background:#fafafc url(../images/line_dotted_h3.gif) bottom left repeat-x;
		padding:9px 14px 0px 2px;
		text-align:right;
	}
	#colLeft .box p, #colLeft .box strong{
		padding-bottom:10px;
		font-size:11px;
	}
#colCenter{
	float:left;
	width:495px;
	margin-right:20px;
	font-size:11px;
	}
	#colCenter div, #colCenter p, #colCenter a, #colCenter strong{
		font-size:11px;
	}
	#colCenter a{
		color:#9d003e;
		text-decoration:none;
	}
	/* referenzen Aktiv Link */
	#colCenter a:hover, #colCenter a.active{
		text-decoration:underline;
	}
	#colCenter a.active{
		font-weight:bold
	}
	/* Drucken Link */
	#colCenter a.print{
		color:#ffffff;
	}
	#colCenter .box{
		background:transparent url(../images/line_dotted_h.gif) bottom left repeat-x;
		padding-bottom:5px;
		float:left;
		width:239px;
		}
		#colCenter .box .headline{
			line-height:24px;
			overflow:hidden;
			background:transparent url(../images/hg_box_headline.gif) top left repeat-x;
			padding-left:2px;
			text-transform:uppercase;
		} 
		#colCenter .box img {
			margin:1px 0 10px 0;
		}
		#colCenter .box p{
			margin:0 0 10px 0;
			font-size:11px;
		}

#colRight{
	float:left;
	width:190px;
	padding-left:10px;
	background:transparent url(../images/line_dotted_v.gif) left top repeat-y;
	}
	#colRight .box{
		background:transparent url(../images/line_dotted_h.gif) bottom left repeat-x;
		padding-bottom:5px;
	}
	#colRight .box .headline{
		margin-top:15px;
		text-transform:uppercase;
		color:#9d003e;
		padding-bottom:3px;
		font-weight:bold;
		background:transparent url(../images/line_dotted_h.gif) left bottom repeat-x;
	}
	#colRight .box p, #colRight .box strong{
		margin-top:10px;
		font-size:11px;
	}
/* ====================================================================
   BEREICH FAQ
===================================================================== */
div#faqs h1.accordion_toggle{
	outline: none;
	display: block;
	margin:0px;
	padding:0px;
	font-size:11px;
	font-weight:bold;
	margin:9 0 0 0px;
	border-top:1px solid #bbbbbb;
	cursor:pointer;
	background:transparent url(../images/pink_arrow.gif) 2px 15px no-repeat;
}
div#faqs h1.accordion_toggle_active {
	color:#9d003e;
}
.accordion_content {
	background-color:#ffffff;
	overflow: hidden;
}

/* ====================================================================
   BEREICH A-Z
===================================================================== */
div#a-z{
	line-height:40px;
	margin-top:24px;
	padding-left:3px;
	border-top:1px solid #bbbbbb;
	border-bottom:1px solid #bbbbbb;
}
div#a-z a{
	font-size:14px;
	font-weight:bold;
	text-decoration:none;
	padding-right:6px;
	color:#000000;
}
div#answers a:hover{
	color:#9d003e;
	text-decoration:none;
}
div#answers .anchor{
	margin:9px 0 10px 0px;
	height:26px;
	line-height:26px;
	text-align:center;
	background:transparent url(../images/service/a-z/hg_char.gif) top left no-repeat;
}
div#answers .anchor a{
	font-size:18px;
	font-weight:bold;
	text-decoration:none;
	color:#9d003e;
}
div#answers .answer{
	margin-bottom:20px;
}
/* ====================================================================
   AUFLISTUNG für Sonnenrente
===================================================================== */
div.list{
	height:26px;
	line-height:26px;
	border-top:1px solid #bbbbbb;
	padding-left:8px;
	overflow:hidden;
	font-weight:bold;
	font-size:11px;
	background:transparent url(../images/hg_auflistung.gif) top left repeat-x;
}
div.list span{
	font-size:11px;
}
/* ====================================================================
   AUFLISTUNG für Unabhängig von Herstellern
===================================================================== */
div.list2{
	height:26px;
	line-height:26px;
	border-top:1px solid #bbbbbb;
	text-align:center;
	overflow:hidden;
	font-weight:bold;
	font-size:11px;
	color:#9d003e;
	background:transparent url(../images/hg_auflistung2.gif) top left no-repeat;
}
div.list2 span{
	font-size:11px;
}
/* ====================================================================
   LISTE mit schwarzem Pfeil Bsp. für Solarcheck
===================================================================== */
ul.blackarrow {
	margin: 0;
	padding: 0;
	list-style-type:none;
}
ul.blackarrow li {
	margin: 0;
	padding: 0 0 0 10px;
	background:transparent url(../images/black_arrow.gif) 2px 5px no-repeat;
	font-size:11px;
	font-weight:bold;
}
/* ====================================================================
   Formulare Bsp. für Solarcheck und Kontakt
===================================================================== */
input.input {
	width:238px;
	height:18px;
	border: 1px solid #bbbbbb;
}
select.select{
	height:20px;
	width:240px;
	border: 1px solid #bbbbbb;
}
textarea.textarea{
	width:493px;
	height:107px;
	border: 1px solid #bbbbbb;
}
/* Validation */
.validation-advice {
	margin: 2px 0;
	padding: 3px;
	color : #BD0102;
	font-weight: normal;
	background-color:#FFFFFF;
	border:0px solid #FFFFFF;
}
.custom-advice {
	margin: 2px 0;
	padding: 5px;
	background-color: #9d003e;
	color : #000000;
	font-weight: normal;
}

.form-row {
	clear: both;
	padding: 0.1em;
}
/* ====================================================================
   REFERENZEN
===================================================================== */
.picture-1, .picture-2{
	margin-right:12px;
}
a.gal{
	text-decoration:none;
}
a.gal:hover{
	text-decoration:underline;
}
