html {
	margin: 0;
	padding: 0;
	border: 0;
	padding-left: 70px;
	background: white url('../img/bg-left.png') left top repeat-y;
	height: 100%;
}

body {
	margin: 0;
	padding: 0;
	border: 0;
	min-width: 860px;
	padding-right: 70px;
	background: white url('../img/bg-right.png') right top repeat-y;
	font-family: "Arial", sans-serif;
	font-size: 10pt;
	min-height: 100%;
}

#title {
	margin-top: 0;
	height: 219px;
	background: url('../img/logo.png') left top no-repeat;
	font-size: 1px;
	line-height: 10px;
	color: white;
	padding-right: 50px;
	behavior: url('/data/css/ie7-generatedcontent.htc');
}

#title::after, #title .ie7_after {
	display: block;
	content: "\a0";
	font-size: 1px;
	height: 210px;
	background: url('../img/animation.gif') right center no-repeat;
}

#menu {
	position: relative;
	display: block;
	background: url('../img/bg-menu.png') top repeat-x;
	margin-left: 30px;
	margin-right: 30px;
	height: 185px;
	margin-bottom: 7.5em;
}

#menu div {
	display: block;
	background: url('../img/bg-menu1.png') top left no-repeat;
	position: relative;
	height: 70px;
	margin: 0;
	width: 100%;
}

#menu a {
	display: block;
	position: absolute;
	bottom: 0;
	text-align: center;
	font-size: 1px;
	line-height: 100px;
	overflow: hidden;
	color: white;
	font-size: 1px;
	height: 46px;
	z-index: 2;
}

a[href='/werksleitung'] { width: 89px; left: 0%; background: url('../img/link-werksleitung.png') top no-repeat; }
a[href='/philosophie'] { width: 89px; left: 18%; background: url('../img/link-philosophie.png') top no-repeat; }
a[href='/lizenzen'] { width: 63px; left: 36%; background: url('../img/link-lizenzen.png') top no-repeat; }
a[href='/kontakt'] { width: 124px; right: 36%; background: url('../img/link-kontakt.png') top no-repeat; }
a[href='/gaestebuch'] { width: 82px; right: 18%; background: url('../img/link-gaestebuch.png') top no-repeat; }
a[href='/partner'] { width: 56px; right: 0%; background: url('../img/link-partner.png') top no-repeat; }

#menu div.leistungen {
	background: url('../img/bg-menu2.png') top left no-repeat;
	margin: 0;
	border: 0;
	padding: 0;
	margin-top: 15px;
	height: 90px;
	width: 100%;
	overflow: visible;
}

#menu div.leistungen a {
	bottom: auto;
	top: 23px;
	height: 0px;
	padding-top: 77px;
	width: 13%;
	color: black;
	line-height: 1.2;
	text-align: left;
	text-decoration: none;
	font-size: 1px;
	background-repeat: no-repeat;
	behavior: url('/data/css/ie7-generatedcontent.htc');
}

#menu div.leistungen a strong {
	display: block;
	font: inherit;
	color: #888;
	font-size: 110%;
}

#menu div.leistungen a:hover {
	display: block;
	position: absolute;
	z-index: 1;
	overflow: visible;
	left: 0%;
	right: 0%;
	padding-left: 1%;
	padding-right: 1%;
	font-size: 9pt;
	width: 98%;
	top: 23px;
	padding-top: 77px;
	height: 3em;
	text-decoration: none;
}

#menu div.leistungen a:before, #menu div.leistungen a > .ie7_before {
	display: block;
	margin-left: -1%;
	width: 102%;
	content: "\a0";
	height: 6.2em;
	margin-bottom: -5.8em;
	border: 1px solid #714027;
}

a[href='/grafikdesign/'] { left: 0%; background-image: url('../img/link-grafikdesign.png'); background-position: 0% top; }
a[href='/illustrationen/'] { left: 14.5%; background-image: url('../img/link-illustrationen.png'); background-position: 16.67% top; }
a[href='/2d-animationen/'] { left: 29%; background-image: url('../img/link-2d-animationen.png'); background-position: 33.33% top; }
a[href='/on-air-design/'] { left: 43.5%; background-image: url('../img/link-on-air-design.png'); background-position: 50% top; }
a[href='/bildretusche-fotomontage/'] { left: 58%; background-image: url('../img/link-bildretusche-fotomontage.png'); background-position: 66.67% top; }
a[href='/3d-texturen-matte-painting/'] { left: 72.5%; background-image: url('../img/link-3d-texturen-matte-painting.png'); background-position: 83.33% top; }
a[href='/concept-art/'] { left: 87%; background-image: url('../img/link-concept-arts.png'); background-position: 100% top; }

a[href='/grafikdesign/']:hover { background-image: url('../img/olink-grafikdesign.png'); }
a[href='/illustrationen/']:hover { background-image: url('../img/olink-illustrationen.png'); }
a[href='/2d-animationen/']:hover { background-image: url('../img/olink-2d-animationen.png'); }
a[href='/on-air-design/']:hover { background-image: url('../img/olink-on-air-design.png'); }
a[href='/bildretusche-fotomontage/']:hover { background-image: url('../img/olink-bildretusche-fotomontage.png'); }
a[href='/3d-texturen-matte-painting/']:hover { background-image: url('../img/olink-3d-texturen-matte-painting.png'); }
a[href='/concept-art/']:hover { background-image: url('../img/olink-concept-arts.png'); }

#content {
	position: relative;
	top: -1em;
	display: block;
	margin: 0;
	margin-left: 29px;
	margin-right: 29px;
	border: 1px solid #999;
	background: #e8e8e8;
	padding: 1ex;
	margin-top: 1em;
}

#content h1 {
	font-size: 130%;
}

#content h2 {
	font-size: 120%;
}

#content h3 {
	font-size: 110%;
}

#content.arbeitsproben, #content.empty {
	display: block;
	margin: 0;
	border: 0;
	background: white;
	padding: 0;
	margin-top: 1em;
}

.projekt {
	position: relative;
	display: block;
	margin: 0;
	margin-left: 29px;
	margin-right: 29px;
	border: 1px solid #999;
	background: #e8e8e8;
	padding: 1ex;
	margin-top: 1em;
}

.projekt .logo {
	margin: 0;
	margin-top: -2em;
	float: left;
	border: 1px solid #888;
	margin-bottom: 1ex;
	width: 137px;
	height: 93px;
	position: relative;
}

.projekt h1 {
	color: #888;
	margin: 0;
	height: 2em;
	font-size: 100%;
	padding-left: 150px;
	margin-right: 50%;
}

.projekt dl {
	background: transparent;
	display: block;
	margin: 0;
	margin-left: 150px;
	padding: 0;
	margin-right: 50%;
	position: relative;
	top: 1ex;
}

.projekt dt {
	display: block;
	height: 1.2em;
	width: 4em;
	margin: 0;
	margin-top: .2em;
	padding: 0;
}

.projekt dd {
	background: transparent;
	margin: 0;
	padding: 0;
	display: block;
	padding-left: 4em;
	margin-top: -1.2em;
}

.projekt p {
	clear: left;
	margin-right: 50%;
}

.end {
	clear: both;
	height: 1px;
}

.projekt .examples {
	display: block;
	float: right;
	width: 49%;
}

.projekt .examples div {
	width: 45%;
	display: block;
	float: left;
	font-family: inherit;
	font-size: 90%;
	font-weight: bold;
	font-variant: normal;
	margin: 2%;
	padding: 0;
}

.projekt .examples div .zoom {
	display: none;
	position: fixed;
	left: 70px;
	top: 0;
	right: 70px;
	bottom: 0;
	text-align: center;
	z-index: 10;
	background: white;
	width: auto;
	height: 100%;
	border: 0;
	margin: 0;
	padding: 0;
	line-height: 3;
}

.projekt .examples div div.zoom:active {
	z-index: -1;
}

.projekt .examples div .zoom:after {
	display: block;
	cursor: pointer;
	border: 0;
	width: 5em;
	margin-top: -1em;
	margin-left: auto;
	margin-right: auto;
	content: "Schließen";
}

.projekt .examples div .zoom img {
	border: 1px solid #888;
}

.projekt .examples div img.piktogramm {
	display: block;
	border: 1px solid #888;
	cursor: pointer;
}

.projekt .examples div:active .zoom {
	display: block;
}

.projekt .examples .zoom:hover {
	display: block;
}

.gaestebuch .entry {
	border: 1px solid black;
	margin-top: 1em;
	background: #fff;
	padding: 1ex;
}

.gaestebuch .entry .author {
	margin-left: -1ex;
	margin-right: -1ex;
	margin-top: -1ex;
	background: #888;
	border-bottom: 1px solid black;
	padding: 1ex;
}

.gaestebuch .entry .date {
	text-align: right;
	height: 2ex;
	margin-left: -1ex;
	margin-right: -1ex;
	margin-top: -3.5ex;
	padding-bottom: 2.5ex;
	padding-right: 1ex;
}

.gaestebuch #email, .gaestebuch #url {
	display: none;
}

.gaestebuch label {
	display: block;
	float: left;
	width: 5em;
	height: 1.5em;
	line-height: 1.5em;
}

.gaestebuch #name {
	font-family: inherit;
	font-size: inherit;
	width: 20em;
	height: 1.5em;
}

.gaestebuch textarea {
	font-family: inherit;
	font-size: inherit;
	margin-top: .5ex;
	margin-bottom: .5ex;
	display: block;
	width: 25em;
	height: 4em;
}

a:link {
	color: #7F543D;
	font-weight: normal;
	text-decoration: none;
}

a:link:hover {
	text-decoration: underline;
}

a:visited {
	color: #603F2E;
}

#content.werksleitung {
	background: white url("../img/wl-bg.png") repeat-x bottom;
	position: relative;
	font-size: 7pt;
	min-height: 269px
}

.werksleitung h1, .werksleitung h2 {
	display: none;
}

.werksleitung .contact {
	position: absolute;
	right: 0;
	bottom: 0;
	width: 280px;
	height: 99px;
	overflow: hidden;
	background: url("../img/wl-contact.png");
	padding-left: 30px;
	padding-right: 200px;
	padding-top: 20px;
	padding-bottom:  150px;
}

.werksleitung h3 {
	margin: 0;
	color: #bbb;
	font-size: 100%;
}

.werksleitung p {
	margin: 0;
	margin-bottom: 1em;
	font-size: 100%;
}

.werksleitung .cv1 {
	float: left;
	width: 30ex;
}

.werksleitung .cv2 {
	margin-left: 1ex;
	float: left;
	width: 30ex;
}

.werksleitung .contact table {
	width: 280px;
	height: 99px;
	overflow: hidden;
	table-layout: fixed;
}

.werksleitung .contact table, .werksleitung .contact table tr, .werksleitung .contact table tr td {
	border: 0;
	margin: 0;
	padding: 0;
}

.werksleitung .contact table tr td {
	color: white;
	vertical-align: top;
	font-size: 1px;
	line-height: 1em;
	text-align: left;
	white-space: nowrap;
	overflow: hidden;
	width: 71px;
	padding-top: 4px;
}

.werksleitung .contact table tr td + td {
	width: 195px;
	overflow: hidden;
	padding-left: 7px;
}

.werksleitung .contact table tr td:before {
	border: 0;
	margin: 0;
	padding: 0;
	content: "\a0";
	background-image: url("../img/wl-name.png");
	background-position: top right;
	background-repeat: no-repeat;
	display: block;
	position: relative;
	z-index: 1;
	height: 20px;
	margin-bottom: -1em;
	width: 71px;
}

.werksleitung .contact table tr td + td:before {
	background-image: url("../img/wl-name-text.png");
	width: 195px;
	background-position: top left;
}

.werksleitung .contact table tr + tr td:before {
	background-image: url("../img/wl-abschluss.png");
}

.werksleitung .contact table tr + tr td + td:before {
	background-image: url("../img/wl-abschluss-text.png");
	height: 35px;
}

.werksleitung .contact table tr + tr + tr td:before {
	background-image: url("../img/wl-geboren-am.png");
	height: 11px;
}

.werksleitung .contact table tr + tr + tr td + td:before {
	background-image: url("../img/wl-geboren-am-text.png");
}

.werksleitung .contact table tr + tr + tr + tr td:before {
	background-image: url("../img/wl-in.png");
	height: 30px;
}

.werksleitung .contact table tr + tr + tr + tr td + td:before {
	background-image: url("../img/wl-in-text.png");
}

.werksleitung .contact table tr + tr + tr + tr + tr td:before {
	background-image: url("../img/wl-wohnort.png");
}

.werksleitung .contact table tr + tr + tr + tr + tr td + td:before {
	background-image: url("../img/wl-wohnort-text.png");
}