﻿@charset 'utf-8';
/* 
	STYLESHEET: screen.css
	--------------------------------------------------------------
	
	Media Type: 	Screen
	Copyright:		(c)2009, bionic 
	Updated: 		2009-02-06
	
------------------------------------------------------------------

__________________01. GLOBAL
__________________02. HEADER
__________________03. NAVIGATION
__________________04. META
__________________05. HEADLINE
__________________06. CONTENT
__________________07. SIDEBAR
__________________08. MAIN
__________________09. FOOTER
__________________10. MODULES



------------------------------------------------------------------*/


/* Import default Stylesheets 
------------------------------------------------------------------*/
@import url(reset.css); 	/* Resets all Styles */
@import url(base.css);		/* Basic Styles (margins, font size, ect.)



/* 01. GLOBAL
------------------------------------------------------------------*/
html, body {
	color: #333;
	font-family: Arial, Helvetica, sans-serif;
	margin: 0;
	padding: 0;
	line-height: 1.4em;
	font-size: 85%;
	width:100%; height:100%;
}

p {line-height: 1.5em}
.print {display:none}
.left {float:left}
.right {float:right}

th, td {border:none; padding:0}

/* Default link styles */
a:link {color:#333; text-decoration:underline}
a:visited {color:#333; text-decoration:underline}
a:active {color:#333; text-decoration:underline}
a:hover {color:#0333; text-decoration:none;}

a.more {
	background: url(../images/icon_arrow2.png) left center no-repeat;
	padding-left: 13px;
	color: #333;
	text-decoration: underline;
}
a.more:hover {text-decoration:none}


#wrapper {
	height: 100%;
	width: 100%;
	margin: 0 auto;
	position: relative;
}
#container {
	position: absolute;
	top: 50%;
	z-index: 2;
	left: 50%;
	margin: -300px 0px -300px -456px;
	width: 912px;
	height: 600px;

}
#background{position:absolute; z-index:1; width:100%; height:100%}



/* 02. HEADER
------------------------------------------------------------------*/
#header {
	padding-left: 25px;
	position: relative;
} 
/* Logo replacement */
#header #logo {
	margin: 0 0 0 -8px;

}
#header #logo a {
	display: block;
	width: 363px;
	height: 69px;
	text-indent: -999em;
	background: url(../images/faszinationfarbe_logo.png) left top no-repeat;

}
#langselector {
	
	position: absolute;
	top: 60px;
	right: 25px;
	width: 140px;
	text-align: right;
	font-size: 11px;

}


#navigation {
	margin: -10px 0 10px 0;
}
#navigation ul {
	margin: 0;
	padding: 0;
}
#navigation li {
	list-style: none;
	float: left;
	margin-right: 15px;
}
#navigation a {
	font-size: 16px;
	text-decoration: none;
}
#navigation a:hover {text-decoration:underline}
#navigation li.active p {font-size:16px; padding:0; margin:-3px 0 0 0; font-weight:bold} /* TODO: margin */
#navigation li.trail {font-weight:bold}


/* Weniger höhe:
Original:
	#content: 506px
	#main: 450px
	#sidebar: 456px
Neu: -75px */
	
	
#content {
	background: url(../images/bg_content.png) left top no-repeat;
	height: 356px; 
}
#main {
	float: left;
	padding: 25px;
	width: 590px; /*646*/
	height: 275px; /*506*/

	overflow: auto;
	margin: 6px 0 0 6px;
}
#main h1 {
	margin: 0.5em 0 1.5em 0;
	padding: 0;
}

#sidebar {
	float: right;
	height: 281px; /* 506*/
	width: 215px; /*265*/
	padding: 25px;
}
#Subnavigation ul {
	margin: 0;
	padding: 0;
}
#Subnavigation li {
	list-style: none;
	background: url(../images/icon_arrow2.png) left center no-repeat;
	padding-left: 17px;
}
#Subnavigation a {

	text-decoration: none;
}
#Subnavigation a:hover {

	text-decoration:underline;
}
#Subnavigation .active p {margin:0; font-weight:bold}


#footer {
	background: url(../images/bg_footer.png) left top no-repeat;
	height: 131px; /*156*/
	padding: 25px;
}
#footer.start {
	background: url(../images/bg_footer_start.png) left top no-repeat;
	height: 138px;
	margin-bottom: 6px;
}
#footer #news {
	float: left;
	font-size: 12px;
	padding-left: 25px;
	width: 596px; /*621*/
	background: url(../images/text_news.png) left top no-repeat;
}
#footer .news h2 {
	margin: 0;	
}
#footer ul {
	margin-top: 0;
	margin-bottom: 7px;
}
#footer li {
	margin-bottom: 3px;	
}

#footer #contact {
	float: right;
	width: 195px;

	padding-left: 25px;
	background: url(../images/text_contact.png) left top no-repeat;
}

#copyright {
	text-align: right;
	padding: 0 25px 0 0;
	font-size: 11px;
	color: #fff;
}
