/* ================================================================ 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/padding.html Copyright (c) 2005-2007 Stu Nicholls. All rights reserved. This stylesheet and the assocaited (x)html may be modified in any way to fit your requirements. =================================================================== */ /* style the outer div */ #navigation {background:url(../_images/navi/verlauf_ebene1.gif) left top repeat-x; width:100%; font-size:0.9em; z-index:333} /* remove link outline */ #navigation a:focus {outline: none} /* remove all the bullets, borders and padding from the default list styling */ #navigation ul, #navigation li {padding:0; margin:0; list-style-type:none; height:2.1em} /* style the sub-level lists */ #navigation ul ul { width:15em; border-top:0px solid transparent; border-left:1px solid #999; border-bottom:2px solid #666; border-right:2px solid #666; background-color:#EFEFEF; voice-family: "\"}\""; background:#C4C7C9 url(../_images/navi/verlauf_ebene2.gif) left top repeat-x} * html #navigation ul ul {margin-left:-1px} /* float the top list items to make it horizontal and a relative positon so that you can control the dropdown menu positon */ #navigation ul li {float:left; height:2.1em; line-height:2.1em; display:block} /* style the sub level list items */ #navigation ul ul li {display:block; width:12em; height:auto; line-height:1em} /* style the links for the top level */ #navigation a, #navigation a:visited { display:block; float:left; height:100%; font-size:1.1em; text-decoration:none; color:#545454; background-color:#CACACA; background:url(../_images/navi/verlauf_ebene1.gif) left top repeat-x; padding:0em 1em 0em 1em} /* hack IE5.x to get the correct the faulty box model */ * html #navigation a, * html #navigation a:visited {margin-bottom:-1px; white-space:nowrap; w\hite-space:inherit} /* top level active link */ #navigation a.active, #navigation a.active:visited { color:#CC1F2F; border-top:0px solid #C0C0C0; border-left:0px solid #999999; border-right:0px solid #999999; background:#FFFFFF; voice-family: "\"}\""; background:#FFFFFF url(../_images/navi/verlauf_ebene1_negiert.gif) left top repeat-x} /* style the sub level links */ #navigation ul ul a, #navigation ul ul a:visited {display:block;background:transparent; color:#000000; width:10.6em; height:100%; line-height:1.5em; padding:0.2em 0.95em 0.2em 1em; border:0px; font-weight:normal; margin:0px; border-top:1px dotted #FFFFFF; border-bottom:1px dotted #C0C0C0} * html #navigation ul ul a, * html #navigation ul ul a:visited {width:14em; w\idth:12em; white-space:inherit} /* subnav arrow */ #navigation ul ul a.subnav {background:url(../_images/navi/pfeil.gif) right center no-repeat} /* style the table so that it takes no part in the layout - required for IE to work */ #navigation table {border-collapse:collapse; padding:0; margin:-1px; width:0; height:0; font-size:1em; z-index:1} /* style the level hovers */ /* first */ * html #navigation a:hover, * html #navigation a.active:hover { color:#CC1F2F; position:relative; z-index:300; border-top:1px solid #999999; border-left:1px solid #999999; border-right:1px solid #999999; margin-right:-2px; background:#FFFFFF; voice-family: "\"}\""; background:#FFFFFF url(../_images/navi/verlauf_ebene1_negiert.gif) left top repeat-x} #navigation li:hover { position:relative} #navigation :hover > a, #navigation :hover > a.active { color:#CC1F2F; border-top:1px solid #999999; border-left:1px solid #999999; border-right:1px solid #999999; background:#FFFFFF url(../_images/navi/verlauf_ebene1_negiert.gif) left top repeat-x; margin-right:-2px; height:2em; +height:2.05em} /* second */ * html #navigation ul ul a:hover { color:#CC1F2F; background:#FFFFFF; position:relative; margin:0px; border-top:1px solid #FFFFFF; border-right:0px; border-bottom:1px solid #FFFFFF; border-left:0px; padding:0.2em 0.95em 0.2em 1em; z-index:110} #navigation ul ul li:hover { position:relative} #navigation ul ul :hover > a { color:#CC1F2F; background:#FFFFFF; margin:0px; border-top:1px solid #FFFFFF; border-right:0px; border-bottom:1px solid #FFFFFF; border-left:0px; padding:0.2em 0.95em 0.2em 1em; height:auto} /* third */ * html #navigation ul ul ul a:hover { background:#FFFFFF; position:relative; z-index:120} #navigation ul ul ul :hover > a { background:#FFFFFF} /* fourth */ #navigation ul ul ul ul a:hover { background:#FFFFFF; position:relative; z-index:130} /* hide the sub levels and give them a positon absolute so that they take up no room */ #navigation ul ul {position:absolute; height:0; top:2.0em; left:-999em; width:14em} /* position the third level flyout menu */ #navigation ul ul ul {left:12em; top:0; width:14em} /* make the second level visible when hover on first level list OR link */ #navigation ul :hover ul {left:auto; top:auto; margin-top:2.0em; height:auto} * html #navigation ul :hover ul {left:0; margin-top:0em} *+html #navigation ul :hover ul {left:0} /* IE 7 only */ /* keep the third level hidden when you hover on first level list OR link */ #navigation ul :hover ul ul {left:-999em; margin-top:0} * html #navigation ul :hover ul ul {top: 0} /* keep the fourth level hidden when you hover on second level list OR link */ #navigation ul :hover ul :hover ul ul {left:-999em} /* make the third level visible when you hover over second level list OR link */ #navigation ul :hover ul :hover ul {left:13em} /* make the fourth level visible when you hover over third level list OR link */ #navigation ul :hover ul :hover ul :hover ul {left:13em} /* iehover-fix -> iframe */ #navigation ul iframe {position: absolute; z-index: -1; left:-1px; top:0; filter: progid:DXImageTransform.Microsoft.Alpha(style=0,opacity=0)} /* IE 5.0 hide selectboxes */ select.hide {visibility: hidden}