/*  =========================================================
Stylesheet CM 
Datei:  bildschirm.css
Media:  screen
Datum:  10.02.2008
========================================================== */

/* Kalibrierung der wichtigsten Abst&auml;nde */
*  { padding: 0; margin: 0; }
h2, h3, p, ul, ol { margin-bottom: 1em; }  
ul ul { margin-bottom: 0; } 
li { margin-left: 1em; list-style: url(images/azz.png); } 
em { color: #fc7217; font-style: normal; font-weight: bold; }

/* Allgemeine Selektoren */

html { height: 101%; } 
body { 
   color: #bed747; 
   background: url(pics/body_bg.gif);
   font-family: Verdana, Arial, Helvetica, sans-serif; 
   font-size: small;
   scrollbar-3dlight-color: #bed747;
   scrollbar-arrow-color: #bed747;
   scrollbar-darkshadow-color: #bed747;
   scrollbar-face-color: #fc7216;
   scrollbar-highlight-color: #bed747;
   scrollbar-shadow-color: #bed747;
   scrollbar-track-color: #bed747; 
}
h1 { font-size: 150%; }
h1.orange { font-size: 100%; color: #fc7216;  line-height: 1.5em;  }
h1.small { font-size: 100%; font-weight: normal; text-align: center; }
h1.smallf { font-size: 100%; font-weight: bold; color: #fc7216; text-align: center; }
h2 { font-size: 130%; }
h3 { font-size: 100%; color: #fc7216; }
address {
   text-align: center;  
   font-size: 80%;      
   font-style: normal;  
   letter-spacing: 2px;  
}
strong {
   color: #fc7216;
}

/* Hyperlinks */
a { text-decoration: none; outline: none;} 
a:link { color: #199045; } 
a:visited { color: #fc7216; }
a:hover, 
a:focus { 
  border-bottom: 1px solid #199045;
}
a:active { 
   color: white; 
   background-color: #bed747; 
}
/* Hyperlinks_none */
a.none { text-decoration: none !important; outline: none !important;
         border: none !important; } 
a.none:hover, 
a.none:focus { 
  border: none !important;
}
a.none:active { 
   color: white; 
   background-color: #bed747; 
}





/* Allgemeine Klassen und IDs */
.skiplink { 
   position: absolute; 
   left: -3000px; 
   top: -2000px; 
   width: 0px; 
   height: 0px; 
   overflow: hidden; 
   display: inline; 
}
.bildlinks {
   float:left; 
   padding: 3px; 
   border: 5px solid #bed747; 
   margin-right: 10px; 
   margin-bottom: 10px; 
}
.bildrechts {
   float:right; 
   padding: 3px; 
   border: 5px solid #bed747; 
   margin-bottom: 10px;
   margin-left: 10px; 
}
.bild_table {
   float:left !important;
   padding: 3px !important; 
   border: 1px solid #bed747 !important;
   margin-right: 5px !important; 
   margin-bottom: 10px !important; 
}
.kasten_ohnerand {
   float:left !important;
   padding: 0 !important; 
   border: none !important;
   margin-right: 24px !important;
   margin-left: 12px !important;
   font-size: 80% !important;
}
.kasten_ohnerand_1 {
   float:left !important;
   padding: 0 !important; 
   border: none !important;
   margin-right: 24px !important;
   margin-left: 360px !important;
   font-size: 80% !important;;
}
.kasten_ohnerand_2 {
   float:left !important;
   padding: 0 !important; 
   border: none !important;
   margin-right: 0 !important;
   margin-left: 12px !important;
   font-size: 80% !important;;
}

#clearing { clear: both; }
#logo { 
   color: black;
   padding: 0;
   border: 0 solid #fff100; 
}

/* ==================================== 
   2. Styles für die  Layoutbereiche 
   ==================================== */

#wrapper { 
   color: black; 
   background: white url(pics/bg_fig.gif) repeat-y top left;
   width: 720px;  
   margin: 10px auto;
}

#kopfbereich {
   position: relative;  
   color: black; 
   background: #bed747 url(pics/farbverlauf.jpg) repeat-y top left;
   padding: 10px 20px 0 20px; 
}
   #kopfbereich p {
      top: 10px ; 
      right: 10px;  
      font-weight: bold;  
      padding: 5px 0 3px 0; 
      margin-bottom: 0; 
   }
   #kopfbereich p span {
      color: #bed747;  
   }

#navibereich { 
   text-align: right;  
   color: black;
   background: #bed747 url(pics/farbverlauf_.jpg) repeat-y top left; 
   padding: 5px 10px 4px 10px;  
   border-bottom: 1px solid #14902d;
} 
   #navibereich ul { 
      margin-bottom: 0; 
   } 
   #navibereich li { 
      display: inline; 
      list-style-type: none; 
      margin: 0 ;  
   }
   #navibereich a { 
      color: black; 
      background-color: #bed747; 
      padding: 4px 4px 4px 8px; 
      border: 1px solid #14902d;
   }  
   #navibereich a:hover,
   #navibereich a:focus,
   #startseite #navi01 a, 
   #galerieseite #navi06 a,
   #hv #navi03 a,
   #hd #navi04 a,
   #kosmetik  #navi05 a,
   #news_aktionen #navi08 a,
   #kontaktseite #navi02 a { 
      color: black; 
      background: #ecdf5d url(pics/menu_verlauf.gif);
      border-bottom-color: #ecdf5d; 
   }  
   #navibereich a:active { 
      color: black;
      background-color: white; 
   }  

#textbereich { padding: 20px 10px 20px 20px; }
   #textbereich a { 
      border-bottom: 1px dotted #cc0000;
   }
   #textbereich a:hover,
   #textbereich a:focus { 
      border-bottom: 1px solid #bed747; 
   }
   
 

#fussbereich {
   padding: 10px 20px 20px 20px;
   border-top: 1px solid #bed747; 
   margin-top: 20px; 
}


/* ==================================== 
   3. Sonstige Styles 
   ==================================== */
   
iframe {
   background-color: #ffffff;
   width: 640px;
   height: 480px;
   padding: 20px; 
   border: 1px solid #bed747;
}

/* Das Kontaktformular */
form {
   background-color: none;
   width: 590px; /* Breite des Formulars */ 
   padding: 10px; 
   /* border: 1px solid #bed747; */
}
/* Beschriftung auf eigener Zeile */
label { 
   display: block; 
   cursor: pointer; 
} 
input#absender, 
textarea { 
   width: 300px;
   border: 1px solid #bed747;
}
textarea { 
   height: 7em; 
}
input#absender:focus, 
textarea:focus {
   background-color: #d9d9d9; 
}
div.text { 
   overflow: hidden; /* zum Umschließen der Floats */
   padding: 0; 
   margin: 0;
 }
 div.textscroll { 
   overflow: scroll; 
   overflow-x: hidden;
   padding-right: 4px;
   padding-bottom: 6px; 
   margin: 0;
   height: 410px;
 }
/* PICS */
div.galerie { 
   overflow: hidden; /* zum Umschließen der Floats */
   padding: 25px 10px 10px 0; 
   margin: 0 3px 3px 0;
 }

/* für IE6 */
* html div.galerie { height: 1%; }

div.galerie img { 
   float: left; 
   padding: 4px;
   border: 1px solid #bed747; 
   border-right-color: #bed747; 
   border-bottom-color: #bed747; 
   margin-right: 15px; 
   margin-bottom: 15px;  
}

/* G A L E R Y */  
#lightbox{	position: absolute;	left: 0; width: 100%; z-index: 100; text-align: center; line-height: 0;}
#lightbox img{ width: auto; height: auto;}
#lightbox a img{ border: none; }

#outerImageContainer{ position: relative; background-color: #fff; width: 250px; height: 250px; margin: 0 auto; }
#imageContainer{ padding: 10px; }

#loading{ position: absolute; top: 40%; left: 0%; height: 25%; width: 100%; text-align: center; line-height: 0; }
#hoverNav{ position: absolute; top: 0; left: 0; height: 100%; width: 100%; z-index: 10; border: none; }
#imageContainer>#hoverNav{ left: 0; border: none;}
#hoverNav a{ outline: none;}

#prevLink, #nextLink{ width: 49%; height: 100%; background-image: url(data:image/gif;base64,AAAA); /* Trick IE into showing hover */ display: block; border: none; }
#prevLink { left: 0; float: left;}
#nextLink { right: 0; float: right;}
#prevLink:hover, #prevLink:visited:hover { background: url(images/prevlabel.gif) left 15% no-repeat; border: none; }
#nextLink:hover, #nextLink:visited:hover { background: url(images/nextlabel.gif) right 15% no-repeat; border: none; }

#imageDataContainer{ font: 10px Verdana, Helvetica, sans-serif; background-color: #fff; margin: 0 auto; line-height: 1.4em; overflow: auto; width: 100%; }

#imageData{	padding:0 10px; color: #ff5400; }
#imageData #imageDetails{ width: 70%; float: left; text-align: left; }	
#imageData #caption{ font-weight: bold;	}
#imageData #numberDisplay{ display: block; clear: left; padding-bottom: 1.0em;	}			
#imageData #bottomNavClose{ width: 66px; float: right;  padding-bottom: 0.7em; outline: none;}	 	

#overlay{ position: absolute; top: 0; left: 0; z-index: 90; width: 100%; height: 500px; background-color: #000; }
/*end G A L E R Y */  



/* ======================================= 
   E N D E   D E S   S T Y L E S H E E T S 
   ======================================= */