/*  ==================================================================
Liqui Moly
Datei: layout.css
Media: screen

Datum: 14.09.2007
                                   
1. Allgemeine Selektoren                                 
                                   
2. Layoutbereiche
   - content                      (Inhaltsbereich)              
   - top                          (Kopfbereich)
   - Navigation 1.Ebene
   - Navigation 2.Ebene
   - midleftProd, midleftStart    (linker Bereich in Start- bzw Produktseite)
   - midrightProd, midrightStart  (rechter Bereich in Start- bzw Produktseite)  
   - footerbox                    (unterer Bereich der Seite)
   - Produktkatalog
   - Produktbild
   - Produktinfo
   - Artikel
   - Produktuebersichtsbox       (Inhalt)
                                                         
3. Runde Boxen
   - languageBox                 (Box mit Laenderflaggen)
   - prodoverviewBox             (Produktuebersichtsbox)
   - infobox und infoboxWide     (infobox fuer Produktseiten, infoboxWide fuer Startseite)
   - loginbox
   - loginInfobox                (Infobox mit Loginmöglichkeit - in jeder Seite vorhanden außer Startseite)
   - newsbox
   - tabbox                      (Box mit Tab oben auf der Startseite)
   - searchbox                   (Box mit Produktsuche)
   - suche			 (Standardsuche)

4. Sonstige
   - Produktkatalog
   - Downloads
   - Formularfelder

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

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

   =1. Allgemeine Selektoren

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

body { 
   font-size:12px;
   margin: 0px 0px 0px 0px;
   padding: 0px 0px 0px 0px;
   font-family: Arial, Verdana;
   text-align: center;
   color:black;
   
   background: white url(bodyGrad.jpg) repeat-x top left;
}

.clearer {   
   clear:both;
}

.heading { 
   margin-top:0; 
   margin-left:15px; 
   margin-bottom:2px; 
   font-size:20px; 
   color:white; 
}

.heading img { 
   padding-top:7px;  
}

img { 
   border:0; 
}

img.inTab {
   display: block;
   width: 269px;
   margin-left:8px;
   margin-right: auto;
   padding-top: 0;
   margin-bottom: 6px;
}

img.ibox {
   margin-bottom:0px;
}

.hidepics {
	width: 0px;
	height: 0px;
	visibility: hidden;
}

input { 
  margin:0; 
  padding:0;
}

input.inputText { 
   width:140px;
   height:17px;
}

div#forPrint {
   display: none;
}

.standardDiv {
   width: 648px;
   float: left;
   padding-bottom: 10px;
}

.hasInfobox {
   width: 485px;
   float: left;
   padding-bottom: 10px;
}

.hasNoInfobox {
   width: 720px;
   float: left;
}

.anfahrt {
	margin-bottom: 3px;
}

.kontaktinput {
	font-size: 11px;
}

.ulnewsarchiv {
	list-style:none;
	margin-left:0px;
	padding-left:0px;
}

.gap-saver-beta {
    height: 1px; /* without height it doesn't exist :-) */
    margin: 0;
    padding: 0;
	overflow: hidden;
}

div.newsWide {
	float:left; 
	width: 650px;
	border-bottom: 
	1px solid #d9d9d9; 
	padding-bottom: 10px; 
	padding-top: 10px;
}

div.newsNormal {
	float:left; 
	width: 450px;
	border-bottom: 
	1px solid #d9d9d9; 
	padding-bottom: 10px; 
	padding-top: 10px;
}

div.newsContentWide {
	float:left; 
	width:470px;
}

div.newsContentNormal {
	float:left; 
	width:280px;
}

ul#myapps {
	padding-left:15px;
	margin-top: 7px;
	margin-bottom: 0px;
}

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

  =2. LAYOUTBEREICHE

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

/* ===============================
   =INHALTSBEREICH (content)
=============================== */

#content {
   width: 940px;
   margin-left: auto;
   margin-right: auto;
   text-align: left;
   line-height: 1.5;
   height: 101%;
}


/* ===============================
   =KOPFBEREICH
=============================== */

.top {
   width: 940px;
   height: 155px;
   overflow: hidden;
}

.top img#li {
   padding-top:5px;
   float:left;
   z-index:1;
}

.top img#re { 
   float:right;
}


/* ===============================
   =NAVIGATIONSBEREICH ERSTE EBENE
=============================== */

.navigationboxProduct {    /*fuer den Bereich PRODUKTE*/
   float:right;
   margin:0;
   padding:0;
   /*background:transparent url(topProdukte.jpg) top right no-repeat;*/
   width:610px;
   z-index:-2;
}

.navigationboxStart {  /*fuer den Bereich UNTERNEHMEN */
   float:right;
   margin:0;
   padding:0;
   /*background:transparent url(topUnternehmen.jpg) top right no-repeat;*/
   width:618px;
   z-index:-2;
}


.topNavigation {
   float:right;
   width:618px;
   height:43px;
   position:relative;
   margin-top:43px;
   margin-bottom: 30px;
  /* z-index:100;      */
}


.navItemStart, 
.navItemProdukt {
   float:right;
   width:119px;
   padding-left:1px;
   margin:0;
   border:0;
   position:relative;
   top: -130px;
   z-index:120;
}


/* ===============================
   =NAVIBEREICH 2.EBENE (SUBMENU)
=============================== */

.subnavigationAllgemein {
   width:940px;
   height:29px;
   position: relative;
   top: -134px;
   background: transparent url(submenuAllgemein.jpg) no-repeat top right;
   z-index: 103;
}

.subnavigationStart {
   width:940px;
   height:29px;
   position: relative;
   top: -134px;
   background: transparent url(submenuStart.jpg) no-repeat top right;
   z-index: 103;
}

.subnavigationProduct {
   width:940px;
   height:29px;
   position: relative;
   top: -134px;
   background: transparent url(submenuProdukt.jpg) no-repeat top right;
   z-index: 103;
}

.subnavigationService {
   width:940px;
   height:29px;
   position: relative;
   top: -134px;
   background: transparent url(submenuService.jpg) no-repeat top right;
   z-index: 103;
}

.subnavigationAktuelles {
   width:940px;
   height:29px;
   position: relative;
   top: -134px;
   background: transparent url(submenuAktuelles.jpg) no-repeat top right;
   z-index: 103;
}

.subnavigationWelt {
   width:940px;
   height:29px;
   position: relative;
   top: -134px;
   background: transparent url(submenuWeltweit.jpg) no-repeat top right;
   z-index: 103;
}

img.subDivisor {
   z-index:300; 
   margin-left:3px;
   margin-right:3px;
   position:relative; 
   bottom:-2px;
}

/*schiebt sich ueber die Sprachenbox mit den Flaggen*/
img#rightNavItem {
   z-index: 100;
}


/* ===============================
   =NAVIBEREICH 3-5.EBENE 
=============================== */

div.navigationlevel3to5 {
   float: left;
   width: 160px;
   margin-right: 7px;
}

.liLeft {
   float:left;
   width: 16px;
   padding-top: 10px;
}

.liLeft2 {
   float:left;
   width: 12px;
   padding-top: 10px;
}

.liRight {
   float:left;
   width: 130px;
   margin-left:3px;
   padding-top: 6px;
   overflow: hidden;
}


ul.navi {
   list-style: none;
   margin: 0;
   padding: 0;
   font-family: Arial, Verdana;
   font-size: 8px;
}

li.navlevel3 {
	 margin-left: 3px;
   /*margin-bottom: 5px;*/
   margin-top: 5px;
   clear:left;
}

li.navlevel4 {
   margin-left: 7px;
   margin-top: 8px;
   clear:left;
}

li.navlevel5 {
   margin-left: 27px;
   margin-top: 0px;
   clear:left;
}

li.navlevel3a {
	 margin-left: 3px;
   /*margin-bottom: 5px;*/
   margin-top: 5px;
   clear:left;
}

li.navlevel4a {
   margin-left: 7px;
   margin-top: 8px;
   clear:left;
}

li.navlevel5a {
   margin-left: 27px;
   margin-top: 0px;
   clear:left;
}





/* ===============================
   =BEREICH MITTE-LINKS
=============================== */

.midleftProd { /*fuer die Produktseiten*/
   float:left;
   width:694px;
   margin-top:10px;
   margin-right:10px;
   height:auto;
}


.midleftStart { /*fuer die Startseite*/
   margin-top:10px;
   width:622px;
   height:auto;
   float:left;
}


/* ===============================
   =BEREICH MITTE-RECHTS
=============================== */

.midrightProd { /*fuer die Produktseiten*/
   margin-top:10px;
   float:right;
   width:235px;
   height:auto;
}

.midrightStart { /*fuer die Startseite*/
   margin-top:10px;
   float:right;
   width:318px;
   height:auto;
}


/* ===============================
   =FUSSBEREICH
=============================== */

.footerbox {
   width:940px;
   height:20px;
   background:transparent url(schatten.gif) no-repeat top left;
   color:#333333; 
   margin-top:5px;
   padding-top:4px;
   padding-left:10px;
   font-size:11px;
}


/* ===============================
   =PRODUKTKATALOG
=============================== */

.productCatalogue {
   padding-left:3px;
   float:left;
   width:240px;
   font-size:12px;
   background: white;
}


/* ===============================
   =PRODUKTBILD
=============================== */

.productPicture {
   float:left;
   width:100px;
   margin-right:10px;
   margin-left:3px;
   background: white;
   text-align: right;
}


/* ===============================
   =PRODUKTINFO
=============================== */

.productInfo {
   float:left;
   width: 305px;
   font-size:11px;
   background: white;
}


/* ===================================
   =ARTICLES (Bereich weitere Artikel)
=================================== */

.articles {
   float:left;
   width: 150px;
   margin-top:8px;
}

.articlesLeft{
   float:left;
   width:40px;
   padding-top:4px;
}

.articlesRight{
   font-size:11px;
   line-height:1.3;
   float:left;
   padding-left:1px;
   width:auto;
}


/* ===============================
   =PRODUKTUEBERSICHT
=============================== */

.productboxParent {
   width: 670px;
   padding-left:10px;
   padding-top:0px;
   
}

.productChildAll { 
   float:left;
   width:310px; 
   height:auto;
   margin-right:10px;
   margin-bottom:10px; 
}

.productChildAll {
   float:left;
   width:310px;
   margin-right:10px;
   margin-bottom:10px;
}

.productChildLeft {
   float:left; 
   width:142px;
}

.productChildLeft img {
   display: block;
   width: 133px;
   margin-top: 5px;
   margin-left:auto;
   margin-right: auto;
}

.productChildRight { 
   padding:3px;
   float:left; 
   width:140px;
   font-size:12px; 
   background:white;
}


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

  =3. RUNDE BOXEN

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

/* ===========================================
   =languageBox 
   (weiße Box mit Länderflaggen)
============================================ */

.languageBox {
  width:119px;
  float:right;
  position:relative;
  top: -127px;
}

.languageBox img {
   border:1px solid black;
   margin-top:0;
   padding-top:0;
}

/*TODO: auslagern in IE6 Datei*/
* html .languageBox img {
   border:1px solid black;
   margin-bottom:3px;
   margin-top:0;
}

.languageBoxContent {
   text-align: center;
   background:white;
   margin-top: 0;
   padding-top: 0;
}

.languageBoxTopLeft {
   margin-right: 8px;
   background-image: url(languageBoxTop.gif) ;
   height: 6px;
   font-size:2px;
}

.languageBoxTopRight {
   margin-top:-6px;
   margin-left:8px;
   background-image: url(languageBoxTop.gif);
   background-position: 100% 0;
   height:6px;
   font-size:2px;
}

.languageBoxNoTopGap {
   margin-top:0;
   margin-bottom:0;
}


/* ===============================
   =prodoverviewBox
    (Box mit der Produktübersicht)
=============================== */
     
.prodoverviewBox {
   width: 679px;
   height:auto;
   margin-top:5px;
}

.prodoverviewBoxTopLeft {
   margin-right: 8px;
   background-image: url(whiteTop.gif) ;
   height: 6px;
   font-size:2px;
}

.prodoverviewBoxTopRight {
   margin-top:-6px;
   margin-left:8px;
   background-image: url(whiteTop.gif);
   background-position: 100% 0;
   height:6px;
   font-size:2px;
}

.prodoverviewBoxNoTopGap {
   margin-top:0;
   margin-bottom:0px;
}

.prodoverviewBoxContent {
   background:white;
   overflow: auto;
}

.prodover_insideDetail {
   background:white;
   
}

#productDetail {
  background: white;
  height: 350px;
}


/* ===============================
   =infobox und infoboxWide
    (Boxen im rechten Bereich der Seite)
=============================== */

.infoboxWide { 
   width:314px; 
   margin-top:21px;
   float:right; 
}

.infobox { 
   width:234px; 
   margin-top:18px; 
   float:right; 
}

.infoboxTopLeft { 
   margin-right: 7px; 
   background-image: url(infoboxTop.gif) ;
   height: 8px; 
   font-size:2px; 
}

.infoboxTopRight { 
   margin-top:-8px;  
   margin-left:7px;
   background-image: url(infoboxTop.gif); 
   background-position: 100% 0; 
   height:8px; 
   font-size:2px; 
}

.infoboxContent { 
   border-left: 1px solid #a29f9f;
   border-right: 1px solid #a29f9f;
   margin-bottom:0px; 
   margin-top:0px; 
   padding: 0;
   text-align: left;
  
   /*background:#cccccc url(infoboxGradient.gif) top left repeat-x; */
}

.infoboxInnerContent {
   background: #cccccc url(infoboxGradient.gif) top left repeat-x;
}



/*TODO: anderer Name*/
.infoboxContent2 {  /* für nicht so hohe Boxen, damit der Verlauf angezeigt wird */
      border-left: 1px solid #cccccc; 
      border-right: 1px solid #cccccc; 
      border-bottom:0px; 
      border-top:0px;
      background:#cccccc url(whiteToGrayShort.gif) top left repeat-x; 
}

.infoboxNoTopGap { 
   margin-top:0; 
   margin-bottom:0px; 
}    

.infoboxHeading { 
   margin-top:0; 
   margin-left:0px; /*vorher 10*/
   margin-bottom:2px; 
   padding-top:5px; 
}

.infoboxNoBottomGap {
   margin-bottom:0; 
   
   margin-left:10px;
   margin-right:15px;
   font-size:11px; 
   color:#333333;
}

.infoboxBottomLeft {
   margin-right:6px; 
   background-image: url(info-tabboxBottom.gif);
   background-position: 0 -5px; 
   height:10px; 
   font-size:2px; 
}

.infoboxBottomRight {
   margin-top: -10px; 
   margin-left: 6px; 
   background-image: url(info-tabboxBottom.gif);
   background-position: 100% -5px; 
   height:10px; 
   font-size:2px; 
}
     
img.buttonInfobox {
   position:relative; 
   left:10px;
   bottom:-10px; 
   border:0; 
}

input.buttonInfobox {
   position:relative; 
   left:10px;
   bottom:-10px; 
   border:0; 
}


/* ===============================
   =loginInfoBox
    (Boxen im rechten Bereich der Seite)
=============================== */

.loginInfoBox { 
   width:234px; 
   margin-top:18px; 
   float:right; 
}

.loginInfoBoxTopLeft { 
   margin-right: 7px; 
   background-image: url(loginInfoBoxTop.gif) ;
   height: 8px; 
   font-size:2px; 
}

.loginInfoBoxTopRight { 
   margin-top:-8px;  
   margin-left:7px;
   background-image: url(loginInfoBoxTop.gif);
   background-position: 100% 0;
   height:8px; 
   font-size:2px; 
}

.loginInfoBoxBottomLeft {
   margin-right:7px; 
   background-image: url(loginInfoBoxBottom.gif);
   background-position: 0 -1px;
   height:8px; 
   font-size:2px; 
}

.loginInfoBoxBottomRight {
   margin-top: -8px; 
   margin-left: 7px; 
   background-image: url(loginInfoBoxBottom.gif);
   background-position: 100% -1px; 
   height:8px; 
   font-size:2px;
}

.loginInfoBoxContent { 
   border-left: 1px solid #a29f9f; 
   border-right: 1px solid #a29f9f; 
   margin-bottom:0px; 
   margin-top:0px; 
   padding: 0;
   text-align: left;
  
   background:#042c65 url(loginInfoBoxGradient.jpg) top left repeat-x; 
}

.loginInfoboxNoTopGap {
   margin-top:0;
   margin-bottom:0px;
 
}

.loginInfoboxNoBottomGap {
   margin-bottom:0; 
   margin-top:0; 
 
}



/* ===================================
   =boxWorld 
    (Boxen in Infobox - Weltweit)
    --> bessere Lsg. bereits in voila
==================================== */

.boxWorld {
   width:312px;
   height:130px;
   text-align:center; 
   margin-top:10px;
}

.boxWorldL { 
   float:left;
   width:25px;  
}

.boxWorldL img, .boxWorldR img {
   margin-bottom:0;
   padding-top:45px; 
}

.boxWorldC { 
   float:left;
   width:258px;  
}

.boxWorldC img {
   display:block;
   margin-left: auto;
   margin-right: auto;
}

.boxWorldR { 
   float:right;
   width:25px;  
}


/* ===============================
   =loginbox
=============================== */
        
.loginbox{
   margin-top:15px;
   width:225px;
   float:left;
}

#loginbox{
   margin-top:15px;
   width:225px;
   float:left;
}

.loginFormRow { 
   width:210px; 
   text-align:left; 
   margin-top:3px;
   height:17px;
} 

.loginFormLeftColumn {
   float:left;
   width:60px;
   margin-left:10px;
}

.loginFormRightColumn {
   float:left;
   width:140px;
}

.loginFormRightColumn img {
   padding-left:40px; 
   padding-top:10px; 
}

.loginboxLeftTop {
   margin-right:8px;
   height:9px;
   font-size:2px;
   background-image: url(loginAll.gif);
}

.loginboxRightTop {
   margin-left: 8px;
   margin-top: -9px; 
   background-image: url(loginAll.gif) ;
   background-position: 100% 0px;   /*0=von linksbeginnend , -x px = von unten gesehen x px hoch  */
   height: 9px;
   font-size:2px;
}

.loginboxLeftBottom {
   margin-right:8px;
   height:7px;
   font-size:2px;
   background-image: url(loginAll.gif);
   background-position: 0 -9px;
}

.loginboxRightBottom {
   margin-left:8px;
   margin-top:-7px;
   background-image: url(loginAll.gif);
   background-position: 100% -9px;   /*0=von linksbeginnend , -x px = von unten gesehen x px hoch  */
   height:7px;
   font-size:2px;
}

.loginButton {
    width:80%;
    text-align:right;
}

.loginInfoBoxButton {
	margin-top: 3px;
	width:75%;
    text-align:right;
}

.loginButton input {
   margin-bottom: 10px;
   margin-top: 10px;
}

#loginRegTxt {
   width:92%;
   text-align:right;
}

.loginboxContent {
   background:#042d65 url(loginGradient.gif) top left repeat-x;
   border-right: 1px solid #91a2bc;
   border-left: 1px solid #92a2b9;
   /*
height: 174px;
*/
}

#loginboxContent {
   background:#042d65 url(loginGradient.gif) top left repeat-x;
   border-right: 1px solid #91a2bc;
   border-left: 1px solid #92a2b9;
   /*
height: 174px;
*/
}
      
.loginNoTopGap {
   margin-top:0;
   margin-bottom:0px;
   padding-left:5px; 
}

.loginNoBottomGap {
   margin-bottom:0; 
   margin-top:0; 
   margin-left:15px; 
   font-size:11px; 
   color:black;
}


/* ===============================
   =NEWSBOX
=============================== */

.newsbox {
   margin-top:15px;
   width:365px;
   margin-right:1px;
   float:left;
}

#newsbox {
   margin-top:15px;
   width:365px;
   margin-right:1px;
   float:left;
}


.newsboxLeftTop {
   margin-right: 8px;
   background-image: url(newsTop.gif) ;
   height: 8px;
   font-size:2px;
}

.newsboxRightTop {
   margin-top:-8px;
   margin-left:7px;
   background-image: url(newsTop.gif) ;
   background-position: 100% 0;
   height:8px;
   font-size:2px;
}

.newsboxLeftBottom {
   margin-right:8px;
   background-image: url(newsBottom.gif);
   background-position: 0 7px;   /*0=von linksbeginnend , -x px = von unten gesehen x px hoch  */
   height:7px;
   font-size:2px;
}

.newsboxRightBottom {
   margin-left:8px;
   margin-top:-7px;
   background-image: url(newsBottom.gif);
   background-position: 100% 7px;
   height:7px;
   font-size:2px;
}

.newsboxContent {
   background:#282828 url(newsGradient.gif) top left repeat-x;
   border-right: 1px solid #9f9f9d;
   border-left: 1px solid #9f9f9d;
   text-align:left;
   height: 195px;
}

#newsboxContent {
   background:#282828 url(newsGradient.gif) top left repeat-x;
   border-right: 1px solid #9f9f9d;
   border-left: 1px solid #9f9f9d;
   text-align:left;
  /* height: 195px;*/
}

.newsboxNoTopGap {
   margin-top:0;
   margin-bottom:0px;
   padding-left:5px;
}

.newsboxNoBottomGap {
   margin-bottom:0;
   margin-top:0;
   margin-left:15px;
   font-size:11px;
   color:black;
}

img.buttonNews {
   position: relative;
   left:7px;
   bottom:-7px;
   border:0;
}


/* ======================================
   =NEWSINLINE
    (Box mit einer einzelnen Nachricht)
======================================= */

.newsinline {  /*Formatierung von News in der Newsbox*/
   clear:both;
   float: left;
   width: 357px;
   margin: 0px 5px 0px 5px;
   padding: 4px 0px 4px 0px;
   border-bottom: 1px solid gray;
}


.newsinline#last {
   border-bottom:0;
}

/*Hier Bild hinterlegen*/
.newsinline .left {
   float:left;
   width:16px;
   margin-right:2px;
}

.newsinline .left img {
   display:block;
   width: 16px;
   margin-left: auto;
   margin-right: auto;
   padding-top:5px;
}

/* -- newsinlineR -- Nachrichteninhalt */
.newsinline .right {
   float:left;
   width:339px;  /*normal: 335 */
   color:white;
}






/* ===============================
   =TABBOX
=============================== */

.tabbox {
   float:left;
   width: 287px;
   height:auto;
   margin-right:16px;
   margin-top:15px;
}

.upperTab { /*Breite oberes Rechteck*/
   width:159px;
}

.WideBox { /*Breite unteres Rechteck*/
   width:287px;          
   margin-top: 0px;
   padding-top: 0px;
}       

.tabboxTopLeft { 
   margin-right: 8px;
   background-image: url(whiteTop.gif) ;
   height: 10px;
   font-size:2px;
   position:relative;
   bottom: -1px;
 }

.tabboxTopRight { 
   margin-top:-10px;  
   margin-left:8px;
   background-image: url(whiteTop.gif);
   background-position: 100% 0;
   height:10px;
   font-size:2px;
   position:relative;
   bottom: -1px;
}
           
.upperTabContent {  /* oberer Inhalt */
  background:white;
  position:relative;
  bottom: -1px;  
 }
 
.tabboxContent {   /* unterer Inhalt */
   background:#cccccc url(whiteToGrayLong.gif) top left repeat-x;
   margin-top: 0;
   padding-top: 0;
   border-left: 1px solid #a29f9f;
   border-right: 1px solid #a29f9f;
   border-top: 1px solid #a29f9f;   
}
         
.tabboxNoTopGap { 
   margin-top:0; 
   margin-bottom:0px; 
   padding-top:10px;
}

.tabboxNoBottomGap { 
   margin-bottom:0; 
   margin-top:0;
   padding-top:0;
   margin-left:10px;
   font-size:11px;
   color:black; 
}

.tabboxBottomLeft { 
   margin-right:6px;
   background-image: url(info-tabboxBottom.gif);
   background-position: 0 -5px;   
   height:10px;
   font-size:2px;
}
               
.tabboxBottomRight { 
   margin-top: -10px;  
   margin-left: 6px;   
   background-image: url(info-tabboxBottom.gif);
   background-position: 100% -5px;                 
   height:10px;
   font-size:2px;
}

img.buttonTabbox {
   position:relative;
   left:10px;
   bottom:-10px;
   border:0;
}


/* ===============================
   =SEARCHBOX
=============================== */

.searchbox {
   width: 679px;
   height:auto;
   margin-top:10px;
   margin-bottom:10px;
}
         
.searchboxTopLeft {
   margin-right: 8px;
   background-image: url(whiteTop.gif) ;
   height: 10px;
   font-size:2px;
 }

.searchboxTopRight {
   margin-top:-10px;  /*Hoehe von oberen Teil*/
   margin-left:8px;  /*Randradius*/
   background-image: url(whiteTop.gif);
   background-position: 100% 0;
   height:10px;
   font-size:2px;
}       
  
.searchboxNoTopGap {
   margin-top:0;
   margin-bottom:0px; 
   padding-left: 5px; 
   padding-bottom:5px;
   
}

.searchboxNoBottomGap {
   margin-bottom:0; 
   margin-top:0; 
   margin-left:15px; 
   font-size:11px; 
   color:black;
}

.searchboxBottomLeft {
   margin-right:6px;
   background-image: url(prodsearchBottom.gif);
   background-position: 0 -3px;
   height:10px;
   font-size:2px;
}
               
.searchboxBottomRight {
   margin-top: -10px;  
   margin-left: 6px;   
   background-image: url(prodsearchBottom.gif);
   background-position: 100% -3px;
   height:10px;
   font-size:2px;
}  

.searchboxContent {
   background:#cccccc url(whiteToGrayShort.gif) top left repeat-x; 
   padding-top:0px;
   margin-top:0px;
}

.searchboxContentRow {
   width:650px;
   margin-left:7px;
   margin-bottom:10px;
}

.searchboxContentRow2 {
   width:650px;
   margin-left:7px;
   margin-bottom:10px;
}

.searchboxContentRow2 input#first {
   margin-left: 0;
   padding-left: 0;
}

input.buttonSearchbox {   /* fuer Formular Produktsuche in Produktuebersicht */
   position:relative;
   left:10px;
   bottom:-10px;  
   border:0;
}

.suche  {
   background-image: url(bg_weiss.gif);
   background-repeat: no-repeat;
   width:679px;
   float: left;
   font-size:12px;
   font-family: Arial, Verdana;
   color:black;
   /*overflow: hidden;        */


}

.sucheWide  {
   background-image: url(bg_weiss_breit.gif);
   background-repeat: no-repeat;
   width:940px;
   float: left;
   font-size:12px;
   font-family: Arial, Verdana;
   color:black;
}

.suche_content  {
  margin: 0px 10px 10px 10px;
  padding-top: 10px;
  font-size: 11px;
  font-family: Arial, Verdana;
  color: black;
}



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

   =4. KATALOGE (LISTEN)

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

/* ===============================
   =PRODUKTKATALOG
    unpraktikable Loesung -
    wird in voila vereinfacht
=============================== */

ul.topselected {  
   list-style-image: url(nav_top_selected.gif);
   margin-bottom: 20px; 
   color:red;
}
  
* html ul.topselected {  /* IE-LSG */
   list-style-image:url(nav_top_selected.gif);
   margin-bottom:30px; 
   color:red;
}
  
ul.topselected a {  
   color:#375b99;  
}

ul.topunselected a { 
   color:#375b99; 
}
   
ul.topselected ul { 
   list-style-image:url(sub_nav_selected.gif); 
   margin-left:-20px; 
   margin-top:8px; 
   color:red; 
}

* html ul.topselected ul { /* IE-LSG */
   list-style-image:url(sub_nav_selected.gif); 
   margin-left:20px; 
   margin-top:8px; 
   color:red;
}

ul.topselected ul ul { 
   list-style:none; 
   padding-left:25px; 
   margin-top:-2px; 
   color:#999999;
}
   
ul.topselected ul ul a { 
   text-decoration:none; 
}

* html ul.topselected ul ul { 
   list-style-image:none;  
   padding-left:0px; 
   color:#999999; 
}

* html ul.topselected ul ul a { 
   text-decoration:none; 
}

ul.topunselected { 
   list-style-image:url(top_nav_unselected.gif);  
   margin-top:-13px;
} 

* html ul.topunselected { 
   list-style-image:url(top_nav_unselected.gif);  
   margin-top:-17px;
} 

/* ===============================
   =DOWNLOADS
=============================== */

.downloadLeft {
   clear:left;
   float:left;
   height: 20px;
   width:10px;
   background:url(pdf_symbol.gif) no-repeat center;
}

.downloadRight {
   float:left;
   margin-left:4px;
}


/* ===============================
   =TABLE
    (mit Produktdetails und Kontaktformular)
=============================== */

#detail {
   text-align:left;
   margin-top:4px;
}

#detail td.left {
    padding-left:5px;
    background:#d20000;
    color:white;
    font-weight:bold;
    width:95px;
}

#detail td.right {
    padding-left:5px;
    background:#cccccc;
    color:black;
    font-weight:bold;
    width:180px;
}

#kontakt  {
  font-size: 11px;
  font-family: Arial, Verdana;
  color: black;
}
   


 /* ===============================
   =TEASER
=============================== */

/* ===============================
   =bild links / text rechts
=============================== */

.contentTeaserPicText {
    clear:both;
    width:100%;
    margin-bottom: 10px;
    margin-top: -1px;   /* wg. clear:both;*/
    float:left;
}

.contentTeaserPicText .picture {
    float:left;
    margin-right:7px;
}

.contentTeaserPicText .text {
    float:left;
    width: 70%;
}

.contentTeaserEmpty {
    height: 0px;
}




div.contentteaser {
  width: 100%;
  float: left;
}

div.contentteaserl2 {
  width: 100%;
  float: right;
}

/*
 * Bugfixies für IE 6 und IE 7
 */

* html div.contentteaser div.cttext {
/*  margin-top:-19px;*/
  margin-top:-4px;
}

* html div.contentteaser div.cttext2 {
/*  margin-top:-4px;*/
  margin-top:-4px;
  
}

div.contentteaser div.ctimage {
  float:left;
  margin:19px 15px 5px 0;

}

/* Bild in Layout2 Text links / Bild rechts */
div.contentteaserl2 div.ctimagel2 {
  float:right;
  margin:19px 0px 5px 15px;
}

div.contentteaser div.ctbox {
  width:70%;
  float:left;
}

div.contentteaser div.ctheadline {
  font-weight:bold;
  margin-bottom:3px;
}

div.contentteaser div.cttext {
  margin-bottom:5px;
  margin-top:0px;
  vertical-align:top;
  width: 70%;
  float:left;
}

div.contentteaser div.cttext2 {
  margin-bottom:5px;
  margin-top:0px;
  vertical-align:top;
  width: 70%;
  float:left;
}

/* funktioniert so nicht !!! */
div.contentteaserl2 div.cttext2l2 {
  margin-bottom:5px;
  margin-top:0px;
  vertical-align:top;
  width: 70%;
  float:right;
/*  text-align: justify;*/
}

/*
div.contentteaser div.cttext2l2 {
  margin-bottom:5px;
  margin-top:0px;
  vertical-align:top;
  width: 70%;
  float:right;
}*/

.layout2Text {
   /*text-align:justify;*/
   margin-top:15px;
}
  

div.clearboth {
  clear:both;
  float:none;
  height:0px;
  font-size:1px;
  line-height:1px;
}







/* ===============================
   =text links / bild rechts
=============================== */

.contentTeaserTextPic {
    clear:both;
    width:100%;
    margin-bottom: 10px;
    float:left;
}

.contentTeaserTextPic .text {
    float:left;
    width: 70%;
    margin-right:7px;
}

.contentTeaserTextPic .picture {
    float:left;
}




/* ===============================
   =Text oben / 3 Bilder unten
=============================== */

.contentTeaserTxt3PicText {
   clear:both;
   padding-bottom: 10px;
}

.contentTeaserTxt3PicPicture {
   float:left;
   padding-bottom: 10px;
   margin-right: 8px;
}


/* ===============================
   =Tab auf der Tabbox
=============================== */

.tableft {
   float:left;
   width:5px;
   height:31px;
   background:url(tabboxLeft.gif);
    position:relative;
      bottom: -1px;
}

.tabright {
   float:left;
   width:5px;
   height:31px;
   background:url(tabboxRight.gif);
   position:relative;
   bottom: -1px;
}

.tabmid {
   float:left;
   display:block;
   width: auto;
   min-width: 150px;
   text-align:left;
   height:21px;
   padding-top: 10px;
   background: white;
   padding-right:2px;
    position:relative;
      bottom: -1px;

}

* html .tabmid {
   width: 150px;
   height:31px;
}


/*input, select, textarea { 
    color:black; 
    font-size:11px; 
    font-family:Arial, Verdana, Helvetica, Sans-Serif; 
    background-repeat:no-repeat; 
    border:solid 1px #a9a9a9; 
    border-collapse:collapse; 
    padding:0 0 0 3px;
}*/

    .layoutArea {
        width: 694px;
        float: left;
     }

     .layer {
      width: 640px;
      float: left;
     }

     .clear {
        clear: both;
        height: 0px;
        overflow: hidden;
     }




    /*  div {border: 1px solid red;} */