/* -----------------------------------------------------------------------------------------------------------------
	common
----------------------------------------------------------------------------------------------------------------- */	
	/* some nice to have resets */
	
	p, div, body, img { padding: 0; margin: 0; }
	a img{ border: none; }
	html { height: 100%; }

	/* Clearing floats without extra markup - Based on How To Clear Floats Without Structural Markup by PiE
	   [http://www.positioniseverything.net/easyclearing.html] */
	.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
	
	/* Regular clearing -  apply to column that should drop below previous ones. */
	.clear { clear: both; }
	
/* -----------------------------------------------------------------------------------------------------------------
	YOUR site layout
----------------------------------------------------------------------------------------------------------------- */
	.px210x750 .col1  { width: 209px; border-right: 1px solid #dcdcdc; }
	.px210x750 .col2  {	width: 750px;	}

/* -----------------------------------------------------------------------------------------------------------------
	predefined layout - add your site layout before; everything else after
----------------------------------------------------------------------------------------------------------------- */

	.colmask { position: relative; clear: both; width: 100%; overflow: hidden; }
	.colmask .col1, .colmask .col2, .colmask .col3, .colmask .col4 { float: left; }
	
	/* |-------------------------50%-------------------------|-------------------------50%-------------------------| */
	.p50x50 .col1, .p50x50 .col2 { width: 49.9%; }
	/* |----------20%----------|----------------------------------------80%----------------------------------------| */
	.p20x80 .col1 { width: 19.9%; }
	.p20x80 .col2 { width: 79.9%; }
	/* |----------------------------------------80%----------------------------------------|----------20%----------| */
	.p80x20 .col1 { width: 79.9%; }
	.p80x20 .col2 { width: 19.9%; }
	/* |---------------30%---------------|-----------------------------------70%-----------------------------------| */
	.p30x70 .col1 { width: 29.9%; }
	.p30x70 .col2 { width: 69.9%; }
	/* |-----------------------------------70%-----------------------------------|---------------30%---------------| */
	.p70x30 .col1 { width: 69.9%; }
	.p70x30 .col2 { width: 29.9%; }
	/* |----------------33%----------------|----------------33%----------------|----------------33%----------------|  */
	.p33x33x33 .col1, .p33x33x33 .col2, .p33x33x33 .col3 { width: 33.2%; }
	/* |------------25%------------|-------------------------50%-------------------------|------------25%------------|  */
	.p25x50x25 .col1, .p25x50x25 .col3 { width: 24.45%; }
	.p25x50x25 .col2 { width: 50.9%; }	
	/* |------------25%------------|------------25%------------|------------25%------------|------------25%------------| */
	.p25x25x25x25 .col1, .p25x25x25x25 .col2, .p25x25x25x25 .col3, .p25x25x25x25 .col4 { width: 24.9%; }
	
	/* getting equal hight blocks; works due to the hidden overflow on colmask */
	.equal .col1, .equal .col2, .equal .col3, .equal .col4 { margin-bottom: -30000px; padding-bottom: 30000px; }
	
	/* give them some nice margin */
	.col1 .content, .col2 .content, .col3 .content { margin: 0 10px; }
	
	/* override col1 left margin and col2 right margin for 2 cols */
	.p50x50 .col1 .content, .p20x80 .col1 .content, .p80x20 .col1 .content, .p30x70 .col1 .content, .p70x30 .col1 .content { margin-left: 0; }
	.p50x50 .col2 .content, .p20x80 .col2 .content, .p80x20 .col2 .content, .p30x70 .col2 .content, .p70x30 .col2 .content { margin-right: 0; }
	
	/* override col1 left margin and col3 right margin for 3 cols */
	.p33x33x33 .col1 .content, .p25x50x25 .col1 .content { margin-left: 0; }
	.p33x33x33 .col3 .content, .p25x50x25 .col3 .content { margin-right: 0; }

/* -----------------------------------------------------------------------------------------------------------------
	YOUR everything else
----------------------------------------------------------------------------------------------------------------- */
	.p33x33x33 .col2, .p25x50x25 .col2  { border-right: 1px solid #dcdcdc; }
	
	body {
		font-family: "Lucida Grande",Verdana,Arial,Helvetica,sans-serif;
		font-size: 11px;
		color: #6D675C;
		background: #1E711C url(home_img/startseiten_hg.jpg) repeat-x;
	}
	
	h1 {
		color: #1E711C;
		font-size: 22px;
		font-family: "Times New Roman", Times, serif;
		font-weight: normal;
		text-transform: uppercase;
	}
	
	h2 {
		font-size: 16px;
		color: #1E711C;
		font-family: "Times New Roman", Times, serif;
		font-weight: normal;
	}
	
	h3 {
		margin-top: 0;
		font-size: 1em;
		color: #1E711C;
	}
	
	a {
		color:#1E711C;
		text-decoration: none;
	}
	
	a:hover {
		text-decoration: underline;
	}
	
	li {
		list-style-image: url(img/subnav_bullet.gif);
	}
	
	.green {
		color:#1E711C;
	}
/* -----------------------------------------------------------------------------------------------------------------
	navigation
----------------------------------------------------------------------------------------------------------------- */
	
	#navigation {
		overflow: hidden;
	}
	
	#navigation a {
		text-indent: -9999px;
	}
	
	#navigation .nav_empty {
		display: none;
	}
	
	#navigation ul {
		margin: 0;
		padding: 0;
		float: left;
		overflow: hidden;
	}
	
	#navigation ul li {
		float: left;
		list-style: none;
	}
	
	#navigation > ul > li > ul {
		display: none;
	}
	
	.nav_separator {
		width: 2px;
		height: 64px;
	}
	
	.nav_separator.one {
		background-image: url(home_img/nav_linie_1.jpg);
	}
	
	.nav_separator.two {
		background-image: url(home_img/nav_linie_2.jpg);
	}
	
	.nav_separator.three {
		background-image: url(home_img/nav_linie_3.jpg);
	}
	
	.nav_separator.four {
		background-image: url(home_img/nav_linie_4.jpg);
	}
	
	#navigation ul li a {
		display: block;
		height: 64px;
	}
	
	.nav_apfel {
		width: 111px;
		background-image: url(home_img/nav_der_apfel.jpg);
	}
	
	
	.nav_about {
		width: 142px;
		background-image: url(home_img/nav_ueber_uns.jpg);
	}
	
	.nav_news {
		width: 72px;
		background-image: url(home_img/nav_news.jpg);
	}
	
	
	.nav_presse {
		width: 76px;
		background-image: url(home_img/nav_presse.jpg);
	}
	
	.nav_iapple {
		width: 78px;
		background-image: url(home_img/nav_iapple.jpg);
	}
	
	.nav_logo {
		float: left;
		background: url(home_img/nav_leer.jpg) no-repeat;
		height: 64px;
		width: 81px;
	}
	
	.nav_logo a {
		display: none;
	}
	
/* -----------------------------------------------------------------------------------------------------------------
	content containers
----------------------------------------------------------------------------------------------------------------- */
	
	#wrap {
		width: 976px;
	}
	
	#sujet {
		float: left;
		width: 320px;
		height: 748px;
	}
	
	#main {
		float: left;
		height: 748px;
		width: 568px;
	}
	
	#rightbar {
		float: left;
		height: 748px;
		width: 88px;
		background: url(home_img/rightbar.jpg) no-repeat;
	}
	
	#header {
		height: 272px;
		background: url(home_img/fss_logo_oben.jpg) no-repeat right center;
	}
	
	#content {
		height: 256px;
		background: url(home_img/hg_content.jpg);
	}
	
	#footer {
		height: 156px;
		background: url(home_img/unten_2.jpg);
	}
	
	#footer * {
		display: none;
	}
	
	#bottombar {
		float: left;
		clear: both;
		background: url(home_img/seitenabschluss.jpg);
		height: 10px;
		width: 976px;
	}
	
/* -----------------------------------------------------------------------------------------------------------------
	themes
----------------------------------------------------------------------------------------------------------------- */

#sujet.suess_sauer {
	background: url(home_img/sujet_suess_sauer.jpg) no-repeat;
}

/* -----------------------------------------------------------------------------------------------------------------
	flexible content elements
----------------------------------------------------------------------------------------------------------------- */

.image-item {
	margin-left: -240px;
	overflow: hidden;
}

.image-item .image {
	float: left;
	width: 218px;
	text-align: right;
	padding-right: 22px;
}

.image-item .content {
	float: left;
	width: 366px;
	padding: 14px;
}

.image-item .content.background {
	background: url(img/liste_hg.jpg) top repeat-x;
}

/* -----------------------------------------------------------------------------------------------------------------
	content
----------------------------------------------------------------------------------------------------------------- */

.csc-textpic {
	float: left;
}

div.csc-textpic div.csc-textpic-imagewrap .csc-textpic-image {
	margin-bottom:0px;
}

#content div.csc-textpic-clear {
	clear: none;
}

#content h1 {
	margin: 0;
	padding-top: 20px;
}

#content h2 {
	margin: 0;
}

#content h2 a:hover {
	text-decoration: none;
}

/* -----------------------------------------------------------------------------------------------------------------
	news
----------------------------------------------------------------------------------------------------------------- */

#content div.news-latest-container {
	float: left;
	width: 400px;
}

#content div.news-latest-item {
	padding: 0;
}

#content div.news-latest-separator {
	height: 16px;
	background: url(home_img/headline_hg.jpg);
}

#content div.news-latest-morelink a { 
	text-indent: -9999px;
	background: url(home_img/mehr_button.jpg) no-repeat;
	display: block;
	width: 58px;
	height: 26px;
	margin-left: 0px;
	margin-top: 11px;
}

#content div.news-latest-image {
	width: 141px;
	float: left;
}

#content div.news-latest-text {
	float: left;
	color: #6D675C;
	margin-left: 22px;
	width: 215px;
}
#newLogo { position: absolute; top: 80px; left: 690px; width: 242px; height: 246px; background: url('home_img/newLogo.png') no-repeat top center; display: none; }

a.hover img {
	opacity: 0.85;
}

a.hover:hover img {
	opacity: 1;
}