/*

v-cube.de
CSS

(c) 06.07.2006 Gustaf Mossakowski, <gustaf@koenige.org>
Layout (c) v-cube

*/

html, body {height: 100%; text-transform: lowercase; font-size: 90%;}
body {color: #000; background: #FFF; padding: 0; margin: 0;
	font-family: Arial, sans-serif; font-size: 90%; line-height: 120%;}

a:link {color: #888;}
a:visited {color: #888;}
a.aktiv:link, a.aktiv:visited {color: #000;}

#projekt, #text, #impressum, #kontakt, #login,Ê#leer {
	clear: both; overflow: auto; z-index: 4; position: relative;
	text-align: justify; }
#grau, #projektgrau {position: absolute; right: 0; top: 0; height: 360px; width: 290px;
	background: white; filter:alpha(opacity=60); -moz-opacity:.6; opacity:.6;
	z-index: 2;}
#projektgrau {width: 364px;}
#text, #leer {width: 258px; padding: 10px 22px 10px 10px; height: 340px;
	margin-left: 710px; /*background: url('streifen.gif');*/
	position: absolute; left: 0; top: 0; z-index: 3;}
#leer {background: transparent; }
.ausgeklappt p {padding-left: 12px;}
#impressum {width: 386px; padding: 10px 22px 10px; height: 340px;
	position: absolute; left: 570px; top: 0;}
#login {width: 436px; padding: 50px 22px 10px; height: 300px;
	position: absolute; left: 520px; top: 0;}
#kontakt {width: 436px; padding: 10px 0; height: 340px;
	text-align: left; position: absolute; left: 307px; }
#text p, #text ul {margin: .5em 0;}
#text ul {padding-left: 1.5em;}

#middle {width: 100%; height: 100%; text-align: center; border-collapse: collapse;}
#middle td {vertical-align: middle; padding: 0;}
#canvas {width: 1000px; height: 465px; text-align: left; margin: auto;
	background: white; position: relative; border: 1px solid #000;
	padding-bottom: 6.4em}

#menu {list-style: none; margin: 0; padding: 0;} /* position: relative; z-index: 3; */
#menu li {float: left; text-align: center; border: 1px solid black;
	border-right: none; background: #CCC; line-height: 1.4em; height: 1.4em;
	width: 142px; position: relative; }
#menu li.first-child {border-left: none;}
#menu a {text-decoration: none; display: block;
	vertical-align: middle; }
#menu a:hover {background: #DDD;}
#menu ul a:hover {background: transparent;}
#menu .aktiv {font-weight: bold;}

#menu ul a, #menu ul strong {padding: 0 .75em; display: block;}
#menu li ul {list-style: none; margin: 0; padding: 0; position: absolute;
	left: 50%; top: 100%; width: 450%; /* 400% bedeutet 4 Felder */ 
	border-left: 1px solid black; line-height: 1.6em}
#menu li ul li {background: transparent; border: none; width: auto; 
	border-bottom: 1px solid black; padding: .35em 0 0}
#menu li ul ul {width: 5em;}
#menu li ul ul a {padding: 0 .6em;}
#menu li ul ul.projekte3, #menu li ul ul.projekte4 {width: 9em;}
#menu li ul ul.projekte5, #menu li ul ul.projekte6 {width: 13em;}
#menu li ul ul.projekte7, #menu li ul ul.projekte8 {width: 17em;}

#menu li ul li#extramenu {position: absolute; left: -7em; width: 7em; text-align: left;}

#logo {margin: 0; padding: 0; border-bottom: 1px solid black;}
#logo img {margin: 0; padding: 15px 22px 9px 22px; border: 0;}

#topmenu {margin: 0; padding: 0 22px; border-bottom: 1px solid black; 
	height: 1.7em; line-height: 1.7em;}
#topmenu p, #topmenu h1 {margin: 0; padding: 0; }
#topmenu #firma {padding-right: 22px; border-right: 1px solid black; float: left;
	height: 1.7em; line-height: 1.7em;}
#topmenu #leistungen {padding: 0 1em; border-right: 1px solid black; float: left;
	max-width: 50%; overflow: hidden;	height: 1.7em;}
#topmenu h1 {padding-left: 22px; float: right; font-size: 100%;}

#content {position: relative; height: 360px;}
#images {position: absolute; top: 0; left: 0; z-index: 1; width: 1000px;
	height: 360px; overflow: hidden;}
#images img {position: absolute; top: 0px;}
#images img.pos1 {left: 0px;}
#images img.pos2 {right: 0px;}

#projekt {padding: 10px 22px; height: 340px;
	overflow: auto; position: absolute; right: 0; top: 0; z-index: 3;
	width: 320px;}
#projekt th, #projekt td {vertical-align: top; padding-top: 1.75em;}
#projekt td p {margin: 0; padding: 0;}
#projekt th {text-align: right; padding-right: 1em;}

#impressum td, #impressum th {vertical-align: baseline; line-height: 1.2em;}
#impressum .hoch2 th, #impressum .hoch2 td { padding-top: 1em;}
#impressum .hoch3 th, #impressum .hoch3 td { padding-top: 1.75em;}
#impressum .hoch4 th, #impressum .hoch4 td { padding-top: 2.5em;}
#impressum td {text-align: right; padding-right: 1em;}
#impressum th {text-align: left;}
#impressum p {margin: 0;}

.daten {border-collapse: collapse; padding-bottom: 1em; margin-bottom: 1em;}
.daten th, .daten td {padding: 0;}
.daten p {margin: 0;}
.daten th {padding-right: 1em; text-align: left;}

hr {border: 0; border-top: 1px solid black; border-bottom: transparent;
	margin: 1em 0 0 auto;}

.spalte {width: 48%; float: left;}

#klapppfeil {position: absolute; top: 170px; cursor: pointer; z-index: 4;}
.pfeil-aus {left: 636px;}
.pfeil-ein {left: 984px;}
.spalte-rechts {width: 48%; float: right; }

.login {padding-top: 1em; padding-bottom: 0; margin-bottom: 0;}
.login label {display: block; width: 8.5em; float: left; vertical-align: middle;}
.login p {margin-bottom: 0; padding-bottom: 0; margin-top: .5em;}
p.submit {padding-left: 8.5em;}

#logout {position: absolute; right: 10px; top: 10px; background: white;
	font-size: 100%;}
#logout a {display: block; padding: 5px;}
#logout a:hover {background: #751309; }

#menufuss, #fuss {display: none;}

