/**** TJK_keyBoardDropDown Pure CSS Drop Down Menu [TJK_keyBoardDropDown] v1.2 Copyright 2006, Thierry Koblentz - TJKDesign.com - All rights reserved. Read www.TJKDesign.com/articles/Pure_CSS_dropdown_Menus.asp ****/ /* zeroing padding/margin for all elements */ #TJK_dropDownMenu, #TJK_dropDownMenu * { margin:0; padding:0; font:normal 11px Verdana, Arial, Helvetica, sans-serif; } /* "Master" UL (the whole Menu) */ #TJK_dropDownMenu { /*position:relative;*/ float:left; width:130px; font-size:12px; /*height:20px;*/ margin:0 10px 0 0; background: url(../../images/search-fires-bg.jpg) no-repeat right top; } /* sub-menu ULs */ #TJK_dropDownMenu li ul { width:150px; /*width:11em !important; leaves room for padding */ list-style-type:none; cursor:pointer; position:absolute; display:none; top:20px; left:0px; z-index:999999999; padding:0px; border:1px solid #bcbdc0; } /* All LIs */ #TJK_dropDownMenu li { position:relative; width:130px; cursor:pointer; float:left; list-style-type:none; } /* sub-menu LIs */ #TJK_dropDownMenu li ul li { /*width:10em/*FF;*/ padding:0; border:none; /*max-width:120%; border:1px solid #333;*/ width:150px; /*background:#fff url(../images/smallline.jpg) no-repeat 5px 10px;*/ } /* All anchors */ #TJK_dropDownMenu li a { /*background: url(../../images/search-fires-bg.jpg) no-repeat right top;*/ cursor:pointer; color:#666; /*border-left:1px solid #333;*/ text-decoration:none; display:block; float:left; padding:0 .4em; height:20px; /* uncomment the declaration below if you want to go "full width" */ /* width:7.47em; height:2em;*/ line-height:1.9em; } /* sub-menu Anchors */ #TJK_dropDownMenu li ul li a { width:13.2em/*FF*/; position:relative !important; /* ie Mac */ cursor:pointer !important; white-space:nowrap; line-height:1.7em; /*height:24px;*/ font-weight:normal; padding:2px 0px 2px 18px; font-size:10px; /*border:1px solid #fff;*/ color:#666; background:#fff url(../../images/smallline.jpg) no-repeat 5px 10px; /*background-position:0 50% !important;*/ } /* :hover and stuff */ #TJK_dropDownMenu li a:hover, #TJK_dropDownMenu li a:focus, #TJK_dropDownMenu li a:active {color:#000} /* move the declarations from the rule below the one above if you want a background swap on *all* anchors, including the top level ones */ #TJK_dropDownMenu ul a:hover, #TJK_dropDownMenu ul a:focus, #TJK_dropDownMenu ul a:active {color:#000000 !important;background:#eeeeee; width:13.2em;} /* display and z-index for the sub-menus */ #TJK_dropDownMenu li:hover ul, #TJK_dropDownMenu li.msieFix ul {display:block;z-index:10; !important;} /* safari: users can keep sub-menus up by from sub-menus to next top level */ /* didn't find a solution for users going back from the last one. I prefer */ /* to leave it like that vs. taking the last sub-menu *out of* the wrapper */ #TJK_dropDownMenu li#AB {z-index:6;} #TJK_dropDownMenu li#CF {z-index:5;} #TJK_dropDownMenu li#GJ {z-index:4;} #TJK_dropDownMenu li#KR {z-index:3;} #TJK_dropDownMenu li#ST {z-index:2;} #TJK_dropDownMenu li#UZ {z-index:1;} /* Current location - class on Body must match LI's id */ .AB #TJK_dropDownMenu li#AB a, .CF #TJK_dropDownMenu li#CF a, .GJ #TJK_dropDownMenu li#GJ a, .KR #TJK_dropDownMenu li#KR a, .ST #TJK_dropDownMenu li#ST a, .UZ #TJK_dropDownMenu li#UZ a {color:#000;} /* Keeping current menu accessible to JAWS */ .AB #TJK_dropDownMenu li#AB ul, .CF #TJK_dropDownMenu li#CF ul, .GJ #TJK_dropDownMenu li#GJ ul, .KR #TJK_dropDownMenu li#KR ul, .ST #TJK_dropDownMenu li#ST ul, .UZ #TJK_dropDownMenu li#UZ ul {display:block;top:-1000px} /* background colors #AB,#AB li a {background-color:#e2facd;} #CF,#CF li a {background-color:#fffcd0;} #GJ,#GJ li a {background-color:#ffe1cc;} #KR,#KR li a {background-color:#fccae5;} #ST,#ST li a {background-color:#c9c9ff;} #UZ,#UZ li a {background-color:#ffcebe;}*/ /* "trigger" and "msieFix" classes */ #TJK_dropDownMenu li.msieFix a {} /* last nested UL. keeping it in */ #TJK_dropDownMenu li#UZ ul {left:-2.3em !important;} /* If JS is OFF we need to style the links in the sub-menu of the current page */ /* so they are accessible to keyboard users. Using a class on each link would let */ /* us stick each link in the same place, but we would have to plug a lot of */ /* attributes in the markup and many rules here, so... */ .AB #TJK_dropDownMenu li#AB ul li a:focus, .AB #TJK_dropDownMenu li#AB ul li a:active, .CF #TJK_dropDownMenu li#CF ul li a:focus, .CF #TJK_dropDownMenu li#CF ul li a:active, .GJ #TJK_dropDownMenu li#GJ ul li a:focus, .GJ #TJK_dropDownMenu li#GJ ul li a:active, .KR #TJK_dropDownMenu li#KR ul li a:focus, .KR #TJK_dropDownMenu li#KR ul li a:active, .ST #TJK_dropDownMenu li#ST ul li a:focus, .ST #TJK_dropDownMenu li#ST ul li a:active, .UZ #TJK_dropDownMenu li#UZ ul li a:focus, .UZ #TJK_dropDownMenu li#UZ ul li a:active {position:absolute !important;top:1028px !important;} /**** TJK_keyBoardDropDown Pure CSS Drop Down Menu [TJK_keyBoardDropDown] v1.2 Copyright 2006, Thierry Koblentz - TJKDesign.com - All rights reserved. Read www.TJKDesign.com/articles/Pure_CSS_dropdown_Menus.asp ****/ /* zeroing padding/margin for all elements */ #TJK_dropDownMenu1, #TJK_dropDownMenu1 * { margin:0; padding:0; font:normal 11px Verdana, Arial, Helvetica, sans-serif; } /* "Master" UL (the whole Menu) */ #TJK_dropDownMenu1 { /*position:relative;*/ float:left; width:240px; font-size:12px; height:20px; margin:0 10px 0 0; background: url(../../images/search-fires-bg.jpg) no-repeat right top; } /* sub-menu ULs */ #TJK_dropDownMenu1 li ul { width:239px; /*width:11em !important; leaves room for padding */ list-style-type:none; cursor:pointer; position:absolute; display:none; top:20px; left:0px; z-index:999999999; padding:0px; border:1px solid #bcbdc0; } /* All LIs */ #TJK_dropDownMenu1 li { position:relative; width:240px; cursor:pointer; float:left; list-style-type:none; } /* sub-menu LIs */ #TJK_dropDownMenu1 li ul li { /*width:10em/*FF;*/ padding:0; border:none; /*max-width:120%; border:1px solid #333;*/ width:210px; /*background:#fff url(../images/smallline.jpg) no-repeat 5px 10px;*/ } /* All anchors */ #TJK_dropDownMenu1 li a { /*background: url(../../images/search-fires-bg.jpg) no-repeat right top;*/ cursor:pointer; color:#666; /*border-left:1px solid #333;*/ text-decoration:none; display:block; float:left; padding:0 .4em; /*height:20px; uncomment the declaration below if you want to go "full width" */ /* width:7.47em; */ height:2em; line-height:1.9em; } /* sub-menu Anchors */ #TJK_dropDownMenu1 li ul li a { width:22.1em/*FF*/; position:relative !important; /* ie Mac */ cursor:pointer !important; white-space:nowrap; line-height:1.7em; /*height:24px;*/ font-weight:normal; padding:2px 0px 2px 18px; font-size:10px; /*border:1px solid #fff;*/ color:#666; background:#fff url(../../images/smallline.jpg) no-repeat 5px 10px; /*background-position:0 50% !important;*/ } /* :hover and stuff */ #TJK_dropDownMenu1 li a:hover, #TJK_dropDownMenu1 li a:focus, #TJK_dropDownMenu1 li a:active {color:#000} /* move the declarations from the rule below the one above if you want a background swap on *all* anchors, including the top level ones */ #TJK_dropDownMenu1 ul a:hover, #TJK_dropDownMenu1 ul a:focus, #TJK_dropDownMenu1 ul a:active {color:#000000 !important;background:#eeeeee; width:22.1em;} /* display and z-index for the sub-menus */ #TJK_dropDownMenu1 li:hover ul, #TJK_dropDownMenu1 li.msieFix ul {display:block;z-index:10; !important;} /* safari: users can keep sub-menus up by from sub-menus to next top level */ /* didn't find a solution for users going back from the last one. I prefer */ /* to leave it like that vs. taking the last sub-menu *out of* the wrapper */ #TJK_dropDownMenu1 li#AB {z-index:6;} #TJK_dropDownMenu1 li#CF {z-index:5;} #TJK_dropDownMenu1 li#GJ {z-index:4;} #TJK_dropDownMenu1 li#KR {z-index:3;} #TJK_dropDownMenu1 li#ST {z-index:2;} #TJK_dropDownMenu1 li#UZ {z-index:1;} /* Current location - class on Body must match LI's id */ .AB #TJK_dropDownMenu1 li#AB a, .CF #TJK_dropDownMenu1 li#CF a, .GJ #TJK_dropDownMenu1 li#GJ a, .KR #TJK_dropDownMenu1 li#KR a, .ST #TJK_dropDownMenu1 li#ST a, .UZ #TJK_dropDownMenu1 li#UZ a {color:#000;} /* Keeping current menu accessible to JAWS */ .AB #TJK_dropDownMenu1 li#AB ul, .CF #TJK_dropDownMenu1 li#CF ul, .GJ #TJK_dropDownMenu1 li#GJ ul, .KR #TJK_dropDownMenu1 li#KR ul, .ST #TJK_dropDownMenu1 li#ST ul, .UZ #TJK_dropDownMenu1 li#UZ ul {display:block;top:-1000px} /* background colors #AB,#AB li a {background-color:#e2facd;} #CF,#CF li a {background-color:#fffcd0;} #GJ,#GJ li a {background-color:#ffe1cc;} #KR,#KR li a {background-color:#fccae5;} #ST,#ST li a {background-color:#c9c9ff;} #UZ,#UZ li a {background-color:#ffcebe;}*/ /* "trigger" and "msieFix" classes */ #TJK_dropDownMenu1 li.msieFix a {} /* last nested UL. keeping it in */ #TJK_dropDownMenu1 li#UZ ul {left:-2.3em !important;} /* If JS is OFF we need to style the links in the sub-menu of the current page */ /* so they are accessible to keyboard users. Using a class on each link would let */ /* us stick each link in the same place, but we would have to plug a lot of */ /* attributes in the markup and many rules here, so... */ .AB #TJK_dropDownMenu1 li#AB ul li a:focus, .AB #TJK_dropDownMenu1 li#AB ul li a:active, .CF #TJK_dropDownMenu1 li#CF ul li a:focus, .CF #TJK_dropDownMenu1 li#CF ul li a:active, .GJ #TJK_dropDownMenu1 li#GJ ul li a:focus, .GJ #TJK_dropDownMenu1 li#GJ ul li a:active, .KR #TJK_dropDownMenu1 li#KR ul li a:focus, .KR #TJK_dropDownMenu1 li#KR ul li a:active, .ST #TJK_dropDownMenu1 li#ST ul li a:focus, .ST #TJK_dropDownMenu1 li#ST ul li a:active, .UZ #TJK_dropDownMenu1 li#UZ ul li a:focus, .UZ #TJK_dropDownMenu1 li#UZ ul li a:active {position:absolute !important;top:1028px !important;} /**** TJK_keyBoardDropDown Pure CSS Drop Down Menu [TJK_keyBoardDropDown] v1.2 Copyright 2006, Thierry Koblentz - TJKDesign.com - All rights reserved. Read www.TJKDesign.com/articles/Pure_CSS_dropdown_Menus.asp ****/ /* zeroing padding/margin for all elements */ #TJK_dropDownMenu2, #TJK_dropDownMenu2 * { margin:0; padding:0; font:normal 11px Verdana, Arial, Helvetica, sans-serif; } /* "Master" UL (the whole Menu) */ #TJK_dropDownMenu2 { /*position:relative;*/ float:left; width:240px; font-size:12px; height:24px; margin:0 10px 0 0; background: url(../../images/search-fires-bg1.jpg) no-repeat left top; } /* sub-menu ULs */ #TJK_dropDownMenu2 li ul { width:239px; /*width:11em !important; leaves room for padding */ list-style-type:none; cursor:pointer; position:absolute; display:none; top:20px; left:0px; z-index:9; padding:0px; border:1px solid #000000; } /* All LIs */ #TJK_dropDownMenu2 li { position:relative; width:222px; cursor:pointer; float:left; list-style-type:none; } /* sub-menu LIs */ #TJK_dropDownMenu2 li ul li { /*width:10em/*FF;*/ padding:0; border:none; /*max-width:120%; border:1px solid #333;*/ width:210px; /*background:#fff url(../images/smallline.jpg) no-repeat 5px 10px;*/ } /* All anchors */ #TJK_dropDownMenu2 li a { /*background: url(../../images/search-fires-bg.jpg) no-repeat right top;*/ cursor:pointer; color:#666; /*border-left:1px solid #333;*/ text-decoration:none; display:block; float:left; padding:0 .4em; height:20px; /* uncomment the declaration below if you want to go "full width" */ /* width:7.47em; */ height:2em; line-height:2em; } /* sub-menu Anchors */ #TJK_dropDownMenu2 li ul li a { width:22.1em/*FF*/; position:relative !important; /* ie Mac */ cursor:pointer !important; white-space:nowrap; line-height:1.7em; /*height:24px;*/ font-weight:normal; padding:2px 0px 2px 18px; font-size:10px; /*border:1px solid #fff;*/ color:#666; background:#fff url(../../images/smallline.jpg) no-repeat 5px 10px; /*background-position:0 50% !important;*/ } /* :hover and stuff */ #TJK_dropDownMenu2 li a:hover, #TJK_dropDownMenu2 li a:focus, #TJK_dropDownMenu2 li a:active {color:#000} /* move the declarations from the rule below the one above if you want a background swap on *all* anchors, including the top level ones */ #TJK_dropDownMenu2 ul a:hover, #TJK_dropDownMenu2 ul a:focus, #TJK_dropDownMenu2 ul a:active {color:#000000 !important;background:#eeeeee; width:22.1em;} /* display and z-index for the sub-menus */ #TJK_dropDownMenu2 li:hover ul, #TJK_dropDownMenu2 li.msieFix ul {display:block;z-index:10; !important;} /* safari: users can keep sub-menus up by from sub-menus to next top level */ /* didn't find a solution for users going back from the last one. I prefer */ /* to leave it like that vs. taking the last sub-menu *out of* the wrapper */ #TJK_dropDownMenu2 li#AB {z-index:6;} #TJK_dropDownMenu2 li#CF {z-index:5;} #TJK_dropDownMenu2 li#GJ {z-index:4;} #TJK_dropDownMenu2 li#KR {z-index:3;} #TJK_dropDownMenu2 li#ST {z-index:2;} #TJK_dropDownMenu2 li#UZ {z-index:1;} /* Current location - class on Body must match LI's id */ .AB #TJK_dropDownMenu2 li#AB a, .CF #TJK_dropDownMenu2 li#CF a, .GJ #TJK_dropDownMenu2 li#GJ a, .KR #TJK_dropDownMenu2 li#KR a, .ST #TJK_dropDownMenu2 li#ST a, .UZ #TJK_dropDownMenu2 li#UZ a {color:#000;} /* Keeping current menu accessible to JAWS */ .AB #TJK_dropDownMenu2 li#AB ul, .CF #TJK_dropDownMenu2 li#CF ul, .GJ #TJK_dropDownMenu2 li#GJ ul, .KR #TJK_dropDownMenu2 li#KR ul, .ST #TJK_dropDownMenu2 li#ST ul, .UZ #TJK_dropDownMenu2 li#UZ ul {display:block;top:-1000px} /* background colors #AB,#AB li a {background-color:#e2facd;} #CF,#CF li a {background-color:#fffcd0;} #GJ,#GJ li a {background-color:#ffe1cc;} #KR,#KR li a {background-color:#fccae5;} #ST,#ST li a {background-color:#c9c9ff;} #UZ,#UZ li a {background-color:#ffcebe;}*/ /* "trigger" and "msieFix" classes */ #TJK_dropDownMenu2 li.msieFix a {} /* last nested UL. keeping it in */ #TJK_dropDownMenu2 li#UZ ul {left:-2.3em !important;} /* If JS is OFF we need to style the links in the sub-menu of the current page */ /* so they are accessible to keyboard users. Using a class on each link would let */ /* us stick each link in the same place, but we would have to plug a lot of */ /* attributes in the markup and many rules here, so... */ .AB #TJK_dropDownMenu2 li#AB ul li a:focus, .AB #TJK_dropDownMenu2 li#AB ul li a:active, .CF #TJK_dropDownMenu2 li#CF ul li a:focus, .CF #TJK_dropDownMenu2 li#CF ul li a:active, .GJ #TJK_dropDownMenu2 li#GJ ul li a:focus, .GJ #TJK_dropDownMenu2 li#GJ ul li a:active, .KR #TJK_dropDownMenu2 li#KR ul li a:focus, .KR #TJK_dropDownMenu2 li#KR ul li a:active, .ST #TJK_dropDownMenu2 li#ST ul li a:focus, .ST #TJK_dropDownMenu2 li#ST ul li a:active, .UZ #TJK_dropDownMenu2 li#UZ ul li a:focus, .UZ #TJK_dropDownMenu2 li#UZ ul li a:active {position:absolute !important;top:1028px !important;} /**** TJK_keyBoardDropDown Pure CSS Drop Down Menu [TJK_keyBoardDropDown] v1.2 Copyright 2006, Thierry Koblentz - TJKDesign.com - All rights reserved. Read www.TJKDesign.com/articles/Pure_CSS_dropdown_Menus.asp ****/ /* zeroing padding/margin for all elements */ #TJK_dropDownMenu3, #TJK_dropDownMenu3 * { margin:0; padding:0; font:normal 11px Verdana, Arial, Helvetica, sans-serif; } /* "Master" UL (the whole Menu) */ #TJK_dropDownMenu3 { /*position:relative;*/ float:left; width:240px; font-size:12px; height:24px; margin:0 10px 0 0; background: url(../../images/search-fires-bg1.jpg) no-repeat left top; } /* sub-menu ULs */ #TJK_dropDownMenu3 li ul { width:239px; /*width:11em !important; leaves room for padding */ list-style-type:none; cursor:pointer; position:absolute; display:none; bottom:0px; left:0px; z-index:1; padding:0px; border:1px solid #000000; } /* All LIs */ #TJK_dropDownMenu3 li { position:relative; width:222px; cursor:pointer; float:left; list-style-type:none; } /* sub-menu LIs */ #TJK_dropDownMenu3 li ul li { /*width:10em/*FF;*/ padding:0; border:none; /*max-width:120%; border:1px solid #333;*/ width:210px; /*background:#fff url(../images/smallline.jpg) no-repeat 5px 10px;*/ } /* All anchors */ #TJK_dropDownMenu3 li a { /*background: url(../../images/search-fires-bg.jpg) no-repeat right top;*/ cursor:pointer; color:#666; /*border-left:1px solid #333;*/ text-decoration:none; display:block; float:left; padding:0 .4em; height:20px; /* uncomment the declaration below if you want to go "full width" */ /* width:7.47em; */ height:2em; line-height:2em; } /* sub-menu Anchors */ #TJK_dropDownMenu3 li ul li a { width:22.1em/*FF*/; position:relative !important; /* ie Mac */ cursor:pointer !important; white-space:nowrap; line-height:1.7em; /*height:24px;*/ font-weight:normal; padding:2px 0px 2px 18px; font-size:10px; /*border:1px solid #fff;*/ color:#666; background:#fff url(../../images/smallline.jpg) no-repeat 5px 10px; /*background-position:0 50% !important;*/ } /* :hover and stuff */ #TJK_dropDownMenu3 li a:hover, #TJK_dropDownMenu3 li a:focus, #TJK_dropDownMenu3 li a:active {color:#000} /* move the declarations from the rule below the one above if you want a background swap on *all* anchors, including the top level ones */ #TJK_dropDownMenu3 ul a:hover, #TJK_dropDownMenu3 ul a:focus, #TJK_dropDownMenu3 ul a:active {color:#000000 !important;background:#eeeeee; width:22.1em;} /* display and z-index for the sub-menus */ #TJK_dropDownMenu3 li:hover ul, #TJK_dropDownMenu3 li.msieFix ul {display:block;z-index:10; !important;} /* safari: users can keep sub-menus up by from sub-menus to next top level */ /* didn't find a solution for users going back from the last one. I prefer */ /* to leave it like that vs. taking the last sub-menu *out of* the wrapper */ #TJK_dropDownMenu3 li#AB {z-index:6;} #TJK_dropDownMenu3 li#CF {z-index:5;} #TJK_dropDownMenu3 li#GJ {z-index:4;} #TJK_dropDownMenu3 li#KR {z-index:3;} #TJK_dropDownMenu3 li#ST {z-index:2;} #TJK_dropDownMenu3 li#UZ {z-index:1;} /* Current location - class on Body must match LI's id */ .AB #TJK_dropDownMenu3 li#AB a, .CF #TJK_dropDownMenu3 li#CF a, .GJ #TJK_dropDownMenu3 li#GJ a, .KR #TJK_dropDownMenu3 li#KR a, .ST #TJK_dropDownMenu3 li#ST a, .UZ #TJK_dropDownMenu3 li#UZ a {color:#000;} /* Keeping current menu accessible to JAWS */ .AB #TJK_dropDownMenu3 li#AB ul, .CF #TJK_dropDownMenu3 li#CF ul, .GJ #TJK_dropDownMenu3 li#GJ ul, .KR #TJK_dropDownMenu3 li#KR ul, .ST #TJK_dropDownMenu3 li#ST ul, .UZ #TJK_dropDownMenu3 li#UZ ul {display:block;top:-1000px} /* background colors #AB,#AB li a {background-color:#e2facd;} #CF,#CF li a {background-color:#fffcd0;} #GJ,#GJ li a {background-color:#ffe1cc;} #KR,#KR li a {background-color:#fccae5;} #ST,#ST li a {background-color:#c9c9ff;} #UZ,#UZ li a {background-color:#ffcebe;}*/ /* "trigger" and "msieFix" classes */ #TJK_dropDownMenu3 li.msieFix a {} /* last nested UL. keeping it in */ #TJK_dropDownMenu3 li#UZ ul {left:-2.3em !important;} /* If JS is OFF we need to style the links in the sub-menu of the current page */ /* so they are accessible to keyboard users. Using a class on each link would let */ /* us stick each link in the same place, but we would have to plug a lot of */ /* attributes in the markup and many rules here, so... */ .AB #TJK_dropDownMenu3 li#AB ul li a:focus, .AB #TJK_dropDownMenu3 li#AB ul li a:active, .CF #TJK_dropDownMenu3 li#CF ul li a:focus, .CF #TJK_dropDownMenu3 li#CF ul li a:active, .GJ #TJK_dropDownMenu3 li#GJ ul li a:focus, .GJ #TJK_dropDownMenu3 li#GJ ul li a:active, .KR #TJK_dropDownMenu3 li#KR ul li a:focus, .KR #TJK_dropDownMenu3 li#KR ul li a:active, .ST #TJK_dropDownMenu3 li#ST ul li a:focus, .ST #TJK_dropDownMenu3 li#ST ul li a:active, .UZ #TJK_dropDownMenu3 li#UZ ul li a:focus, .UZ #TJK_dropDownMenu3 li#UZ ul li a:active {position:absolute !important;top:1028px !important;}