/* qc.HockeyExperts.ca - Navigation -------------------------------------------------- */ /* Navigation -------------------------------------------------- */ #nav { position: relative; z-index: 1000; } /* Menu 0 (Go Home) -------------------------------------------------- */ #page #btnHockeyExperts { width: 245px; height: 125px; background: url(/img/UI/btn/hockey-experts.png) no-repeat; position: relative; left: 0px; } #page #btnHockeyExperts li { display: inline; } #page #btnHockeyExperts li a { float: left; width: 245px; height: 0; padding-top: 125px; overflow: hidden; background: url(/img/UI/btn/hockey-experts.jpg) no-repeat 0 0; } #page #btnHockeyExperts li a:hover { background-position: 0px -125px; } #page.home #btnHockeyExperts { display: none; } /* Menu 1 -------------------------------------------------- */ #menuBanner { width: 100%; height: 23px; } #menuBanner li { display: inline; } #menuBanner li a { float: left; height: 0; padding-top: 23px; overflow: hidden; background-repeat: no-repeat; } /* --- State Normal - French --- */ #page.fr #menuBanner { background: url(/img/UI/menus/hockey-experts-fr.png) no-repeat; } #page.fr #menuBanner li a { background: url(/img/UI/menus/hockey-experts-fr.png); } #page.fr #menuBanner li#mb-stores a { width: 120px; background-position: 0px 0; } #page.fr #menuBanner li#mb-about a { width: 80px; background-position: -125px 0; margin-left: 5px; } #page.fr #menuBanner li#mb-brands a { width: 80px; background-position: -215px 0; margin-left: 10px; } #page.fr #menuBanner li#mb-tips a { width: 105px; background-position: -305px 0; margin-left: 10px; } #page.fr #menuBanner li#mb-partners a { width: 100px; background-position: -420px 0; margin-left: 10px; } #page.fr #menuBanner li#mb-sitemap a { width: 80px; background-position: -825px 0; margin-left: 305px; } #page.fr #menuBanner li#mb-switchlang a { width: 20px; background-position: -920px 0; margin-left: 15px; } /* --- State Over --- */ #page.fr #menuBanner li#mb-stores a:hover { background-position: 0px -23px; } #page.fr #menuBanner li#mb-about a:hover { background-position: -125px -23px; } #page.fr #menuBanner li#mb-brands a:hover { background-position: -215px -23px; } #page.fr #menuBanner li#mb-tips a:hover { background-position: -305px -23px; } #page.fr #menuBanner li#mb-partners a:hover { background-position: -420px -23px; } #page.fr #menuBanner li#mb-sitemap a:hover { background-position: -825px -23px; } #page.fr #menuBanner li#mb-switchlang a:hover { background-position: -920px -23px; } /* --- State Pressed --- */ #page.fr #menuBanner li#mb-stores a:active { background-position: 0px -46px; } #page.fr #menuBanner li#mb-about a:active { background-position: -125px -46px; } #page.fr #menuBanner li#mb-brands a:active { background-position: -215px -46px; } #page.fr #menuBanner li#mb-tips a:active { background-position: -305px -46px; } #page.fr #menuBanner li#mb-partners a:active { background-position: -420px -46px; } #page.fr #menuBanner li#mb-sitemap a:active { background-position: -825px -46px; } #page.fr #menuBanner li#mb-switchlang a:active { background-position: -920px -46px; } /* --- State Selected --- */ /* #page.fr #menuBanner li#mb-stores a { background-position: 0px -46px !important; } */ #page.fr.about #menuBanner li#mb-about a { background-position: -125px -46px !important; } #page.fr.brands #menuBanner li#mb-brands a { background-position: -215px -46px !important; } #page.fr.tips #menuBanner li#mb-tips a { background-position: -305px -46px !important; } #page.fr.mags #menuBanner li#mb-partners a { background-position: -420px -46px !important; } #page.fr.sitemap #menuBanner li#mb-sitemap a { background-position: -825px -46px !important; } /* --- State Normal - English --- */ #page.en #menuBanner { background: url(/img/UI/menus/hockey-experts-en.png) no-repeat; } #page.en #menuBanner li a { background: url(/img/UI/menus/hockey-experts-en.png); } #page.en #menuBanner li#mb-stores a { width: 105px; background-position: 0px 0; } #page.en #menuBanner li#mb-about a { width: 60px; background-position: -115px 0; margin-left: 10px; } #page.en #menuBanner li#mb-brands a { width: 75px; background-position: -185px 0; margin-left: 10px; } #page.en #menuBanner li#mb-tips a { width: 85px; background-position: -265px 0; margin-left: 5px; } #page.en #menuBanner li#mb-partners a { width: 80px; background-position: -357px 0; margin-left: 5px; } #page.en #menuBanner li#mb-sitemap a { width: 60px; background-position: -845px 0; margin-left: 411px; } #page.en #menuBanner li#mb-switchlang a { width: 20px; background-position: -920px 0; margin-left: 15px; } /* --- State Over --- */ #page.en #menuBanner li#mb-stores a:hover { background-position: 0px -23px; } #page.en #menuBanner li#mb-about a:hover { background-position: -115px -23px; } #page.en #menuBanner li#mb-brands a:hover { background-position: -185px -23px; } #page.en #menuBanner li#mb-tips a:hover { background-position: -265px -23px; } #page.en #menuBanner li#mb-partners a:hover { background-position: -357px -23px; } #page.en #menuBanner li#mb-sitemap a:hover { background-position: -845px -23px; } #page.en #menuBanner li#mb-switchlang a:hover { background-position: -920px -23px; } /* --- State Pressed --- */ #page.en #menuBanner li#mb-stores a:active { background-position: 0px -46px; } #page.en #menuBanner li#mb-about a:active { background-position: -115px -46px; } #page.en #menuBanner li#mb-brands a:active { background-position: -185px -46px; } #page.en #menuBanner li#mb-tips a:active { background-position: -265px -46px; } #page.en #menuBanner li#mb-partners a:active { background-position: -357px -46px; } #page.en #menuBanner li#mb-sitemap a:active { background-position: -845px -46px; } #page.en #menuBanner li#mb-switchlang a:active { background-position: -920px -46px; } /* --- State Selected --- */ /* #page.en.stores #menuBanner li#mb-stores a { background-position: 0px -46px !important; } */ #page.en.about #menuBanner li#mb-about a { background-position: -115px -46px !important; } #page.en.brands #menuBanner li#mb-brands a { background-position: -185px -46px !important; } #page.en.tips #menuBanner li#mb-tips a { background-position: -265px -46px !important; } #page.en.mags #menuBanner li#mb-partners a { background-position: -357px -46px !important; } #page.en.sitemap #menuBanner li#mb-sitemap a { background-position: -845px -46px !important; } /* Menu 2 -------------------------------------------------- */ #nav #menuProducts { margin: 0; padding: 0; height: 46px; width: 950px; list-style: none; float: left; } #nav #menuProducts a { display: block; } #nav #menuProducts li { display: inline; } #nav #menuProducts li a { float: left; height: 0; padding-top: 46px; overflow: hidden; background-repeat: no-repeat; } #menuProducts li ul { position: absolute; top: 46px; display: block; width: 169px; background: url(/img/UI/decoration/menu-shadow.png) right bottom no-repeat !important; border-top: none; padding: 0 5px 4px 0; z-index: 1000; } /* submenus positions */ #menuProducts li#mp-promotions ul { left: 0; } #menuProducts li#mp-Skates ul { left: 92px; } #menuProducts li#mp-Sticks ul { left: 150px; } #menuProducts li#mp-Equipment ul { left: 213px; } #menuProducts li#mp-Goalies ul { left: 308px; } #menuProducts li#mp-Apparel ul { left: 386px; } #menuProducts li#mp-Roller-hockey-and-Street-hockey ul { left: 474px; } #menuProducts li#mp-Licensed-products ul { left: 585px; } ul#menuProducts ul { display: none; } ul#menuProducts li:hover ul { display: block; } ul#menuProducts li ul li a { color: #000 !important; text-decoration: none !important; border-left: 1px solid #f8f8f8 !important; border-top: 1px solid #ddd !important; background: #fff !important; height: auto !important; width: 150px !important; padding: 5px 10px !important; white-space: nowrap; margin: 0 !important; } ul#menuProducts li ul li:hover a { background: #ddd !important; } ul#menuProducts li ul li.disable a { color: #aaa !important; background: #fff !important; cursor: default; } /* --- French --- */ #page.fr #menuProducts { background: url(/img/UI/menus/products-fr.png); } #page.fr #menuProducts li a { background: url(/img/UI/menus/products-fr.png); color: #000; } /* --- English --- */ #page.en #menuProducts { background: url(/img/UI/menus/products-en.png) no-repeat; } #page.en #menuProducts li a { background: url(/img/UI/menus/products-en.png); } /* --- State Normal --- */ #nav #menuProducts li#mp-promotions a { width: 88px; background-position: 0px 0; } #nav #menuProducts li#mp-Skates a { width: 56px; background-position: -91px 0; margin: 0 0 0 3px; } #nav #menuProducts li#mp-Sticks a { width: 60px; background-position: -150px 0; margin: 0 0 0 3px; } #nav #menuProducts li#mp-Equipment a { width: 92px; background-position: -213px 0; margin: 0 0 0 3px; } #nav #menuProducts li#mp-Goalies a { width: 75px; background-position: -308px 0; margin: 0 0 0 3px; } #nav #menuProducts li#mp-Apparel a { width: 85px; background-position: -386px 0; margin: 0 0 0 3px; } #nav #menuProducts li#mp-Roller-hockey-and-Street-hockey a { width: 108px; background-position: -474px 0; margin: 0 0 0 3px; } #nav #menuProducts li#mp-Licensed-products a { width: 77px; background-position: -585px 0; margin: 0 0 0 3px; } /* --- State Over --- */ #nav #menuProducts li#mp-promotions a:hover { background-position: 0px -46px; } #nav #menuProducts li#mp-Skates a:hover { background-position: -91px -46px; } #nav #menuProducts li#mp-Sticks a:hover { background-position: -150px -46px; } #nav #menuProducts li#mp-Equipment a:hover { background-position: -213px -46px; } #nav #menuProducts li#mp-Goalies a:hover { background-position: -308px -46px; } #nav #menuProducts li#mp-Apparel a:hover { background-position: -386px -46px; } #nav #menuProducts li#mp-Roller-hockey-and-Street-hockey a:hover { background-position: -474px -46px; } #nav #menuProducts li#mp-Licensed-products a:hover { background-position: -585px -46px; } /* --- State Pressed --- */ #nav #menuProducts li#mp-promotions a:active { width: 88px; background-position: 0px -92px; margin: 0 0px 0 0; } #nav #menuProducts li#mp-Skates a:active { width: 60px; background-position: -89px -92px; margin: 0 -2px 0 1px; } #nav #menuProducts li#mp-Sticks a:active { width: 64px; background-position: -148px -92px; margin: 0 -2px 0 1px; } #nav #menuProducts li#mp-Equipment a:active { width: 96px; background-position: -211px -92px; margin: 0 -2px 0 1px; } #nav #menuProducts li#mp-Goalies a:active { width: 79px; background-position: -306px -92px; margin: 0 -2px 0 1px; } #nav #menuProducts li#mp-Apparel a:active { width: 89px; background-position: -384px -92px; margin: 0 -2px 0 1px; } #nav #menuProducts li#mp-Roller-hockey-and-Street-hockey a:active { width: 112px; background-position: -472px -92px; margin: 0 -2px 0 1px; } #nav #menuProducts li#mp-Licensed-products a:active { width: 81px; background-position: -583px -92px; margin: 0 -2px 0 1px; } /* --- State Selected --- */ #page.promotions #menuProducts li#mp-promotions a { width: 88px; background-position: 0px -138px !important; } #page.skates #menuProducts li#mp-Skates a { width: 56px; background-position: -91px -138px !important; margin: 0 0 0 3px; } #page.sticks #menuProducts li#mp-Sticks a { width: 60px; background-position: -150px -138px !important; margin: 0 0 0 3px; } #page.equipment #menuProducts li#mp-Equipment a { width: 92px; background-position: -213px -138px !important; margin: 0 0 0 3px; } #page.goalies #menuProducts li#mp-Goalies a { width: 75px; background-position: -308px -138px !important; margin: 0 0 0 3px; } #page.apparel #menuProducts li#mp-Apparel a { width: 85px; background-position: -386px -138px !important; margin: 0 0 0 3px; } #page.rollerhockeyandstreethockey #menuProducts li#mp-Roller-hockey-and-Street-hockey { width: 108px; background-position: -474px -138px !important; margin: 0 0 0 3px; } #page.licensedproducts #menuProducts li#mp-Licensed-products a { width: 77px; background-position: -585px -138px !important; margin: 0 0 0 3px; } /* --- Search button --- */ #nav #searchProducts { position: absolute; top: 0; right: 0; } #nav #searchProducts #keywords { border: 1px solid #b0c6d1; width: 200px; height: 14px; padding: 3px; font-family: "Trebuchet MS", Arial, Helvetica, sans-serif; color: #058; } /* --- State Normal --- */ #nav #btnSearch li#goSearch { display: inline; height: 22px; margin: 0 10px 0 3px; float: right; } #nav #btnSearch li#goSearch a { background: url(/img/UI/btn/search.png); float: left; height: 0; width: 31px; padding-top: 22px; overflow: hidden; background-repeat: no-repeat; } /* --- State Over --- */ #nav #btnSearch li#goSearch a:hover { background-position: 0px -22px; } /* --- State Pressed --- */ #nav #btnSearch li#goSearch a:active { background-position: 0px -44px; }