@import "fonts.css";
@import "forms.css";

/* <------------ Basic Layout ------------> */

* { 
	padding: 0; margin: 0; 
}

html {
	height: 100%;
}

body {
 	background: #ffffff url(images/bg_big.jpg) top left no-repeat;
}
	/* <------------ Wrapper ------------> */
	
	#wrapper { 
 		margin: 0 0 0 135px;
 		width: 900px;
	}
		/* <------------ Header Area ------------> */
		
		#header {
			height: 197px;
			width: 900px;
		}

			#logo {
				height: 65px;
				width: 190px;
				margin-top: 60px;
				float: left;
				background: url(images/logo.gif) top left no-repeat;
			}
			
			#logo a {
				height: 65px;
				width: 190px;
				display: block;
				text-indent: -900px;
			}
			
			#teaser {
				float: right;
				margin-top: 25px;
				height: 137px;
				width: 152px;
			}
			
				#teaser img {
					text-decoration: none;
					outline: none;
					border: none;
					height: 137px;
					width: 152px;
				}

			#menu {
				height: 65px;
				width: 500px;
				margin-top: 60px;
				float: left;
			}
				#menu ul {
					list-style: none;
				}
				
				#mainmenu li {
					text-align: center;
					float: left;
					height: 65px;
					width: 100px;
				}
				
				#mainmenu li a {
					display: block;
					font-size: 14px;
					font-weight: bold;
					color: #938f90;
					padding: 25px 0 0 0; 
				}
				
				#mainmenu li a:hover {
					color: #2d2b2d;
				}
				
				#mainmenu li a:visited {
					font-style: normal;
				}
				
				#mainmenu li a.home:hover {
					background: url(images/home_hover.gif) no-repeat;
				}		
				
				#mainmenu li a.folio:hover {
					background: url(images/folio_hover.gif) no-repeat;
				}	
				
				#mainmenu li a.about:hover {
					background: url(images/about_hover.gif) no-repeat;
				}	
				
				#mainmenu li a.contact:hover {
					background: url(images/contact_hover.gif) no-repeat;
				}
				
				#mainmenu li a.blog:hover {
					background: url(images/blog_hover.gif) no-repeat;
				}
				
				#mainmenu li a#home_active, #mainmenu li a#folio_active, #mainmenu li a#about_active, #mainmenu li a#contact_active, #mainmenu li a#blog_active {
					color: #2d2b2d;
					height: 65px;
					display: block;
				}
				
				#mainmenu li a#home_active {
					background: url(images/home_active.gif) no-repeat;
				}
				
				#mainmenu li a#folio_active {
					background: url(images/folio_active.gif) no-repeat;
				}
				
				#mainmenu li a#about_active {
					background: url(images/about_active.gif) no-repeat;
				}
				
				#mainmenu li a#contact_active {
					background: url(images/contact_active.gif) no-repeat;
				}
				
				#mainmenu li a#blog_active {
					background: url(images/home_active.gif) no-repeat;
				}
				
							
		/* <------------ Main Message ------------> */
		
		#main_content {
			clear: both;
			width: 810px;
			margin-bottom: 50px;
		}

			#mainmessage {
			margin-bottom: 5px;
			}
			
			
		/* <------------ Content ------------> */
		
		#content {
			clear: both;
		}		
			#content-left {
				width: 380px;
				margin-right: 50px;
				float: left;
			}
			
			#content-right {
				width: 450px;
				float: left;
			}
				
				#job_preview {
				}
				
					.preview_thumb {
						float: left;
						height: 83px;
						width: 377px;
						margin-bottom: 20px;
						background: url(images/preview_bg.png) no-repeat;
					}
						
						.preview_thumb img {
							height: 70px;
							width: 371px;
							margin: 3px 0 0 3px;
							border: none;
						}	
						
							.preview_cat-digital, .preview_cat-print, .preview_cat-photo, .preview_cat-priv {
								float: left;
								height: 70px;
								width: 70px;
								display: block;
								text-indent: -9000px;
							}
							
							.preview_cat-digital {
								background: url(images/preview_cats-digital.gif) top left no-repeat;
							}
								
							.preview_cat-print {
								background: url(images/preview_cats-print.gif) top left no-repeat;
							}
							
							.preview_cat-photo {
								background: url(images/preview_cats-photo.gif) top left no-repeat;
							}
							
							.preview_cat-priv {
								background: url(images/preview_cats-priv.gif) top left no-repeat;
							}
					
		/* <------------ Content Folio ------------> */
		
			.folio-left {
				width: 380px;
				margin-right: 50px;
				float: left;
			}
			
			.folio-right {
				width: 450px;
				float: left;
			}
		
			.category {
				float: left;
				width: 807px;
				margin-bottom: 15px;
				background: url(images/line.gif) bottom left no-repeat;
			}
			
			.divider {
				display: block;
				float: left;
				height: 27px;
				width: 810px;
			}
			
				.folio_item {
					margin-bottom: 25px;
				}
			
				.folio-pic, .folio-pic-m  {
					float: left;
					height: 146px;
					width: 377px;
					margin: 5px 0px 0px 0px;
					background: url(images/folio_bg.png) no-repeat;
				}
				
				.folio_bg {
					float: left;
					height: 146px;
					width: 377px;
					margin: 5px 0px 0px 0px;
					background: url(images/folio_bg.png) no-repeat;
				}
				
				.folio-pic-m img {
					border: none;
				}	
				
				.folio-pic-m a {
					height: 133px;
					width: 371px;
				}	
				
				.folio-pic img {
					height: 133px;
					width: 371px;
					margin: 3px 0 0 3px;
				}					
				
			.info {
				width: 371px;
			}
			
				.info a {
					clear: both;
					text-indent: -9000px;
					margin-left: 326px;
					margin-bottom: 5px;
					height: 13px;
					width: 45px;
					display: block;
					background: url(images/more_info.gif) top right no-repeat;
				}
			
		/* <------------ Content About ------------> */
		
		.skill {
			float: left;
			width: 380px;
			margin-bottom: 10px;
			padding-left: 25px;
			background: url(images/check.gif) top left no-repeat;
		}

		#lastfm {
			width: 380px;
			margin-bottom: 15px;
		}
		
		/* <------------ Content Contact ------------> */
		
		#adresse, #phono, #messenger, #mail, #profiles {
			float: left;
			width: 350px;
			margin-bottom: 10px;
			padding-left: 25px;
		}
		
		#adresse {
			background: url(images/adresse.gif) top left no-repeat;
		}
		
		#phono {
			background: url(images/phone.gif) top left no-repeat;
		}
		
		#messenger {
			background: url(images/messenger.gif) top left no-repeat;
		}
		
		#mail {
			background: url(images/mail.gif) top left no-repeat;
		}
		
		#profiles {
			background: url(images/profiles.gif) top left no-repeat;
		}
		
		#profiles a {
			font-weight: normal;
		}
		
		#success p {
			color: #41bc00;
		}

			
		/* <------------ Footer ------------> */
		
		#footer {
			float: left;
			clear: both;
			margin-top: 30px;
			height: 25px;
			width: 810px;
			background: url(images/footer_bg.gif) bottom repeat-x;
		}
		
			#copyright {
				clear: both;
				width: 180px;
				margin-right: 150px;
				float: left;
			}
			
			#impressum {
				width: 480px;
				float: left;
				text-align: right;
			}