/* 
	-----------------------------------------------------
	Stylesheet zur Darstellung auf dem Bildschirm für Homepage "Croquis Vivant".
	Kunde: Antje Burckhardt
	Getestet auf und Optimiert für:
	WIN: IE >= 6, FF >= 1.5, Opera >= 9
	MAC: Safari,
	author: klaus@spencker.de
	Stand: 09.2009
	-----------------------------------------------------
*/
/* 	
	Globales aufheben der default Abstände aller Elemente basierend auf 
	Eric Meyers "reset reloaded" 
	http://aktuell.de.selfhtml.org/weblog/browserstyles-zuruecksetzen-reset-css
*/

html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	vertical-align: baseline;
}

:focus {
	outline: 0;
}
body {
	line-height: 1;
	color: black;
	background-color:#FFFFFF;
}
ol, ul, dl {
	list-style: none;
}
table {
	border-collapse: separate;
	border-spacing: 0;
}
caption, th, td {
	text-align: left;
	font-weight: normal;
}
blockquote:before, blockquote:after, q:before, q:after {
	content: "";
}
blockquote, q {
	quotes: "" "";
}
/* 
	Aufheben von Floats ohne zusätzliches Markup
	http://www.jassesnee.de/easyclear/
*/    
.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
.clearfix {
	display: inline-block;
}

/* 
	Behelfsklassen: clearer, kein Hintergrundbild, keine Abstände
 */
.clearer {
	clear: both;
	line-height: 1px;
	font-size: 1px;
	height: 1px;
}
/* kein hintergrundbild */	
.nobg {
	background-image: none !important;
}			
.fleft {
	float: left !important;
	}
.fright {
	float: right !important;
	}			
.noborder {
	border: none !important;
	}
/* keine abstände */	
.nospace {
	margin: 0 !important;
	padding: 0 !important;
}
/* development klasse für kommentare */
.development {
	background-color: #00ff18;
	border: 3px solid #000;
	color: #000;
	padding: 10px;
	font-size: 2em;
	font-weight: bold;
	display: block;/* display: none;  */
}

/* ------------------------- Layout ------------------------------ */

.construction{
	margin-left: 15px;

	
}

.construction img {
	margin-top: 15px;
	
}
.construction p{
	margin: 15px 0 0 13px;
	font-size:14px;
	font-weight:bold;
	line-height:18px;
}
.construction hr{
	margin: 15px 0 0 13px;
	
}
html {
	font-family: arial, helvetica, sans-serif;
	height: auto;
	/*background: url(../images/bg.jpg);*/
}
body {
	/*width: 100%;*/
	/*margin-top: 30px;*/ 
	/*margin: 20px auto; /* Content in nicht-IE Browsern horizontal zentrieren */
	/*height: 100.1%; /* verhindert ein "springen" in FF - Scrollbars werden immer angezeigt */
	background-color: #777777;
	text-align: left;
	position: relative;
	font-size: 12px;
	font-family:Verdana, Arial, Helvetica, sans-serif;
	color:#585f6a;
	
}

a {
	text-decoration:none;
	color:#585f6a;
}
a:hover {
	color:#9E333c;
}
a:active {
	color:#9E333c;
}

.act {
	color:#9E333c;
}

.start,
.stage {
	position:relative;
	margin: 20px auto;
	width: 990px;
	/*height: 630px;*/
	min-height:630px;
	background: url(../images/bg_content.jpg)  no-repeat;
	/*background-color: #C6AF9F;*/
	background-color: #cdbdb0; 
	
}

.start {
	background: url(../images/bg_start.jpg)  repeat;
}

.content_start {
	position:relative;
	left:60px;
}

.header {
	position:relative;
	width: 990px;
	height: 220px;
	background: url(../images/header.jpg) no-repeat;
	
}

.header ul{
			padding: 3px;
			color: #777777;
			
		}

	.space_1 {
		width: 990px;
		height: 163px;
		
	}
	.space_2 {
		width: 172px;
		height: 28px;
		float:left;
		
	}
	
	
	
	.main_nav,
	.meta_nav,
	.sec_nav {
		
		/*border: 1px solid #c2b6ad;*/
	}
	
	.main_nav{
		position:relative;
		float: left;
		
		width: auto;
		height: 26px;
	}
		
		.main_nav li{
			float: left;
			padding: 0 18px 0 5px;
			font-size: 18px;
			background: url(../images/dot.png)  no-repeat right top;
		}
		
		* html .main_nav li {
			behavior: url(./js/iepngfix.htc);
		}
		
		.main_nav .last_item {
			background: none;
		}
		
	.meta_nav{
		position:relative;
		margin-left: 720px;
		margin-top: 3px;
		/*width: 157px;*/
		width: 250px;
		height: 21px;
		text-align:right;
		
	}
		
		.meta_nav ul {
		display:inline-block;
		
		}
		.meta_nav li{
			float: left;
			margin-left:7px;
			font-size: 12px;
			
			
		}
	

	.sec_nav{
		position:relative;
		float:left;
		left:240px;
		margin-top:-2px;
		width:auto;
		height: 21px;
		
	}
		
		.sec_nav li{
			float: left;
			padding: 0 6px 0 6px;
			font-size: 12px;
			
		}

.content_level_1{
		padding: 0px 90px 20px 90px;
}
	
	.image_large {
		float:left;
		width:265px;
		height:395px;
		background: url(../images/shadow_1.png)  no-repeat;
		}
	.image_large img {
	
		margin: 10px 8px 10px 8px;
	}
	
	* html .image_large {
		behavior: url(./js/iepngfix.htc);
	}

.content_level_1_2{
		padding: 40px 40px 20px 44px;
}
.content_level_1_3{
		padding: 0 40px 20px 240px;
}
	
	.image_large_2 {
		float:left;
		width:226px;
		height:330px;
		background: url(../images/shadow_4.png)  no-repeat;
		}
	.image_large_2 img {
	
		margin: 7px 10px 10px 6px;
	}
	
	* html .image_large_2,
	* html .image_large {
		behavior: url(./js/iepngfix.htc);
	}	

.content_level_2{
		/*position:relative;*/
		/*margin-top: 40px;*/
		margin-top: 0px;
		padding: 10px 69px 10px 71px;
		text-align:left;
		
}

.content_level_2_2{
		
		padding: 10px 69px 10px 71px;
		text-align:left;
		margin-top: 0px;
}
.content_level_2_3{
		
		padding: 10px 155px 10px 155px;
		text-align:center;
		margin-top: 40px;
}
.content_level_2_4{
		
		padding: 10px 240px 10px 240px;
		text-align:center;
		margin-top: 40px;
}
.content_level_2_5{
		
		padding: 10px 240px 10px 240px;
		text-align:left;
		margin-top: 0px;
}

.content_level_2_6{
		
		padding: 10px 155px 10px 155px;
		text-align:left;
		margin-top: 0px;
}
	.content_level_2 .img_dis{
		position:relative;
		text-align:center;
		line-height:14px;
		
	}
	.dscr {
		text-align:center;
	
	}
	.image_medium {
		margin: 3px;
		float:left;
		width:164px;
		height:239px;
		background: url(../images/shadow_2.png)  no-repeat;
		}
	.image_medium img {
		margin: 7px;
	}
	
	* html .image_medium {
		behavior: url(./js/iepngfix.htc);
	}
	.back {
		background: url(../images/close.png)  no-repeat right top;
		position:relative;
		text-align:right;
		font-size:12px;
		display:inline-block;
		/*	margin-top: 10px;*/
		padding:1px 14px 0 0;
		
	}
	.discription {
		margin: 10px 0 20px 10px;
		line-height:16px;
		text-align:left;
	}
	.discription h3{
		
		margin:0 0 10px 0;
	}	
	
.detail	 {
	background: url(../images/bg_detail.png);
	position:absolute;
	left: 0;
	top: 0;
	width:100%;
	height:100%;

}

	.content_detail,
	.content_detail_2 {
		padding:10px;
		position:relative;
		margin:50px auto;
		height:546px;
	}
	.content_detail {
		background: url(../images/shadow_5.png)  no-repeat;
		width:378px;
		height:546px;
		
	}
	.content_detail_2 {
		background: url(../images/shadow_3.png)  no-repeat;
		width:620px;
		
	}
	
	
	
	.content_detail img,
	.content_detail_2 img {
		position:relative;
		float:left;
	}
	
	.content_detail_2 p , h4, .close{
		float:left;
		line-height:14px;
		position:relative;
		margin: 10px;
		width:200px;
	
	}
	.content_detail_2  h4 {
		font-size:18px;
		font-weight:bold;
	
	}
	.close {
		left: 0;
		top: 0;
		z-index:auto;
		/*position:absolute;*/
		background: url(../images/close.png)  no-repeat right top;
		text-align:right;
		font-size:12px;
		padding:0 14px 0 0;
		margin: 0 10px 0 10px;
		width:329px;
		height:20px;
		font-weight:bold;
		/*background-color:#00FF00;*/
		/*color:#999999;*/
	
	}
	.back:hover,
	.close:hover {
		background: url(../images/close_hover.png)  no-repeat right top;
	
	}
	.close_2 {
		background: url(../images/close.png)  no-repeat right top;
		text-align:right;
		font-size:12px;
		border-bottom: 1px solid #585f6a;
		padding:0 14px 10px 0;
		margin-bottom:20px;
		width:186px;
	
	}
	
	
	* html back ,
	* html back:hover ,
	* html .close:hover,
	* html .close {
		padding: 0;
		margin: 0;
		background:none;
	}
	
	
	* html .close_2 ,
	* html .detail ,
	* html .content_detail {
		behavior: url(./js/iepngfix.htc);
	}
	
/* ------------ Standard Pages  ------------ */

.content_impressum, 
.content_vita, 
.content_press,
.content_contact {
	position:relative;
	width:700px;
	top:50px;
	left:182px;
	line-height:16px;
	padding-bottom:100px;
	
}
.content_press .text {
	width: 500px;

}
	.text .low {
	font-size:10px;
	line-height:12px;
	
	
	}
	
	.content_vita table{
		/*background-color:#FFFFFF;*/
		/*width:700px;*/
		
	}
	.first_col{
		width:120px;
		font-weight:bold;
	}
	
	.content_vita h4,
	.text h4 {
		margin: 0 0 5px 0;
		float:none;	
		font-weight:bold;
		width:auto;
		/*text-transform:uppercase;*/
		font-size: 14px;
	
	}
	.img_vita {
		width:192px;
		height:189px;
		background: url(../images/img_vita.png)  no-repeat right top;
		float:right;	
		}
	* html .img_vita{
		behavior: url(./js/iepngfix.htc);
	}
	
	.vita_img_dsc{
		width:210px;
		margin: 190px 0 0 7px;
		
		
	}
	
	.text {
		width: 400px;
	}
	.text p {
		margin-bottom:10px;
	}
	.text span {
		color:#9E333c;
		font-size:12px;
		line-height:16px;
	}
	.low {
	
	font-size:8px;
	
	}
	
	
	.form {
		width:400px;
		float:left;
	}
	
	.content_contact .ipt,
	.content_contact textarea {
		float:left;
		width:250px;
		margin:0 0 20px 0;
		border: 1px solid #C2B6AD;
	}
	.content_contact .sbm,
	.content_contact .rst {
		float:none;
		width:100px;
		margin:0 0 20px 0;
		background-color:#C2B6AD;
		height: 30px;
		
		
	}
	.content_contact .sbm {
		margin:0 0 20px 120px;
	}
	.content_contact label {
		float:left;
		width:120px;
	}
	.address {
		/*display:block;*/
		float:left;
		margin: 0 0 0 40px;
	
	}
	.content_impressum h4{
		font-size:12px;
		margin-bottom:10px;
	}
	.content_impressum ul{
		
		margin-bottom:20px;
	}
	.lower {
		text-transform:none;
	}