html, body{
height:100%;/*!*/
}

body {
	font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#565656;
	margin:0px; padding:0px;
  background: #5ea6a2 url(../media/hg_body.jpg) top center no-repeat;
   background-attachment: scroll; 
	}

a img { border:none; }
a { color: #009288; text-decoration: none; }

#seite {
	position:absolute; left:50%; margin-left:-512px; /* horizontal zentriert */ top:0px; 
	height:100%;
	background:url(../media/hg_pylon.jpg) top left no-repeat;
	}
#logo { position:absolute; left:32px; top:0px; width:180px; height:90px; }


/* Navigation 1 (oben) */
/* **************************************************************** */
#navi1 {
	position:absolute; left:242px; top:40px; width:500px; height:40px;
	list-style:none; padding:0px; margin:0px;	
	float:left;
	text-indent: -9999em;
	}
#navi1 li {
	float:left;
	height:50px;
	}
#navi1 li a {
	height:50px; display:block;
	text-decoration:none;
	outline: 0px;
	}
#navi1 li a .seo { position:relative; top:-200px; /* Text der Buttons für Suchmaschinen */ }
#navi1 #n11 a { background:url(../media/n1_produkte.jpg) top left no-repeat; width:99px; }
#navi1 #n11 a:hover, #navi1 #n11 a.active { background:url(../media/n1_produkte.jpg) 0px -50px no-repeat; }
#navi1 #n12 a { background:url(../media/n1_unternehmen.jpg) top left no-repeat; width:140px; }
#navi1 #n12 a:hover, #navi1 #n12 a.active { background:url(../media/n1_unternehmen.jpg) 0px -50px no-repeat; }
#navi1 #n13 a { background:url(../media/n1_service.jpg) top left no-repeat; width:85px; }
#navi1 #n13 a:hover, #navi1 #n13 a.active { background:url(../media/n1_service.jpg) 0px -50px no-repeat; }
#navi1 #n14 a { background:url(../media/n1_kontakt.jpg) top left no-repeat; width:95px; }
#navi1 #n14 a:hover, #navi1 #n14 a.active { background:url(../media/n1_kontakt.jpg) 0px -50px no-repeat; }


/* Login */
/* **************************************************************** */
/* .login {
	position:absolute; left:350px; top:5px; width:280px; height:21px;
	margin:0px; padding:0px;
	text-align:right;
	}

#login td {
	text-align:right;
	}
#login input {
	height:20px; width:60px;
	margin:0px; padding:0px;
	margin-right:5px;
	}
#login label {
	font-family:Arial, Helvetica, sans-serif; font-size:11px; color:#777;
	padding-bottom:10px; margin-right:5px;
	}
#login input.go-button {

	padding-top:5px; margin:0px;
	width:21px; height:21px;
	}
#login input.logout-button {
	
	 margin:0px;
	width:48px; height:15px;
	}
	*/
/*.go-button:hover { background: url(../media/hg_go-button_3x.gif) top 21px no-repeat; }*/
/*.go-button:active { background: url(../media/hg_go-button_3x.gif) top 42px no-repeat; }*/

#logout-button {
	width:48px; height:15px;
	text-decoration:none;
	background: url(../media/hg_logout-button_3x.gif) left 0px no-repeat;
	float:right;
	}
#logout-button:hover {
	background: url(../media/hg_logout-button_3x.gif) left -15px no-repeat;
	}
#logout-button:active {
	background: url(../media/hg_logout-button_3x.gif) left -30px no-repeat;
	}
#logout-button .seo { position:relative; top:-200px; } /* versteckter Text der Buttons für Suchmaschinen */


/* Navigation 4 (rechts oben: Englisch, Impressum, Sitemap) */
/* **************************************************************** */
#navi4 {
	position:absolute; left:700px; top:46px; width:280px; height:20px;
	margin:0px; padding:0px;
	text-align:right;
	list-style:none; padding:0px; margin:0px;	
	}
#navi4 ul {float: right;}
#navi4 li {
	float:right;
	}
#navi4 li a {
	text-decoration:none;
	height:18px; display:block;
	padding-top:2px; padding-left:5px; padding-right:5px;
	font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#00827c;
	float: left;
	}
#navi4 li a:hover, #navi4 li .an a {
	color:#fff; background-color:#00827c;
	padding-left:4px; padding-top:1px; border-left: 1px solid #bdd; border-top: 1px solid #bdd;
	}
	
	
/* Navigation Shop */
/* **************************************************************** */
#navi_shop {
	position:absolute; left:242px; top:93px; width:740px; height:17px;

	border-bottom: 1px solid #ccc;
	list-style:none; padding:0px; margin:0px;
	}
#navi_shop li {
	float:right;
	}
#navi_shop li a {
	text-decoration:none;
	display:block; height:16px;
	padding-top:1px; padding-left:5px; padding-right:5px;
	font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:15px; color:#565656;
	float: left;
	}
#navi_shop li a:hover, #navi_shop li .an a { color:#fff; background-color:#00827c; }/* türkis */


.shop_h1 { width:100%; float:left; margin:0px; }

.shop_seiten {
	width:33%; height:40px; margin-top:15px;
	position:relative;
	float:right; padding-top:0px;
	font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:15px; color:#565656;
	text-align:center;
	}
.shop_seiten ol { list-style:none; margin:0px; padding:0px; text-align:center; height:20px; }
.shop_seiten ol li {
	height:20px; width:20px;
	margin-right:5px;
	float:left;
	}
.shop_seiten ol li a {
	display:block; 
	padding-top:2px;
	height:18px; width:20px;
	color:#565656; text-decoration:none;
	background: url(../media/hg_shop_seiten20.gif) 0px 0px no-repeat;
	}
.shop_seiten ol li a:hover {
	color:#fff; background-color:#00827c;
	background: url(../media/hg_shop_seiten20.gif) 0px -20px no-repeat;
	}
.shop_seiten ol li.an a {
	color:#fff; background-color:#00827c;
	background: url(../media/hg_shop_seiten20.gif) 0px -40px no-repeat;
	}
	
.shop_anzahl {
	width:33%; height:40px; margin-top:15px;
	float:right; padding-right:5px; padding-top:5px;
	text-align:right;
	font-family:Arial, Helvetica, sans-serif; font-size:12px; line-height:15px; color:#565656;
	}


/* Container links */
/* **************************************************************** */
#container_links { position:absolute; left:22px; top:110px; width:180px; }
	
	
/* Navigation 2 (links) */
/* **************************************************************** */
#navi2 {
	width:180px;
	list-style:none; padding:0px; margin:0px;
	border-bottom: 1px solid #ccc;
	}
#navi2 li { border-top: 1px solid #ccc; }
#navi2 li a {
	text-decoration:none;
	display:block;
	height:17px;
	padding-left:10px; padding-top:3px;
	border-left: 10px solid #00827c; /* türkis */
	font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#565656;
	}
#navi2 li.kat1 a { border-left: 10px solid #777; } /* grau */
#navi2 li.kat2 a { border-left: 10px solid #359; } /* blau */
#navi2 li.kat3 a { border-left: 10px solid #b88; } /* rosa */
#navi2 li.kat4 a { border-left: 10px solid #c60; } /* orange */

/* n2 Rollover */
#navi2 li a:hover, #navi2 li a.active { background-color:#bdd; } /* türkis hell */
#navi2 li.kat1 a:hover { background-color:#ccc; } /* grau hell */
#navi2 li.kat2 a:hover { background-color:#9bd; } /* blau hell */
#navi2 li.kat3 a:hover { background-color:#ecc; } /* rosa hell */
#navi2 li.kat4 a:hover { background-color:#eb9; } /* orange hell */

/* n2 Markierung an */
#navi2 li .an a { 
	border:none; padding-left:20px;
	color:#fff; font-weight:bold;
	background: #00827c url(../media/hg_n2_an_00827c.gif) top left repeat-x; /* türkis */
	} 
#navi2 li.kat1 .an a { background: #777 url(../media/hg_n2_an_777.gif) top left repeat-x; } /* grau */
#navi2 li.kat2 .an a { background: #359 url(../media/hg_n2_an_359.gif) top left repeat-x; } /* blau */
#navi2 li.kat3 .an a { background: #b88 url(../media/hg_n2_an_b88.gif) top left repeat-x; } /* rosa */
#navi2 li.kat4 .an a { background: #c60 url(../media/hg_n2_an_c60.gif) top left repeat-x; } /* orange */


/* Navigation 3 (Unterkategorien links) */
/* **************************************************************** */
#navi3 { list-style:none; padding:0px; margin:0px; }
#navi3 li { border-top: 1px solid #fff; }
#navi2 li #navi3 li a {
	border:none;
	padding-left:30px;
	color:#444;
	background-color:#bdd; /* türkis hell */
	}
#navi2 li.kat1 #navi3 li a { background-color:#ccc; } /* grau hell */
#navi2 li.kat2 #navi3 li a { background-color:#9bd; } /* blau hell */
#navi2 li.kat3 #navi3 li a { background-color:#ecc; } /* rosa hell */
#navi2 li.kat4 #navi3 li a { background-color:#eb9; } /* orange hell */


/* Suche */
/* **************************************************************** */
#suche{
	position:relative; width:160px; height:20px;
	margin-top:20px; margin-bottom:20px; margin-left:20px; padding:0px;
	border-collapse:collapse;
	}
#suche td {
	margin:0px; padding:0px;
	}
#suche input {
	height:20px; width:85px;
	margin:0px; padding:0px;
	margin-right:5px;
	}
#suche label {
	font-family:Arial, Helvetica, sans-serif; font-size:12px; color:#565656;
	padding-bottom:10px; margin-right:5px;
	}
#suche input.go-button {
	padding-top:5px; margin:0px;
	width:21px; height:21px;
	}


/* Inhalt */
/* **************************************************************** */
#inhalt { position:absolute; left:242px; top:110px; width:740px; padding-right: 20px; }

#sp_haupt { float:left; width:500px; }
#sp_rechts {
	float:right; width:180px;
	border-left: 1px solid #ccc; padding-left:20px; padding-right:20px; }


/* Boxen mit runden Ecken */
/* **************************************************************** */
.box160 {
	width:160px;
	float:left; margin:0px; margin-right:8px; margin-bottom:8px; padding:0px;
	background:url(../media/hg_box160_oben.gif) left top no-repeat; padding-top:5px; /* runde Ecken oben und Hintergrund */
	}
.box160_hg { 
	margin:0px;
	background:url(../media/hg_box160_unten.gif) left bottom no-repeat; /* runde Ecken unten */
	padding-top:0px; padding-left:10px; padding-right:10px; padding-bottom:10px;
	}

.box180 {
	width:180px;
	float:left; margin:0px; margin-right:8px; margin-bottom:8px; padding:0px;
	background:url(../media/hg_box180_oben.gif) left top no-repeat; padding-top:5px; /* runde Ecken oben und Hintergrund */
	}
.box180_hg {
	margin:0px;
	background:url(../media/hg_box180_unten.gif) left bottom no-repeat; /* runde Ecken unten */
	padding-top:0px; padding-left:10px; padding-right:10px; padding-bottom:10px;
	}

#container_links .box160 { margin-left:20px; }


/* Typografie */
/* **************************************************************** */
h1 {
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:20px; line-height:25px;
	color:#565656;
	margin:0px; margin-top:10px; margin-bottom:15px;
	}
p {
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:13px; line-height:18px;
	color:#565656;
	}
p a {
	text-decoration:none;
	color:#00827c;
	}
p a:hover { text-decoration:underline; }

.box160 h2, .box180 h2 {
	margin:0px; padding:0px;
	font-family:Geneva, Arial, Helvetica, sans-serif; font-weight:bold;
	font-size:12px; line-height:15px;
	color:#00827c;
	padding-bottom:2px;
	border-bottom: 1px solid #ccc;
	margin-bottom:2px;
	}
.box160 p, .box180 p {
	margin:0px; padding:0px;
	font-family:Geneva, Arial, Helvetica, sans-serif;
	font-size:12px; line-height:15px;
	color:#565656;
	margin-bottom:5px;
	}

/* ==== FCE SETUP ==== */
/* Agenturen */
div.agenturen {width: 30%; float: left; position: relative; height: 175px; margin: 0px 20px 10px 0px;}
div.agenturen p {padding: 0px 0px 10px 0px; margin: 0px;}

/* Partner */
div.partner {width: 120px; float: left; position: relative; height: 100px; margin: 0px 20px 10px 0px;}
div.partner img a:hover {text-decoration: none;}
div.partner p {padding: 0px 0px 10px 0px; margin: 0px;}
div#c48 {width: 100%; float: left;}

/* Topimages */	
div#topimage { 
  width: 100%;
  height: 360px;
  float: left;
  position: relative;
  }
  div#topimage div.image_big {
    width: 354px;
    height: 360px;
    float: left;
    margin: 0px 5px 5px 0px;
    }
  div#topimage div.image_small {
    width: 177px;
    height: 177px;
    float: left;
    margin: 0px 5px 5px 0px;
    }

/* ====== Portal ===== */
div#main_left {
  width: 470px; 
  padding: 0px 20px 0px 50px; 
  float: left; 
  position: relative;
  }
  div#main_left h1 {
    font-size: 18px; 
    font-weight: normal;
    padding: 0px !important;
    }
div#main_right {
  width: 199px; 
  float: left; 
  position: relative;
  margin-left: 1px;
  }
  div#main_right h1 {
    font-size: 14px; 
    font-weight: normal;
    padding: 0px !important;
    }
    
/****************************/
/* KONTAKTFORMULAR          */
/****************************/	
fieldset {
  border: 0px;
  margin: 0px;
  padding: 0px;
  font-size: 12px;
  width: 100%;
  }
  fieldset span {
  	color: #565656;
  }
  
  
  fieldset dt {width: 25%; float: left;}
  fieldset dd {float: left; width: 60%; padding-bottom: 10px;}
  
  fieldset input, fieldset select {
    width: 400px;
    padding: 2px;
    color: #565656;
    border: 1px solid #777777;
    font-size: 11px;
    }
	fieldset input.ultrasmall {width: 50px; margin-right: 10px;}
	fieldset input.small {width: 84px; margin-right: 10px;}
	fieldset input.small2 {width: 160px; margin-right: 10px;}
	fieldset input.wide {width: 300px;}
	fieldset input.half {width: 193px; margin-right: 10px;}
	fieldset input.full {width: 400px;}
	fieldset input.radio {width: 10px;}
	fieldset input:focus, fieldset input:hover {
	    border: 1px solid #01837d;
	    }
	
	fieldset input.checkbox {
    width: 12px;
	border: 0px;
	margin-bottom: 10px;
    }
	fieldset input.radio {
    width: 12px;
	   border: 0px;
    }

  fieldset textarea {
    width: 400px;
    height: 100px;
    padding: 2px;
    color: #565656;
    border: 1px solid #777777;
   	font-family: Arial, Verdana, Helvetica, sans-serif;
   	font-size: 11px;
    }
	fieldset textarea:focus, fieldset textarea:hover {
	    border: 1px solid #01837d;
	    }
    fieldset input.button {
	    width: 100px;
	    padding: 2px;
	    color: #565656;
	    border: 1px solid #777777;
	    background-color: #ffffff;
	    }
		fieldset input.button:hover {
			border: 1px solid #01837d;
			background-color: #ffffff;
			color: #01837d;
		}
		

/* ==== SITEMAP ==== */
div.tx-flseositemap-pi1 a {
  color: #565656;
  }
  div.tx-flseositemap-pi1 a:hover {
    color: #01837d;
    }
div.tx-flseositemap-pi1 ul {
  list-style: none;
  font-weight: bold;
  color: #000000;
  padding: 0px;
  }
  div.tx-flseositemap-pi1 ul li {
    padding: 2px 0px 2px 0px;
    }
    div.tx-flseositemap-pi1 ul li ul {
      padding-left: 20px;
      list-style: none;
      font-weight: normal;
      }
      
/* ==== Ansprechpartner ==== */
div.float_small {
	width: 180px;
	float: left;
	position: relative;
	height: 600px;
	}

div.input-box, div.input-box-submit, div.input-box-error {
	position: relative;
	float: left;
	width: 100%;
	clear: both;
	padding-bottom: 1em;
	}
	
	div.input-box-error {
		padding: 0.2em;
		margin-bottom: 2em;
		width: 400px;
		font-weight: bold;
	}
	
	div.input-box-errorbox {
		width: 400px;
		padding: 0.2em;
		margin-bottom: 2em;
		clear: both;
		border: 1px #f00 dotted;
		background: #FFDFDF;
		}		
	
	div.input-box-submit {
		padding-top: 1em;
	}
	
input.submit {
	width: 406px;
}

input.error {
	border: 1px #f00 dotted;
	background: #FFDFDF;
	}

div#inhalt ul li {font-size: 12px;}
