@charset "utf-8";
@import url(reset.css);

/* ----------------------------------------------------- All browsers */

body,
input,
textarea {
  font-family:      georgia, 'times new roman', serif;
  font-size:        8pt;
  line-height:      12pt;
}

body {
  background:       #87A180;
  margin:           10px 0px 10px 0px;
}

p, h1, h2, h3, h4, h5, h6, ul, table {
  margin-bottom:    8pt; /* siehe body line-height */
}

ul {
  /*list-style-position:inside;*/
  list-style-type:    square;
  margin-left:        1.5em;
  padding:            0;
}
li {
  margin-bottom:      12pt;
  
}

:focus {
    outline:        1px dotted black;
}

strong {
  font-weight:      bold;
}

em {
  font-style:       italic;
}
em.ul { /* Ersatz für <u> */
  font-style:       normal;
  text-decoration:  underline;
}

sub {
  vertical-align:   sub;
}

sup {
  vertical-align:   super;
}


/* alte Elemente, die wohl noch wg. HTML4 drin sind und ersetzt werden müssen */

b {
  font-weight:      bold;
}

.red {
  font-weight:      bold;
  color:            #cc0000;
}

i {
  font-style:       italic;
}

th {
  font-weight:      bold;
}

/* ----------------------------------------------------- Allgemeine Klassen  */


.small {
  font-size:        85% !important;  /*9pt*/
}

.clear {
  clear:            both;
}
.clearLeft {
  clear:            left;
}

.bold {
  font-weight:      bold;
}

.normal {
  font-weight:      normal;
}

.nowrap {
  white-space:      nowrap;
}

.vcard abbr { /* abbr wird für Microformats gebraucht, aber reset.css macht da Formatierungen, die wir hier nicht wollen */
  border-style:     none !important;
  cursor:           default;

}

.flRight {                    /* siehe auch ie7 */
  float:            right;
  margin-left:      1em;
}

.flLeft {
  float:            left;
  margin-right:      1em;
}

.flBottomLeft {
  position:         absolute;
  float:            left;
  margin-right:     1em;
  bottom: 0;
}

.relativ {
  position: relative;
}

.bildunterschrift {
  text-align:       center;
  font-style:       italic;
}
div.bildunterschrift {
  margin:           0 auto;   /* siehe auch ie7 */
}

.infoInhalt {
  margin-top:       -3em;
}
.infoInhalt ul {
  text-align:       left;     /* ie6 u. 7 */
}
.infoInhalt li {              /* siehe auch ie7 */
  list-style-image: url('/images/breadcrum-info.gif');
}
.infoInhalt li.current {
  list-style-image: url('/images/breadcrum-info-ol.gif');
}

#prospekt {
  margin:           5px 0 0 235px;
}

ul.breadcrumnavi {
  font-size:        90%;
  margin-top:       -1em;
  margin-left:      0;
}

ul.breadcrumnavi li {
  display:          inline;
  background:       url('/images/breadcrum-info.gif') left no-repeat;
  padding-left:     12px;
}

div.imageBox {
  border:           1px solid #330;
  text-align:       center;
  padding:          5px;
  line-height:      100%;
}
div.imageBox img {
  margin-bottom:    5px;
}
div.imageBox div {
/*  outline:          1px solid red;*/
}

.imgBorder {
  border:           1px solid #330;
  padding:          5px;
}

.textLeft { /* zum Überschreiben von zentrierter Ausrichtung */
  text-align:       left !important;
}

a.tel, 
.tel a {
  text-decoration:  none;
}

#upps {
  border: 2px solid red;
  color: red;
  padding: 0.5em;
  margin-bottom: 1em;
}

#uppsHead {
  font-weight: bold;
  font-size: larger;
}

.error {
  border:           2px solid red;
}

/* ----------------------------------------------------- parkett_naturnah_09  */


/** Bereiche **/

#rahmen                    {
  margin:           0 auto;
  padding:          0;
  width:            1015px;
  text-align:       left;
}

#sidebar		{
  position:         fixed;
  top:              15px;
  float:            left;
  margin:           80px 0px 0px 0px;
  padding:          0px 0px 0px 0px;
  width:            235px;
  height:           auto;
  text-align:       right;
  z-index:          100;
}
/* ie7 und ie6 siehe unten !!! */

/* ---------------------- Arcordion-Navigation (siehe auch navigation.css) -- */

#navigation a {
  color:            #505050;
}
#navigation a.head:hover {
	color:            white;
}
#navigation a.ui-state-active {
  color:            white;
}
#navigation a.current {
  color:            white;
}
#navigation li li a:hover {
	color:            white;
}
/* ----------------- Ende Arcordion-Navigation (siehe auch navigation.css) -- */


#header {
text-align:         center;
margin:             0px 0px 0px 235px;
padding:            0px;
width:              778px;
height:             278px;
border:             1px solid #330;
position:           relative;
}

#header.kontakt {
  background-image: url(/bg/kontakt-neu.jpg);
}

#header div#headline {
  background:   url(/images/parkett_naturnah-fs8.png) no-repeat;
  position:         absolute;
  bottom:           -1px;
  right:            -5px;
  z-index:          100;
  width:            503px;
  height:           85px;
  text-indent:      -99999px;
  overflow:         hidden;
}
#header div#headline.ol {
  right:            auto;
  left:             5px;
  top:              10px;
}
#header div#headline.shadow {
  background:   url(/images/parkett_naturnah-sh-fs8.png) no-repeat;
}
#content 		{
margin:1px 0px 0px 235px;
padding:20px;
width:738px;
color:#333300;
border:1px solid #330;
background-color:#EDEFBE;
position: relative;
z-index: 1;
}

#content.kontakt {
  min-height:       500px;
}

#hooverlogo {
  position: absolute;
  top: -270px;
  right: 0px;
  width: 324px;
  height: 420px;
  background: url('../bg/logo-mit-schatten.png') no-repeat;
}

#logospacer {
  float:  right;
  width:  260px;
  height: 120px;  
}

#fuss 		{
text-align:right;
margin:1px 0px 0px 235px;
padding:4px;
width:778px;
color:#333300;
border:none;
}

.rechts 		{
text-align:center;
float:right;
margin:4px;
padding:8px;
width:160px;
color:#333300;
border:1px dotted #330;
background-color:#EDEFBE;
}

td.produkt 		{
text-align:left;
margin:4px;
padding:8px;
width:700px;
color:#333300;
border:1px dotted #330;
background-color:#EDEFBE;
}

td.produktbild 		{
text-align:center;
float:right;
margin:4px;
padding:0px;
border:1px solid #330;
}

/** Links **/

a:link {
color:#333300;

}
a:visited {
color:#333300;

}
a:hover {
color:#333300;

}
a:active {
color:#333300;

}

/* Ueberschriften und Text */

h1 {
  margin-top:       0px;
  text-align:       left;
  vertical-align:   top;
  color:            #000000;
  font-weight:      bold;
  font-size:        150%;
}

.startseite h1 {
  font-family:      'gillsans-bold', 'arial black', 'tahoma', serif;
  font-size:        30pt;
  font-weight:      normal;
  letter-spacing:   1pt;
  color:            #333300;
  margin-bottom:    10px;
}

h2 {
  font-weight:      bold;
  font-size:        130%;
}

div.produkt h2 {
  font-size:        100%;
}

h3 {
  font-weight:      bold;
}

#schlagworte {
  font-family:      'gillsans', 'arial black', 'tahoma', serif;
  font-size:        14pt;
  letter-spacing:   1pt;
  color:            #333300;
  margin-top:       0;
}

td			{
  text-align:       left;
}

td.mittig			{
  text-align:       center;
  color:            #003;
}

td.form			{
  text-align:       left;
  color:            #000000;
  border:           1px solid #ccc;
}

ul.sitemap {
  list-style-type:  circle;
  margin:           10px;
  padding:          0;
}

li {
  margin:           0;
  padding:          0;
}

/** Sidenavigation **/

ul.sidebar {
  list-style-type:  none;
  margin:           0;
  padding:          0;
}

li.sidebar {
  margin:           5px 0;
  padding:          5px 0 0 0;
}

a.navi:link,
a.navi:visited,
a.navi:active {
  color:            #F1F0A7;
  text-decoration:  none;
  margin-right:     6px;
}
a.navi:hover {
  color:            #ffc;
  font-size:        10pt;
  text-decoration:  none;
  margin-right:     6px;
}

a.subnavi:link,
a.subnavi:visited,
a.subnavi:hover,
a.subnavi:active {
  color:            #E6F2B6;
  text-decoration:  none;
  margin-right:     6px;
}

a.navihead:link,
a.navihead:visited,
a.navihead:hover,
a.navihead:active {
  color:            #F1F0A7;
  text-decoration:  none;
  font-weight:      bold;
  margin-right:     6px;
}
a.navihead:hover {
  color:            #ffc;
}
a.navihead:active {
  text-decoration:  underline;
}

/** Diverses **/

.content {
  padding:          2px;
  margin:           4px;
  border:           1px solid #330;
}

div.contentnavi a,
a.contentnavi:link,
a.contentnavi:visited,
a.contentnavi:hover,
a.contentnavi:active {
  color:            #330;
  font-weight:      bold;
}

p.contentnavi {
  clear:            both;
  padding:          25px 0 0 0;
  text-align:       center;
}

td.form			{
  text-align:       left;
  font-family:      arial,helvetica,sans-serif;
  font-style:       normal;
  background-color: #87A180;
  color:            #333300;
}

#oeffnungszeiten th,
#oeffnungszeiten td {
  padding-right:    2em;
}

#tabZubehoer,
table.historie {
  border-collapse:  collapse;
}

table.historie th,
table.historie td {
  border:           1px solid #333;
  padding:          0.5em;
}

#tabZubehoer td {
  padding:          0.5em;
  vertical-align:   middle;
}

table.veranstaltungstermine {
  border-collapse:  collapse;
  border:           1px solid #330;
}

table.veranstaltungstermine td {
  padding:          0.5em 1em 0.5em 0.5em;
}

/* Stellenangebote */
div.stelle {
  position:         relative;
  margin-top:       3em;
}
.stelle .datum {
  position:         absolute;
  top:              0;
  right:            0;
}

#aktion {
  width:            150px;
  border:           1px solid black;
  padding:          2px;
  text-align:       center;
}
#aktion img {
  text-decoration:  none;
}

#veranstaltungshinweis {
  margin-left:      35px;
  width:            160px;
  height:           160px;
  background:       url(/bg/tanzbeine.jpg);
  position:         relative;
  margin-right:     5px;    /* IE <= 7 braucht das */
}
#veranstaltungshinweis p {
  position:         absolute;
  bottom:           0px;
  left:             0px;    /* IE <= 7 braucht das */
  width:            150px;  /* IE <= 7 braucht das */
  padding:          5px;
  margin:           0;
  text-align:       center;
  font-weight:      bold;
}
#veranstaltungshinweis p a {
  color:            #F1F0A7;
}

#sidebar .videolink {
  color:            #C00000;
  padding-right:    0;
}

.tipTrigger {
/*  cursor:           help;*/
}

#tooltip {
	position:         absolute;
	z-index:          3000;
/*	opacity:          0.85;*/
/* background-color:   lightblue; */
}
#tooltip.viewport-bottom {
  top: 50px;
}
#tooltip .innerBody {
	background:       transparent url(/images/tooltip/tooltip_left.png) no-repeat;
	height:           61px;
	padding:          50px 0px 25px 20px;
	color:            black;	
  float:            left;
}
#tooltip.viewport-bottom .innerBody {
  /* TODO: passendes Hintergrundbild */
  background:       transparent url(/images/tooltip/tooltip_leftbottom.png) no-repeat;
  padding:          25px 0px 50px 20px;
}
#tooltip .innerEnd { 
	background:       transparent url(/images/tooltip/tooltip_lend.png) no-repeat right;
	height:           126px;
  width:            18px;
  float:            right;
}
#tooltip.viewport-bottom .innerEnd {
  background:       transparent url(/images/tooltip/tooltip_lbend.png) no-repeat right;
}

/* ----------------------------------------------------- JS enabled browsers */

.js div { }


/* ----------------------------------------------------- IE7 and below */

.ie7 div { }

.ie7 #sidebar {
  margin-left:      -240px;
}

.ie7 .flRight {
  text-align:       center;
}
.ie7 div.bildunterschrift {
  margin:           0;  /* ie7 versteht auto nicht und nutzt die ganze Breite */
}

.ie7 .infoInhalt li {     /* ie6 u. 7 setzen sonst das List-Icon nicht mittig */
  line-height:      100%; /*   vor den Text, sondern mittig vor die Zeile */
  margin-bottom:    4pt;
}

/* ----------------------------------------------------- IE6 and below */

.ie6 div { }

.ie6 #sidebar {
  /* Das Fixed funktioniert beim IE6 nicht. Damit das wenigstens an der
   * richtigen Position landet, machen wir es absolut. */
  position:         absolute;
}


/* Da IE-Spezialitäten wie DXImageTransform nicht Valide sind, sind solche
 * Sachen nach screen-ie6.css ausgelagert. */