/*  =========================================================
Zentrales Stylesheet - wird im HEAD der Webseiten aufgerufen 
Datei: ESD_styles.css
Datum: 10.2009
Autor: SN 
========================================================== */
/* ======================================================= */
/*  Basisformatierungen   */
/* ======================================================= */

* { padding: 0; margin: 0; }  /* Gilt für das gesamte Dokument */

blockquote { margin: 1em 2em; } 

ul, ol, dl { margin-left: 1em; }

li { margin-left: 1em; } 

dd { margin-left: 2em; }

ul ul, ul ol, ul dl,
ol ul, ol ol, ol dl,
dl ul, dl ol, dl dl {
   margin-top: 0;
   margin-bottom: 0;
}

ul { list-style-type: square; }
ol { list-style-type: decimal; }

ul ul { list-style-type: disc; }
ol ol { list-style-type: lower-alpha; }

ul ol { list-style-type: decimal; }
ol ul { list-style-type: square; }

ol ol ol, ol ol ul, ol ul ul, ol ul ol,
ul ul ul, ul ul ol, ul ol ol, ul ol ul {
   list-style-type: circle;
} 

option { padding-left: 0.2em; padding-right: 0.3em; }

fieldset, a img { border: none; }

html { height: 101%; } /* Bildlaufleiste im Firefox immer zeigen */

body {
   background-color: #fffffa;
   color: #000081; 
   font-family: Arial, Helvetica, sans-serif;
   font-size: small; 
}

h1, h2, h3, h4, h5, h6 {
   font-family: Arial, Helvetica, sans-serif;
   font-weight: bold; 
}

h1 { font-size: 125%; }     /* Wichtige Punkte, aber nicht zu groß (suchmaschinen) */ 
h2 { font-size: 184.62%; }  /* ca. 24px */ 
h3 { font-size: 153.85%; }  /* ca. 20px */ 
h4 { font-size: 138.46%; }  /* ca. 18px */ 
h5 { font-size: 123.08% }   /* ca. 16px */ 
h6 { font-size: 107.69%; }  /* ca. 14px */

/* =============================================== 
   Ende der allgemeingültigen Basisformatierungen
================================================ */

/*================================================================*/
/* allgemeine Bildschirmformatierung                              */ 
/*================================================================*/

address {
   text-align: center;  
   font-size: 80%;      
   font-style: normal;  
   letter-spacing: 2px; 
}


a 
{ 	text-decoration: none;
	outline: none;
} 

.tabmich:focus, .tabmich:active {
   position: absolute;
   top: 9999px;   /* Werte für top/left ggfs. dem Layout anpassen */ 
   left: 9999px; 
   display: inline; 
   width: 12em;   /* Werte für width/height dem Text anpassen */ 
   height: auto; 

   background-color: white; 
   color: black; 
   padding: 5px; 
   border: 1px solid black;
}

.para02 {
	margin-left: 30%;
	color: #FFFFf0;
	font-size: 110%;
	line-height: 1.0;  
}
.para02 {
	margin-left: 30%;
	color: #FFFFf0;
	font-size: 110%;
	line-height: 1.0;  
}

.para03 {
	margin-left: 30%;
	font-size: 105%;
	line-height: 1.1;
	color: #FFFFf0;
}

.para04 {
	margin-left: 5%;
	font-size: 105%;
	line-height: 1.1;
	color: #FFFFf0;
}

.para09 {
	font-size: 95%;
	color: #FFFF00;
}

.para09 a { 
	color: #0099FF;
}

.para09 a:active, .para09 a:hover {
	color: #f6CCCC;
	text-decoration: none;
}

.rechts {
	padding: 1em;
	padding-left: 20em;
	padding-right: 2em;  
	color: #2a3c69;
/*	font-size: 110%;  */
	line-height: 1.5em;
}	

.rechts_2 {
	padding: 1em;
	padding-left: 30em;
	padding-right: 3em;
	color: #000081;
	font-size: 110%;
	line-height: 1.5em;
}
	
.rechts_3 {
	padding: 1em;
	padding-left: 15em;
	padding-right: 3em;
	color: #ffff81;
	font-size: 98%;
	line-height: 1.3em;
	margin: 5px;
}

.rechts_4 {
	padding: 2px;
	color: #ffffff;
	font-size: 120%;
	line-height: 3.5em;
	margin: 20px;
	margin-left: 40%;
}		

.rechts_5 {
	padding-left: 60%;
}


.links { 
	float:left;
	margin-top: 5px;
	margin-right: 3em;
} 

.polster
{
	padding: 10px;  	
}

.clearing 
{
	clear:both;
}

.bildrand
{
	border: 4%;
	padding-left: 3%; 
}

.bildrand_2
{
	border: #fef79f solid 3px;
}


.mehr_dazu
{  
	height: 3%;
}

.impressum 
{
	background-image: url(bilder/impressum.png);   
	background-repeat: repeat;  
   	padding: 5%;
	margin: 4%;
	color: #000066;
	font-size: large; 
}



/* ==================================== 
   2. Styles für die  Layoutbereiche 
   ==================================== */
#wrapper
{	
	background-color: #2a3c69; 
	color: #FFFFFF; 
	width: 98%;
	height: 98%;
	margin-left: 0.5%;
	margin-top: 0.5%;
	margin-right: auto;
	margin-bottom: 1%; 
	border: 1px solid #2a3c69;
   	position: relative;
}

#kopfbereich 
{
	height: auto;
	width: auto;
	background-image: url(bilder/esd_direct_gmbh_3.jpg);
	background-position: left;  
	background-repeat: no-repeat;  
   	background-color: #ffffff;
	padding-bottom: 2%;
	padding-top: 2%;
}

.einschub 
{    
	overflow: hidden;
	position: static; 
	width: 98%;
	margin-right: 0;
	margin-top: 0;   
	padding: 1%;
	background-color: #ffffff; 
	color: #2a3c69;
}	

.textbereich_links
{   
	float: left; 
	position: static; 
	width: 44%; 
	margin: 1%;
	padding: 1%;
    background-color: #f0f0f0;  
	color: #2a3c69;
	font-size: 110%;
}

.textbereich_rechts
{   
	float: right;
	position: static;
	width: 44%;
	margin: 1%;
	padding: 1%;
	border-left: 60%;
	background-color: #f0f0f0;  
	color: #2a3c69;
	font-size: 110%;
}

.textbereich_mitte
{	
/*	float: left;   Nicht floaten */  
/*	position:relative;  */
	width: 96%;
	margin-right: 0;
	margin-bottom: 0;
	padding: 2%;
	background-color: #f1f1f1;  
	color:#2a3c69;
	font-size: 105%;
}


#fussbereich {
	
   	padding: 10px 0 0 0;
   	border-top: 1px solid #ffff00;
	background-color: #2a3c69;
	color: #FFFFFF;
}
   #fussbereich ul {
      text-align: center;
      font-size: 90%;
      font-style: normal;
      letter-spacing: 1px;
      padding: 10px;
      margin: 0;
   }
   #fussbereich ul li {
      list-style-type: none;
      padding: 0;
      margin: 0;
   }

#fussbereich a {
	color: #FFFFFF;
	text-decoration: underline;
}
/* Kontaktformular */
form {
   	color: 000081;
	background-color: #2a3c69;
   	width: 40%;
	height: 40%; 
   	padding: 20px; 
   	border: 1px solid #ffff00;
	
}

label { 
   display: block; 
   cursor: pointer;
   color: #FFFFFF;
    
} 
input#absender, 
textarea { 
   width: 300px;
   border: 1px solid #ffff00;
   margin-bottom: 1em;
   color: #2a3c69;
   background-color: #d9d9d9; 
}
 

textarea { 
   height: 12em;
}
input#absender:focus, 
textarea:focus {
   background-color: #d9d9d9;
   color: #2a3c69;
}

/* ======================================= 
/* Ende der allgemeine Bildschirmformatierung 
   ======================================= */

/* ======================================= 
/* Speziell für Referenzseite 
   ======================================= */
   
.box01 {
	float: left;
	position: relative;
	padding: 2%;
	width: 25%;
} 

.box02 {
	text-align: center;
	position: relative;
	padding: 2%;
	padding-left: 20%;
	width: 25%;
}   

/*==================================================================*/
/* Formatierung der Navigation */
/*==================================================================*/
#navigation
{
   overflow: hidden;
   color: black;
   padding: 5px 10px 0 10px;
   background: #ffffff url(bilder/Gelb_linie.jpg) repeat-x right bottom; 
   margin: 0;
   margin-bottom: 2.50em;  /* darf nicht geändert werden wegen Höhe der zweiten Navi-Zeile */
      
}

/* Sternchen-Hack, hasLayout für IE5x. und 6 */ 
* html #navigation { height: 1%; } 

#navigation ul
{ 
	float: right;  
    width: auto; 
    margin-bottom: 0;
	background: #2a3c69;
	color: #FFFFFF;
	margin-right: 1%;	
}
	
#navigation li
{
   float: left; 
   width: auto; 
   list-style: none;
   margin: 0;
 
/*   background: transparent url(bilder/links_a.gif) no-repeat left top;  */
}

#navigation a
{
   	display: block; 
  	color: #999999;  
  	font-weight: normal;
   	padding: 4px 8px;
	border: 0;
	border-bottom: 1px solid #ffff00;
	margin-right: 1%;	
/*	background: transparent  url(bilder/rechts_a.gif) no-repeat right top; */
}  

#navigation strong
{
   	display: block; 
  	color: #ffffff;
  	font-weight: normal;
   	padding: 4px 8px;
	border-bottom: 1px solid #2a3c69;
	background-color: #006699;
/*	background: transparent  url(bilder/links_strong.gif) no-repeat left top; */
     
}

#navigation a:hover
{
   	display: block; 
/*   	background-color: #2a3c69; 	*/
  	color: #ffffff;
  	font-weight: normal;
   	padding: 4px 8px;
	border-bottom: 1px solid #ffff00;
/*	background: transparent  url(bilder/links_strong.gif) no-repeat left top; */
    
}

/*********************************************************
/* Zweite Ebene positionieren 
*********************************************************/

#startseite #navi01 ul,
#shopsysteme #navi01 ul,
#datenverarbeitung #navi01 ul,
#lager_konf #navi01 ul,
#versandabwicklung #navi01 ul
{
	position: absolute;
	right: 3em;
	top: auto;
	display: block;
	width: auto;
	height: auto;
	padding: 0.5em 0 0 0;
	margin: 1%;
}

#startseite #navi01 ul li,
#shopsysteme #navi01 ul li,
#datenverarbeitung #navi01 ul li,
#lager_konf #navi01 ul li,
#versandabwicklung #navi01 ul li
{
/*	background:   url(bilder/ebene2_a_links.gif) no-repeat left top;  */
    background:   #FFFFCC;
	
}

#startseite #navi01 ul li a,
#shopsysteme #navi01 ul li a,
#datenverarbeitung #navi01 ul li a,
#lager_konf #navi01 ul li a,
#versandabwicklung #navi01 ul li a
{
/*	background:   url(bilder/ebene2_arechts.gif) no-repeat right top;  */
    background:   #FFFFCC;
	
}
	

/************************************************************
/* Zweite Ebene gestalten 
/************************************************************/ 
#navigation #navi01 ul a:hover
{
   	color: #000081;
  	font-weight: normal;
   	padding: 4px 8px;
	border-bottom: 1px solid #ffff00;
} 

#navigation #navi01 ul li a:hover
{
/*	background: url(bilder/ebene2_hover_zentral.gif) no-repeat left top; */
    background:   #FFFFCC;
	
} 

#navigation #navi01 ul li strong
{
   	display: block; 
  	color: #000081;
  	font-weight: normal;
	padding: 4px 8px;

	border-bottom: 5px solid #ffffff;
/*	background: url(bilder/links_ebene2_aktiv.gif) no-repeat left top;  */
	background:   #FFFFCC;
	
	
}

/* ======================================
   E N D E navigation
====================================== */

/*====================================================================*/
/* Formatierung für den Drucker */
/*====================================================================*/
/* @import url(druckversion.css); */