@charset 'utf-8';
@import url(reset.css);


/********************** BASICS ************************/

body {
	background: #a7b1b3 url(img/bg-body.gif) repeat-x fixed;
	color: #333;
	font: 70% Georgia, "Times New Roman", Times, serif;
	margin-top: 30px;
}

	#left-shadow, #right-shadow {
		width: 20px;
		height: 101%;
		position: fixed;
		top: 0px;
	}
	
		#left-shadow {left: 20px; background: url(img/bg-shadow-left.png) repeat-y;}
		#right-shadow {left: 985px; background: url(img/bg-shadow-right.png) repeat-y;}
	
	#content {
		display: block;
		position: relative;
		width: 945px;
		margin: 0 40px;
		min-height: 100%;
		height: auto;
		background: #fff url(img/bg-right-2.gif) 706px 0 repeat-y;
	}
		
		#left, #right {
			float: left;
			display: block;
			position: relative;
		}
		
		#left {
			width: 699px;
			margin-right: 6px;
			margin-top: 70px;
		}
		
		#right {
			width: 211px;
			padding: 331px 0 70px 29px;
		}
		
			.inner {
				padding: 0 30px 50px 30px;
			}

hr {
	display:block;
	overflow:hidden;
	visibility:hidden;
	width:0;
	height:0;
	border:0;
	outline:0;
	padding:0;
	margin: 0;
}

hr.clear{
	clear:both;
}

hr.divider {
	visibility: visible;
	overflow: visible;
	border-top: 1px dotted #aaa;
	background-color: #fff;
	margin:0px 10px 0px 10px;
	width: auto;
	height: 1px;

}

/********************** HEADER IMAGE ************************/

.home #left {background: url(mood/lighthouse.jpg) no-repeat;}
.services #left {background: url(mood/lighthouse.jpg) no-repeat;}
.references #left {background: url(mood/bridge.jpg) no-repeat;}
.experts #left {background: url(mood/mountain.jpg) no-repeat;}
.contact #left {background: url(mood/lighthouse.jpg) no-repeat;}
.imprint #left {background: url(mood/lighthouse.jpg) no-repeat;}


/********************** TYPO ************************/

.inner p, .inner ul, .inner ol {
	display: block;
	font-size: 1.2em;
	line-height: 1.6em;
	margin-bottom: 1em;
	padding: 0 10px;
}

.inner table, .inner table tbody {
	display: block;
	width: 100%;
}

.inner ol {
	list-style-position: inside;
	list-style-type: decimal;
}

.inner ul {
	list-style-position: inside;
	list-style-type: square;

}

	.inner ul li {
		padding-left: 1em;
		text-indent: -1em;
	}
	.inner ol li {
		padding-left: 1.5em;
		text-indent: -1.5em;
	}
	
	.inner ul.imagelist li { padding: 0; text-indent: 0;}
	
.inner div.rounded {
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	padding: 10px;
}

.inner .blue {background: #E0E9EF;}
.inner .yellow {background: #fbebd0;}
.inner .red {background: #f6eaec;}
.inner .green {background: #e5f2eb;}

.inner table {
	padding: 0;
}

	.inner table.rounded tr:first-child td {
		-moz-border-radius-topleft: 5px;
		-moz-border-radius-topright: 5px;
		-webkit-border-top-left-radius: 5px;
		-webkit-border-top-right-radius: 5px;
	}

	.inner table.rounded tr:last-child td {
		-moz-border-radius-bottomleft: 5px;
		-moz-border-radius-bottomright: 5px;
		-webkit-border-bottom-left-radius: 5px;
		-webkit-border-bottom-right-radius: 5px;
	}
		
		.inner td {padding: 10px;}
	

	
a {
	text-decoration: none;
	color: #666;
}

	a:hover {color: #085189;}

.meta, .metalist, select, .caption {
	font-family: Arial, Verdana,sans-serif;
	font-size: 11px;
	color: #555;
	line-height: 15px;
}

	.meta a:hover {text-decoration: underline;}
	
	
h2 {
	line-height: 1.2em;
	height: auto;
	font-size: 26px;
	font-weight: normal;
	text-indent: 0;
	padding-left: 10px;
	margin: 1em 0 1em 0;
	width: 500px;
}

	h2 em.date {
		color: #bbb;
		float: right;
		margin-right: -130px;
	}

.h2 {
	height: 70px;
	margin: 0 -10px 2em -10px;
	padding: 0 10px;
	width: 639px;
	background: url(img/h2-shadow.png) no-repeat;
	
}

	.h2 h2 {
		padding: 0;
		text-indent: 10px;
		margin: 0 0 0.4em 0;
		line-height: 60px;
		height: 60px;
		color: #fff;
		text-shadow: -1px -1px 0px rgba(0,0,0,.2), 1px 1px 1px rgba(0,0,0,.2);
		width: 639px;
		border:none;
		background: #9c0700 url(img/bg-popup-lines.png) 0 1px repeat-x;
	}
		
	.services h2 {background-color: #9c0700;}
	.references h2 {background-color: #007c32;}
	.experts h2 {background-color: #085189;}


h3 {
	font-size: 1.2em;
	line-height: 33px;
	font-weight: bold;
	font-style: italic;
	text-indent: 10px;
	background: #eef0f1;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	margin-bottom: 1.2em;
}
	
	
	h3 .date {font-weight: normal;}
	h3 .affix {color: #aaa;}

	.services h3, .references h3, .experts h3, .issues h3  {
		color: #D03E05;
		color: #444;
		font-weight: normal;
		font-size: 1.9em;
		line-height: 1.9em;
		background: transparent;
		border-bottom: 1px dotted #8F9A9D;
		margin: 0.9em 0;
	}


.h4 {
	margin-left: -28px;
	padding-left: 28px;
	background: url(img/h4-context.png) 0px 11px no-repeat;
}

h4 {
	font-size: 1.2em;
	line-height: 44px;
	height: 46px;
	font-weight: bold;
	font-style: italic;
}

	#right h4 {background: url(img/bg-underline.gif) bottom left repeat-x; text-shadow: 1px 1px 1px #fff;}

h1, #logo {
	display: block;
	position: absolute;
	top: 30px;
	left: 30px;
	z-index: 10;
	text-indent: -5000px;
	overflow: hidden;
}
	#logo {
		height: 97px;
		width: 61px;
		background: url(img/bg-logo.png) no-repeat;
	}
	
	h1 {
		height: 40px;
		width: 550px;
		background: url(img/bg-h1.gif) 70px 0 no-repeat;
	}
	
	
h2 a.affix {color: #fff; display: none; margin-left: 10px;}
h2:hover a.affix {display: inline; opacity: 0.1; }
h2:hover a.affix:hover {opacity: 0.5;}

h3 a.affix {color: #333; display: none; margin-left: 10px;}
h3:hover a.affix {display: inline; opacity: 0.1; }
h3:hover a.affix:hover {opacity: 0.5;}


/********************** NAVIGATION ************************/

#navi {
	padding: 10px;
	background: url(img/navi-shadow.png) no-repeat;
	margin: 0 0 10px 20px;
}
	
	#navi li, #navi-s li {
		display: block;
		float: left;
		margin-right: 9px;
	}
		
		#navi a {
			display: block;
			width: 183px;
			padding: 42px 12px 0 12px;
			height: 68px;
			font-size: 1.1em;
			font-style: italic;
			color: #fff;
			line-height: 14px;
		}
			.en #navi a {background: url(img/navi-en.gif) no-repeat;}
			.de #navi a {background: url(img/navi-de.gif) no-repeat;}
		
		#navi b {display: none;}
		
		#navi .affix, .prefix {
			color: #fff;
			opacity: 0.6;
			filter:alpha(opacity=60);
		}
		
		#navi li a span.affix {
			color: #FFF;
		}
		
		#navi #n1 a {background-color: #9c0700; background-position: 0 -96px;}
		#navi #n2 a {background-color: #007c32; background-position: -207px -96px;}
		#navi #n3 a {background-color: #085189; background-position: -414px -96px;}
		
		#navi #n1 a:hover {background-position: 0 -206px;}
		#navi #n2 a:hover {background-position: -207px -206px;}
		#navi #n3 a:hover {background-position: -414px -206px;}
		
		#navi #n1 a.active {background-position: 0 -206px;}
		#navi #n2 a.active {background-position: -207px -206px;}
		#navi #n3 a.active {background-position: 414px -206px;}
		
		#navi a:hover .affix {color: #fff; opacity: 1.0; filter:alpha(opacity=100);}
	


#navi-s {
	padding: 10px 10px 0 10px;
	background: url(img/navi-shadow.png) no-repeat;
	margin: 0 0 0 20px;
}
		
		#navi-s a {
			display: block;
			width: 207px;
			height: 32px;
		}
		
			.en #navi-s a {background: url(img/navi-en.gif) no-repeat;}
			.de #navi-s a {background: url(img/navi-de.gif) no-repeat;}
		
		#navi-s b {display: none;}
		
		#navi-s #n1 a {background-color: #9c0700; background-position: 0 0;}
		#navi-s #n2 a {background-color: #007c32; background-position: -207px 0;}
		#navi-s #n3 a {background-color: #085189; background-position: -414px 0;}
		
		#navi-s #n1 a:hover {background-position: 0 -32px;}
		#navi-s #n2 a:hover {background-position: -207px -32px;}
		#navi-s #n3 a:hover {background-position: -414px -32px;}
		
		#navi-s #n1 a.active {background-position: 0 -64px;}
		#navi-s #n2 a.active {background-position: -207px -64px;}
		#navi-s #n3 a.active {background-position: -414px -64px;}




#metanavi {
	display: block;
	padding: 0 30px;
	width: 639px;
	height: 40px;
	margin-bottom: 218px;
	line-height: 36px;
	background: none;
	color: #fff;
}

#switchlang {
	height: 40px;
	width: 200px;
	padding: 70px 30px 2px 10px;
	background: #fff;
	position: absolute;
	right: 0px;
	top: 0px;
	text-align: right;
	line-height: 36px;
}
	
	#metanavi a {color: #fff;}
	#switchlang a {color: #333;}
	#metanavi a, #switchlang a {display: block; float: right;}
	span.divider {display: block; float: right; padding: 0 6px; opacity: 0.5; filter:alpha(opacity=50);}


/********************** POPUP ************************/

div#popup-services {
	display: none;
	position: absolute;
	top: 300px;
	left: 20px;
	width: 639px;
	height: auto;
	color: #fff;
	z-index: 20;
	padding: 0 10px 10px 10px;
	background: transparent url(img/bg-popup-shadow.png) bottom no-repeat;
}

	.home div#popup-services {top: 310px;}
	
	.popup h4 {
		color: #fff;
		line-height: 62px;
		text-indent: 12px;
		opacity: 0.5;
	}
	
	.popup h5 {
		font-family: Arial, Verdana, Sans-serif;
		text-transform: uppercase;
		font-size: 1.1em;
		line-height: 4.2em;
		height: 2.8em;
		font-weight: bold;
		color: #fff;
	}
	
	table.popup  {
		width: 100%;
		background: #9c0700 url(img/bg-popup-lines.png) 0 1px repeat-x;
	}
		
		table.popup tr.head {height: 61px;}
		table.popup .column1 {width: 182px; border-right: 1px solid #a61f19;}
		table.popup .column2 {width: auto; border-left: 1px solid #860600;}
		table.popup td {padding: 0 12px 30px 12px;}
		
	
	table.popup ul {
		display: block;
		list-style-type: none;
		margin: 0px;
		padding: 0px;
		font-family: Arial, Verdana,sans-serif;
		line-height: 1.4em;
		font-size: 1.1em;
		color: #ce8380;
	}
	
		table.popup a {color: #eee;}
		table.popup a:hover {background: #800600; color: #fff;}
		
		table.popup ul li {
			padding-left: 12px;
			background-image: url(img/bullet-12.gif);
			background-repeat: no-repeat;
			background-position: 0px 7px;
		}
		
	table.popup .column2 ul {
		width: 370px;
		border-bottom: 1px solid #860600;
		border-top: 1px solid #a61f19;
		padding-bottom: 0.7em;
		padding-top: 0.7em;
	}
	
		table.popup .column2 ul.first {border-top: none; padding-top: none;}
		table.popup .column2 ul.last {border-bottom: none; padding-bottom: none;}
		
	.popup .scrollbox {
		display: block;
		width: 100%;
		height: 300px;
		overflow: auto;
	}
	


/********************** SIDEBAR CONTENT ************************/

ul.metalist {
	padding-bottom: 4px;
	background: url(img/bg-underline.gif) bottom left repeat-x;
}

	ul.metalist li {
		border-bottom: 1px dotted #8f9a9d;
		padding-left: 1em;
		text-indent: -1em;
	}
	
	ul.metalist li:last-child {border-bottom: none; padding-bottom: 1px;}
	
		ul.metalist li a:before {
			content: "\00BB \0020";
		}
		
		ul.metalist li a {
			display: block;
			line-height: 15px;
			padding: 5px 0;
		}
			
			ul.metalist li a:hover {color: #333;}



/********************** PAGINATION ************************/

.pagination {
	display: block;
	position: relative;
	margin-top: 40px;
	height: 60px;
}

	.pagination p {
		display: block;
		position: absolute;
		padding: 0px;
	}
	
		.pagination a {
			margin: 0px;
			background: #eee;
			padding: 10px 15px;
			height: 50px;
			-moz-border-radius: 5px;
			-webkit-border-radius: 5px;
			text-shadow: 1px 1px 1px #fff;
		}
		
	.pagination .prev {top: 0px; left: 0px;}
	.pagination .next {top: 0px; right: 0px;}
	
	.services .pagination a:hover {background-color: #9c0700; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.5);}
	.references .pagination a:hover {background-color: #007c32; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.5);}
	.experts .pagination a:hover {background-color: #085189; color: #fff; text-shadow: 1px 1px 1px rgba(0,0,0,.5);}


/********************** FORMS & FIELDS ************************/

.field {
	padding: 20px 0;
	height: 30px;
	background: url(img/bg-underline.gif) bottom left repeat-x;
}


select {
	padding: 3px 5px;
}

	#right select {width: 180px;}
	



/********************** CONTENT ************************/


.inner ul.imagelist {
	margin: 0 -10px 0 0;
	padding: 0px;
}

	ul.imagelist li {
		display: block;
		position: relative;
		float: left;
		width: 208px;
		height: 200px;
		margin: 0 7px 1em 0;
	}
	

		.imagelist li a {
			display: block;
			border: 1px dotted #8F9A9D;
			padding: 3px;
		}
		
		.imagelist .image {
			display: block;
			overflow: hidden;
			width: 200px;
			height: 110px;
		}
		
		.imagelist li a:hover img {display: none;}
		
		.imagelist li h4 {
			font-style: normal;
			font-weight: bold;
			font-size: 1em;
			line-height: 3em;
			text-indent: 3px;
			height: 2em;
		}
		
		.imagelist .meta, .caption {
			color: #aaa;
			padding: 3px;
		}
		
		

.itemblock {
	margin: 2em -10px 0 0;
	padding: 0px;
}

		div.image {
			display: block;
			border: 1px dotted #8F9A9D;
			padding: 3px;
			overflow: hidden;
			width: 200px;
			height: 110px;
			margin-bottom: 0.5em;
		}
		
			.image .inner {
				padding: 0;
				overflow: hidden;
				width: 200px;
				height: 110px;
			}
		
div.floatleft {
	margin-right: 10px;
	margin-bottom: 2em;
	float: left;
}


div.box-issues, div.box-services, div.box-results {
	padding-bottom: 5px;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
}
	
	div.box-issues {background: #f6eaec;}
	div.box-services {background: #fbebd0;}
	div.box-results {background: #e5f2eb;}
	
	
/* ----------------------------------------------------- JS enabled browsers */

.js .noscript { display: none; visibility: hidden;}

.js body {margin-top: 0;}

.guide {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: 1000;
	text-indent: 40px;
	padding: 10px 0;
	color: #333;
	background: #FFFC4F;
	-moz-box-shadow: 0 0 6px #333;
	-webkit-box-shadow: 0 0 6px #333;
	font-family: Arial, Verdana, Sans-Serif;
	font-size: 11px;
}

	.guide p {margin: 0px;}

/* ----------------------------------------------------- IE7 and below */

.ie7 div#popup-services {background-color: #fff;}

/* ----------------------------------------------------- IE6 and below */

.ie6 div { }
