/*******************************************************************************
* Gestaltungsanweisungen fuer die Handheld-Variante der Webseite               *
* Gruenfisch Webdesign GbR, Daniel Zenner und Oliver Richter                   *
*******************************************************************************/


/******************************************************************************/ 
/***** Start: Defintion der Standardklassen und des Grundgeruestes ************/
/******************************************************************************/ 
html *
 {
  margin: 0;
  padding: 0;
 }
 
body
 {
  font-family: Arial, Verdana, sans-serif;
  font-size: 100%;
  color: #666699; 	
  background: #ffffff;
 } 

.beendeLinksFluss  { clear: left; }
.beendeRechtsFluss { clear: right; }
.beendeFluss       { clear: both; }

.unsichtbar { display: none; }

.linksAusrichtung   { text-align: left; }
.rechtsAusrichtung  { text-align: right; }
.mittigeAusrichtung { text-align: center; }

.ohneRand { border: 0 !important;}


/****** Definition des Grundlayouts *******************************************/ 
div#gesamt_container { width: 100%;	 }
div#layout_container_aussen { width: 100%; } 
div#layout_container_innen { width: 100%;  }  
 
 
/****** Kopf-Bereich **********************************************************/
div#kopf_container { background: url(../bilder/hintergrund/pda_banner_hintergrund.jpg) top repeat-x; }

div#kopf_mitte_container { height: 70px; width: 194px; background: url(../bilder/hintergrund/pda_banner.jpg) top left no-repeat;  }
div#kopf_mitte_links     { display: none; } 
div#kopf_mitte_rechts    { display: none; }


/****** Koerper-Bereich *******************************************************/
div#koerper_container { }
div#koerper_container_inhalt { } 

div#koerper_links { display: none; }
div#koerper_rechts { display: none; }
 
 
/****** Mittlerer Inhaltsbereich **********************************************/ 			 
div#koerper_mitte { }      

div#koerper_mitte_kopf { display: none; }	

div#koerper_mitte_inhalt
 {
  width: 100%;
  float: left; /* um neue Float-Bereich-Instanz zu starten ... */
  font-size: 8pt;
  text-align: justify;
 }

div#inhalt_mitte { padding: 0px 3px 0px 3px; }          
 
div#koerper_mitte_fuss 
 { 

 }    

p#copyright
 {
  clear: both; 
  color: #cccccc;	  
  text-align: left;
  background: #eeeeee;
  border-top: 1px solid #cccccc;
  margin: 1px 0px 0px 0px;
  padding: 3px;  
  font-size: 8pt;
 } 
 
 
 
 
/******************************************************************************/ 
/***** Start: Defintion der Elemente im Kopfbereich ***************************/
/******************************************************************************/ 
div#kopf_unten /* unterer Kopfbereich (inkl. Hauptmenue) */
 {
  padding: 0px 0px 5px 0px;
  margin: 0px 0px 5px 0px;
 }
 
 
 

/******************************************************************************/ 
/***** Start: Defintion der Elemente im Hauptmenue ****************************/
/******************************************************************************/ 
ul#hauptmenue /* gilt fuer das Hauptmenue und alle Elemente darin */
 {
  margin: 3px;
  list-style: none; 
  position: relative;  
  z-index: 1;  
  font-size: 8pt;
 }

ul#hauptmenue li.hauptmenuepunkt_li
 {
  margin: 0px 0px 0px 0px; /* Abstand zwischen den Hauptmenuepunkten */
  display: block;  
 }  
 
ul#hauptmenue li a.hauptmenuepunkt_a
 {
  display: block;
  padding: 1px 1px 1px 1px;
  font-weight: bold;  
  margin: 1px 0px 1px 0px;
  width: 100px;  
  font-size: 0.9em;
 }  
 
ul#hauptmenue li a.hauptmenuepunkt_a_einzeln
 {
  display: block;
  padding: 2px 0px 2px 0px;
  font-weight: bold;
  width: 120px;  
  font-size: 0.9em;  
 }  
 
ul#hauptmenue li a.aktiver_hauptmenuepunkt_a 
 { 
  background: #009900;
  border: 1px solid #666666;
  color: #ffffff;
 }  
 
ul#hauptmenue span.hauptmenuepunkt_span { } 
 
ul#hauptmenue a         { color: #009933; text-decoration: none; } 
ul#hauptmenue a:link    { color: #009933; text-decoration: none; }
ul#hauptmenue a:visited { color: #009933; text-decoration: none; }
ul#hauptmenue a:focus   { color: #009933; text-decoration: underline; } 
ul#hauptmenue a:hover   { color: #009933; text-decoration: underline; }
ul#hauptmenue a:active  { color: #009933; text-decoration: underline; } 
 
li ul.hauptmenue_untermenue /* gilt fuer das Untermenue */
 {
  padding: 2px 2px 2px 2px;
  position: absolute;
  top: 0px;
  left: 109px;
  list-style: none;
  z-index: 60;
  border: 1px dotted #339933;
  font-size: 0.8em;
 }

  
/****** Ein- und Ausblenden des Untermenues ***********************************/  
li ul.hauptmenue_untermenue { display: none; } 
ul#hauptmenue li.aktiver_hauptmenuepunkt_li ul { display: block; }
/****** Ende: Ein- und Ausblenden des Untermenues *****************************/ 
  
  

/****** Formatierung der Unterpunkte ******************************************/
ul#hauptmenue li li.hauptmenue_unterpunkte_kopf { display: none; } 
ul#hauptmenue li li.hauptmenue_unterpunkte_fuss { display: none; }     

ul#hauptmenue li li a 
 {
  padding: 1px 0px 1px 0px;
  display: block;
 }






/******************************************************************************/ 
/***** Start: Defintion der Elemente im mittleren Inhaltsbereich **************/
/******************************************************************************/  
 
/****** Mittelteil fuer den mittleren Inhaltsbereich **************************/ 
div#koerper_mitte_inhalt a         { color: #009933; text-decoration: none; }     
div#koerper_mitte_inhalt a:link    { color: #009933; text-decoration: none; }
div#koerper_mitte_inhalt a:visited { color: #009933; text-decoration: none; }
div#koerper_mitte_inhalt a:focus   { color: #000000; text-decoration: underline; }
div#koerper_mitte_inhalt a:hover   { color: #000000; text-decoration: underline; }
div#koerper_mitte_inhalt a:active  { color: #000000; text-decoration: underline; }	


div#koerper_mitte_inhalt h1
 {
  font-size: 9pt; 
  padding: 5px 0px 5px 0px;	
  background: #efefef;
  border: 1px solid #e1e1e1
  
 }

div#koerper_mitte_inhalt h2 
 {
  font-size: 9pt; 
  padding: 10px 2px 5px 0px;	
 }

div#koerper_mitte_inhalt h3
 {
  font-size: 9pt; 	
  padding: 10px 0px 0px 0px;
 }

div#koerper_mitte_inhalt h4
 {
  font-size: 8pt; 
  padding: 10px 0px 10px 0px;
 }		 

div#koerper_mitte_inhalt h5
 {
  font-size: 8pt; 	
  padding: 5px 0px 10px 0px;
 }	

div#koerper_mitte_inhalt ul
 {
  padding: 10px 10px 10px 25px;	
 }

div#koerper_mitte_inhalt table
 {
  margin: 20px 10px 10px 0px;	
 }
 
div#koerper_mitte_inhalt td, th
 {	
  vertical-align: top;
  text-align: left;	
 }
 
div#koerper_mitte_inhalt p 
 { 
  padding: 5px 0px 5px 0px; 
 }        
 
div#koerper_mitte_inhalt img.themenbild 
 {
  width: 236px;
  height: 96px;
 } 

 
 
 
 
 
/***** Darstellung der Sitemap (Var. 1) ***************************************/ 
div#koerper_mitte_inhalt ul.sitemap_hauptmenue { list-style: none; } 
div#koerper_mitte_inhalt ul.sitemap_hauptmenue ul { font-weight: normal; } 
div#koerper_mitte_inhalt ul li.sitemap_ausgewaehlter_menuepunkt  { font-weight: bold; }  
/***** Ende: Darstellung der Sitemap (Var. 1) *********************************/ 





 
/***** Darstellung der Sitemap (Var. 2) ***************************************/  
div#koerper_mitte_inhalt ul#sitemap 
 {
  margin: 15px 0px 15px 30px;
  list-style: none;  
 }
 
div#koerper_mitte_inhalt ul#sitemap a.ebene_eins 
 {
  font-size: 1.2em;
  font-weight: bold;
  margin: 0px 0px 0px 0px;
  display: block;
  padding: 10px 0px 3px 0px;
 }
 
div#koerper_mitte_inhalt ul#sitemap a.ebene_zwei 
 {
  font-size: 1em;
  margin: 0px 0px 0px 15px;  
 }

div#koerper_mitte_inhalt ul#sitemap a.ebene_drei
 {
  font-size: 0.9em;
  margin: 0px 0px 0px 30px;
 }   
/***** Ende: Darstellung der Sitemap (Var. 2) *********************************/ 
 
 
 
 
 
 
/****** Themenbild-Anzeige ****************************************************/ 
div#themenbildcontainer 
 {
  margin: 15px 2px 20px 2px;
  padding: 5px;
  background: #ebf8eb;   
  border: 1px solid #cccccc;  
 }   

div#themenbildcontainer img { padding:0; margin: 0; }         
   
div#themenbild_links
 {
  float: left;
  width: 200px;
  height: 150px;
  margin-right: 10px;
 }

div#themenbild_rechts
 {
  float: left;
  width: 240px; /*290px */
  overflow: auto;
  height: 190px;
  margin: 0px 0px 0px 0px; 
 } 
/****** Ende: Themenbild-Anzeige **********************************************/  
 
 
 
 
 
 
/****** Start: Personen-Vorstellung *******************************************/ 
div#personenvorstellung 
 {
  margin: 15px 0px 20px 0px;    
 }   

div#personenvorstellung img { padding: 0; margin: 0; }         
   
div#personenvorstellung_links
 {
  float: left;
  width: 200px;
  margin: 0px 0px 15px 0px;
 }

div#personenvorstellung_rechts
 {
  float: left;
  width: 240px;
 } 
/***** Ende: Personenvorstellung **********************************************/ 





/***** Start: Doc-Check-Anmeldeformular ***************************************/
div#doccheck_anmeldung
 {
  width: 236px;
  margin: 15px auto;
 }

div#doccheck_anmeldung a         { color: #BF001F; text-decoration: underline; }     
div#doccheck_anmeldung a:link    { color: #BF001F; }
div#doccheck_anmeldung a:visited { color: #BF001F; } 
 
div#doccheck_anmeldung form
 {
  background: #cccccc;
  border: 1px solid #000000;
  color: #000000;
 } 
    
div#doccheck_anmeldung form fieldset { border: 0; }  
   
div#doccheck_anmeldung form legend { display: none; }
    
div#doccheck_anmeldung form h5
 {
  color: #ffffff;
  font-size: 1.2em;
  padding: 12px 10px 12px 10px;
  margin: 0;
  font-family: Verdana, sans-serif;
 } 

div#doccheck_anmeldung h5 a         { color: #ffffff; text-decoration: none; }     
div#doccheck_anmeldung h5 a:link    { color: #ffffff; }
div#doccheck_anmeldung h5 a:visited { color: #ffffff; }  
 
div#doccheck_anmeldung form p
 {
  font-size: 0.9em;
  margin: 8px 10px 8px 10px;   
 }  
 
div#doccheck_anmeldung form p.standard
 {
  font-size: 0.9em;
  margin: 8px 10px 8px 10px;
 } 
 
    
div#doccheck_anmeldung form div.doccheck_form_zeile    
 {
  margin: 4px 10px 4px 10px;
 } 
 
div#doccheck_anmeldung form div.doccheck_form_zeile label
 {
  width: 100px;
  display: block;
  float: left;
  font-weight: bold;
 }
 
div#doccheck_anmeldung form div.doccheck_form_zeile input
 {
  display: block;
  float: left;
  width: 140px;
  border: 1px solid #999999;
  padding: 2px;
  font-size: 0.9em;
 }
 
div#doccheck_anmeldung form div.doccheck_form_zeile input.form_button
 {
  width: 67px;
  border: 0;
 } 
/***** Ende: Doc-Check-Anmeldeformular ****************************************/








/***** Start: Allg. Kontaktformular *******************************************/
div#koerper_mitte_inhalt form.kontaktformular
 {
  margin: 15px 0px 35px 0px;
  border: 0;
 }

div#koerper_mitte_inhalt form.kontaktformular fieldset
 {
  border: 0px solid #eeeeee/* gruen: #14AA34  */; 
  padding: 5px; 
  margin: 15px 0px 5px 0px;
 }

div#koerper_mitte_inhalt form.kontaktformular fieldset legend
 {
  border: 0px solid #dddddd; 
  padding: 3px; 
  margin: 2px 2px 2px 0px; 
  font-weight: bold; 
  color: #333333; 
  /*background-color: #eeeeee;*/
 } 
 
div#koerper_mitte_inhalt form.kontaktformular label
 {
  float: left;
  width: 180px;
  padding: 2px 2px 2px 2px;
  margin: 2px 0px 2px 0px;
  font-weight: bold;  
 }

div#koerper_mitte_inhalt form.kontaktformular input:focus { background-color: #fffadd; } 
div#koerper_mitte_inhalt form.kontaktformular input
 {
  float: left;
  width: 174px;
  padding: 2px;
  margin: 2px 0px 2px 0px;  
  border: 1px solid #dddddd;  
 }
 
div#koerper_mitte_inhalt form.kontaktformular select:focus { background-color: #fffadd; } 
div#koerper_mitte_inhalt form.kontaktformular select 
 {
  float: left;
  width: 174px;
  padding: 2px;
  margin: 2px 0px 2px 0px;  
  border: 1px solid #dddddd;  
  font-size: 0.9em;
 }

div#koerper_mitte_inhalt form.kontaktformular textarea:focus { background-color: #fffadd; } 
div#koerper_mitte_inhalt form.kontaktformular textarea
 {
  float: left;
  width: 210px;
  padding: 2px;
  margin: 2px 0px 12px 0px;
  border: 1px solid #dddddd;
 } 
 
div#koerper_mitte_inhalt form.kontaktformular input.absende_button:hover { background-color: #fffadd; color: #000000; border: 1px solid #dddddd; }  
div#koerper_mitte_inhalt form.kontaktformular input.absende_button
 {
  float: left;
  width: 134px;
  padding: 2px;
  margin: 2px 2px 2px 2px;  
  border: 1px solid #000000;   
  background: #cccccc;  
  color: #333333;
  font-weight: bold;
  font-size: 1em;
 } 

div#koerper_mitte_inhalt form.kontaktformular input.zurueck_button:hover { background-color: #fffadd; color: #000000; }  
div#koerper_mitte_inhalt form.kontaktformular input.zurueck_button 
 {
  float: left;
  width: 134px;
  padding: 2px;
  margin: 2px 2px 2px 2px;  
  border: 1px solid #dddddd;   
  background: #eeeeee;
  color: #999999;  
  font-weight: normal;
  font-size: 0.9em;  
 } 
/***** Ende: Allg. Kontaktformular ********************************************/ 







 
/***** Start: Formular zur Arztsuche (2-spaltige Ausgabe) *********************/
div#koerper_mitte_inhalt form.arztsuche { border: 0; margin: 25px 0px 25px 0px; }
div#koerper_mitte_inhalt form.arztsuche fieldset { border: 1px solid #14AA34; padding: 5px; margin: 3px; }  
div#koerper_mitte_inhalt form.arztsuche legend { border: 1px solid #000000; padding: 3px; margin: 2px; font-weight: bold; color: #ffffff; background-color: #14AA34; } 
        
div#koerper_mitte_inhalt form.arztsuche label 
 {
  float: left;
  width: 180px;
  padding: 2px;
  margin: 2px 0px 2px 0px;
  font-weight: bold;
 }  

 
div#koerper_mitte_inhalt form.arztsuche input:focus { background-color: #fffadd; } 
div#koerper_mitte_inhalt form.arztsuche input 
 {
  float: left;
  width: 174px;
  padding: 2px;
  margin: 2px 0px 2px 0px;  
  border: 1px solid #dddddd;
 }   
        
div#koerper_mitte_inhalt form.arztsuche input.button100:hover { background-color: #fffadd; color: #000000; } 
div#koerper_mitte_inhalt form.arztsuche input.button100
 {
  border:1px solid #000000;
  background-color: #14AA34;
  color: #ffffff;
  font-weight: bold;
 }

div#koerper_mitte_inhalt form.arztsuche select:focus { background-color: #fffadd; }
div#koerper_mitte_inhalt form.arztsuche select.sonderlaenge { width: 310px !important; font-size: 10px; } /* fuer ueberlange Auswahlfelder */
div#koerper_mitte_inhalt form.arztsuche select
 {
  float: left;
  width: 110px;
  padding: 2px;
  margin: 2px 0px 2px 0px;  
  border: 1px solid #dddddd;  
  font-size: 0.8em;
 } 

div#koerper_mitte_inhalt form.arztsuche span.radioauswahl
 {
  float: left;
  display: block;
  width: 180px;
  padding: 0px 0px 5px 0px;  
  margin: 0px 0px 15px 0px;
 }

div#koerper_mitte_inhalt form.arztsuche span.radioauswahl input
 {
  float: left;
  width: 15px;
  border: 0;
  margin: 0;
  padding: 0;
 }  
 
div#koerper_mitte_inhalt form.arztsuche span.radioauswahl span.radio_beschreibung
 {
  float: none;
  display: block;
  width: 140px;
  margin: 0px 2px 0px 20px;
  padding: 0px 0px 0px 0px;
 }           
/***** Ende: Formular zur Arztsuche *******************************************/ 



div#koerper_mitte_fuss p { color: #999999; } 

div#koerper_mitte_fuss p#logo_grafik
 {
  float: left;
  width: 50px;
  margin: 10px 10px 10px 10px;
 }
 
div#koerper_mitte_fuss p#letzte_aenderung
 {
  float: right;
  font-size: 10px; 
  font-weight: bold;	
  padding: 30px 30px 5px 30px;
 }   
 
div#koerper_mitte_fuss p#editor
 {
  font-size: 0.9em; 
  padding: 0px 30px 2px 30px;
 }  
 
div#koerper_mitte_fuss p#editor a         { color: #bbbbbb; text-decoration: none; }     
div#koerper_mitte_fuss p#editor a:link    { color: #bbbbbb; }
div#koerper_mitte_fuss p#editor a:visited { color: #bbbbbb; }
div#koerper_mitte_fuss p#editor a:focus   { color: #000000; }
div#koerper_mitte_fuss p#editor a:hover   { color: #000000; }
div#koerper_mitte_fuss p#editor a:active  { color: #000000; }	
















/***** Alfabet-Leiste bei der Produktsuche ************************************/
div#koerper_mitte_inhalt table.produktsuche_alfabet_leiste 
 {
  width: 520px;
  /* background: #eeeeee; */
  border: 0px solid #dddddd;
  margin: 15px auto;
  padding: 0;
 }

div#koerper_mitte_inhalt table.produktsuche_alfabet_leiste td
 {
  padding: 2px;
  background: #ffffff;
  text-align: center;
  border: 0px solid #dddddd;
 } 
 
div#koerper_mitte_inhalt table.produktsuche_alfabet_leiste td.produktsuche_alfabet_leiste_alle 
 {
  border-left: 1px solid #dddddd;
 }




/***** Tabelle unter dem Themenbild bei der Produktsuche **********************/ 
div#koerper_mitte_inhalt table.produktsuche_tabelle
 {
  margin: 15px auto;
  width: 520px; 
  border-collapse: separate;  
  border-spacing: 0px;
 }
 
 
/* Allg. Definitionen (Achtung, werden in verschachtelte Tabellen vererbt!!) */ 
div#koerper_mitte_inhalt table.produktsuche_tabelle tr 
 {

 }
 
div#koerper_mitte_inhalt table.produktsuche_tabelle th 
 {
 
 }  
  
div#koerper_mitte_inhalt table.produktsuche_tabelle td
 {
 
 } 
 
/* Spezifische Definitionen */
div#koerper_mitte_inhalt table.produktsuche_tabelle tr.produktsuche_tabelle_ueberschrift th { padding: 4px; border-bottom: 2px solid #008745; /* background: #eeeeee; */ }   
div#koerper_mitte_inhalt table.produktsuche_tabelle tr.produktsuche_tabelle_buchstabe strong { display: block; font-size: 16px; padding: 14px 5px 2px 5px; }
div#koerper_mitte_inhalt table.produktsuche_tabelle tr.produktsuche_tabelle_medikament td { padding: 2px; border-bottom: 1px solid #008745; }
 


 
 
 
 
/***** Tabelle unter dem Themenbild bei der Produktsuche (Detailansicht *******/ 
div#koerper_mitte_inhalt table.produktsuche_tabelle_detailansicht
 {
  margin: 0px auto 10px auto; 
  width: 520px;  
  background: #eeeeee;
  border: 1px solid #dddddd;
 }
 
div#koerper_mitte_inhalt table.produktsuche_tabelle_detailansicht tr
 {

 }
  
div#koerper_mitte_inhalt table.produktsuche_tabelle_detailansicht th
 {
  padding: 4px;
  border-bottom: 1px solid #dddddd;
  width: 20%;
 }  
  
div#koerper_mitte_inhalt table.produktsuche_tabelle_detailansicht td
 {
  padding: 3px;
  border-bottom: 1px solid #dddddd;
  width: 20%;
  background: #ffffff;
  }
 



 
/***** Eingabeformular zur Produktsuche ***************************************/
div#koerper_mitte_inhalt form#formular_produktsuche
 {
  border: 1px solid #dddddd;
  background: #f2f2f2;
  padding: 10px;
  margin: 0 auto;
  width: 505px; /* ehemals 520 */
 } 
 
form#formular_produktsuche fieldset
 {
  border: 1px solid #dddddd;
  padding: 4px;
  margin: 10px 0px 10px 0px;
  }

form#formular_produktsuche legend
 {
  padding: 2px;
  border: 1px solid #dddddd;
  color: #008745;  
  font-size: 11px;
  font-style: normal;
  background: #fcfcfc;
 }

form#formular_produktsuche p.produktsuche_hinweis 
 { 
  font-size: 10pt; 
  font-weight: bold; 
  font-family: Verdana, sans-serif; 
  padding: 20px 80px 40px 0px;
  margin-right: 20px;
  
  background: url(../../bilder/hintergrund/michelin.jpg) top right no-repeat;
 } 
 
form#formular_produktsuche div.produktsuche_zeile 
 {
  margin: 4px auto 4px auto;
  width: 480px;
 } 
 
form#formular_produktsuche div.produktsuche_zeile label
 {
  float: left;
  width: 150px;
  color: #888888;
  font-weight: bold;
  text-align: right;
 } 
 
form#formular_produktsuche div.produktsuche_zeile select
 {
  float: left;
  border: 1px solid #dddddd;
  background: #ffffff;
  margin-left: 25px;
  color: #888888;
  width: 300px; /*220*/
  font-size: 11px;
 } 

form#formular_produktsuche button#button_abbrechen:hover { border: 1px solid #aaaaaa; background: #cccccc;  }  
form#formular_produktsuche button#button_abbrechen 
 {
  float: left;
  border: 1px solid #cccccc;
  background: #dddddd;
  padding: 4px 2px 2px 2px;
  margin: 4px;  
 }

form#formular_produktsuche button#button_senden:hover { border: 1px solid #aaaaaa; background: #cccccc; } 
form#formular_produktsuche button#button_senden 
 {
  float: right;
  border: 1px solid #cccccc;
  background: #dddddd;
  padding: 4px 2px 2px 2px;
  margin: 4px;
 } 

div#koerper_mitte_inhalt input#detailbutton:hover { border: 1px solid #bbbbbb; background: #dddddd; color: #000000; }  
div#koerper_mitte_inhalt input#detailbutton 
 {
  border: 1px solid #dddddd;
  background: #eeeeee;
  color: #666666;
  padding: 2px;
  margin: 4px;
 }