
	/* erste Ebene navigation*/
#bildchen1 
	{
	background: url("../grf/festival.gif") 0 0 no-repeat;
	}

#bildchen2 
	{
	background: url("../grf/akademie.gif") 0 0 no-repeat;
	}	
	
#bildchen3
	{
	background: url("../grf/partner.gif") 0 0 no-repeat;
	}

#bildchen4 
	{
	background: url("../grf/service.gif") 0 0 no-repeat;
	}

#bildchen5 
	{
	background: url("../grf/programm.gif") 0 0 no-repeat;
	}

#bildchen6 
	{
	background: url("../grf/kontakt.gif") 0 0 no-repeat;
	}
	
	/* zweite Ebene */

#bildchen11
	{
	background: url("../grf/konzept.gif") 0 0 no-repeat;
	}

#bildchen12 
	{
	background: url("../grf/jahrgang.gif") 0 0 no-repeat;
	}


#bildchen31 
	{
	background: url("../grf/hamburgerbahnhof.gif") 0 0 no-repeat;
	}

#bildchen32 
	{
	background: url("../grf/edn.gif") 0 0 no-repeat;
	}

#bildchen33
	{
	background: url("../grf/imz.gif") 0 0 no-repeat;
	}

#bildchen34
	{
	background: url("../grf/kooperationspartner.gif") 0 0 no-repeat;
	}

#bildchen35
	{
	background: url("../grf/sponsoren.gif") 0 0 no-repeat;
	}

#bildchen41
	{
	background: url("../grf/tickets.gif") 0 0 no-repeat;
	}

#bildchen42
	{
	background: url("../grf/professionals.gif") 0 0 no-repeat;
	}
	
#bildchen43
	{
	background: url("../grf/presse.gif") 0 0 no-repeat;
	}
	
#bildchen51
	{
	background: url("../grf/zeitplan.gif") 0 0 no-repeat;
	}
	
#bildchen52
	{
	background: url("../grf/filme.gif") 0 0 no-repeat;
	}

#bildchen53
	{
	background: url("../grf/forum.gif") 0 0 no-repeat;
	}

#bildchen61
	{
	background: url("../grf/festivalteam.gif") 0 0 no-repeat;
	}

#bildchen62
	{
	background: url("../grf/kontaktadressen.gif") 0 0 no-repeat;
	}

#bildchen63
	{
	background: url("../grf/wegbeschreibung.gif") 0 0 no-repeat;
	}


	/* dritte Ebene */

#bildchen421
	{
	background: url("../grf/filmanmeldung.gif") 0 0 no-repeat;
	}
	
#bildchen422
	{
	background: url("../grf/akkreditierung.gif") 0 0 no-repeat;
	}
	
#bildchen431
	{
	background: url("../grf/news.gif") 0 0 no-repeat;
	}
	
#bildchen432
	{
	background: url("../grf/bilder.gif") 0 0 no-repeat;
	}

#bildchen433
	{
	background: url("../grf/text.gif") 0 0 no-repeat;
	}

#bildchen434
	{
	background: url("../grf/archiv.gif") 0 0 no-repeat;
	}
	
	
	
	/* menubar*/
	
ul.vertical, ul.vertical li {
	margin: 0;
	padding: 0;
	list-style-type: none;
	}


ul.vertical {
	position:absolute;
	z-index:1000;
	cursor:default;
	
	width:135px;
	height: 28px;	

	/* navbar left and top position 
	   this DOES NOT already include 1px compensation 
	   on TOP, for list-item border collapse 
	   (1px defaults to around 0.05em) */
	left:28px;
	top:33px;
	}


ul.vertical li {
	position:relative;
	text-align:left;
	cursor:pointer;
	cursor:hand;

	/* duplicate navbar width */
	width:135px;
	height: 28px;	
	/* shift list-items to collapse borders vertically */
	margin:-1px 0 0 0;
	padding: 0;
	}


ul.vertical ul {
	z-index:1020;
	cursor:default;
	position:absolute;
	
	width:197px;
	height: 19px;
	/* menu offset, which already includes 1px compensation 
	   on TOP, for list-item border collapse */
	margin: 2px 0 0 134px;
	/* overlapping the menus improves usability */
	
	/* 
	position menus off the screen to hide 
	because using display, visibility, overflow or clip,  
	would hide them from browser-based screenreaders as well 
	*/
	top:-100em;
	
	/* shift menus to collapse navbar->menu borders */
	left:-1px;
	
	/* compensate for list-item border collapse */
	padding:0 0 0 0;
	}
	
/* menu list-items */
ul.vertical ul li {
	/* duplicate menu width */
	width:197px;
	height: 19px;
	}


/* further child-menu offset */
ul.vertical ul ul {
	/* this already includes 1px compensation 
	   for list-item border collapse */
	margin: 0 0 0 127px;
	/* overlapping the menus improves usability */
	width: 145px;
	height: 19px;
	}

ul.vertical ul ul li {
	width: 145px;
	height: 19px;
	}

@media Screen, Projection { 
	ul.vertical li:hover > ul { top: 0; }
	}


/* links */
ul.vertical a, ul.vertical a:visited {
	display:block;
	cursor:pointer;
	cursor:hand;
	
	visibility: hidden;
	background: transparent;
	border:0;
	padding:0;
	}
	
/* rollover pseudo-classes, and scriptable persistence class */
ul.vertical a:hover, ul.vertical a:focus, ul.vertical a.rollover, ul.vertical a.rollover:visited {
	visibility: visible;
	}



/* hacks for win/ie to cure 'excess hidden margins' bug */
@media screen, projection {
	* html ul.vertical li {
		/* for ie5.0 */
		display:inline; 
		/* for ie5.5+ */
		f\loat:left; 
		/* this cures 'events fall through the menu' bug in ie6 */
		background:#ffffff; 
		}
	}
	
/* use different comparative positioning for ie, 
   to avoid problems with virtual z-ordering */
* html ul.vertical li { position:static; }
* html ul.vertical a { position:relative; }

/* hide menus from konqueror < 3.2 */
ul[class^="vertical"] ul { display:none; }
ul[class^="vertical"] ul { displa\y:block; }
