/****************************************************************************

framework identity - main stylesheet 
v.1 - 7th December 2008 - domenica lucifora - kontakt@deeluxe.de


TABLE OF CONTENTS
-----------------

	- reset styles
	- base
	- grid
		- index
		- contentpages - static
		- contentpages - blog
	- elements
		- index
		- footer
		- for all sections
			- header
			- main navigation
			- content side
		- people
			- people image navigation
			- partners
			- content side
		- results
			- general
			- content side
		- focus (and imprint)
		- blog
			-general
			- comments
			- content side
		- contact
		- imprint
		- error
	- fontsizes
	- helpers
	
	
COLOR DEFINITION
----------------

	Blue			#005288
	Lightblue		#16acdc
	Greyblue		#c1d1da
	Pink			#c3188a
	Yellow			#ffd600
	Green			#33aa00
	Lightgreen		#ecf7e7
	Beige			#8f866c
	Lightbeige		#c7c3b6
	Grey			#eeede9
	Lightgrey		#f3f2ee

*****************************************************************************/

/* --- RESET - ERIC MEYER --- */

html, body, div, span, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, code,
del, dfn, em, img, q, dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
}

/* Tables still need 'cellspacing="0"' in the markup. */
table { border-collapse: separate; border-spacing: 0; }
caption, th, td { text-align: left; font-weight:400; }

/* Remove possible quote marks (") from <q>, <blockquote>. */
blockquote:before, blockquote:after, q:before, q:after { content: ""; }
blockquote, q { quotes: "" ""; }

a img { border: none; }
a { outline: none; text-decoration: none; }

legend, caption { display: none; }


/* --- BASE --- */

body, html { height: 100%; }

body {
	background-color: #fff;
	color: #000;
	font: 11px Verdana, Helvetica, Arial, sans-serif;
	margin: 0;
	padding: 0;
	text-align: center;
}

em {
	font-style: italic;
}

strong {
	font-weight: 700;
}


/* --- GRID --- */

/* - index - */

#front div#grid-content-wrap { /* image rotation by real image uploaded into txp */
	height: 530px;
	position: relative;
	width: 950px;
}

		#front div#grid-head {
			height: 118px;
		}


/* contentpages - static */

div#grid-wrap {
	margin: 0 auto;
	text-align: left;
	width: 950px;
}

		div#grid-head {
			background: #fff;
			height: 118px;
		}

		div#grid-content-wrap {
			background: url('../images/layout/bg_sidecontent1.gif') repeat-y right top;
		}

				div#grid-content-main {
					float: left;
					margin-right: 7px;
					position: relative;
					width: 702px;
				}

				div#grid-content-side {
					float: right;
					width: 238px;
				}

				div#grid-footer {
					clear: both;
					padding-top: 20px;
					text-align: center;
				}

/* contentpages - blog */

#blog div#grid-content-wrap { /* blog has another background image for a wider sidecontent */
	background: url('../images/layout/bg_sidecontent2.gif') repeat-y right top;
}

		#blog div#grid-content-main { /* the content of the blogpage is narrower */
			float: left;
			margin-right: 7px;
			width: 474px;
		}

		#blog div#grid-content-side {
			float: right;
			width: 469px;
		}

				#blog div.grid-content-side-sub {
					float: left;
					line-height: 150%;
					width: 233px;
				}


/* --- ELEMENTS --- */

/* --- index --- */

#front #grid-head div.address {
	background: #c7c3b6;
	height: 115px;
	width: 709px;
}

		#front #grid-head .address span {
			color: #fff;
			display: block;
			padding: 95px 0 0 9px;
		}

				#front #grid-head .address a {
					color: #005288;
					display: inline;
				}
				
						#front #grid-head .address a:hover { text-decoration: underline; }

div.teaser-blog {
	background: url('../images/layout/bg_white_o85.png') repeat left top;
	height: 350px;
	line-height: 140%;
	padding-bottom: 5px;
	position: absolute;
	right: 0;
	top: 0;
	width: 472px;
	z-index: 1;
}

		.teaser-blog h3 {
			background: url(../images/layout/bg_share.png) no-repeat left top;
			display: block;
			height: 20px;
			margin: 15px 0 10px 30px;
			text-indent: -8000px;
			width: 185px;
		}
		
				.teaser-blog h3 a {
					display: block;
					height: 20px;
					width: 185px;
				}

		.teaser-blog h4 {
			color: #8f866c;
			font-weight: 700;
			margin: 15px 0 3px 30px;
		}

		.teaser-blog p {
			margin: 0 60px 0 30px;
		}
		
		.teaser-blog a {
			color: #c3188a;
			/*display: block;*/
			margin: 0 0 10px;
		}
		
		.teaser-blog p a {
			/*display: inline;*/
		}

				.teaser-blog a:hover {
					text-decoration: underline;
				}

div.teaser-nav {
	position: absolute;
	left: 0;
	top: 220px;
	width: 486px;
	z-index: 2;
}

		.teaser-nav div.box {
			background: #ffd600;
			float: left;
			height: 135px;
			margin: 0 3px 3px 0;
			position: relative;
			width: 236px;
		}

				.teaser-nav .box h3 {
					display: block;
					height: 20px;
					margin: 8px 10px 8px;
					text-indent: -8000px;
					width: 70px;
				}

				.teaser-nav .results h3 { background: url(../images/layout/bg_results.png) no-repeat left top; }
				.teaser-nav .people h3 { background: url(../images/layout/bg_people.png) no-repeat left top; }
				.teaser-nav .focus h3 { background: url(../images/layout/bg_focus.png) no-repeat left top; }

				.teaser-nav .box img {
					float: left;
					height: 47px;
					margin: 0 5px 0 10px;
					width: 47px;
				}

				.box p {
					margin: 0 10px;
				}
				
				.box p a {
					color: #000;
					text-decoration: none;
				}

				.box a.link-block {
					display: block;
					height: 135px;
					left: 0;
					margin: 0 10px;
					position: absolute;
					text-indent: -8000px;
					top: 0;
					width: 236px;
					z-index: 10;
				}


/* --- footer --- */

#grid-footer a {
	color: #005288;
}

		#grid-footer a:hover { text-decoration: underline; }


/* --- for all sections --- */

#accessibility {
	position: absolute;
	top: -10000px;
}

/* - header - */

#grid-head div.logo {
	background: #ffd600;
	float: right;
	height: 115px;
	width: 238px;
}

		.logo h1 {
			background: url('../images/layout/logo1.png') no-repeat center center;
			display: block;
			text-indent: -8000px;
		}

				.logo h1 a {
					display: block;
					height: 115px;
					width: 238px;
				}

		.logo h2 {
			color: #7578b0;
			font-style: italic;
			margin: -50px 0 0 140px;
		}

#grid-head div.image-main {
	float: left;
	width: 709px;
}


/* - navigation - main - */

ul.navigation-main {
	clear: both;
	list-style: none;
	margin-bottom: 14px;
}

		.navigation-main li {
			float: left;
			margin-right: 4px;
			width: 8.25em;
		}
	
				.navigation-main .last { /* margin needs an overwrite */
					text-align: left;
					margin-right: 0 !important;
				}

				.navigation-main li a {
					background: #c7c3b6;
					border-bottom: 4px solid #c7c3b6;
					color: #000;
					font-weight: 700;
					padding: 6px 3px 7px 8px;
					display: block;
				}

						.navigation-main li a:hover {
							background: #ffd600;
							border-bottom: 4px solid #ffd600;
						}

								.navigation-main li a span {
									color: #8f866c;
									display: block;
									font-weight: 400;
								}

										.navigation-main li a:hover span { text-decoration: none; }

												.navigation-main li a span span {
													color: #c3188a;
													display: inline;
												}

					/* current state aka you are here - people */
					body#people .navigation-main li#navigation-people a { background: #fff; border-bottom: 4px solid #005288; }
					body#results .navigation-main li#navigation-results a { background: #fff; border-bottom: 4px solid #33aa00; }
					body#focus .navigation-main li#navigation-focus a { background: #fff; border-bottom: 4px solid #16acdc; }
					body#blog .navigation-main li#navigation-blog a { background: #fff; border-bottom: 4px solid #c3188a; }
					body#contact .navigation-main li#navigation-contact a { background: #fff; border-bottom: 4px solid #ffd600; }


/* content side */

#grid-content-side h4 {
	color: #8f866c;
	margin: 5px 6px 10px;
}


/* --- elements - depend on section --- */

/* - people - */

/* image navigation */

ul.navigation-people {
	float: left;
	list-style: none;
	width: 210px;
}

		ul.navigation-people li {
			float: left;
		}

				ul.navigation-people li img {
					border: 1px solid #005288;
					height: 55px;
					margin: 0 5px 5px 0;
					width: 55px;
				}

		.muted li a img {
			filter:alpha(opacity=15);
			-moz-opacity:.15;
			opacity:.15;
		}
		
				.muted li a:hover img {
					filter:alpha(opacity=100);
					-moz-opacity:1;
					opacity:1;
				}
		
		.muted li.current a img { /* current state makes the muted image 100% opaque then */
			border: 1px solid #ffd600;
			filter:alpha(opacity=100);
			-moz-opacity:1;
			opacity:1;
		}


/* - partners - */

#people div.entry-image {
	border: 1px solid #005288;
	display: block;
	float: left;
	height: 180px;
	width: 180px;
}

#people div.entry-text {
	float: right;
	width: 68%;
}

		.entry-text h3 {
			color: #8f866c;
			font-weight: 700;
			margin: -3px 10px 3px 0;
		}

		.entry-text img {
			float: left;
			margin: 0 15px 0 0;
		}

		div.entry-image-people {
			float: left;
			height: 108px;
			width: 108px;
		}

				.entry-image-people img {
					border: 1px solid #ffd600;
				}

		.entry-text p {
			line-height: 150%;
			margin: 0 20px 20px 0;
		}

				.entry-text p.link-extern {
					font-weight: 700;
				}

		.entry-text a { color: #005288; }
		
				.entry-text a:hover { text-decoration: underline; }

		.entry-text div.entry-body {
			float: right;
			width: 68%;
		}


/* people/network - content-side - */

div.box-partner {
	margin: 5px;
	padding: 2px;
}

ul.list-network {
	list-style: none;
}

		ul.list-network li {
			display: block;
			float: left;
		}
		
				ul.list-network li.pair {
					float: right;
				}

	

/* - results - */

#results div.entry-wrap { /* needs a wrapper for striping the entries */
	margin-bottom: 10px;
	height: 180px;
}

		#results div.even { background: #f3f2ee; }
		#results div.odd { background: #fff; }

		#results div.entry-image { /* Workaround: The plugin for multi article images does not allow to add a class name here */
			display: block;
			float: left;
			width: 180px;
		}

				#results .entry-image img {
					margin-bottom: 5px;
				}

		#results .entry-text {
			float: right;
			width: 68%;
		}
		
				#results .entry-image-main { /* this is the big image that is on the top of an individual results article */
					margin: 0 0 5px -38px ;
				}
				
				#results .entry-wrap .entry-text h3 {
					margin-top: 15px;
				}

				#results .entry-text h3 {
					color: #8f866c;
					margin: 0 10px 10px 0;
				}

						#results .entry-text h3 a {
							color: #8f866c;
						}

				.entry-text p.link-more {
					margin-top: -20px;
				}

						.entry-text p.link-more a { color: #33aa00; }

						.entry-text span.link-back {
							display: block;
							padding-top: 10px;
						}


/* - results - content-side */

#grid-content-side h4.results {
	margin-bottom: 34px;
}

#grid-content-side dl {
	background: #fff;
	height: 64px;
	margin: 5px 0 5px;
}

		#grid-content-side dt {
			float: left;
			margin-right: 10px;
			width: 64px;
		}
		
				#grid-content-side h5 a {
					color: #005288;
					display: block;
					font-weight: 700;
					margin-bottom: 4px;
				}

						#grid-content-side h5 a:visited { color: #8f866c; }
						#grid-content-side h5 a:hover { text-decoration: underline; }

		#grid-content-side dd {
			margin: 3px 5px 0 0;
		}


/* - focus - */

#focus div.entry-text {
	float: right;
	padding-right: 7px;
	width: 68%;
}

		#focus .focus img {
			margin: 10px 0 10px -120px;
		}

/* - blog - */

div.entry-details { /* under the headline */
	margin: 0 0 10px;
}

		.entry-details span {
			display: block;
			float: left;
			margin: 2px 5px 0 0;
		}

div.entry-footer { 
	margin: 0 10px 50px 0;
}

		.entry-footer img.icon {
			clear: both;
			display: inline;
			float: left;
			margin: 0 3px 2px 0;
		}
		
		.entry-footer span {
			display: block;
			float: left;
			margin: 2px 5px 5px 0;
			width: 90%; /* width for safari */
		}
				
				.entry-footer span.list-social {
					float: right;
					text-align: right;
					width: 48%;
				}
		

		p.found { /* creditlink for i.e. images */
			margin: 0 20px 10px 0;
			padding: 0 5px;
			text-align: right;
		}

		img.big { /* unfloated, big blogged images */
			float: none;
			margin-bottom: 0 0 -25px 0;
		}

		blockquote { /* cite */
			background: url('../images/layout/bg_blockquote.gif') no-repeat 3% 8% #eae9e3;
			color: #8f866c;
			display: block;
			margin: 30px 10px 30px 0;
			padding: 20px 0 10px 30px;
		}
		
				blockquote span.author {
					display: block;
					margin-top: 5px;
					text-align: right;
				}

/* some blog text styles */

.entry-text ul,
.entry-text ol {
	margin-bottom: 15px;
}

.entry-text ol {
	margin-left: 18px;
}

.entry-text ul {
	list-style: none;
}

		.entry-text li {
			line-height: 140%;
			margin: 0 40px 5px;
		}

				.entry-text ul li { /* this one is especially for all list items of an unordered list */
					background: url(../images/layout/el_content_litem.gif) no-repeat left 5px;
					padding-left: 15px;
				}

		.entry-text h4,
		.entry-text h5,
		.entry-text h6 {
			color: #8f866c;
			margin: 10px 10px 10px 0;
		}

		.entry-text h4,
		.entry-text h5 {
			font-weight: 700;
		}
		
		img.icon {
			background: #c3188a;
			display: inline;
			margin: 0 3px 0 0;
		}

		img.icon2 {
			background: #c7c3b6;
			display: inline;
			margin: 0 3px 0 0;
		}
		
/* comments */

div.comments { /* wraps the single comments. CMS does not allow to add class names to generated divs */
	margin: 5px 10px 5px 0;
}

		.even { background: #f5f4f0; }

		.comments div {
			padding: 20px;
		}

				.comments div a:hover span { text-decoration: underline; } /* overwrites the text-decoration none rule */ 

				.comment-details span {
					display: block;
					float: left;
					margin: 0 15px 0 2px;
				}
				
				p.comment-details {
					clear: both;
				}

/* comments form */

div.comments-wrapper {
	background:#c7c3b6;
	float: left;
	margin: 20px 10px 0 0;
	padding: 10px 0 10px 10px;
}

		div.form-row {
			float: left;
			margin: 5px 10px 5px 0;
			padding: 2px 0;
		}
		
		div.form-row-additional {
			float: right;
			margin-top: 5px;
			width: 80px;
		}

				.row-last {
					text-align: right;
					width: 360px;
				}

				.form-row label {
					color: #000;
					float: left;
					margin-top: 3px;
					width: 60px;
				}

				input.comment_name_input,
				input.comment_email_input,
				input.comment_web_input,
				textarea.txpCommentInputMessage {
					border: none;
					width: 300px;
				}

				textarea {
					height: 200px;
				}

				input.checkbox {
					border: none;
					height: auto;
					width: auto;
				} 

				input.button {
					background: #eeede9;
					border: none;
					height: 2em;
					width: 100px;
				}

				div#comments-help {
					float: right;
					margin-top: 1em;
					width: 80px;
				}


/* - blog - content side */

.grid-content-side-sub a {
	color: #005288;
}

		.grid-content-side-sub a:hover {
			text-decoration: underline;
		}

ul.recent_articles,
ul.list-category,
ul.linklist,
ul.wet_recent_comments,
ul.rssMenu { /* various linklists - naming comes from plugin or cms - */
	list-style: none;
	margin: -5px 12px 30px 6px;
}

		.recent_articles li,
		.list-category li,
		.linklist li,
		.wet_recent_comments li,
		.rssMenu {
			background: url('../images/layout/el_contentside_litem.gif') no-repeat left 7px;
			padding-left: 12px;
		}

		.wet_recent_comments li {
			margin-bottom: 9px;
		}

div.link-tagcloud {
	margin: 0 10px 30px 6px;
}

#grid-content-side dl.aa { /* archive */
	background: none;
	margin: -5px 3px 5px 6px;
}

		#grid-content-side dl.aa dt {
			float: none;
			margin-right: 0;
			width: auto;
		}
		
		#grid-content-side dl.aa dd {
			background: url('../images/layout/el_contentside_litem.gif') no-repeat left 7px;
			padding-left: 12px;
			margin: 0 0 0 10px;
		}

div.search { /* searchform */
	margin: -5px 0 30px;
}

		.search input {
			border: none;
			margin-left: 6px;
		}

span.feed { /* feeds */
	background: url('../images/layout/icons/ic_feed.png') no-repeat left center;
	display: block;
	padding-left: 20px;
}

		.atom { margin: -5px 0 5px 6px; }
		.rss { margin: 0 0 30px 6px; }

div#flickr_badge_wrapper { /* flickr */
	margin-left: 6px;
	padding: 10px 0;
}

		div.flickr_badge_image {
			float: left;
			margin: 0 5px 5px 0;
		}
		
				.flickr_badge_image img {
					border: 1px solid #005288;
					padding: 2px;
				}

/* - contact - */

div#map_canvas {
	height: 252px;
	margin-bottom: 8px;
	width: 609px;
}

div.vcard { /* microformats ready */
	margin: 0 6px 5px 6px;
}
		
		.vcard img {
			vertical-align: bottom;
		}
		
		.vcard h5 {
			color: #8f866c;
			margin: 30px 0 10px;
		}
		
		.vcard span {
			line-height: 155%;
		}

				span.org {
					display: block;
					font-weight: 700;
				}

				span.street-address,
				span.country-name {
					display: block;
					margin-left: 22px;
				}
		
				span.postal-code {
					margin-left: 22px;
				}
		
				span.tel {
					display: block;
				}

				span.type {
					margin-top: 6px;
				}

		.vcard a {
			color: #005288;
		}

				.vcard a:hover {
					text-decoration: underline;
				}

/* imprint */

#imprint div.entry-text {
	float: right;
	padding-right: 7px;
	width: 68%;
}

ul.navigation-credits {
	list-style: none;
	margin: 0 6px 10px;
}

		.navigation-credits h5 {
			color: #8f866c;
			margin: 15px 0 5px 0;
		}

		.navigation-credits li span {
			display: block;
			margin-bottom: 5px;
		}

		.navigation-credits li span.deeluxe {
			background: url(../images/layout/el_logo_deeluxe.gif) no-repeat left center;
		}
		
		.navigation-credits li span.cms {
			background: url(../images/layout/el_logo_txp.gif) no-repeat left center;
		}

		.navigation-credits li a {
			color: #005288;
			display: block;
			padding: 5px 0 5px 25px;
		}

				.navigation-credits li a:hover { text-decoration: underline; }

/* error page */

.error-msg {
	line-height: 160%;
	margin: 15px 0;
}


/* --- FONTSIZES --- */

.teaser-blog h3,
.teaser-nav h3,
h4.error-status											{ font-size: 1.95em; }
#grid-content-side h4,
.entry-text h3,
.entry-text h4,
.vcard h5		 										{ font-size: 1.2em; }
.entry-text h5,
p.error-msg												{ font-size: 1.1em; }
.navigation-main li span span,
.entry-text h6,
input													{ font-size: 1em; }
p.found,
.entry-details,
.comments div span,
#grid-content-side dl.aa								{ font-size: .95em; }
.teaser-contact, .navigation-main li span,
#grid-content-side dl,
span.tags												{ font-size: .85em; }


/* --- HELPER --- */

.clearfix:after {
	content: ".";
	display: block;
	height: 0;
	clear: both;
	visibility: hidden;
}
		.clearfix { display:inline-block; }
		/* Hide from IE Mac \*/
		.clearfix { display:block; }
		/* End hide from IE Mac */

		* html .clearfix { height:1px; }