/* ================================================================================
 *
 * ### Wordpress ###
 * Theme Name: davidhellmann
 * Theme URI: http://www.davidhellmann.com
 * Description: Theme for David Hellmann
 * Version: 2.0
 * Author: David Hellmann
 * Author URI: http://www.davidhellmann.com
 *
 *
 * @project David Hellmann
 * @version 2.0
 * @author David Hellmann
 * @copyright 2009 by David Hellmann - Grafikdesign, Webdesign, Webentwicklung
 *
 *
 * @colordef #000 Farbton/Beschreibung (Einsatzort)
 *
================================================================================ */


/* ================================================================================

   Tooltip

================================================================================ */


#tooltip {
	position:absolute;
	background: #2b251c;
	padding:10px 15px;
	line-height:20px;
	font-size:12px;
	color:#fff;
	display:none;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    z-index: 99999;
    font:normal 13px/15px "Trebuchet MS", Arial, Helvetica, sans-serif;
    left: 14px; top: 30px;
}

a.tweetthis {
	width:50px;
	position: absolute;
	left:0;
	top: 49px;
}


/* ================================================================================

   CSS Reset

================================================================================ */


* {
	padding:0;
	margin:0;
	border:0;
	text-decoration:none;
	list-style:none;
}


/* ================================================================================

   Font Face

================================================================================ */


@font-face { font-family:GraublauWeb; src:url(http://www.davidhellmann.com/wordpress/wp-content/themes/davidhellmann/fonts/GraublauWeb.otf) format("opentype") }
@font-face { font-family:GraublauWeb; src:url(http://www.davidhellmann.com/wordpress/wp-content/themes/davidhellmann/fonts/GraublauWebBold.otf) format("opentype"); font-weight:bold }


/* ================================================================================

   Allgmeine Klassen

================================================================================ */


del {
	text-decoration: line-through;
	font-style: italic;
}

italic {
	font-style: italic;
}

.rc5 {
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;	
}

.rc10 {
	-webkit-border-radius:10px;
    -khtml-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;	
}

.mt40 { margin-top:40px; }

.mt20 { margin-top:20px; }

.mb25 { margin-bottom:25px; }


/* ================================================================================

   Links

================================================================================ */


a, a:link {
	color:#8d2c2d;
	font-weight:normal;
}

a:visited {
	color: #8d2c2d;
}

a:focus{
	outline: none;
}

a:link:hover,
a:visited:hover {
		color:#8d2c2d;
		border-bottom: 1px dotted #453e34;
}

a:link:active,
a:visited:active {
	color: #8d2c2d;

}



/* ================================================================================

   More Link

================================================================================ */


a.more-link,
a.back2portfolio,
a.showDetails {
	float: left;
	clear: both;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    background:url(images/bgOverlayDark.jpg) repeat;
	padding: 10px 15px;
	color: #453e34;
	font:normal 20px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
	margin: 20px 0 20px 65px;
}

a.back2portfolio,
a.showDetails {
	clear:both;
	float:left;
	margin:0 0 10px 0;
	color:#453e34;	
	padding: 15px;
	background:url(images/bgOverlayDark.jpg) repeat;
	font:normal 18px/18px GraublauWeb, Arial, Helvetica, sans-serif;
	white-space: nowrap;
}

a.showDetails {
	margin:40px 0 10px 0;
}

a.more-link:hover {
	border: none;
	color: #fff;
	background: #1c7734;
}

a.back2portfolio:hover,
a.showDetails:hover {
	color:#fff;
	background: #1c7734;
	border: none;
	padding: 15px;
}


/* ================================================================================

   Body

================================================================================ */


body {
	background:url(images/pageBg.png) center top repeat;
	font:normal 15px/25px Georgia, "Times New Roman", Times, serif;
	color:#34332d; /*4c4638;*/
}

/* ================================================================================
   
   Meta Top   
   
================================================================================ */

#metaTop {
	width: 100%;
	background: url(images/metaTopBg.png) center top repeat-x;
	height: 45px;	
	position: fixed !important;
	position: absolute;
	z-index: 50;
	top: 0;
}

	#metaTop #metaTopContent {
		color: #333;
		font:normal 15px/38px "Trebuchet MS", Arial, Helvetica, sans-serif;
		width: 920px;
		padding: 0;
		margin: 0 auto;
		position:relative;
	}
		
		#metaTop #metaTopContent #searchHead {
			position:absolute;
			right:0; top:0px;
		}
		
			#metaTop #metaTopContent #searchHead .searchInput form {
				margin:0;
				padding:0;
			}
			
			
			#metaTop #metaTopContent #searchHead .searchInput {
				background:#f4f3ee;
				padding:2px 4px;
				border:1px solid #dfded9;
				color:#8c897d;
				width:130px;
				margin:0 20px 0 0;
			}
			
			#metaTop #metaTopContent #searchHead .searchInput:focus {
				color:#453e34;
				border:1px solid #c0bcb0;
				background:#dfded9;
			}
				
			#metaTop #metaTopContent #searchHead .searchSubmit {
				background:#dfded9;
				padding:2px 3px;
				font-weight:bold;
				color:#a9a699;
				cursor:pointer;
				width:35px;
			}
			
			#metaTop #metaTopContent #searchHead .searchSubmit:hover {
				background:#2d758d;
				color:#fff;
			}
	
		#metaTop #metaTopContent a {
			color: #2d758d;
		}
		
		#metaTop #metaTopContent a:hover {
			color: #2d758d;
		}


/* ================================================================================
   
   Head
   
================================================================================ */

#head {
	margin: 0 auto;
	width: 960px;
	height: 240px;
	position: relative;
}

	#head h1#logo a {
		width: 240px;
		height: 240px;
		background: url(images/spriteGrafik.png) left top no-repeat;
		position: absolute;
		left:0px;
		top: 0;
		z-index: 5;
		text-indent: -99999px;
	}
	
	#head h1#logo a:hover {
		border: none;
		background: url(images/spriteGrafik.png) 0 -430px no-repeat;
	}

	/* ================================================================================
	
	   Main Navigation
	
	================================================================================ */
	
	
	#head ul#nav {
		width:560px;
		height: 80px;
		position: absolute;
		left: 400px;
		top:160px;
	}
	
		ul#nav li {
			float:left;
			height:80px;
		}
		
			ul#nav li a.start {
				display:block;
				background:url(images/spriteGrafik.png) -250px 0 no-repeat;
				height:80px;
				width:94px;
				text-indent:-9999px;
			}
			
			ul#nav li a.start:hover {
				background-position: -250px -90px;
				border: none;
			}
			
			ul#nav li a.start-akt {
				background-position: -250px -180px;
			}
			
			ul#nav li a.portfolio {
				display:block;
				background:url(images/spriteGrafik.png) -344px 0 no-repeat;
				height:80px;
				width:141px;
				text-indent:-9999px;
			}
			
			ul#nav li a.portfolio:hover {
				background-position: -344px -90px;
				border: none;
			}
			
			ul#nav li a.portfolio-akt {
				background-position: -344px -180px;
			}
			
			ul#nav li a.blog {
				display:block;
				background:url(images/spriteGrafik.png) -485px 0 no-repeat;
				height:80px;
				width:85px;
				text-indent:-9999px;
			}
			
			ul#nav li a.blog:hover {
				background-position: -485px -90px;
				border: none;
			}
			
			ul#nav li a.blog-akt {
				background-position: -485px -180px;
			}
			
			ul#nav li a.about {
				display:block;
				background:url(images/spriteGrafik.png) -570px 0 no-repeat;
				height:80px;
				width:107px;
				text-indent:-9999px;
			}
			
			ul#nav li a.about:hover {
				background-position: -570px -90px;
				border: none;
			}
			
			ul#nav li a.about-akt {
				background-position: -570px -180px;
			}
			
			ul#nav li a.contact {
				display:block;
				background:url(images/spriteGrafik.png) -677px 0 no-repeat;
				height:80px;
				width:133px;
				text-indent:-9999px;
			}
			
			ul#nav li a.contact:hover {
				background-position: -677px -90px;
				border: none;
			}
			
			ul#nav li a.contact-akt {
				background-position: -677px -180px;
			}
			
	ul#nav li a:active {
	  position: relative;
	  top: 0px;
	}

	
	
	/* ================================================================================
	   
	   Bottom Navi
	   
	================================================================================ */
	
	
	#content #naviBottom {
		position: absolute;
		left: 10px;
		bottom: -220px;
		line-height: 20px;
		z-index: 40;
	}
	
		#content #naviBottom li {
			float: left;
			padding: 0 10px 0 0;
		}
		
		#content #naviBottom li.clear {
			padding: 20px 10px 0 0;
			clear: both;
		}
		
			#content #naviBottom li a {
				color: #8d2c2d;
			}
	

/* ================================================================================
   
   Wrapper
   
================================================================================ */

#wrapper {
	width: 960px;
	margin: 0 auto;
}


/* ================================================================================
   
   Headline
   
================================================================================ */

h2 {
	font:normal 60px/60px GraublauWeb, Arial, Helvetica, sans-serif;
	color: #453e34;
	letter-spacing: -5px;
}

h3, h4 {
	color: #453e34;
	font:normal 25px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
	letter-spacing: -1px;
}

	h3.portfolioOverview {
		float: left;
		clear: both;
		margin: 20px 0 40px 170px;
		text-align: right;
	}
	
		h3.portfolioOverview a {
			font:normal 13px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
			letter-spacing: normal;
		}


 
/* ================================================================================
   
   Content
   
================================================================================ */

#content {
	width: 960px;
	float: left;
	background:url(images/contentBg.png) center bottom no-repeat;
	padding: 80px 0 300px 0;
	position: relative;
}

	/* ================================================================================
	   
	   Hello Text
	   
	================================================================================ */
	

	#content #helloText {
		width: 560px;
		height: 480px;		
		background:url(images/spriteGrafik.png) -820px 0 no-repeat;
		float: left;
		position: relative;
		font:normal 20px/30px "Trebuchet MS", Arial, Helvetica, sans-serif;
		letter-spacing: -1px;
		color: #5c5a53;
	}
	
		#helloText h2 {
			position: absolute;
			left: 250px;
			top:70px;
		}
		
		#helloText p.absatz1 {
			position: absolute;
			left: 250px;
			top:154px;
			width: 310px;
		}
		
		#helloText p.absatz2 {
			position: absolute;
			left: 215px;
			top:304px;
			width: 345px;
		}


			#helloText p.absatz1 strong,
			#helloText p.absatz2 strong {
				color: #47443b;
				font-weight: strong;
			}
			

	/* ================================================================================
	   
	   Latest Portfolio
	   
	================================================================================ */
	
	#content h2.portfolioLatest {
		float: left;
		width: 380px;
		padding: 0 0 0 6px;
	}
	
	#content h3.portfolioLatest {
		font:normal 15px/12px "Trebuchet MS", Arial, Helvetica, sans-serif;
		color: #453e34;
		float: left;
		width: 380px;
		padding: 0 0 0 10px;
	}
	
	
	#portfolioLatest {
		float: left;
		width: 400px;
		padding: 10px 0;
	    margin: 15px 0 0 0;	
	    position: relative;
	}
	
	#portfolioLatest ul {
		float: left;
	}
	
		#portfolioLatest ul li {
			float: left;
			margin: 0 0 2px 10px;
			width: 121px;
			position: relative;
		}
			
			#portfolioLatest ul li a:hover {
				border:none;
			}
		
			#portfolioLatest ul li a img {
				padding: 7px;
				background:url(images/bgOverlayDark.jpg) repeat;
				border: 1px solid #8c897d;
			    -moz-box-shadow:inset 0 0 0 #333;
			    -webkit-box-shadow:inset 0 0 0 #333;
			    box-shadow:inset 0 0 0 #333;
			}
			
			#portfolioLatest ul li a:hover img {
				border: 1px solid #b5b1a4;
				background: #fff;
				background:url(images/bgOverlayDark.jpg) repeat;
			    -moz-box-shadow:inset 0 0 5px #333;
			    -webkit-box-shadow:inset 0 0 5px #333;
			    box-shadow:inset 0 0 5px #333;
			}
			
	#portfolioLatest a.portfolioOverview,
	#blogContent a.readTheBlog,
	#contentBlog a.showArchiv {
		position: absolute;
	    background:url(images/bgOverlayDark.jpg) repeat;
		padding: 10px 15px;
		color: #453e34;
		font:normal 20px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
	}
	
		#portfolioLatest a.portfolioOverview{
			top: 368px;
			right: 7px;
		}
			
		#blogContent a.readTheBlog {
			bottom: -70px;
			right: 250px;
		}
		
		#contentBlog a.showArchiv {
			bottom: 0px;
			right: 10px;
		}
	
	#portfolioLatest a.portfolioOverview:hover,
	#blogContent a.readTheBlog:hover,
	#contentBlog a.showArchiv:hover {
		border: none;
		color: #fff;
		background: #1c7734;
	}




/* ================================================================================
   
   BlogContent Startseite
   
================================================================================ */

#blogContent {
	float: right;
	width: 720px;
	margin: 80px 80px 0 0;
	position:relative;
}

	


	h2.blog {
		float: left;
		clear: both;
		width: 470px;
		margin: 0 0 30px 10px;
	}

	#blogContent ul.article {
		width: 480px;
		float: left;
	}
	
	
	
		#blogContent ul.article li,
		#contentBlog ul.secondArticles li {
			width: 220px;
			float: left;
			padding: 0 10px;
		}
		
		#contentBlog ul.secondArticles li {
			width: 280px;
			height: 380px;
			float: left;
			padding: 0 30px 0 10px;
		}
		
			#blogContent ul.article li h3 a,
			#contentBlog ul.secondArticles li h3 a {
				color: #2d758d;
				font:normal 25px/25px Georgia, "Times New Roman", Times, serif;
			}
			
			#blogContent ul.article li h3 a:hover,
			#contentBlog ul.secondArticles li h3 a:hover {
				color: #175f77;
				border: none;
			}
			
			#blogContent ul.article li .articleMeta,
			#contentBlog .firstArticle .articleMeta,
			#contentBlog .articleBox .articleMeta,
			#contentBlog ul.secondArticles li .articleMeta {
				font:normal 13px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
				color: #555;
			}
			
			#contentBlog .firstArticle .articleMeta,
			#contentBlog .articleBox .articleMeta {
				margin: 10px 0 40px 80px;
				font-size: 15px;
			}
			
			#contentBlog .articleBox .googleAd {
				margin:20px 0 0 0;
				float:left;
			}
			
			#contentBlog .articleBox .postMeta {

				float:left;
				background:url(images/bgOverlayDark.jpg) repeat;
				-webkit-border-radius:5px;
				-khtml-border-x;radius: 5px;
				-moz-border-radius: 5px;
				border-radius: 5px;
				margin:40px 0 80px 80px;
				padding:20px;
				width:420px;
			}
			
			#blogContent ul.article li .articleMeta a,
			#contentBlog .firstArticle .articleMeta a,
			#contentBlog .articleBox .articleMeta a,
			#contentBlog ul.secondArticles li .articleMeta a {
				color: #8d2c2d;
			}

			
			#blogContent ul.article li p.article,
			#contentBlog ul.secondArticles li p.article {
				float: left;
				margin: 25px 0 0 0;
			}
				
			
		
	
	#blogContent .cats {
		float: right;
		width: 150px;
		padding: 0 0 0 10px;
	}
	
		#blogContent .cats a {
			font:normal 15px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
		}
		
		#blogContent .cats h3 {
			margin: 25px 0 16px 0;
			width:140px;
			font:normal 25px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
			letter-spacing: -2px;
			float: left;
			margin: 0 0 20px 0;
		}
		
		
		
		#content #contentBlog {
			width: 640px;
			float: left;
			position:relative;
		}
		
			#contentBlog .firstArticle,
			#contentBlog .articleBox{
				float: left;
				padding: 0 0 40px 0;
				margin: 0 10px;
				width: 620px;
				position: relative;	
				background:url(images/borderZacken.png) center bottom repeat-x;	
			}
			
				#contentBlog .firstArticle  h2,
				#contentBlog .articleBox  h2 {
					color: #175f77;
					margin: 0 0 0 80px;
					width: 460px;
				}
				
				#contentBlog .firstArticle  h3,
				#contentBlog .articleBox  h3,
				#contentBlog .firstArticle  h4,
				#contentBlog .articleBox  h4 {
					margin: 40px 0 10px 0;
					float:left;
					width: 540px;
					_font-weight:bold;
					background:url(images/borderZacken.png) center bottom repeat-x;
					padding:0 0 20px 0;
				}
		
				#contentBlog .firstArticle  h2 a,
				#contentBlog .articleBox  h2 a {
					color: #2d758d;
				}
				
				#contentBlog .firstArticle  h2 a:hover,
				#contentBlog .articleBox  h2 a:hover {
					color: #175f77;
					border: none;
				}
				
				#contentBlog .firstArticle  p,
				#contentBlog .articleBox  p {
					width: 460px;
					float: left;
					padding: 20px 80px 20px 80px;
				}
				
				#contentBlog .firstArticle  ul,
				#contentBlog .articleBox  ul,
				#contentBlog .firstArticle  ol,
				#contentBlog .articleBox  ol {
					width: 420px;
					float: left;
					padding: 20px 80px 20px 120px;
				}
				
					#contentBlog .firstArticle  ul li,
					#contentBlog .articleBox  ul li {
						width: 420px;
						float: left;
						list-style-type: disc;
					}

					#contentBlog .firstArticle  ol li,
					#contentBlog .articleBox  ol li {
						width: 420px;
						float: left;
						list-style-type: decimal;
					}
				
				#contentBlog .firstArticle  p img.alignright,
				#contentBlog .articleBox  p img.alignright,
				contentBlog .firstArticle  p img.right,
				#contentBlog .articleBox  p img.right {
					float:right;padding: 9px;
					background:url(images/bgOverlayDark.jpg) repeat;
					border: 1px solid #8c897d;	 
					-webkit-border-radius:5px;
					-khtml-border-radius: 5px;
					-moz-border-radius: 5px;
					border-radius: 5px;
					margin:0 0 20px 20px;
				}
				
				#contentBlog .firstArticle  p.bild,
				#contentBlog .articleBox  p.bild,
				#contentBlog .firstArticle .wp-caption,
				#contentBlog .articleBox .wp-caption {
					width: 620px;
					float: left;
					padding: 20px 0;
					position: relative;
				}
				
				#contentBlog .firstArticle  p.fancybox ,
				#contentBlog .articleBox  p.fancybox {
					width: 470px;
					float: left;
					padding: 20px 0 20px 72px;
				}
				
					#contentBlog .firstArticle  p.bild img,
					#contentBlog .articleBox  p.bild img,
					#contentBlog .firstArticle .wp-caption img,
					#contentBlog .articleBox .wp-caption img {
						padding: 9px;
						background:url(images/bgOverlayDark.jpg) repeat;
						border: 1px solid #8c897d;	 
						-webkit-border-radius:5px;
						-khtml-border-radius: 5px;
						-moz-border-radius: 5px;
						border-radius: 5px;	
					}
					
						#contentBlog .firstArticle .wp-caption .wp-caption-text,
						#contentBlog .articleBox .wp-caption .wp-caption-text {
							position:absolute;
							left:20px; top:7px;
							background:url(images/bgOverlayDark.jpg) repeat;
							border: 1px solid #8c897d;	 
							padding:10px 15px;
							color:#2b251c;
							-webkit-border-radius:5px;
						    -khtml-border-radius: 5px;
						    -moz-border-radius: 5px;
						    border-radius: 5px;
						    z-index: 45;
						    font:italic normal 15px/15px "Trebuchet MS", Arial, Helvetica, sans-serif;
						    width: auto;
						}
					
					#contentBlog .firstArticle  p.fancybox img,
					#contentBlog .articleBox  p.fancybox img {
						padding: 5px;
						background:url(images/bgOverlayDark.jpg) repeat;
						border: 1px solid #8c897d;	 
						-webkit-border-radius:5px;
						-khtml-border-radius: 5px;
						-moz-border-radius: 5px;
						border-radius: 5px;	
					}
					
					#contentBlog .firstArticle  p.fancybox a,
					#contentBlog .articleBox  p.fancybox a {
						float:left;
						margin:0 0 3px 9px;
					}
					
					#contentBlog .firstArticle  p.fancybox a:hover,
					#contentBlog .articleBox  p.fancybox a:hover {
						border-bottom:none;
					}
				
				#contentBlog ul.secondArticles {
					width: 640px;
					float: left;
					margin: 60px 0;
				}
	

/* ================================================================================

   Portfolio Preview

================================================================================ */

ul.portfolioPreview {
	float:left;
	clear:both;
	width:940px;
	padding: 0 10px;
}

	ul.portfolioPreview li {
		float:left; 
		clear:both; 
		width:940px; 
		margin:0 0 40px 0; 
		padding:0 0 55px 0;  
		background:url(images/borderZacken.png) center bottom repeat-x;
	}
	
		ul.portfolioPreview li p.browser img,
		ul.portfolioPreview li p.bild img {
			width:600px;
			float:left;
			clear:both;
			padding: 9px;	
			background:url(images/bgOverlayDark.jpg) repeat;
			border: 1px solid #8c897d;	
			-webkit-border-radius:5px;
		    -khtml-border-radius: 5px;
		    -moz-border-radius: 5px;
		    border-radius: 5px;	
		}
		
		ul.portfolioPreview li p.bild img {
			margin: 20px 0 0 0;
		}
		
		ul.portfolioPreview li .portfolioPics {
			float: left;
			width: 620px;
		}
		
		ul.portfolioPreview li div.portfolioMeta {
			float: right;
			width: 300px;
			margin: 40px 0 0 10px;
		}
		
		
			ul.portfolioPreview li div.portfolioMeta ul.weitereArbeiten {
				float:left;
				clear: both;
			}
			
				ul.portfolioPreview li div.portfolioMeta ul.weitereArbeiten li {
					float:left;
					clear: both;
					background: none;
					width: 300px;
					padding: 0;
					margin: 0;
				}
		
			ul.portfolioPreview li div.portfolioMeta h3 {
				margin-bottom: 40px;
			}
			
			
		
			ul.portfolioPreview li div.portfolioMeta h4 {
				font:normal 12px/12px Arial, Helvetica, sans-serif;
				letter-spacing: normal;
				border-top: 1px dotted #453e34;
				padding: 2px 0 0 0;
			}
			
			ul.portfolioPreview li div.portfolioMeta p {
				margin: 10px 0 0 0;
				padding: 0;
			}


/* ================================================================================
   
   Portfolio Overview
   
================================================================================ */

h2.portfolioOverview {
	float: left;
	clear: both;
	width: 400px;
	margin: 0 0 30px 5px;
}

ul.portfolioQuickView {
	float:left;
	clear:both;
	width:860px;
	margin:0 0 20px 10px;
	padding: 0 0 50px 80px;
	background:url(images/borderZacken.png) center bottom repeat-x;
}


	ul.portfolioQuickView li {
		float:left;
		margin: 0 9px 3px 0;
	
	}
	
	ul.portfolioQuickView li a {
		position: relative;
		display: block;
	
	}
	
		ul.portfolioQuickView a img {
			padding: 8px;
			background:url(images/bgOverlayDark.jpg) repeat;
			border: 1px solid #8c897d;	
			-webkit-border-radius:5px;
		    -khtml-border-radius: 5px;
		    -moz-border-radius: 5px;
		    border-radius: 5px;
		    -moz-box-shadow:inset 0 0 0 #333;
		    -webkit-box-shadow:inset 0 0 0 #333;
		    box-shadow:inset 0 0 0 #333;
		}
		
		ul.portfolioQuickView a:hover img {
			border: 1px solid #b5b1a4;
			background: #fff;
			background:url(images/bgOverlayDark.jpg) repeat;
		    -moz-box-shadow:inset 0 0 5px #333;
		    -webkit-box-shadow:inset 0 0 5px #333;
		    box-shadow:inset 0 0 5px #333;
		}
		
		ul.portfolioQuickView a:hover {
			border: none;
		}



/* ================================================================================

   Brotnavi Portfolio

================================================================================ */



.brotnavi {
	float:right;
	margin: 15px 170px 0 0;
	height:45px;
	width:300px;
}

.brotnavi li {
	float: right;
	clear: none;
	height:35px;
	margin: 0 0 0 7px;
}

.brotnavi-left li {
	float: left;
	clear: none;
	height:35px;
	margin: 0 0 0 7px;
}


.brotnavi li a {
	float:left;
	margin:0;
	color:#453e34;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
	font:normal 15px/15px GraublauWeb, Arial, Helvetica, sans-serif;
	padding: 10px;
	background:url(images/bgOverlayDark.jpg) repeat;
}

.brotnavi li a:hover {
	color:#fff;
	background: #1c7734;
	border: none;
}

.brotnavi li a.aktiv {
	color:#1c7734;
	border: none;
	background: none;
	padding: 10px;
}


/* ================================================================================

   Blog Comments

================================================================================ */


#contentBlog ol.commentlist,
#contentBlog ol.trackbacklist {
	float:left;
	width:620px;
	padding:0;
}

#contentBlog ol.commentlist li,
#contentBlog ol.trackbacklist li {
	float:left;
	width:620px;
	margin:40px 0 0 0;	
	list-style-type: none;
	position: relative;
}

#contentBlog ol.trackbacklist li {
	margin:10px 0 0 0;
}

#contentBlog ol.commentlist li .box {
	float:left;
	width:460px;
	margin:0 0 0 80px;
    position: relative;
}

#contentBlog ol.commentlist li .box .date {
	background:#7d796b;
	position:absolute;
	right: 0;
	top:20px;
	color:#fff;
	padding:0 5px;
	font:normal 12px/22px "Trebuchet MS", Arial, Helvetica, sans-serif;
	z-index:9;
	-moz-border-radius: 5px; 
	-webkit-border-radius: 5px; 
	border-radius: 5px;
}

#contentBlog ol.commentlist li.author .box .date {
	background:#2d758d;
}


#contentBlog ol.commentlist li .box h4 {
	width:460px;
	background:none;
	border-bottom:3px solid #7d796b;
	padding:0 0 5px 0;
	margin:0 0 10px 0;
	letter-spacing: -1px;
	font-weight:normal;
}

#contentBlog ol.commentlist li.author .box h4 {
	border-bottom:3px solid #2d758d;
}

#contentBlog ol.commentlist li .box h4 a,
#contentBlog ol.commentlist li .box h4 a.small {
	color:#8d2c2d;
}

#contentBlog ol.commentlist li .box h4 a:hover,
#contentBlog ol.commentlist li .box h4 a.small:hover  {
	color:#711617;
}

#contentBlog ol.commentlist li .box h4 a.small {
	font:normal 15px/20px "Trebuchet MS", Arial, Helvetica, sans-serif;
	text-transform:uppercase;
}

#contentBlog ol.commentlist li .box h4 img {
	float:left;
	margin:0 10px 0 0;
}


#contentBlog ol.commentlist li .box p {
	float:right;
	width:380px;
	padding:10px 0 0 0;
	font-style: italic;
}



#contentBlog ol.commentlist li p.simple_comment_quotes {
	text-align: right;
	color: #938A72;
	padding: 20px 0 10px 0;
}

#contentBlog ol.commentlist li p.simple_comment_quotes a {
	font-size: 11px;
}

#contentBlog ol.commentlist li p.simple_comment_quotes span {
	font-size: 18px;
	color: #c1bfb7;
	font-style: italic;
	font-weight: bold;
	padding: 0 5px 0 0;
}


#contentBlog ol.commentlist li.alt .box p {
	background:#7d796b;
}

#contentBlog ol.commentlist li .box blockquote,
#contentBlog ol.commentlist li.author .box blockquote{
	float:right;
	padding:0;
	margin:16px 40px 20px 0;
	width:280px;
	padding:10px;
	background:url(images/bgOverlayDark.jpg) repeat;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
}

#contentBlog ol.commentlist li .box blockquote p,
#contentBlog ol.commentlist li.author .box blockquote p {
	float:right;
	padding:0;
	margin:10px 0;
	width:260px;
	padding:0 10px;
	color:#464337;
}

#contentBlog ol.commentlist li .gravatar {
	position: absolute;
	left: 0;
	top: 60px;
	padding: 1px;
	border: 4px solid #7d796b;
	background:#fff;
	height:50px;
}

#contentBlog ol.commentlist li.author .gravatar {
	background:url(images/bgOverlayDark.jpg) repeat !important;
	border:5px solid #2d758d;
}

#form {
	float:left;
	clear:both;
	width:580px;
	padding:20px 20px 10px 20px;
	margin:10px 0 0 0;
	background:url(images/bgOverlayDark.jpg) repeat;
	-webkit-border-radius:10px;
    -khtml-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
}

#form p.subscribe-to-comments {
	padding: 10px 20px 10px 0;
	margin: 20px 0 0 0;
}

.formleft {
	float:left;
	width:580px;
}

.formright {
	float:right;
	clear: both;
	width:580px;
}

.forminput {
	padding:10px;
	width:356px;
	margin:2px 0 5px 0;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    float: left;
    clear: both;
    font-size: 15px;
}

.formcomment {
	padding:10px;
	width:556px;
	margin:2px 0 5px 0;
	height:300px;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    float: left;
    clear: both;
    font-size: 15px;
}

#form small {
	padding:10px 0 0 10px;
	font-size:21px;
    float: left;
    clear: both;
}

.submitButton {
	font-size:20px;
	background:#8d2c2d;
	color:#fff;
	padding:10px;
	cursor:pointer;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    margin: 10px 0 0 0;
    float: left;
    clear: both;
} 

.submitButton:hover {
	background:#1c7734;
}  



/* ================================================================================

   Archiv

================================================================================ */

.contentBlog .archiv {
	width:940px;
	padding:10px;
	float:left;
}

	.contentBlog .archiv li {
		float:left;
		clear:both;
		padding:10px 0;
		border-bottom:1px dotted #7d796b;
		width:940px;
	}
	
		.contentBlog .archiv .first {
			float:left;
			clear:both;
			padding:30px 20px 0 0;
			width:280px;
		}
		
		.contentBlog .archiv .second {
			float:left;
			clear:none;
			padding:30px 10px 0 20px;
			width:470px;
		}
		
		.contentBlog .archiv .third {
			float:left;
			clear:none;
			padding:30px 0 0 0;
			width:140px;
			text-align: right;
		}
	
		.contentBlog .archiv a.headline {
			font-size:25px;
			color: #2d758d;
		}
		
		.contentBlog .archiv a.headline:hover {
			color: #175f77;
			border: none;
		}


/* ================================================================================

   About

================================================================================ */



#about, #about ul.projekte {
	width: 960px;
	float: left;
	position: relative;
}

#about h4 {
	color: #175f77;
	font:normal 25px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
	letter-spacing: -1px;
	width:100%;
	margin:0 0 25px 0;
}

#about .column-1 {
	float: left;
	clear: both;
	width: 300px;
	margin: 10px 10px 0 10px;
}

#about .column-2 {
	float: left;
	width: 300px;
	margin: 10px 10px 0 10px;
}

#about .column-3 {
	float: left;
	width: 220px;
	margin: 10px 10px 0 90px;
}

#about .column-1 p, #about .column-2 p, #about .column-3 p {
	float: left;
	clear: both;
	width: 100%;
	padding: 0 0 21px 0;
}

#about .column-3 ul li.yes {
	float: left;
	clear: both;
	font-weight: bold;
}

#about .column-3 p img {
	float: left;
	clear: both;
	padding: 9px;
	background:url(images/bgOverlayDark.jpg) repeat;
	border: 1px solid #8c897d;	
	-webkit-border-radius:5px;
	-khtml-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:80px 0 6px 0;
}

#about ul.projekte li {
	margin: 10px;
	float: left;
	width: 420px;
	padding:20px;
	background:url(images/bgOverlayDark.jpg) repeat;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
	height:210px;
}

#about ul.projekte li p {
	margin: 0;
	padding: 0;
}

#about ul.projekte li img {
	float: left;
	padding: 9px;
	border: 1px solid #e7e4d9;
	background: #fff;
	margin: 0 20px 100px 0;
}


/* ================================================================================
   
   Sidebar
   
================================================================================ */

#content #sidebar {
	float: right;
	width: 320px;
}

#sidebar h2 {
	font:normal 25px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
	letter-spacing: -2px;
	float: left;
	margin: 80px 10px 20px 90px;
}

	#sidebar h3 a {
		color: #8d2c2d;
	}
	
	#sidebar h3 a:hover {
		border-bottom: none;
		color: #711617;
	}

#sidebar ul.cats,
#sidebar ul.comments,
#sidebar ul.article {
	float: left;
	margin: 0 10px 0 90px;
}

	#sidebar ul.cats li,
	#sidebar ul.comments li,
	#sidebar ul.article li {
		float: left;
		clear: both;
		padding: 10px 0;
		border-bottom: 1px dotted #453e34;
		width: 220px;
	}
	
	#sidebar ul.comments li {
		padding: 15px 0;
	}
	
	#sidebar ul.article li {
		padding: 15px 0 0 0;
	}
	
	#sidebar ul.cats li {
		float: left;
		clear: both;
		padding: 2px 0;
		border: none;
	}
		
		#sidebar ul.article li .articleMeta {
			font:normal 13px/25px "Trebuchet MS", Arial, Helvetica, sans-serif;
			color: #555;
		}
		
		#sidebar ul.article li p {
			padding: 20px 0;
		}
	

		#sidebar ul.comments li img {
			float: left;
			padding: 5px;
			margin: 6px 10px 0 0;
			background:url(images/bgOverlayDark.jpg) repeat;
			width: 25px;
			height: 25px;
		}


#sidebar .werbung {
	float: left;
	padding: 3px 3px 0 3px;
	margin: 40px 0 0 80px;
	background:url(images/bgOverlayDark.jpg) repeat;
}

.werbung a:hover {
	border: none;
}

/* ================================================================================
    
   Conctact Formular
   
================================================================================ */

#content .contentContact {
	float:left;
	padding:0 10px;
	width:940px;
}

.contactSidebar {
	float:right;
	width:300px;
	margin: 40px 0 0 20px;
}

.formmailer {
	float:left;
	width:500px;
	margin: 40px 0 0 ;
	background:url(images/bgOverlayDark.jpg) repeat;
	-webkit-border-radius:10px;
    -khtml-border-radius: 10px;
    -moz-border-radius: 10px;
    border-radius: 10px;
	padding:20px;
}

.formmailer form {
	float:left;
	
}

.formmailer p {
	width:460px;	
}

.formmailer small,
.formmailer label {
	padding:0 0 0 5px;
}

.formmailer .dd_name,
.formmailer .dd_mail,
.formmailer .dd_url,
.formmailer .dd_msg {
		width: 500px;
		margin:0 0 10px 0;
}

.formmailer .dd_name input,
.formmailer .dd_mail input,
.formmailer .dd_url input  {
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
	padding:5px;
	color:#453e34;
	font:normal 18px/23px Georgia, "Times New Roman", Times, serif;
	width:270px;
}

.formmailer .dd_msg textarea {
	width: 490px;
	height: 400px;
	font:normal 18px/23px Georgia, "Times New Roman", Times, serif;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
	padding:5px;
	color:#453e34;
}

.error_msg {
	font-weight:bold;
	color:#8d2c2d;
}

.pxs_css_spamcheck {
	display: none !important;
}

.formmailer .senden {
	font-size:20px;
	background:#8d2c2d;
	color:#fff;
	padding:10px;
	cursor:pointer;
	-webkit-border-radius:5px;
    -khtml-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
} 

.formmailer .senden:hover {
	background:#1c7734;
}  

/*




.formmailer .dd_name input,
.formmailer .dd_mail input,
.formmailer .dd_url input  {
	width: 260px;
	background: none;
	color:#3e382b;
	position: relative;
	top: 50px;
	left: 20px;
	padding: 5px 0;
	font:normal 16px/18px Georgia;
	border-bottom: 1px dotted #c3c2bd;
}

.formmailer .dd_mail input {
	left: 20px;
}

.formmailer .dd_url input {
	left: 10px;
}

.formmailer .senden {
		position: absolute;
		left: 750px;
		top: 330px;
		z-index: 2;
}


*/
	
/* ================================================================================
   
   Footer
   
================================================================================ */

#footer {
	width: 100%;
	background:url(images/footerBg.png) center top no-repeat;
	float: left;
	clear: both;
	margin: 200px 0 0 0;
	height: 800px;
	position: relative;
}



#bottomBar a {
	font:bold 11px/30px Arial, Helvetica, sans-serif;
	text-transform: uppercase;
	color: #ABA89A;
}

	#bottomBar .barContent {
		float: left;
		height: 30px;
		padding: 0 15px;
		line-height: 30px;
		border-right: 1px solid #050403;
	}
	
		.barContent a.icon {
			float: left;
			margin:5px 2px 0 2px;
			border: none;
			position: relative;
			clear: none;
		}
		
			.barContent a.icon span  {
				display: none;
			}
			
			.barContent a.icon:hover span  {
				display: block;
				position: absolute;
				left:50%; top:-35px;
				line-height: 25px;
				font-size: 10px;
				background: rgba(20, 15, 12, 1.0);
				color: #ABA89A;
				margin: 0 0 0 -50px;
				width: 100px;
				text-align: center;
				white-space: nowrap;
				border-radius:5px;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
			    -khtml-border-radius: 5px;
			}			
		
			#bottomBar .barContent a:hover {
				color: #fff;
			}

	#footer #footerContent {
		margin: 0 auto;
		width: 960px;
		position: relative;
	}
	
		#footer #footerContent .topButton {
			width: 121px;
			height: 142px;
			position: absolute;
			top:11px; right: 59px;			
			background:url(images/spriteGrafik.png) 0 -260px no-repeat;
			text-indent: -99999px;
		}
		
		#footer #footerContent .topButton:hover {
			border: none;			
			background:url(images/spriteGrafik.png) -121px -260px no-repeat;
		}
		
		#footerContent a {
			color: #8d2c2d;
		}
		
		#footerContent a:hover {
			border-bottom: 2px solid #8d2c2d;
			color: #fff;
		}
		
		#footerContent small {
			color: #bdb9ac;
		}
		
			#footerContent h3 {
				margin: 0 0 10px 0;
				color: #423e37;
			}


/* !funtionsBar ================================================================================ */

#functionsBar {
	position: fixed;
	left: 50%; bottom: -100px;
	height: 30px;
	width: 94%;
	margin: 0 0 0 -47%;
	background: #140f0c;
	border-radius:10px;
	-moz-border-radius: 10px;
	-webkit-border-radius: 10px;
	border-radius-bottomleft:0;
	border-radius-bottomright:0;
	-moz-border-radius-bottomleft: 0;
	-moz-border-radius-bottomright: 0;
	-webkit-border-bottom-left-radius: 0;
	-webkit-border-bottom-right-radius: 0;;
	box-shadow:0 0 10px #000;
	-moz-box-shadow:0 0 10px #000;
	-webkit-box-shadow: 0 0 10px #000;
	border: 1px solid #050403;
	border-bottom: none;
	font: normal 11px/15px Arial, Helvetica, sans-serif;
	color: #777;
	z-index: 99999;
}

/* !IE Fix ================================================================================ */

*html #functionsBar { /*--IE6 Hack - Fixed Positioning to the Bottom--*/
	margin-top: -1px; /*--Prevents IE6 from having an infinity scroll bar - due to 1px border on #footpanel--*/
	position: absolute;
	top:expression(eval(document.compatMode &&document.compatMode=='CSS1Compat') ?documentElement.scrollTop+(documentElement.clientHeight-this.clientHeight) : document.body.scrollTop +(document.body.clientHeight-this.clientHeight));
}

#functionsBar #inner {
	width: 100%;
	height: 30px;
	position: relative;
}

	#inner a.hide {
		background: #000;
		width: 50px;
		text-align: center;
		padding: 3px 0;
		position: absolute;
		right: 20px;
		font-weight: bold;
		font-size: 13px;
		bottom: 31px;
		color: #ABA89A;
	}
	
	#inner a.hide:hover {
		color: #fff;
		border:none;
	}
	
	#inner .innerLeft {
		float: left;
		line-height: 30px;
		padding: 0 10px;
		border-right: 1px solid #000;
	}
	
	#inner .innerRight {
		float: right;
		line-height: 30px;
		padding: 0 10px;
		border-left: 1px solid #000;
	}
	
		.innerLeft span{
			float: left;
			margin: 0 5px 0 0;
		}
		
		.innerLeft a,
		.innerRight a {
			font-weight: bold;
			color: #ABA89A;
		}
		
		.innerLeft a:hover,
		.innerRight a:hover {
			color: #fff;
		}
		
		.innerLeft a.icon{
			float: left;
			margin:4px 2px 0 2px;
			position: relative;
		}
		
			.innerLeft a.icon span {
				display: none;
			}
			
			.innerLeft a.icon:hover span {
				display: block;
				position: absolute;
				left: 50%; top: -30px;
				margin: 0 0 0 -40px;
				width: 80px;
				text-align: center;
				font-weight: bold;
				line-height: 22px;
				background: #050403;
				border-radius:5px;
				-moz-border-radius: 5px;
				-webkit-border-radius: 5px;
			}

#error404 {
	width:960px;
	height:860px;	
	background:url(images/404.jpg) no-repeat;
	text-indent:-99999px;
	margin:25px 0 0 0;
}

img#wpstats{display:none}