#outside{
	/* border-top:1px solid #000; */
  /* background:#666; */ /* ccff99; transparent; */
  /* background-image:url(../img/bgrd_21px_999.gif); background-repeat:repeat-x; */
  /* background-image:url(../img/bgrd_2px_ccc.gif); background-repeat:repeat; */ /* Auswahl */
  /* background-image:url(../img/bgrd_4px2_ccc.gif); background-repeat:repeat; */
  background-image:url(../img/bgrd_kreuz4x4px_ccc.gif); 
  background-repeat:repeat;
  height:21px;
  /* margin-bottom:-21px; */ /* damit Container unter Navigation rutscht */
  /* width: 448px; */
  }
  /* outside hatte ursprünglich keine "height" u. kein "margin". 
     Ist umgebender Container für die "ul" der horizontalen Navi.  */
/*============================================================================= 
  Die 1. Ebene der horizontalene Navigation 
  -----------------------------------------------------------------------------*/
  #navigation-1 {
	/*padding:1px 0; */  /* ergab anfangs einen 1px-Abstand zwischen obersten Menüpunkten und der Linie von Container "outside"*/
	margin:0 auto; /* sorgt für die horizontal mittige Ausrichtung der Navigation */
	/* margin:0px; */  /* für Navi linksbündig */
  list-style:none;
	/* width:100%; */  /* für Navi linksbündig */
	width:448px;  /* 448px */
	/* height:21px; */  /* 24px */
	/* border-top:1px solid #FFFFFF;
	border-bottom:1px solid #FFFFFF; */
	font:normal 8pt verdana, trebuchet, geneva, arial, helvetica, sans-serif;
	/* z-index:50; */ 
}
#navigation-1 li { /* die obersten Menüpunkte */
	display:block;	
  position:relative;	
	float:left;  
	width:112px; /*112*/ 
  margin:0;
	padding:0;
  background:transparent; /* macht das Listenelement in der Navigation durchsichtig */
  background-image:url(../img/navi_transp_75.png);
  z-index:50; /* optional */
  /* border:1px solid #ccff99; *//* Nur aktivieren für Test */
}
#navigation-1 li a:link,  #navigation-1 li a:visited {
	padding:4px 0;  /* erzeugt abstand oben + unten für die beschriftung */
	display:block; /* somit wird der Anker genau so breit wie sein umgebendes li-element */
	/* display:inline; */ /* Nur aktivieren für Test */
  text-align:center;
	text-decoration:none;
  /* background:#ccff99; */ /* Nur aktivieren für Test */
  color:#000; /* Schwarz */
	width:112px;
	height:13px; 
} /* height + padding (oben + unten) = Gesamthöhe des Elements = 13 + 4 + 4 = 21px*/

/*-------------------------------------------------------------------------------------------------*/
/* Hervorhebung des der Seite entsprechenden Listenelementes in der Navigation */

/* #spektrum #navigation-1 li.navli01,
#ekus #navigation-1 li.navli02,
#ausdoku #navigation-1 li.navli03,
#dverarb #navigation-1 li.navli04,
#einblick #navigation-1 li.navli05,
#workflow #navigation-1 li.navli06,
#me #navigation-1 li.navli07,
#kompetenz #navigation-1 li.navli08,
#and #navigation-1 li.navli09,
#kontakt #navigation-1 li.navli10,
#kunden #navigation-1 li.navli11
  { color:#ffffff; background-color:#cc0033; } */ /* cc0033 = Rot */
   
/*-------------------------------------------------------------------------------------------------*/   
/* Hervorhebung des der Seite entsprechenden Navigationselmentes (Anker) in der Navigation
   und - in diesem Fall - ebenfalls des umgebenden Listenelementes, da #navigation-1 li a:link 
   auf display:block gesetzt ist (s. weiter oben)
   Definiert werden id's (#navi..) für die Navigationselemente (a) der jeweiligen Seiten (Body-id's) */ 
#spektrum #navi01 a,   
#ekus #navi02 a,  
#ausdoku #navi03 a,  
#dverarb #navi04 a,  
#design #navi05 a,   
#workflow #navi06 a,  
#kompetenz #navi08 a,  
#einblick #navi09 a,     
#kontakt #navi10 a,
#kunden #navi11 a  
  { color:#fff; background-color:#cc0033; }   
  /* sorgt für rote Unterlegung des entsprechenden li-Elementes, oben in der Navigation */  
  /* fff = Weiss, cc0033 = Rot */ /* font-weight:300; */
/*-------------------------------------------------------------------------------------------------*/ 
  
/* Formatierung des Listen- u. des Navigationselementes für die 1. Ebene bei hover + active, 
   damit die li's und die Anker mit weißem Hintergrund u. roter Schrift dargestellt werden:*/
#navigation-1 li:hover a, #navigation-1 li a:hover, #navigation-1 li a:active {
	display:block;	
	width:112px;  /* definiert die Breite für alle li's unter der id navigation-1 bei hover + active*/
	height:13px;  
  padding:4px 0;
	text-align:center;
	text-decoration:none;
	background:#fff;  /* Weiss */
	color:#cc0033;   /* Rot */
	/* border-left:1px solid #fff;   ACHTUNG: Wenn diese borders aktiv sind, dann oben "width" um 2px veringern !!
	border-right:1px solid #fff; */
}
/*-------------------------------------------------------------------------------------------------*/ 
  /*display:block;*/ /* Durch die "display:block"-Anweisung werden die Hyperlinks zum Block-Element befördert, 
    wodurch der Hyperlinklink so breit wie das umgebende li u. der ges. Navigationspunkt anklickbar wird. 
    Ein "padding" läßt den hyperlink allerdings entsprechend einrücken */


/*===========================================================================================
  Sub-Navigation Links                                                                     
  ===========================================================================================*/

#navleft {
  position: relative;
  width: 50%;
  float: left;
  margin: 32px 0px 0px -224px;  /* links -224px; */ 
  padding: 0;
  height: 352px; /* 353px; */  
  /* ist 1px höher als Container "beleg", damit Inhalt in der Mitte, unterhalb "beleg", bündig mit "beleg" steht*//* 160px; */
  text-align: right;
  background: transparent;  /*background: #c8ffe1; #d0d0ff; transparent;  */
  z-index: 5;
}
   /* Gestaltung der Listenelemente in der Sub-Navigation - Beschränkung der Formatierung von Listenelementen,
	bezogen auf den Navigationsbereich: */
  #navleft ul { 
 	  width: 100%;        /* border-top: 2px dotted #6495ed;*/ 
    margin-top: 3px;
    background: transparent; /* background: #fff; */
  }
	#navleft li {
    list-style-type: none;
    margin: 0px 64px 24px 0px;  /* left 208px */ /* margin-right steuert den Abstand zum Mittelteil */    
    padding: 0;   /* padding-bottom: 16px; */
    font-size: 11px;
    /* letter-spacing: 1px; */ 
    /* line-height: 1.5em; */
    background: transparent;
    border: 0;
    /* transparent; #E7FF94; border-bottom:1px solid #000; */
    } 
    /* background-image:url(../images/bgrd4x4hg.gif); background-repeat:repeat;}*/

/*-------------------------- Standardansicht der Navigation Links-----------------------------*/
/* Nachfolgend die Formatierung der Hyperlinks nur im linken Navigationsbereich (formatiert die Anker in der Navi-Leiste) */
  #navleft a  { color:#666; font-weight:300; }  

/*------------------ Rollovereffekt für die Hyperlinks der Navigation Links-------------------*/
  #navleft a:hover, #navleft a:focus { display:block; color:#666; font-weight:bold; }
  #navleft a:active {color:#000; font-weight:bold;}
  /* #navleft a:visited {color: #FFFFFF;} */
  /* #navleft a {color:white; background-color:#999; padding:1px 5px; border-bottom:1px solid #999;} */
  
/*-------------------------------------------------------------------------------------------
  >>>>>>>>>> Formatierung der Listenelemente <<<<<<<<<<  */
  /* #spektrum #navleft li.navl-01,*/	
	#ekus #navleft li.navl-02,
	#ausdoku #navleft li.navl-03,
	#dverarb #navleft li.navl-04,
  #design #navleft li.navl-05,
	#workflow #navleft li.navl-06,
	#workflow #navleft li.navl-06b,	
	#kompetenz #navleft li.navl-08,
	#kompetenz #navleft li.navl-08b,
  #kunden #navleft li.navl-11,
  #kunden #navleft li.navl-11b,
	#einblick #navleft li.navl-09,
  #kontakt #navleft li.navl-10
    { background-image:none; background-color:transparent; }
	
/*-------------------------------------------------------------------------------------------
  >>>>>>>>>> Formatierung der Anker <<<<<<<<<< 
  Hervorhebung der aktuellen, gerade aktivierten Seite im entsprechenden Navigationselement - gilt nur für die 
  linke Navigationsleiste (ansonsten gelten die Festlegungen unter "Hyperlinks allgemein"). 
  Body-id + id für das Navigationselement: */ 
  #ekus #nav2s a, 
  #ausdoku #nav3s a,
  #dverarb #nav4s a,
	#workflow #nav6s a,
	#kompetenz #nav8s a,
	#kunden #nav11s a 
    { color:#c03; font-weight:bold; background-color:transparent; }
  
/*-------------------------------------------------------------------------------------------
  >>>>>>>>>> Button "Zurück zur Themen-Hauptseite" <<<<<<<<<< */
  a#up{
  display:inline-block;
  width:24px;
  height:24px;
  margin-right: 16px;
  background: transparent url(../img/up_24x24.gif) 0px 0px no-repeat;
  text-indent:-9000%;
  }
  a:hover#up{
  display:inline-block;
  background: transparent url(../img/up_24x24.gif) 0px -24px no-repeat;
  }
 
/*===========================================================================================
  Abweichendes Link-Format auf der Kontakt-Seite: 
  ===========================================================================================*/   
a.mto:link {color:#c03; text-decoration:none;}
a.mto:hover, a.mto:focus, a.mto:active {font-weight:bold; text-decoration:underline;}


/*===========================================================================================
  Hyperlinks allgemein
  ===========================================================================================*/	
a {text-decoration:none; outline:none; font-weight:300;}
  /* entfernt alle Unterstreichungen + evetl. umgebende gepunktete Linie */
  /* hexadezimale Farbangaben: */
a:link {color:#000;} /* schwarz */
a:visited {color:#999;} /* d90000 rot */
a:hover, a:focus {color:#cc0033;}
a:active {color:#cc0033;}

/* a:link {color:#c03;} */  /* Rot */
/* a:visited {color:#999;} */
/* a:hover, a:focus {text-decoration:underline;} */
/* a:active {font-weight:bold;} */
    
/* a:link - für einen normalen Link
  a:visited - für einen besuchten Link 
  a:focus - für einen Link, der den Fokus über die Tastatur erhält, z.B. beim Durchsteppen mit der Tabulatortaste. 
    a:focus wird jedoch vom Internet Explorer bis einschließlich Version 6 nicht unterstützt. 
  a:hover - während man mit der Maus über einen Link fährt, ohne dass dieser angeklickt wird 
  a:active - für einen gerade mit der Maus angeklickten Link  */