@charset "UTF-8";
/* CSS Document */

body {
	margin: 0;
	padding: 0;
	font-family: Arial, Helvetica, sans-serif;
	font-size: small;
	color: #666666;
}

h1 {
	font-size: 1em;
	margin: 0;
	padding: 0;
	line-height: 2ex;
}

.unsichtbar {
	display: none;
}

a {
	outline: none;
}

/* ______________________________________________________ Border */


.border {
	clear: both;
	height: 18px;
	width: 920px;
	background: white url(images/border.png) center left repeat-x;
	margin: 0 auto 0 auto;
}

/* ______________________________________________________ oberer Bereich */

#shopbutton {
	display: block;
	width: 135px;
	height: 135px;
	position: absolute;
	top: -15px;
	left: 280px;
	background: url(images/button.png) top left no-repeat;
	text-indent: -10000px;
	z-index: 100000;
}
#shopbutton:hover, #shopbutton:focus {
	background: url(images/button.png) bottom left no-repeat;
}

#topwrap {
	width: 900px;
	margin: 25px auto 5px auto;
	height: 45px;
	padding: 0 0 0 0;
	position: relative;
}

#top-left {
	float: left;
	width: 290px;
}

#top-right {
	float: right;
	width: 500px;
	height: 45px;
}

/* Logo */

h1 a {
	background: url(images/logo.png) top left no-repeat;
	display: block;
	height: 45px;
	width: 290px;
	margin-bottom: 0px;
}

/* Navigation */

#topwrap ul, #topwrap li {
	list-style: none;
	margin: 0 0 0 0;
	padding: 0;
	float: right;
}
#topwrap ul {
	margin: 28px 0 0 0;
}

#topwrap li {
	display: block;
	float: left;
	margin-left: 14px;
}

#topwrap li a {
	color: #666666;
	text-decoration: none;
	font-weight: bold;
}
#topwrap li a:hover, #topwrap li a:focus {
	color: #ff6600;
}

/* Produkte */
body#nav-0100 a#item01,

/* Unternehmen*/
body#nav-0200 a#item02, body#nav-0201 a#item02, body#nav-0202 a#item02, body#nav-0203 a#item02, body#nav-0204 a#item02, 

/* Technik*/
body#nav-0300 a#item03, body#nav-0301 a#item03, body#nav-0302 a#item03, body#nav-0303 a#item03, body#nav-0304 a#item03, body#nav-0305 a#item03,
body#nav-0306 a#item03,

/* Service*/
body#nav-0400 a#item04, body#nav-0401 a#item04, body#nav-0402 a#item04, body#nav-0403 a#item04,

/* Kontakt*/
body#nav-0500 a#item05 {
	color: #ff6600;
}

/* ______________________________________________________ unterer Bereich */

#bottomwrap {
	width: 920px;
	margin: -5px auto 0 auto;
	font-size: 85%;
}
#bottom-left {
	float: left;
	padding-left: 10px;
	padding-bottom: 15px;
}
#bottom-right {
	float: right;
	padding-right: 10px;
	padding-bottom: 15px;
}

#bottomwrap a {
	color: #888888;
	text-decoration: none;
}

#bottomwrap a:hover, #bottomwrap a:focus {
	text-decoration: underline;
}

body#nav-0700 #bottom-left a {
	text-decoration: underline;
}


/* ______________________________________________________ mittlerer Bereich */
body.quadrat {
	background: white url(images/bg1.png) repeat-x;
	background-position: left 93px;
}

#middlewrap {
	clear: both;
	width: 928px;
	margin: 0 auto 0 auto;
	background: white;
}

body.quadrat #middlewrap {
	height: 458px;
}

body.fliesstext #middlewrap {
	height: 150px;
}

body.fliesstext {
	background: white url(images/bg2.png) repeat-x;
	background-position: left 93px;
}

h4#quad {
	display: block;
	font-weight: bold;
	font-style: italic;
	font-size: normal;
	margin: 0;
	padding: 0;
	color: white;
}

/* ______________________________________________________ Start-Layout */

#quadrat-left {
	display: block;
	background: url(images/cube/leidenschaftlich.png);
	height: 458px;
	width: 458px;
	float: left;
	margin: 0;
	padding: 0;
	border-left: 4px solid white;
}

#quadrat-right {
	display: block;
	background: url(images/cube/big00.png);
	height: 458px;
	width: 458px;
	float: right;
	margin: 0;
	padding: 0;
	color: white;
	text-decoration: none;
	border-right: 4px solid white;
}

#quadrat-left a img {
	border: none;
}
#quadrat-left a {
	text-decoration: none;
}

#fenster-wrap {
	display: block;
	width: 428px;
	height: 130px;
	margin: 313px 15px 15px 15px;
	background: #ff6600;
	clear: both;
}

#fenster-wrap ul, #fenster-wrap li {
	list-style: none; 
	margin: 0;
	padding: 0;
}
#quadrat-left #fenster1 {
	display: block;
	height: 130px;
	width: 290px;
	float: left;
	background: white;
	color: #888888;
	text-decoration: none;
	overflow: hidden;
}
#quadrat-left #fenster2 a {
	display: block;
	height: 130px;
	width: 128px;
	float: right;
	background: white;
	color: #888888;
	text-decoration: none;
	cursor: pointer;
}

#quadrat-left #fenster1 a:hover, #quadrat-left #fenster1 a:focus, 
#quadrat-left #fenster2 a:hover, #quadrat-left #fenster2 a:focus {
	color: #ff6600;
}

#fenster1 a img {
	display: block;
	background: orange;
	height: 105px;
	width: 282px;
	margin: 4px 4px 0 4px;
}

#fenster2 a img {
	display: block;
	background: orange;
	height: 105px;
	width: 120px;
	margin: 4px 4px 0 4px;
}

#quadrat-left #fenster1 span {
	margin-left: 4px;
	font-size: 85%;
	padding-top: 3px;
	display: block;
	background: white;
}
#fenster1 a {
	color: #666666;
}

#quadrat-left #fenster2 span {
	margin-left: 4px;
	font-size: 85%;
	padding-top: 3px;
	display: block;
}

#quadrat-right div {
	display: block;
	padding: 0 20px 20px 20px;
	margin-top: 317px;
	color: black;
	line-height: 2.5ex;
}



/* ______________________________________________________ Produkte-Layout */

/* links */

#produkte-left {
	display: block;
	background: url(images/cube/leidenschaftlich.png);
	height: 458px;
	width: 458px;
	float: left;
	margin: 0;
	padding: 0;
	position: relative;
	border-left: 4px solid white;
}

#produkte-links {
	text-align: center;
	position: absolute;
	left: 10px;
	bottom: 10px;
	width: 438px;
	padding: 5px 0 5px 0;
}
#produkte-left a {
	padding: 4px 6px 4px 6px;
	margin: 0;
	text-align: center;
	color: white;
	text-decoration: none;
	line-height: 4ex;
}

#produkte-left a:hover, #produkte-left a:focus, #produkte-left a#aktiv {
	background: white;
	color: #ff6600;
}


/* rechts */

#produkte-right {
	display: block;
	background: white;
	height: 458px;
	width: 458px;
	float: right;
	margin: 0;
	padding: 0;
	color: white;
	text-decoration: none;
	position: relative;
	border-right: 4px solid white;
	overflow: hidden;
}

#produkte-right ul, #produkte-right li {
	margin: 0;
	padding: 0;
	list-style: none;
}

#produkte-slide img {
	/* cursor: help; */
}

.svw {width: 50px; height: 20px; background: #fff;}
.svw ul{position: relative; left: -999em;}

.stripViewer { 
	position: relative;
	overflow: hidden; 
	border: 0px solid #ff0000;
	margin: 0 0 1px 0;
}
.stripViewer ul {
	position: relative;
	left: 0;
	top: 0;
	width: 1%;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.stripViewer ul li { 
	float:left;
}
.stripTransmitter { 
	overflow: hidden;
	width: 1%;
	position: absolute;
	bottom: 10px;
	left: 10px;
}
.stripTransmitter ul { 
	position: relative;
}
#produkte-right .stripTransmitter ul li{
	width: 23px;
	float:left;
	margin: 0 5px 1px 0;
}
.stripTransmitter a { 
	text-align: center;
	line-height: 22px;
	background: #ff6600;
	color: #fff;
	text-decoration: none;
	display: block;
	font-weight: bold;
	width: 23px;
}
.stripTransmitter a:hover { 
	background: #ff8533;
}
.stripTransmitter a.current, .stripTransmitter a.current:hover { /* current */
	background: #fff;
	color: #ff6600;
}

/* ______________________________________________________ Image-Layout */
#cube-left {
	background: white;
	height: 458px;
	width: 458px;
	float: left;
	margin: 0;
	padding: 0;
	border-left: 4px solid white;
}

#cube-left {
	background: white;
	height: 458px;
	width: 458px;
	float: left;
	margin: 0;
	padding: 0;
}


#cube-left ul, .cube-right ul, #cube-left li, .cube-right li {
	list-style: none;
	margin: 0;
	padding: 0;
}
#cube-left li {
	display: block;
	float: left;
}

#cube-left ul li a {
	display: block;
	height: 150px;
	width: 150px;
	cursor: pointer;
}
#feld1 a, #feld2 a, #feld4 a, #feld5 a, #feld7 a, #feld8 a {
	margin-right: 4px;
}

#feld1 a, #feld2 a, #feld3 a, #feld4 a, #feld5 a, #feld6 a  {
	margin-bottom: 4px;
}

li#feld1 a {background: blue url(images/cube/feld1.png);}
li#feld2 a {background: blue url(images/cube/feld2.png);}
li#feld3 a {background: blue url(images/cube/feld3.png);}
li#feld4 a {background: blue url(images/cube/feld4.png);}
li#feld5 a {background: blue url(images/cube/feld5.png);}
li#feld6 a {background: blue url(images/cube/feld6.png);}
li#feld7 a {background: blue url(images/cube/feld7.png);}
li#feld8 a {background: blue url(images/cube/feld8.png);}
li#feld9 a {background: blue url(images/cube/feld9.png);}

/* HOVER-EFFEKT */
#cube-left a {
	position: relative;
}
#cube-left a span.hover {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	height: 150px;
	width: 150px;
}
li#feld1 a span.hover, li#feld1 a#aktiv {background:url(images/cube/feld1-hover.png);}
li#feld2 a span.hover, li#feld2 a#aktiv {background:url(images/cube/feld2-hover.png);}
li#feld3 a span.hover, li#feld3 a#aktiv {background:url(images/cube/feld3-hover.png);}
li#feld4 a span.hover, li#feld4 a#aktiv {background:url(images/cube/feld4-hover.png);}
li#feld5 a span.hover, li#feld5 a#aktiv {background:url(images/cube/feld5-hover.png);}
li#feld6 a span.hover, li#feld6 a#aktiv {background:url(images/cube/feld6-hover.png);}
li#feld7 a span.hover, li#feld7 a#aktiv {background:url(images/cube/feld7-hover.png);}
li#feld8 a span.hover, li#feld8 a#aktiv {background:url(images/cube/feld8-hover.png);}
li#feld9 a span.hover, li#feld9 a#aktiv {background:url(images/cube/feld9-hover.png);}


.cube-right {
	height: 458px;
	width: 458px;
	float: right;
	margin: 0;
	padding: 0;
	border-right: 4px solid white;
}

.cube-right div {
	display: block;
	padding: 0 20px 20px 20px;
	margin-top: 317px;
	color: black;
	line-height: 2.5ex;
}

a.mehr {
	color: white;
	font-weight: normal;
	text-decoration: none;
	padding: 0 0 0 2px;
}

a.mehr:hover, a.mehr:focus {
	color: black;
}

/* tooltip */
#tooltip {
	position: absolute;
	left: -320px;
	z-index: 3000;
	background: #333333;
	padding: 5px;
	opacity: 0.8;
	color: white;
	font-size: 1em;
}

.img-tooltip {
	width: 300px;
}

#tooltip h3, #tooltip div {
	margin: 0;
	font-weight: normal;
	font-size: 0.85em;
}
#cube-00 {background: url(images/cube/big00.png);}
#cube-01 {background: url(images/cube/big01.png);}
#cube-02 {background: url(images/cube/big02.png);}
#cube-03 {background: url(images/cube/big03.png);}
#cube-04 {background: url(images/cube/big04.png);}
#cube-05 {background: url(images/cube/big05.png);}
#cube-06 {background: url(images/cube/big06.png);}
#cube-07 {background: url(images/cube/big07.png);}
#cube-08 {background: url(images/cube/big08.png);}
#cube-09 {background: url(images/cube/big09.png);}



    

/* ______________________________________________________ Fliesstext-Layout */
#box-left {
/*	background: url(images/box-left/001.png); */
	background: #cccccc;
	height: 150px;
	width: 458px;
	float: left;
	margin: 0;
	padding: 0;
	border-left: 4px solid white;
}

#box-right {
/*	background: url(images/box-right/001.jpg); */
	background: #cccccc url(images/box-right/0700.jpg);
	height: 150px;
	width: 458px;
	float: right;
	margin: 0;
	padding: 0;
	border-right: 4px solid white;
}

#content-wrap {
	clear: both;
	padding-top: 15px;
	font-size: 90%;
	margin: 0 4px 0 4px;
	float: left;
	width: 920px;
}
#spalte-1-x {
	width: 150px;
	float: left;
	padding-top: 5px;
	margin-bottom: 30px;
}

/* Unternavigation */
#content-wrap #spalte-1-x ul, #content-wrap #spalte-1-x li {
	list-style: none;
	margin: 0;
	padding: 0;
	display: block;
	width: 150px;
}
#content-wrap #spalte-1-x li {
	float: left;
	margin: 0;
	padding: 0;
}

#content-wrap #spalte-1-x a {
	display: block;
	width: 145px;
	padding: 5px 0 5px 7px;
	border-bottom: 1px solid #999999;
	text-decoration: none;
	color: #666666;
	background: white url(images/pfeil.png) center right no-repeat;
	background-position: 142px center;
}

#content-wrap #spalte-1-x ul {
	border-top: 1px solid #999999;
	margin: 0 0 50px 0;
	width: 152px; /* warum */
	display: block;
}

#content-wrap #spalte-1-x a:focus, #content-wrap #spalte-1-x .aktiv a, #content-wrap #spalte-1-x a:hover {
	background: #fef2e7 url(images/pfeil-aktiv.png) center right no-repeat;
	background-position: 142px center;
	color: #ff6600;
	text-decoration: none;
} 

#content-wrap #spalte-1-x a:focus {
	background: #ff6600;
	color: white;
}

/* Formate */

#content-wrap p {
	line-height: 2.8ex;
	margin: 0 0 18px 0;
}

#content-wrap ul {
	margin: 5px 0 5px 0;
	padding: 0 0 0 15px;
	list-style: url(images/bullet.png);
}
#content-wrap li {
	margin: 5px 0 0 0;
}

#content-wrap h2 {
	margin: 0 0 15px 0;
	padding: 0;
	font-size: 120%;
	color: #ff6600;
	line-height: 2.8ex;
}
#content-wrap h2 span, #content-wrap h2 span a {
	font-weight: normal;
	color: #ff6600;
}

#content-wrap h3 {
	color: #ff6600;
	margin: 0 0 8px 0;
	padding: 0;
	font-size: 1em; 
}

img {
	margin-bottom: 5px;
}

.big {
	font-size: 130%;
}


#content-wrap a {
	color: #666666;
	text-decoration: none;
}
#content-wrap a:hover, #content-wrap a:focus {
	text-decoration: underline;
}

#content-wrap .weiter {
	color: #666666;
	text-decoration: underline;
}
#content-wrap .weiter:hover, #content-wrap .weiter:focus {
	color: #ff6600;
	text-decoration: none;
}


#content-wrap table {
	margin: 0 0 18px 0;
	border-collapse: collapse;
	background: #fef2e7;
}

#content-wrap td, #content-wrap th {
	border: 2px solid white;
	text-align: left;
	padding: 4px;
	vertical-align: top;
}

/* Spalten */
/* spalte 2 von 3 = spalte-2-3 etc. */
.spalte-1-1 {
	margin: 0 0 0 0;
	float: left;
}

.spalte-2-2 {
	width: 725px;
	float: right;
	margin: 0 0 5px 0;
}

.spalte-2-3 {
	/* 575 */
	width: 560px;
	float: left;
}

.spalte-3-3 {
	width: 150px;
	float: right;
}

/* Hauptseiten mit Anreisser */

.spalte-haupt-links-wrap {
	float: left;
	width: 476px;
}

.spalte-haupt-links {
	float: left;
	width: 227px;
}

.spalte-haupt-mitte {
	float: right;
	width: 227px;
}

.spalte-haupt-rechts {
	float: right;
	width: 227px;
}

/* Zweispaltig */

.spalte-halb-links {
	float: left;
	width: 351px;
}

.spalte-halb-rechts {
	float: right;
	width: 351px;
}

/* Zweispaltig Kontakt */

.spalte-kontakt-links {
	float: left;
	width: 458px;
}
.spalte-kontakt-rechts {
	float: right;
	width: 438px;
	border-left: 4px solid #ececec;
	padding-left: 20px;
}

form#kontakt {
	margin-top: 20px;
}

#kontakt input, #kontakt textarea {
	position:relative;
	border:1px solid #cccccc;
	font-size: 1em;
	font-family: Arial, sans-serif;
	width: 170px;
	margin: 0 0 5px 0;
	padding: 2px 2px 2px 5px;
	background: white;
	color: #ff6600;
}

#kontakt input:hover, #kontakt input:focus, #kontakt textarea:hover, #kontakt textarea:focus {
	border: 1px solid #ff6600;
}

#kontakt .button {
	width: 80px;
	border: 1px solid #888888;
	background: #888888;
	color: white;
	cursor: pointer;
}

#kontakt .button:hover, #kontakt .button:focus {
	background: #ff6600;
	color: white;
}

#kontakt textarea {
	width: 270px;
}

div.input-wrap {
	position:relative;
	margin-right:3px;
}

label.overlabel {
	color:#666666;
}
label.overlabel-apply {
	position:absolute;
	top:3px;
	left:6px;
	z-index:1;
	color:#666666;
	cursor: text;
}


/* Rueckruf */

form#rueckruf {
	margin: 10px 0 0 0; 
	padding: 0;
	float: left;
}

#rueckruf input, #rueckruf textarea {
	position:relative;
	border:1px solid #cccccc;
	font-size: 1em;
	font-family: Arial, sans-serif;
	width: 170px;
	margin: 0 0 3px 0;
	padding: 2px 2px 2px 5px;
	background: white;
	color: #ff6600;
}

input#zeit {
	margin: 0;
}

#rueckruf input:hover, #rueckruf input:focus {
	border: 1px solid #ff6600;
}

#rueck-left {
	float: left;
}

#rueck-right {
	float: right;
	width: 85px;
}

#rueckruf .button {
	width: 72px;
	height: 40px;
	border: 1px solid #888888;
	background: #888888;
	padding: 0;
	color: white;
	cursor: pointer;
	text-align: center;
	float: right;
}

#rueckruf .button:hover, #rueckruf .button:focus {
	background: #ff6600;
	color: white;
}


/* Chronik */
#chronik h3 {
	float: left;
	clear: both;
}
#chronik p {
	float: right;
	border-left: 1px solid #ececec;
	padding-left: 10px;
	width: 500px;
}

#chronik div {
	clear: both;
}

/* Service */
a.brief {
	display: block;
	background: url(images/brief.png) center left no-repeat;
	padding-left: 30px;
	margin: 10px 0 5px 0;
	line-height: 3.5ex;
	font-size: 130%;
}

a.brief:hover, a.brief:focus {
	background: url(images/brief-hover.png) center left no-repeat;
}

.telefon {
	display: block;
	background: url(images/telefon.png) center left no-repeat;
	padding-left: 30px;
	line-height: 3.5ex;
	font-size: 130%;
}

.boxi {
	border: 1px solid #cccccc;
	padding: 16px 18px 20px 18px;
	background: white url(images/boxbg.png) bottom left repeat-x;
	width: 270px;
	float: left;
	line-height: 2.8ex;
	margin: 0 0 18px 0;	
	height: 100px;
}

#platzhalter {
	width: 15px;
	height: 10px;
	float: left;
}

/* Service - Leistungsverzeichnis */
#liste-links {
	float: left;
	width: 280px;
}
#liste-rechts {
	float: right;
	width: 280px;
}
#liste-links li, #liste-rechts li {
	cursor: help;
}


/* Bilder fuer Fliesslayout */

/* Unternehmen */
#nav-0200 #box-left {background: url(images/box/0200.png);}
#nav-0200 #box-right {background: url(images/box/0200.jpg);}

#nav-0201 #box-left {background: url(images/box/0201.png);}
#nav-0201 #box-right {background: url(images/box/0201.jpg);}

#nav-0202 #box-left {background: url(images/box/0202.png);}
#nav-0202 #box-right {background: url(images/box/0202.jpg);}

#nav-0203 #box-left {background: url(images/box/0203.png);}
#nav-0203 #box-right {background: url(images/box/0203.jpg);}

#nav-0204 #box-left {background: url(images/box/0204.png);}
#nav-0204 #box-right {background: url(images/box/0204.jpg);}

/* Technik */
#nav-0300 #box-left {background: url(images/box/0300.png);}
#nav-0300 #box-right {background: url(images/box/0300.jpg);}

#nav-0301 #box-left {background: url(images/box/0301.png);}
#nav-0301 #box-right {background: url(images/box/0301.jpg);}

#nav-0302 #box-left {background: url(images/box/0302.png);}
#nav-0302 #box-right {background: url(images/box/0302.jpg);}

#nav-0303 #box-left {background: url(images/box/0303.png);}
#nav-0303 #box-right {background: url(images/box/0303.jpg);}

#nav-0304 #box-left {background: url(images/box/0304.png);}
#nav-0304 #box-right {background: url(images/box/0304.jpg);}

#nav-0305 #box-left {background: url(images/box/0305.png);}
#nav-0305 #box-right {background: url(images/box/0305.jpg);}

#nav-0306 #box-left {background: url(images/box/0306.png);}
#nav-0306 #box-right {background: url(images/box/0306.jpg);}

/* Technik */
#nav-0400 #box-left {background: url(images/box/0400.png);}
#nav-0400 #box-right {background: url(images/box/0400.jpg);}

#nav-0401 #box-left {background: url(images/box/0401.png);}
#nav-0401 #box-right {background: url(images/box/0401.jpg);}

#nav-0402 #box-left {background: url(images/box/0402.png);}
#nav-0402 #box-right {background: url(images/box/0402.jpg);}

#nav-0403 #box-left {background: url(images/box/0403.png);}
#nav-0403 #box-right {background: url(images/box/0403.jpg);}

/* Kontakt */
#nav-0500 #box-left {background: url(images/box/0500.png);}
#nav-0500 #box-right {background: url(images/box/0500.jpg);}


/* Impressum */
#nav-0700 #box-left {background: url(images/box/0200.png);}
#nav-0700 #box-right {background: url(images/box/0200.jpg);}