html{height: 100%;}

body {
	margin:0;
	font:1em/1.2em "Lucida Grande", Arial, sans-serif;
	background:#e4e4e4 url(../pict/bodybg.gif) repeat-x;
	color:#494648;
	position:relative;
	min-height:100%;
	min-width:1000px;
	text-align:center;
}

img{border-style:none;}

a:link{
	color:#ff0000;
	outline:none;
	text-decoration: none;
}
a:visited{ color: #ff0000; }
a:hover{text-decoration:none;}
a:active { outline:none; }
a:focus { outline:none; }

.colorbox{}

p { margin-bottom: 1em; }

hr { 
height: 1px;
background-color: #f0f0f0;
color: #f0f0f0;
border: 0;
margin: 1em 0;
}

sup,
sub {
	height: 0;
	line-height: 1;
	vertical-align: baseline;
	_vertical-align: bottom;
	position: relative;
z-index:0;	
}

sup {
	bottom: 1ex;
}

sub {
	top: .5ex;
}

#wrapper{
	width:700px;
	margin:0 auto;
	position:relative;
	padding:350px 0 0;
	font-size: 0.75em;
	text-align:left;
}

#logo{
	width:700px;
	height:80px;
	margin:0;
	position:absolute;
	top:0;
	left:0;
}

#logo img { margin: 20px 0 0 20px; }

#header{
	width:700px;
	background: url(../pict/head/metropol.png) no-repeat 0 0;
	height:300px;
	margin:0;
	position:absolute;
	top:80px;
	left:0;
}

#header:after{
	content:"";
	display:block;
	clear:both;
}

#projects {
display:none;
position:relative;
margin-bottom: 1.3em;
}

#projects p {
margin-bottom: 3px;
}

#projects h3 { padding: 0; margin: 5px 0; text-transform:uppercase; letter-spacing: 1px;
font-weight: normal; }

#projects a { color: #999; text-decoration:none; }
#projects a:hover { color: #ff0000; }

a#cl { 
display:block;
position: absolute; 
width: 12px; 
height: 12px; 
position:absolute; 
top: 3px; 
right: 3px;
}

#spitzmarke {
position: absolute;
top: 215px;
left: 75px;
font: lighter 12px "Century Gothic", arial, sans-serif;
color: #fff;
text-transform:uppercase;
}

h1 {
position: absolute;
z-index: 1000;
top: 220px;
left: 75px;
font: normal 26px "Syntax UltraBlack", "arial black", sans-serif;
color: #fff;
text-transform:uppercase;
letter-spacing: 3px;
}

h2 {
font-size: 1.2em;
font-weight:normal;
margin: 0.3em 0 0.3em 0;
}



#fakecol {
width: 700px;
height: 30px;
background: url(../pict/headerCols.gif) repeat-y;
}

#main{
	width:700px;
	overflow:hidden;
	margin:0 auto;
	padding:0 0 90px;
}

#twocolumns{
	width:700px;
	float:left;
	overflow:hidden;
}
#twocolumns .leftcol{
	float:left;
	width:175px;
}

.navbox {
	border: solid #dcdcde;
	border-width: 0 1px;
	padding: 5px 3px 10px 30px;
	background-color: #fff;
}

.leftinner {
	background-color: #fff;
	border: solid #dcdcde;
	border-width: 0 1px;
	padding: 15px 15px 15px 28px;
position: relative;
z-index: 50;

}

.leftboxbottomwhite {
	background: url(../pict/whitebg_left_bottom.png) bottom no-repeat;
	height: 6px;
	font-size: 1px;
	line-height: 0.001em;
}

.leftboxtopwhite {
	background: url(../pict/whitebg_left_top.png) bottom no-repeat;
	height: 6px;
	font-size: 1px;
	line-height: 0.001em;
}

ul#nav {
list-style:none;
margin: 0;
padding: 0;
position:relative;
z-index: 60;
line-height: 200%;
}

ul#nav li { margin: 0; padding: 0; position:relative; z-index: 70; }

ul#nav li a { 
display:block; 
color: #494648;
text-decoration:none;
padding: 1px 0;
font-size: 1.1em;
}

ul#nav li a:hover, ul#nav li a.active:hover { 
color: #ff0000;
}

ul#nav li.active a.active {
color: #ff0000;
}

ul#nav li.active a.active:hover { color: #ff0000; }

/* --subnav-- */
ul#nav ul {
list-style:none;
margin:0 0 10px 0;
padding: 0 0 0 10px;
font-size: 0.8em;
line-height: 140%;
}


ul#nav li ul li {
margin-bottom: 2px;
}

ul#nav li ul li a { 
color: #666;
font-weight: normal;
}

ul#nav ul.flap {
background: transparent url(/pict/whitebg_subnav.png) top right no-repeat;
position:absolute;
top: 0;
left: 143px;
width: 120px;
margin: 0;
padding: 10px 0 0 0;
z-index: 80;
}

ul.flap li {
padding: 5px;
}

li.flapbottom {
padding: 0;
height: 5px;
position:relative;
bottom: -6px;
font-size: 1px;
line-height: 1px;
overflow:visible;
background: url(/pict/whitebg_subnav_bottom.png) right bottom no-repeat;
}

/* ---- metanav icons ----- */
 #metabox {
 background: url(../pict/leftframe_trans.png) bottom no-repeat;
 margin: 0 0 5px 0; 
 }
 
 
 #searchbox { margin: 0 1px; padding: 5px; display:none;}
 #searchbox form { margin:0 0 0 10px; padding: 0;}
 #searchbox label { font-size: 0.9em; }
 #searchbox .searchfield { border: 1px solid #dcdcde; margin: 0; width: 100px; padding: 2px; }
 #searchbox .iconsubmit { vertical-align: middle; font-size: 0.9em; padding: 1px; }

ul#metanav {
list-style:none;
margin:0;
padding:0;
width: 175px;
}

ul#metanav li {
float:left;
}

ul#metanav li a {
display:block;
width: 43px;
}



a#sitemap, a#language, a#info { border-right: 1px solid #dcdcde; }

ul#metanav li a img {
margin: 5px 0px 5px 11px;
}

.adressbox, .fbbox, .nlbox {
font-size: 0.8333em;
line-height: 1.4em;
color: #b4b2b4;
}

.fbbox, .nlbox {
padding: 3px 15px 3px 28px;
}

.nlbox h3 {
padding-left: 28px;
}

.fbbox img.fbicon {
vertical-align: top;
}

.nlbox {
background: #fff url(/pict/icons/letter.jpg) 25px 8px no-repeat;
}

.adressbox a, .fbbox a, .nlbox a {
color: #b4b2b4;
text-decoration:none;
}

.adressbox a:hover, .fbbox a:hover, .nlbox a:hover { color: #ff0000; }


/*  --rightcol--  */
 
#twocolumns .rightcol{
	float:left;
	width:519px;
	margin-left: 6px;
}

.rightinner {
	background-color: #fff;
	border: solid #dcdcde;
	border-width: 0 1px;
	padding: 22px 75px 20px 28px;
}

.rightinner p {
margin: 0.6em 0 1em 0;
}

.rightboxbottomwhite {
	background: url(../pict/whitebg_main_bottom.png) bottom no-repeat;
	height: 6px;
	font-size: 1px;
	line-height: 0.001em;
}

/* -- rounded box -- */
.rounded { background-color: #fff; margin-top: 5px; padding: 1px;}

/* rounded box homepage: aktuelle projekte */
div.homepage .rounded { background-color: #e9e9e9; margin-top: 5px; padding: 1px; margin-bottom: 1.3em;}

.combo {
width: 519px;
}


.threeright {
float:left;
margin-left: 5px;
width: 387px;
}

.oneleftimg {
width: 125px;
float:left;
margin-top: 5px;
background-color: #fff;
overflow:hidden;
}

.firstimg, .secondimg, .thirdimg {
margin-right: 6px;
}
	
.innerrounded { 
height: 143px;
font-size: 0.8333em;
color: #494648;
background-color: #e4e4e4;
overflow:hidden;
padding: 10px;
line-height:1.3em;
}

*+html .innerrounded { height: 143px; }

/* rounded box homepage: aktuelle projekte */
.homepage .innerrounded {
background-color: #fff;
}


.varheight {
height:auto;
min-height: 20px;
padding: 10px 10px 10px 28px;
}

*+html .varheight {
height:20px;
}

.refbox {
padding: 10px 10px 10px 148px;
background-position: top left;
background-repeat: no-repeat;
}

#refHider { display:none; }

a.inFade {
display:block;
height: 16px;
background: url('/pict/icons/redplus.png') left center no-repeat;
padding-left: 26px;
font-size: 1.2em;
}

.innerrounded h3 { font-size: 1.3em; font-weight: 200; margin:0 0 10px 0;padding:0;  }
*+html .innerrounded h3 { margin: 0; }

.innerrounded a { color: #999; text-decoration:none; }
.innerrounded a:hover { color: #ff0000; }

.reflinks {
width:120px; 
height:140px; 
float:right; 
margin-left: 15px; 
padding-top:10px;
}

.reflinks ul { margin: 0; padding: 0; }

ul#actprobox { margin: 10px 0 5px 0; padding: 0; }

.reflinks li, #actprobox li {
list-style-type:none;
padding-left: 8px;
background: url(../pict/listicon.gif) 0px 3px no-repeat;
}

.boxframe {
height: 168px;
position:relative;
margin-top: 10px;
}

*html .boxframe {
left: 4px;
top: 0;
}

.boxref1 {
height: 168px;
width: 129px;
overflow:hidden;
position:absolute;
top: 0px;
left: 0px;
background: 0 -168px no-repeat;
}

.boxref2 {
height: 168px;
width: 129px;
overflow:hidden;
position:absolute;
top: 0px;
left: 130px;
background: 0 -168px no-repeat;
}

.boxref3 {
height: 168px;
width: 129px;
overflow:hidden;
position:absolute;
top: 0px;
left: 260px;
background: 0 -168px no-repeat;
}

.boxref4 {
height: 168px;
width: 129px;
overflow:hidden;
position:absolute;
top: 0px;
left: 390px;
background: 0 -168px no-repeat;
}

.boxref1, .boxref2, .boxref3 {
border-right: 1px solid #fff;
}

.boxheadcaption { 
font-size:0.8333em;
	position: absolute;
	top: 0px;
	left: 0px;
	padding: 8px 0 0 8px;
	line-height: 1.4em;
	color: #494648;
}

.boxcaption {
	position: absolute;
	top: 146px;
	left: 0px;
	height: 20px;
	width: 100%;
	color: #fff;
	font-size: 0.8333em;
	text-align:left;
	padding: 0 0 0 5px;
	line-height: 21px;
}

#footer {  
font-size: 0.75em;
color: #b4b2b4;
text-align:right;
padding: 1em 1em 0 0;
}

#footer a { color: #b4b2b4; text-decoration:none; }
#footer a:hover { color: #ff0000; }

#icons {
margin: 0 0 5px 0;
padding-left: 4px;
float:left;
width: 100px;
}

#icons img {
float:left; margin-right: 3px;
}

/* --formular-- */

.formular {
}

label.left {
float:left;
width: 30%;
clear:both;
margin-right: 2em;
text-align:right;
}

.formular fieldset { margin: 10px 0; padding: 10px; border: 1px solid #e4e4e4; }
.formular legend { font-style:italic; color: #e4e4e4; vertical-align:middle; background-color: #fff; padding: 1px 5px 1px 0; }

.formular fieldset input { float:left; width: 50%; margin: 2px 0; border: 1px solid #d4d4d4; border-width: 0 0 1px 0; background-color: #fff; padding: 2px; font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;}
.formular fieldset textarea { float:left; width: 50%; height: 100px; border: 1px solid #d4d4d4; border-width: 0 0 1px 0; background-color: #fff; padding: 2px; font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;}

.clearfix:after {
content: "."; 
display: block; 
height: 0; 
clear: both; 
visibility: hidden;
}

.nlform { margin-top: 10px; }

.nlform fieldset { padding: 10px; border: 1px solid #b4b2b4; }
.nlform legend { font-style:italic; color: #b4b2b4; vertical-align:middle; padding: 1px 5px 1px 0; }

.nlform fieldset input.formfield { float:left; width: 50%; margin: 2px 0; border: 1px solid #d4d4d4; border-width: 0 0 1px 0; background-color: #fff; padding: 2px; font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;}
.nlform fieldset textarea { float:left; width: 50%; height: 100px; border: 1px solid #d4d4d4; border-width: 0 0 1px 0; background-color: #fff; padding: 2px; font-family: "Lucida Grande", "Lucida Sans Unicode", Arial, sans-serif;}

p.alert {
background-color: #ffd15d;
padding: 10px;
color: #000;
font-size: 0.9em;
}


/* -- sifr -- */
/* These are standard sIFR styles... do not modify */

.sIFR-flash {
	visibility: visible !important;
	margin: 0;
}

.sIFR-replaced {
	visibility: visible !important;
}

span.sIFR-alternate {
	position: absolute;
	left: 0;
	top: 0;
	width: 0;
	height: 0;
	display: block;
	overflow: hidden;
}

/* Hide Adblock Object tab: the text should show up just fine, not poorly with a tab laid over it. */
.sIFR-flash + div[adblocktab=true] {
  display: none !important;
}

/* These "decoy" styles are used to hide the browser text before it is replaced... the negative-letter spacing in this case is used to make the browser text metrics match up with the sIFR text metrics since the sIFR text in this example is so much narrower... your own settings may vary... any weird sizing issues you may run into are usually fixed by tweaking these decoy styles */

.sIFR-hasFlash h1 {
	visibility: hidden;
}

.sIFR-hasFlash h2 {
	visibility: hidden;
	letter-spacing: -9px;
	font-size: 55px;
}

.sIFR-hasFlash h3 {
	visibility: hidden;
	letter-spacing: -6px;
	font-size: 25px;
}

.sIFR-hasFlash h4 {
	visibility: hidden;
	letter-spacing: -5px;
	font-size: 21px;
}

.sIFR-hasFlash h5#pullquote {
	letter-spacing: -4px;
	visibility: hidden;
	font-size: 24px;
}