@charset 'utf-8';
/* 
	STYLESHEET: screen.css
	--------------------------------------------------------------
	
	Media Type: 	Screen
	Copyright:		(c)2009, dieSignatur 
	Last Update: 	2009-01-14
	
------------------------------------------------------------------

__________________01. GLOBAL
__________________02. NAVIGATION
__________________03. SIDEBAR
__________________04. MAIN
__________________05. FOOTER

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


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



/* 01. GLOBAL
------------------------------------------------------------------*/
html, body {font-size:100.01%}
body {
	color: #5d6669;
	background: #e2e2e2 url(images/bg_top.gif) left top repeat-x;
	font: 0.7em/1.5em Arial, Helvetica, sans-serif;
}
p {line-height: 1.5em}

/* Basic classes
------------------------------------------------------------------*/
.print {display:none} /* Hide elements on screen, show them in print */
.left {float:left}

/* Page link styles
------------------------------------------------------------------*/
a:link {color:#b71313; text-decoration:none;}
a:visited {color:#b71313; text-decoration:none;}
a:active {color:#b71313; text-decoration:none;}
a:hover {color:#b71313; text-decoration:underline;}

/* Page headline styles
------------------------------------------------------------------*/
h1 {}
h2 {}
h3 {}

/* Containers
------------------------------------------------------------------*/
#container {
	margin: 26px 0 20px 0;
	background: #ededed url(images/bg_container_bottom.gif) left bottom repeat-x;
	padding-bottom: 8px;
}
#wrapper {	
	margin: 0 auto 0 auto;
	background: url(images/bg_wrapper.gif) left top repeat-y;
	width: 1038px; /* 1051 */
	padding: 0 6px 0 7px;
}
#content {
	position: relative;
	border-bottom: 7px solid #b31a1f;
}



/* 02. NAVIGATION
------------------------------------------------------------------*/
#navigation {
	border-top: 7px solid #b31a1f;
	padding: 0 0 0 375px;
	margin: 0 0 15px 0;
}
#navigation ul {margin:0; padding: 0}
#navigation li {
	float: left;
	list-style: none;
	margin: 0 0 0 0;
	padding: 0;

}
#navigation a {
	display: block;
	height: 34px;
	width: 100px;
	text-indent: -999em;
}
#navigation #leistungen {background:url(images/nav_leistungen.gif) left bottom no-repeat}
#navigation #leistungen:hover {background-position: left -34px}
#navigation #leistungen.active {background-position: left top}

#navigation #portfolio {background:url(images/nav_portfolio.gif) left bottom no-repeat}
#navigation #portfolio:hover {background-position: left -34px}
#navigation #portfolio.active {background-position: left top}

#navigation #projekte {background:url(images/nav_projekte.gif) left bottom no-repeat}
#navigation #projekte:hover {background-position: left -34px}
#navigation #projekte.active {background-position: left top}

#navigation #agentur {background:url(images/nav_agentur.gif) left bottom no-repeat}
#navigation #agentur:hover {background-position: left -34px}
#navigation #agentur.active {background-position: left top}

#navigation #kontakt {background:url(images/nav_kontakt.gif) left bottom no-repeat}
#navigation #kontakt:hover {background-position: left -34px}
#navigation #kontakt.active {background-position: left top}


/* 03. SIDEBAR
------------------------------------------------------------------*/
#sidebar {
	width: 274px; /* 334px */
	float: left;
	padding: 20px 0 0 60px;
}
#sidebar h2 {
	margin: 0 0 15px 0;
	padding: 0 0 0 1px;
	width: 180px;
	border-bottom: 1px solid #eee;
	line-height: 1em;
}
#sidebar ul {
	margin: 0;
	padding: 0;
	font-size: 11px;
	
}
#sidebar ul li {
	background: url(images/icon_subnavigation.gif) 5px center no-repeat;
	padding-left: 15px;
	list-style: none;
	margin-bottom: 5px;
}
#sidebar ul a {
	font-size: 0.9em;
	color: #666;
	text-transform: uppercase;
}

/* Logo
------------------------------------------------------------------*/
#logo {
	width: 206px;
	height: 53px;
	position: absolute;
	bottom: 31px;
	left: 59px;
	margin: 0;
}
#logo a {
	display: block;
	width: 206px;
	height: 53px;
	text-indent:-999em;
	background: url(images/diesignatur_logo.gif) no-repeat;	
	outline: none;	
}



/* 04. MAIN
------------------------------------------------------------------*/
#main {
	background: url(images/diesignatur_logo_top.gif) right top no-repeat;
	float: left;
	width: 620px; /* 704px */
	padding: 0 42px;
}
#main h1 {margin:2em 0}

#main #quicks {text-align:right}
#main #quicks .top {
	background: url(images/icon_top.gif) left 5px no-repeat;
	padding-left: 14px;
}
#main #quicks .back {
	background: url(images/icon_back.gif) left 3px no-repeat;
	padding-left: 14px;
	margin-left: 15px;
}



/* 05. FOOTER
------------------------------------------------------------------*/
#footer {
	width: 657px; /*677*/
	background: url(images/bg_footer_top.gif) left top repeat-x;
	margin: 2em 0 0 -27px;
	padding: 13px 10px 13px 10px;
	line-height: 1.4em;
}
#footer .col {
	float: left;
	width: 295px; /*263px*/
	padding: 12px;
	border-left: 1px solid #fdfdfd;
	border-right: 1px solid #fdfdfd;
}
#footer .col.small {
	width: 141px; /*125*/
}
#footer .col h3 {
	color: #999;
	font-size: 1em;
	margin: 0;
	padding: 0;
}
#footer .col ul {
	margin: 0;
	padding: 0;
	font-size: 0.9em;
}
#footer .col li {list-style:none}
#footer .col a {color:#999}

/* Column hover
------------------------------------------------------------------*/
#footer .col:hover {
	background: #f4f4f4;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
}
#footer .col:hover h3, #footer .col:hover a {color:#666}

/* Column active
------------------------------------------------------------------*/
#footer .col.active {
	background: #f4f4f4;
	border-left: 1px solid #ddd;
	border-right: 1px solid #ddd;
}
#footer .col.active h3, #footer .col.active a {color:#666}