/* ===============================
   INHALTSVERZEICHNIS
===============================

   1. Allgemeine Sachen
   2. HEADER
   3. TEXTAUSSEHEN
   4. INHALTS-AUFBAU
   5. HAUPT-NAVIGATION
   6. SUB-NAVIGATION
   7. PRODUKT-NAVIGATION
   8. PRODUKTBESCHREIBUNG
   9. PRODUKTBILD UND FOOT-NAVIGATION
   10. BLOCK-ELEMENTE

=============================== */

/* ===============================
   =1. Allgemeine Sachen
=============================== */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
    font-family: "Trebuchet MS", arial, helvetica, sans-serif;
	vertical-align: baseline;
}

html {height: 101%;}

body {
    line-height: 1;
    background: #FFF;
    text-align: center;
}

#pagewrapper {
    text-align: center;
    width: 900px;
    margin: 0 auto;
    position: relative;
}

.noscreen {display: none;}

.datum {font-size: 90%;}

/* ===============================
   =2. HEADER
=============================== */

#head {height:124px;}

#logo {float:right;}

h1 {width: 359px; height: 49px; float:left; margin-left:40px; margin-top:54px; background-repeat:no-repeat;}
h1 span {visibility: hidden;}
*html h1 {margin-left:15px;}

.index {background: url(../ueberschrift-en/ueberschrift_index.gif) no-repeat;}
.unternehmen {background: url(../ueberschrift-en/ueberschrift_unternehmen.gif) no-repeat;}
.wirueberuns {background: url(../ueberschrift-en/ueberschrift_wirueberuns.gif) no-repeat;}
.philosophie {background: url(../ueberschrift-en/ueberschrift_philosophie.gif) no-repeat;}
.messe {background: url(../ueberschrift-en/ueberschrift_messe.gif) no-repeat;}
.produkte {background: url(../ueberschrift-en/ueberschrift_produkte.gif) no-repeat;}
.sicherheit {background: url(../ueberschrift-en/ueberschrift_service.gif) no-repeat;}
.duschkabinen {background: url(../ueberschrift-en/ueberschrift_duschkabine.gif) no-repeat;}
.duschkabinen-rl {background: url(../ueberschrift-en/ueberschrift_duschkabine-rl.gif) no-repeat;}
.duschkabinen-tg {background: url(../ueberschrift-en/ueberschrift_duschkabine-tg.gif) no-repeat;}
.duschkabinen-ge {background: url(../ueberschrift-en/ueberschrift_duschkabine-ge.gif) no-repeat;}
.exklusiv {background: url(../ueberschrift-en/ueberschrift_exklusiv.gif) no-repeat;}
.kienle {background: url(../ueberschrift-en/ueberschrift_kienle.gif) no-repeat;}
.solida {background: url(../ueberschrift-en/ueberschrift_solida.gif) no-repeat;}
.favorit {background: url(../ueberschrift-en/ueberschrift_favorit.gif) no-repeat;}
.favoritnova {background: url(../ueberschrift-en/ueberschrift_favoritnova.gif) no-repeat;}
.prima {background: url(../ueberschrift-en/ueberschrift_prima.gif) no-repeat;}
.premium {background: url(../ueberschrift-en/ueberschrift_premium.gif) no-repeat;}
.premium-soft {background: url(../ueberschrift-en/ueberschrift_premium-soft.gif) no-repeat;}
.noblesse {background: url(../ueberschrift-en/ueberschrift_noblesse.gif) no-repeat;}
.atelier {background: url(../ueberschrift-en/ueberschrift_atelier.gif) no-repeat;}
.atelier-pur {background: url(../ueberschrift-en/ueberschrift_atelierpur.gif) no-repeat;}
.shower {background: url(../ueberschrift-en/ueberschrift_shower.gif) no-repeat;}
.badewannen {background: url(../ueberschrift-en/ueberschrift_badewannen.gif) no-repeat;}
.duschwannen {background: url(../ueberschrift-en/ueberschrift_duschwannen.gif) no-repeat;}
.heizkoerper {background: url(../ueberschrift-en/ueberschrift_heizkoerper.gif) no-repeat;}
.spiegelschrank {background: url(../ueberschrift-en/ueberschrift_spiegelschrank.gif) no-repeat;}
.walkin {background: url(../ueberschrift-en/ueberschrift_walkin.gif) no-repeat;}
.komfort {background: url(../ueberschrift-en/ueberschrift_komfort.gif) no-repeat;}

/* ===============================
   =3. TEXTAUSSEHEN
=============================== */

p  {
    font-size: 80%;
    color: #000;
    line-height: 1.3;
}

p a {color: #6697B7; text-decoration: none;}
p a:hover {color: #005178;}

.text-klein {font-size: 90%;}
.pdf {display: block;background: url(../grafik/pdf.gif) no-repeat; background-position: left; padding-left: 25px;}
.detail {background: url(../grafik/lupe.gif) no-repeat; background-position: left bottom; padding-left: 25px;}

#videoPlayer {
    font-size: 80%;
    color: #000;
    line-height: 1.3;
}

#videoPlayer a {color: #6697B7; text-decoration: none;}
#videoPlayer a:hover {color: #005178;}    

/* ===============================
   =4. INHALTS-AUFBAU
=============================== */

#inhalt {
    width: 900px;
    clear:both;
    text-align: left;
}

/*.leitspruch {background: url(../grafik/leitspruch.gif) top right no-repeat;} */

#news  {
    float:right;
    width:190px;
    padding-right: 130px;
}

*html #news p {
    width:190px;
}

/* ===============================
   =5. HAUPT-NAVIGATION
=============================== */

.naviabstand {margin-top:38px;width:900px;}
*html .naviabstand {margin-top:37px;width:900px;}

#navi {
    float: left;
    width: 380px;
    /*margin-left: 41px;*/
    margin-left: 101px;
    padding-bottom: 16px;
    height:27px;
    overflow:hidden;
}

*html #navi {
    /*margin-left: 22px;*/
    margin-left: 52px;
}

#navi ul li {
    float:left;
    padding-right:8px;
    font-size: 75%;
}

#navi ul li a {
    text-decoration: none;
    display:block;
    margin-top: 15px;
}

#navi ul li.use {background: transparent url(../grafik/navi-trenner2.gif) top no-repeat;}
#navi ul li a span {visibility: hidden;}

#link1                              {background: url(../navi-en/navi-home.gif) no-repeat; width: 44px;}
#link1:hover, #link1.used           {background: url(../navi-en/navi-home.gif) 0 -13px no-repeat;}
#link2                              {background: url(../navi-en/navi-unternehmen.gif) no-repeat; width: 70px;}
#link2:hover, #link2.used           {background: url(../navi-en/navi-unternehmen.gif) 0 -13px no-repeat;}
#link3                              {background: url(../navi-en/navi-produkte.gif) no-repeat; width: 74px;}
#link3:hover, #link3.used           {background: url(../navi-en/navi-produkte.gif) 0 -13px no-repeat;}
#link4                              {background: url(../navi-en/navi-service.gif) no-repeat; width: 60px;}
#link4:hover, #link4.used           {background: url(../navi-en/navi-service.gif) 0 -13px no-repeat;}
#link5                              {background: url(../navi-en/navi-login.gif) no-repeat;width: 46px;}
#link5:hover, #link5.used           {background: url(../navi-en/navi-login.gif) 0 -13px no-repeat;}

/* ===============================
   =6. SUB-NAVIGATION
=============================== */

#subnavi {
    /*margin-left: 42px; */
    margin-left: 100px;
    padding-top: 20px;
    float: left;
    width: 900px;
    height:18px;
}

*html #subnavi {
    padding-left: 42px;
    /*margin-left: 0px*/
    margin-left: 30px;
    padding-top: 19px;
    width: 850px;
}

#subnavi ul li {
    color: #7F7F7F;
    line-height: 11px;
    height: 10px;
    float:left;
    padding-left:7px;
    padding-bottom: 5px;
    font-size: 80%;
    border-bottom: 1px solid #B2B2B2;
}

#subnavi ul li a {
    text-decoration: none;
    color: #7F7F7F;
    padding-right:6px;
}

#subnavi ul li a:hover{color: #000;}
#subnavi ul li a.used {color: #000;font-weight: bold;}

.border-left {border-left: 1px solid #B2B2B2;}
.border-right {border-right: 1px solid #B2B2B2;background: none;}

/* ===============================
   =7. PRODUKT-NAVIGATION
=============================== */

#produktnavi {
    float: right;
    width: 180px;
    height: 434px;
    border-left: 1px solid #005178;
}

#produktnavi ul li {
    line-height: 15px;
    display:block;
    padding-left:10px;
}

*html #produktnavi ul li {
    line-height: 17px;
    display:block;
    padding-left:10px;
}

#produktnavi ul li a {
    color: #7F7F7F;
    text-decoration: none;
    font-size: 80%;
}

#produktnavi ul li a:hover{color: #000;}
#produktnavi ul li a.used {font-weight: bold;color: #000;}

/* ===============================
   =8. PRODUKTBESCHREIBUNG
=============================== */

#produktdetail  {
    float:right;
    width:220px;
    margin-right: 50px;
    margin-bottom: 20px;
}

#produktbox-links {
    width: 140px;
    float:left;
    margin-bottom: 20px;
}

#produktdetail #produktbox-links {
    width: 120px;
    float:left;
    margin-bottom: 20px;
}

#produktbox-rechts {
    width: 180px;
    float:left;
    margin-bottom: 20px;
}

#produktdetail #produktbox-rechts {
    width: 100px;
    float:left;
    margin-bottom: 20px;
}

#produktdetail ul {
    padding-left: 15px;
}

#produktdetail ul li  {
    font-size: 80%;
    text-decoration: none;
    line-height:1.3;
    list-style-type: disc;
}

#produktdetail ul li a {
    font-size: 80%;
    text-decoration: none;
    color: #6697B7;
}

#produktdetail ul li a:hover {
    font-size: 80%;
    text-decoration: none;
    color: #005178;
}

#produktbeschreibung  {
    float:right;
    width:320px;
    padding-right: 130px;
    margin-bottom: 20px;
}

*html #produktbeschreibung p {
    width:320px;
}

#produktbeschreibung ul {
    padding-left: 15px;
}

#produktbeschreibung ul li ul li ul li a {
    font-size: 85%;
    color: #7F7F7F;
}

#produktbeschreibung ul     {
    padding-bottom: 10px;
    padding-top: 5px;
}

#produktbeschreibung ul.service li  {
    color: #000;
    font-size: 85%;
    text-decoration: none;
    line-height: 1.3;
    list-style-type: disc;
}

#produktbeschreibung ul.news li  {
    color: #000;
    font-size: 80%;
    text-decoration: none;
    line-height: 1.3;
    list-style-type: disc;
}

#produktbeschreibung ul li a {
    color: #000;
    font-size: 85%;
    text-decoration: none;
    line-height: 1.3;
}

#produktbeschreibung ul li a:hover {
    text-decoration: underline;
}

a.sitemap-haupt {
    font-size: 85%;
    margin-bottom: 5px;
    color:#005178;
    font-weight:bold;
    text-decoration: none;
    padding:5px;
    display:block;
}

a.sitemap-haupt:hover {
    text-decoration: underline;
}

*html #produktbeschreibung #produktbox-links p {
    width:140px;
}

*html #produktbeschreibung #produktbox-rechts p {
    width:180px;
}

.abstand {margin-bottom: 7px; margin-right:7px;}
.abstand2 {margin-bottom: 7px; margin-right:0px;}
.bildabstand {margin-bottom: 5px;}

/* ===============================
   =9. PRODUKTBILD UND FOOT-NAVIGATION
=============================== */

#produktbild2 {
    float:right;
    width:530px;
    display:block;
    margin-right:50px;
}

#produktbild {
    float:right;
    width:399px;
    display:block;
    margin-right:50px;
}

#produktbild p.adresse {
    padding-left:10px;
}

#produktbild #foot,
#produktbild2 #foot {
    width: 399px;
    display:block;
    margin-top: 1px;
}

#produktbild #foot p,
#produktbild2 #foot p { 
    display: block;
    background-color: #005187;
    font-size: 70%;
    color: #FFF;
    padding: 8px 0 8px 15px;
}

#produktbild #foot p a,
#produktbild2 #foot p a {
    color: #FFF;
    font-weight: normal;
    text-decoration: none;
    text-align: left;
}

#produktbild #foot p a:hover,
#produktbild #foot p a.used,
#produktbild2 #foot p a:hover,
#produktbild2 #foot p a.used {color: #BBB;}

/* ===============================
   =10. BLOCK-ELEMENTE
=============================== */

h2 {
    font-size: 80%;
    font-weight: bold;
    padding: 0 0 15px 0;
    color: #005178;
    line-height: 18px;
}

h3 {
    font-size: 80%;
    font-weight: bold;
    color: #000;
    line-height: 18px;       
}

ul, ol {margin: 0 0 0 0;}
ol, ul {list-style: none;}
.clear {clear: both;}

table             {width:220px;margin-bottom:15px;}
table thead tr th {font-size:85%; line-height:1.3; font-weight:bold; background-color: #DDD; color:#005187; padding: 5px;}
table tbody tr td {font-size:85%; line-height:1.3;background-color: #EFEFEF; padding: 5px;}

.farbe-weiss {background: url(../grafik/farbe-weiss.jpg) no-repeat; color:#000; padding-left: 30px; display:block; line-height:25px; margin:10px 0 10px 0;}
.farbe-pergamon {background: url(../grafik/farbe-pergamon.jpg) no-repeat; color:#000; padding-left: 30px; display:block; line-height:25px; margin:10px 0 10px 0;}
.farbe-manhatten {background: url(../grafik/farbe-manhattengrau.jpg) no-repeat; color:#000; padding-left: 30px; display:block; line-height:25px; margin:10px 0 10px 0;}
.farbe-silber {background: url(../grafik/farbe-silber.jpg) no-repeat; color:#000; padding-left: 30px; display:block; line-height:25px; margin:10px 0 10px 0;}
.farbe-rot {background: url(../grafik/farbe-rot.jpg) no-repeat; color:#000; padding-left: 30px; display:block; line-height:25px; margin:10px 0 10px 0;}
.farbe-blau {background: url(../grafik/farbe-blau.jpg) no-repeat; color:#000; padding-left: 30px; display:block; line-height:25px; margin:10px 0 10px 0;}
.farbe-ebony {background: url(../grafik/farbe-ebony.jpg) no-repeat; color:#000; padding-left: 30px; display:block; line-height:25px; margin:10px 0 10px 0;}
.farbe-anthrazit {background: url(../grafik/farbe-anthrazit.jpg) no-repeat; color:#000; padding-left: 30px; display:block; line-height:25px; margin:10px 0 10px 0;}

/* ===============================
   =11. KONTAKTFORMULAR
=============================== */

span.tabulator {
    float: left;
    width: 70px;
    display:block;
    height: 15px;
    font-weight: normal;
}

span.tabulator2 {
    float: left;
    width: 160px;
    display:block;
    height: 15px;
    font-weight: normal;
}

label.farbe {
    color: #666;
    font-style: italic;
}

span.fehler {color: #D1020E;}

input, textarea,select {
    margin-bottom:10px;
    width: 246px;
    background-color: #F8F8F8;
    border: 1px solid #005178;
    font-size: 90%; color:#333;
    font-family: Arial, Verdana, sans-serif;
}

*html input, *html textarea, *html select {
    width: 243px;
}

input.button {width: 47px; text-align:left;padding-left: 5px;}
input.button2 {width: 20px; text-align:left; border: 0px;}