/* CSS Styles for BiR 94%-High / Flyout-Menus, Author Tim Reeves, Stand 2009-05-20 */

/* ================================================================
This copyright notice must be untouched at all times.

The original version of this stylesheet and the associated (x)html
is available at http://www.cssplay.co.uk/menus/flyout_4level.html
Copyright (c) 2005-2007 Stu Nicholls. All rights reserved.
This stylesheet and the associated (x)html may be modified in any
way to fit your requirements.
=================================================================== */

/*

Changes by Tim Reeves, August 2007

1. Removed container "div.menu" as this was obscuring links in the content area
   So all the style specs got changed from ".menu ul" to "ul.menu".
   January 2009: But no link obscuration if the container is small + overflow:visible.
2. As a consequence, the outermost <ul> got positioned on the page.
3. The opacity-gif for MSIE got moved to a "IE only" place, because it caused
   Opera to show the padding area black.
4. Added an "li.fst" to allow the first element to have a border-top and the rest not.
   Had to add some more stuff to adjust positioning inheritance for it.
5. Added specific widths for each level, to make them adjustable to fit (max) link texts.
6. Re-sorted the whole area into commented groups of styles per tag-type

*/

/* AREA 0: ENCAPSULATE THE MENUS IN A POSITIONED BLOCK, PROVIDE TOOLTIP-DIV */

div.menu {	/* Only needed when the enclosing container is not positioned */
	position: relative;
	top: 0px;
	left: 0px;
	width: 182px;
	margin: 0px;
	height: auto;
	padding: 0px 0px 0px 0px;
	background-color: transparent;
	overflow: visible;
	z-index: 2;
}

div.menu img {
    display: block;
}

div#fotooltip {	/* For Flyout-Menu Tooltip */
	color: #444444;
	/* In this static-positioned layout, "absolute" is relative to the viewport */
	position: absolute;
	top: 0px;
	left: 0px;
	width: auto;
	height: auto;
	z-index: 999;
	padding: 1px 9px;
	white-space: nowrap;
	display: none;
	font-family: Arial, Tahoma, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif;
	line-height: 130%;
	font-size: 11px;
	background-color: white;
	background-image: url(../images/std/tip.png);
	background-repeat: repeat-x;
	border-top: 1px solid #666666;
	border-left: 1px solid #666666;
	border-right: 1px solid #8A8A8A;
	border-bottom: 1px solid #8A8A8A;
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
}

/* AREA 1: STYLE THE <UL> TAGS - the block elements containing a level of links */

/* Remove all the bullets, borders and padding from the default list styling */
ul.menu, ul.menu li ul, ul.menu li ul li ul {
margin: 0px;
padding: 0px;
border-style: none;
border-width: 0px;
list-style-type: none;
list-style-image: none;
z-index: 3;
}

/* Size and (absolute) position of top level (i.e. of the complete menu on the page) */
ul.menu {
/* This is personal, to position the menu container on the web page
position: absolute;
top: 8px;
left: 8px; */
position: relative;
width: 175px;
}

/* Hide the sub levels and give them a position absolute so that they take up no room */
ul.menu li ul, ul.menu li ul li ul {
position: absolute;
visibility: hidden;
/* Compensate position for padding */
top: -25px;
/* Set up the overlap (minus the overrun) */
left: 156px;
/* Set up the overrun area - none on the left, obscures part of parent link */
padding: 24px 24px 24px 0px;
/* The background of the flyout <ul> elements */
background-color: transparent;
/* MSIE also needs a transparent gif for the padding to work, BUT that
/* causes Opera to show a black padding area, so put it in an "IE Only" place */
/* Opacity is CSS3 or Proprietary - but in fact works in almost all modern browsers */
/* filter: alpha(opacity=95);	BREAKS MSIE 7 */
-moz-opacity: 0.95;			/* Mozilla legacy */
opacity: 0.95;				/* Mozilla, Opera, Safari (modern versions) */
}
ul.menu li ul li.fst ul {
top: -24px;
}

/* Individual adjustments to different level <ul>'s */

ul.menu li ul  {	/* 2nd level <ul> block */
/* This is personal */
width: 175px;		/* The most successful approach... "auto" does NOT work */
padding-right: 0px;
}

ul.menu li ul li ul {	/* 3rd level */
/* This is personal */
width: 175px;
padding-right: 24px;
}

/* For browsers that understand, this is all you need for the flyouts */
ul.menu li:hover > ul { visibility: visible; }

/* For IE5.5 and IE6 you need to style each level hover */
ul.menu li a:hover ul ul, ul.menu li a:hover ul a:hover ul ul { visibility: hidden; }
ul.menu li a:hover ul, ul.menu li a:hover ul a:hover ul { visibility: visible; }


/* AREA 2: STYLE THE <LI> TAGS - the block elements each containing one link */

/* NOTE: Modern browsers hover on this <li> element (IE5+6 on the <a>) */

/* Style the list items */
ul.menu li, ul.menu li ul li, ul.menu li ul li ul li {
/* position: relative; Stu Nicholls has this but it breaks tooltip-position in IE6 */
margin: 0px;
padding: 0px;
height: 23px;
font-size: 13px;	/* If you let them inherit 1.3em IE6 breaks, although no text */
	font-family: Comic Sans MS;
}

/* Individual adjustments to different level <li>'s */
ul.menu li ul li {
/* width: 113px; */
}
ul.menu li ul li ul li {
}

/* The first list item is one pixel higher for the top border */
ul.menu li.fst,
ul.menu li ul li.fst,
ul.menu li ul li ul li.fst { height: 24px; }

/* SPIELPLATZ */
ul.menu li {
/* float: left;	/* for IE7, removes mysterious bottom margin, but not feasible here */
}
ul.menu li ul {
}
ul.menu li ul li {
}
ul.menu li ul li ul {
}
/* ENDE SPIELPLATZ */


/* AREA 3: STYLE THE <A> TAGS - the link elements themselves */

/* Basic style of all the links (inherited down the line) */
ul.menu li a, ul.menu li a:link, ul.menu li a:visited, ul.menu li a:active,
ul.menu li a:focus, ul.menu li a:hover {
display: block;
height: 22px;
line-height: 22px;	/* Centers the text in the link box */
width: 173px;		/* 2px border will be added */
margin: 0px;
padding: 0px;
font-size: 13px;
letter-spacing: 0px;
font-weight: bold;
text-indent: 10px;
border-style: solid;	/* border-width is set individually further down */
text-decoration: none;
	font-family: Comic Sans MS;
	letter-spacing: 1px;
}

/* In this implementation, 2nd level links are just as broad */
ul.menu li ul li a,         ul.menu li ul li a:link,
ul.menu li ul li a:visited, ul.menu li ul li a:active,
ul.menu li ul li a:focus,   ul.menu li ul li a:hover {
width: 173px;			/* 2px border will be added */
}

/* In this implementation, 3rd level links are just as broad */
ul.menu li ul li ul li a,         ul.menu li ul li ul li a:link,
ul.menu li ul li ul li a:visited, ul.menu li ul li ul li a:active,
ul.menu li ul li ul li a:focus,   ul.menu li ul li ul li a:hover {
width: 173px;			/* 2px border will be added */
}

/* Hack for IE5.5 regarding quirks mode container width */
* html ul.menu li a, * html ul.menu li a:visited { width: 175px; w\idth: 173px; }

/* The arrow to a deeper level, if there is one. Prevent inheritance! */
ul.menu li a, ul.menu li.sub ul li a, ul.menu li.sub ul li.sub ul li a {
background-image: none;
}
ul.menu li.sub a,
ul.menu li.sub ul li.sub a {
background-repeat: no-repeat;
background-position: right center;
}

/* IE6: has a table contained in the link, set its attributes */
/* Style the table so that it takes no part in the layout - required for IE to work */
ul.menu li table {
	position: absolute;
	top: 0px;
	left: -1px;
	border-collapse: collapse;
}

/* Style the link hover */
* html ul.menu li a:hover { position: relative; }	/* for IE5+6, only can hover on link */
ul.menu li:hover { position: relative; }			/* modern browsers hover on <li> */

/* Finally, style the link borders, avoiding inappropriate inheritance */
ul.menu li a, ul.menu li a:visited {
border-width: 0px 1px 1px 1px;
}
ul.menu li.fst a, ul.menu li.fst a:visited {
border-width: 1px 1px 1px 1px;
}

ul.menu li.sub ul li a,     ul.menu li.sub ul li a:visited {
border-width: 0px 1px 1px 1px;
}
ul.menu li.sub ul li.fst a, ul.menu li.sub ul li.fst a:visited {
border-width: 1px 1px 1px 1px;
}

ul.menu li.sub ul li.sub ul li a,     ul.menu li.sub ul li.sub ul li a:visited {
border-width: 0px 1px 1px 1px;
}
ul.menu li.sub ul li.sub ul li.fst a, ul.menu li.sub ul li.sub ul li.fst a:visited {
border-width: 1px 1px 1px 1px;
}

/* Flyout-Menu Colours */
ul.menu li a, ul.menu li a:visited {
	border-color: #EBAC9F;
}

ul.menu li.sub a {
	background-image: url(../images/std/menupfeil.gif);
}
ul.menu li.sub ul li.sub a {
	background-image: url(../images/std/menupfeil.gif);
}

a.avblefo, a.avblefo:link, a.avblefo:visited, a.avblefo:active, a.avblefo:focus {
	color: #A9341D;
	background-color: #FFEFEF;		/* 255 231 231 */
}
a.avblefo:hover {
	color: #A9341D;
	background-color: #FFFFFF;
}
a.iscurfo, a.iscurfo:link, a.iscurfo:visited, a.iscurfo:active, a.iscurfo:focus,
a.iscurfo:hover {
	color: #A9341D;
	background-color: #FFFFFF;
}