/* SWIM2.0 :: Simple website menu
****************************************************************
* DOM scripting by brothercake -- http://www.brothercake.com/
* Licensed under GPL -- http://www.gnu.org/copyleft/gpl.html
****************************************************************
* For professional menu solutions visit -- http://www.udm4.com/ 
****************************************************************
*/





/* tame the lists */
ul.horizontal, ul.horizontal li {
	margin:0;
	padding:0;
	list-style-type:none;
	font-size:100%; /* fix for win/ie's "non-linear text scaling" bug */
	}


/* navbar list */
ul.horizontal {
	cursor:default;
	
	z-index:2000;
	
	/* navbar top position 
	   this DOES NOT already include 1px compensation 
	   on TOP, for list-item border collapse 
	   (1px defaults to around 0.05em) */
	top:1.05em;
	}


/* navbar list-items */
ul.horizontal li {
	width: 	131px;
	float:	left;
	position: relative;
	cursor: pointer;
	cursor: hand;
	vertical-align: middle;
	text-align:left;
	
	/* navbar items' left position relative to the container
	   this DOES NOT already include 1px compensation 
	   on LEFT, for list-item border collapse 
	   (1px defaults to around 0.05em) */
	left: 0px;
	 
	/* shift list-items to collapse borders horizontally */
	margin:0 0 0 0px;
	}
	
/* we have to use a different positioning trick for ie, so: 
   - set the two values below to reflect the navbar items' left position,  
   - then reduce the margin-left value by 1px (approx 0.05em)  
     to re-apply the list-item border-collapse */
* html ul.horizontal li {
	position:relative;
	}

/* we also need to use the same trick for safari < 1.2, so 
   - apply the same values again 
   we're also increasing the border-collapse and compensation slightly
   to cover for a float-related rounding-error in mozilla and safari 
   this is using a substring-matching attribute selector 
   which is also visible to safari 1.2, konqueror, mozilla and osx/msn  
   but that's okay, because it still works 
   we can't do that for everybody, because it breaks in opera */
ul[class^="horizontal"] li {
	xleft:0.05em;
	}

ul.horizontal li.first {
	text-indent: 10px;
	
	
}
ul.horizontal li.first li {
	/text-indent: 0;
	
}

/* menu lists */
ul.horizontal ul {
	z-index:2020;
	padding:0;
	cursor:default;
	position:absolute;
	top:auto;
	
	/* menu width */
	width: 131px;
	
	/* menu offset, which already includes 1px compensation 
	   for list-item border collapse */
	margin:0 0 0 0;
	
	/* 
	position menus off the screen to hide 
	because using display, visibility, overflow or clip,  
	would hide them from browser-based screenreaders as well 
	using left this time because top doesn't work correctly in safari
	and using px because left:-Nem causes a horizontal scrollbar in some opera builds
	it also has the advantage that menus which might extend beyond the window
	won't create a horizontal scrollbar unless they're open
	*/
	left:-10000px;
	}
	
	
/* menu list-items */
ul.horizontal ul li {
	/* duplicate menu width */
	width: 131px;
	/* compensate for navbar positioning */
	left:auto;
	
	/* shift list-items to collapse borders vertically */
	margin:0 0 0 0;
	}

ul.horizontal ul li a 
{
	color: #fff;
	font-weight: normal;
}


/* you can use <ul> classes to specify different menu widths */
ul.horizontal ul.wider, ul.horizontal ul.wider li {
	width: 131px;
	}


/* further child-menu offset */
ul.horizontal ul ul {
	/* this DOES NOT already include 1px compensation 
	   on TOP and LEFT, for list-item border collapse 
	   (1px defaults to around 0.05em) */
	/* margin:-0.45em 0 0 7.65em; */
	/* overlapping the menus improves usability */
	}


/* menu triggers -- position menus back on the screen to show 
   hide these from safari < 1.2 because of it's "sticky hover" bug 
   and because the menu positioning doesn't work
   using the "@media with Media Type in Mixed Case" hack
   http://www.dithered.com/css_filters/css_only/media_mixed_case.html */
@media Screen, Projection { 
	ul.horizontal li:hover > ul { left: auto; }
	ul.horizontal ul li:hover > ul { top: 0; }
	}

ul.horizontal ul.selected 
{
	left: auto;
}


/* links */
ul.horizontal a, ul.horizontal a:visited {
	display:block;
	cursor:pointer;
	cursor:hand;
	line-height: 17px;
	margin-top: 0px;
	vertical-align: middle;
	font-size: 11px;
	font-weight: bold;
	color: #666;
	
	text-decoration:none;
	}


/* rollover pseudo-classes, and scriptable persistence class */
ul.horizontal a:hover, ul.horizontal a:focus, ul.horizontal a.rollover, ul.horizontal a.rollover:visited {
		color:#f60;
	}
	
ul.horizontal a.selected {
	color: #f60;
	}

*/
/* profil
ul.horizontal a#profil, ul.horizontal a#profil:visited {
	background: #c8c8c8 url(../img/nav_profil.gif) no-repeat;
	}

ul.horizontal a#profil:hover {
	border: 1px solid #6C251E;
	background: #8A3B2A url(../img/nav_profil_on.gif) no-repeat;
	}
	
ul#profilsub a, ul.profilsub a:visited {
	background: #E1CFCD;
	color: #AC5B48;
	border: 1px solid #E1CFCD;
	margin-top: 1px;
}	

ul#profilsub a:hover, ul.profilsub a:focus {
	background: #fff;
	color: #6C251E;
	border: 1px solid #6C251E;
}	


ul.horizontal a#profilselected {
	border: 1px solid #6C251E;
	background: #8A3B2A url(../img/nav_profil_on.gif) no-repeat;
	}

ul#profilsub a.selected {
	background: #fff;
	color: #6C251E;
	border: 1px solid #6C251E;
}

ul#profilsub a.selected1 {
	background: #fff;
	color: #6C251E;
	border: 1px solid #6C251E;
	border-top: none;
}
 */
	
/* kompetenzen
ul.horizontal a#kompetenzen, ul.horizontal a#kompetenzen:visited {
	background: transparent url(../img/nav_kompetenzen.gif) no-repeat; 
	}

ul.horizontal a#kompetenzen:hover {
	border: 1px solid #7F4825;
	background: transparent url(../img/nav_kompetenzen_on.gif) no-repeat; 
	}
	
ul#kompetenzensub a, ul.kompetenzensub a:visited {
	background: #F0D6A3;
	color: #B79D62;
	border: 1px solid #F0D6A3;
	margin-top: 1px;
}	

ul#kompetenzensub a:hover, ul.kompetenzensub a:focus {
	background: #fff;
	color: #7E4925;
	border: 1px solid #7E4925;
}	


ul.horizontal a#kompetenzenselected {
	border: 1px solid #7F4825;
	background: transparent url(../img/nav_kompetenzen_on.gif) no-repeat; 
}

ul#kompetenzensub a.selected {
	background: #fff;
	color: #7E4925;
	border: 1px solid #7E4925;
}

ul#kompetenzensub a.selected1 {
	background: #fff;
	color: #7E4925;
	border: 1px solid #7E4925;
	border-top: none;
}

 */
 
/* portfolio
ul.horizontal a#portfolio, ul.horizontal a#portfolio:visited {
	background: #c8c8c8 url(../img/nav_portfolio.gif) no-repeat; 
	}

ul.horizontal a#portfolio:hover {
	border: 1px solid #9D4F1A;
	background: transparent url(../img/nav_portfolio_on.gif) no-repeat; 
	}
	
ul#portfoliosub a, ul.portfoliosub a:visited {
	background: #EEE0D6;
	color: #E69661;
	border: 1px solid #EEE0D6;
	margin-top: 1px;
}	

ul#portfoliosub a:hover, ul.portfoliosub a:focus {
	background: #fff;
	color: #9D4F1A;
	border: 1px solid #9D4F1A;
}


ul.horizontal a#portfolioselected {
	border: 1px solid #9D4F1A;
	background: transparent url(../img/nav_portfolio_on.gif) no-repeat; 
	}
	
#portfoliosub a.selected {
	background: #fff;
	color: #9D4F1A;
	border: 1px solid #9D4F1A;
}	
	
#portfoliosub a.selected1 {
	background: #fff;
	color: #9D4F1A;
	border: 1px solid #9D4F1A;
	border-top: none;
}	
 */
 
/* fokus 
ul.horizontal a#fokus, ul.horizontal a#fokus:visited {
	background: #c8c8c8 url(../img/nav_fokus.gif) no-repeat;
	}

ul.horizontal a#fokus:hover {
	border: 1px solid #A96631;
	background: transparent url(../img/nav_fokus_on.gif) no-repeat; 
	}
	
ul#fokussub a, ul.fokussub a:visited {
	width: 213px;
	background: #FCE4B6;
	color: #E3AF1B;
	border: 1px solid #FCE4B6;
	margin-top: 1px;
}	

ul#fokussub a:hover, ul.fokussub a:focus {
	width: 213px;
	background: #fff;
	color: #A96631;
	border: 1px solid #A96631;
}	


ul.horizontal a#fokusselected {
	border: 1px solid #A96631;
	background: transparent url(../img/nav_fokus_on.gif) no-repeat; 
}
	
ul#fokussub a.selected {
	width: 213px;
	background: #fff;
	color: #A96631;
	border: 1px solid #A96631;
}		
	
ul#fokussub a.selected1 {
	background: #fff;
	color: #000F20;
	border: 1px solid #000F20;
	border-top: none;
}

*/

/* opera 5 and 6, and mac/ie5, need float on the links */
ul.horizontal a { float:left; }

/* but it would break other browsers, so we need to negate it
   using a rule that's hidden from them with the "@media with Media Type in Mixed Case" hack
   http://www.dithered.com/css_filters/css_only/media_mixed_case.html */
@media Screen, Projection { ul.horizontal a { float:none; } }

/* msn/osx can see through that, but needs the float as well, 
   so re-apply it using the "not my child" hack
   http://www.jasonkarldavis.com/articles/notmychild/ */
ul.horizontal a:not(:nth-child(n)) { float:left; }

/* compensate submenus, using !important to increase specificity for osx/msn */
ul.horizontal ul a { float:none !important; }

/* hacks for win/ie to cure 'excess hidden margins' and 'double margin float' bugs */
@media screen, projection {
	* html ul.horizontal li {
		/* for ie5.0 */
		display:inline; 
		/* for ie5.5+ */
		f\loat:left; 
		/* this cures 'events fall through the menu' bug in ie6 
		   you can can change the color, but don't remove it or use an image */ 
		xxbackground:#ffffff; 
		}
	}

/* use different comparative positioning for ie, 
   to avoid problems with virtual z-ordering */
* html ul.horizontal li { position:static; }
* html ul.horizontal a { position:relative; }

/* hide menus from konqueror < 3.2 */
ul[class^="horizontal"] ul { display:none; }
ul[class^="horizontal"] ul { displa\y:block; }
