/******************************************************************************* Navigation CSS OReillys by Laut und Schoen *******************************************************************************/ /* ################### main menu ################### */ #navigation, #navigation2 { position:absolute; overflow:hidden; top:150px; left:193px; width:700px; height:30px; } #navigation2 { top:571px; } * html #navigation { top:152px; } .amsterdam #navigation2, .brussels #navigation2, .gateway #navigation2 { text-align:center; color:#FFF6D6; padding-top:5px; } .amsterdam #navigation2.en-gb a, .brussels #navigation2.en-gb a, .gateway #navigation2.en-gb a { background-image:none; } #navigation ul, #navigation2 ul { overflow:hidden; list-style-type:none; padding:0; margin:0; } #navigation li, #navigation2 li { float:left; display:inline; width:auto; } #navigation a, #navigation2 a { display:block; background-repeat:no-repeat; height:30px; } #navigation span, #navigation2 span { position:absolute; display:inline; top:-8000em; left:-8000em; } /*################### english ###################*/ #navigation.en-gb a { background-image:url('../images/nav/navigation1-en.png'); } * html #navigation.en-gb a { background-image:url('../images/nav/navigation1-en-ie.jpg'); } #navigation.en-gb ul li { padding:0 6px; } #navigation.en-gb .item1 a { background-position: -12px 0; width:106px; } #navigation.en-gb .item2 a { background-position:-139px 0; width:49px; } #navigation.en-gb .item89 a { background-position:-205px 0; width:63px; } #navigation.en-gb .item3 a { background-position:-286px 0; width:59px; } #navigation.en-gb .item4 a { background-position:-362px 0; width:60px; } #navigation.en-gb .item5 a { background-position:-440px 0; width:76px; } #navigation.en-gb .item6 a { background-position:-536px 0; width:100px; } #navigation.en-gb .item7 a { background-position:-652px 0; width:48px; } .amsterdam #navigation.en-gb .item2 a, .brussels #navigation.en-gb .item2 a { background-position:-717px 0; width:56px; } .amsterdam #navigation.en-gb .item8 a, .brussels #navigation.en-gb .item8 a { background-position:-506px 0; width:77px; } .amsterdam #navigation.en-gb .item94 a, .brussels #navigation.en-gb .item94 a { background-position:-792px 0; width:62px; } .amsterdam #navigation.en-gb .item96 a, .brussels #navigation.en-gb .item96 a { background-position:-875px 0; width:91px; } #navigation.en-gb li.item1 a:hover, #navigation.en-gb li.item1 a:focus, #navigation.en-gb li#current.item1 a { background-position: -12px -36px; } #navigation.en-gb li.item2 a:hover, #navigation.en-gb li.item2 a:focus, #navigation.en-gb li#current.item2 a { background-position:-139px -36px; } #navigation.en-gb li.item89 a:hover, #navigation.en-gb li.item89 a:focus, #navigation.en-gb li#current.item89 a { background-position:-205px -36px; } #navigation.en-gb li.item3 a:hover, #navigation.en-gb li.item3 a:focus, #navigation.en-gb li#current.item3 a { background-position:-286px -36px; } #navigation.en-gb li.item4 a:hover, #navigation.en-gb li.item4 a:focus, #navigation.en-gb li#current.item4 a { background-position:-362px -36px; } #navigation.en-gb li.item5 a:hover, #navigation.en-gb li.item5 a:focus, #navigation.en-gb li#current.item5 a { background-position:-440px -36px; } #navigation.en-gb li.item6 a:hover, #navigation.en-gb li.item6 a:focus, #navigation.en-gb li#current.item6 a { background-position:-536px -36px; } #navigation.en-gb li.item7 a:hover, #navigation.en-gb li.item7 a:focus, #navigation.en-gb li#current.item7 a { background-position:-652px -36px; } .amsterdam #navigation.en-gb li.item2 a:hover, .amsterdam #navigation.en-gb li.item2 a:focus, .amsterdam #navigation.en-gb li#current.item2 a, .brussels #navigation.en-gb li.item2 a:hover, .brussels #navigation.en-gb li.item2 a:focus, .brussels #navigation.en-gb li#current.item2 a { background-position:-717px -36px; } .amsterdam #navigation.en-gb li.item8 a:hover, .amsterdam #navigation.en-gb li.item8 a:focus, .amsterdam #navigation.en-gb li#current.item8 a, .brussels #navigation.en-gb li.item8 a:hover, .brussels #navigation.en-gb li.item8 a:focus, .brussels #navigation.en-gb li#current.item8 a { background-position:-506px -36px; } .amsterdam #navigation.en-gb li.item94 a:hover, .amsterdam #navigation.en-gb li.item94 a:focus, .amsterdam #navigation.en-gb li#current.item94 a, .brussels #navigation.en-gb li.item94 a:hover, .brussels #navigation.en-gb li.item94 a:focus, .brussels #navigation.en-gb li#current.item94 a { background-position:-792px -36px; } .amsterdam #navigation.en-gb li.item96 a:hover, .amsterdam #navigation.en-gb li.item96 a:focus, .amsterdam #navigation.en-gb li#current.item96 a, .brussels #navigation.en-gb li.item96 a:hover, .brussels #navigation.en-gb li.item96 a:focus, .brussels #navigation.en-gb li#current.item96 a { background-position:-875px -36px; } #navigation2.en-gb a { background-image:url('../images/nav/navigation2-en.png'); } * html #navigation2.en-gb a { background-image:url('../images/nav/navigation2-en-ie.jpg'); } #navigation2.en-gb li { padding:0 11px; } #navigation2.en-gb .item92 a { background-position: -12px 0; width:53px; } #navigation2.en-gb .item94 a { background-position:-208px 0; width:58px; } #navigation2.en-gb .item93 a { background-position: -90px 0; width:94px; } #navigation2.en-gb .item95 a { background-position:-292px 0; width:83px; } #navigation2.en-gb .item96 a { background-position:-395px 0; width:88px; } #navigation2.en-gb .item8 a { background-position: -506px 0; width:77px; } #navigation2.en-gb .item97 a { background-position:-607px 0; width:91px; } #navigation2.en-gb li.item92 a:hover, #navigation2.en-gb li.item92 a:focus, #navigation2.en-gb li#current.item92 a { background-position: -12px -30px; } #navigation2.en-gb li.item94 a:hover, #navigation2.en-gb li.item94 a:focus, #navigation2.en-gb li#current.item94 a { background-position:-208px -30px; } #navigation2.en-gb li.item93 a:hover, #navigation2.en-gb li.item93 a:focus, #navigation2.en-gb li#current.item93 a { background-position: -90px -30px; } #navigation2.en-gb li.item95 a:hover, #navigation2.en-gb li.item95 a:focus, #navigation2.en-gb li#current.item95 a { background-position:-292px -30px; } #navigation2.en-gb li.item96 a:hover, #navigation2.en-gb li.item96 a:focus, #navigation2.en-gb li#current.item96 a { background-position:-395px -30px; } #navigation2.en-gb li.item8 a:hover, #navigation2.en-gb li.item8 a:focus, #navigation2.en-gb li#current.item8 a { background-position:-506px -30px; } #navigation2.en-gb li.item97 a:hover, #navigation2.en-gb li.item97 a:focus, #navigation2.en-gb li#current.item97 a { background-position:-607px -30px; } /* ################### deutsch ################### */ #navigation.de-de a { background-image:url('../images/nav/navigation1-de.png'); } * html #navigation.de-de a { background-image:url('../images/nav/navigation1-de-ie.jpg'); } #navigation.de-de li { padding:0 7px; } #navigation.de-de .item1 a { background-position: -12px 0; width:103px; } #navigation.de-de .item2 a { background-position:-132px 0; width:54px; } #navigation.de-de .item89 a { background-position:-202px 0; width:80px; } #navigation.de-de .item3 a { background-position:-292px 0; width:57px; } #navigation.de-de .item4 a { background-position:-362px 0; width:60px; } #navigation.de-de .item5 a { background-position:-436px 0; width:75px; } #navigation.de-de .item6 a { background-position:-528px 0; width:108px; } #navigation.de-de .item7 a { background-position:-652px 0; width:48px; } #navigation.de-de li.item1 a:hover, #navigation.de-de li.item1 a:focus, #navigation.de-de li#current.item1 a { background-position: -12px -30px; } #navigation.de-de li.item2 a:hover, #navigation.de-de li.item2 a:focus, #navigation.de-de li#current.item2 a { background-position:-132px -30px; } #navigation.de-de li.item89 a:hover, #navigation.de-de li.item89 a:focus, #navigation.de-de li#current.item89 a { background-position:-202px -30px; } #navigation.de-de li.item3 a:hover, #navigation.de-de li.item3 a:focus, #navigation.de-de li#current.item3 a { background-position:-292px -30px; } #navigation.de-de li.item4 a:hover, #navigation.de-de li.item4 a:focus, #navigation.de-de li#current.item4 a { background-position:-362px -30px; } #navigation.de-de li.item5 a:hover, #navigation.de-de li.item5 a:focus, #navigation.de-de li#current.item5 a { background-position:-436px -30px; } #navigation.de-de li.item6 a:hover, #navigation.de-de li.item6 a:focus, #navigation.de-de li#current.item6 a { background-position:-528px -30px; } #navigation.de-de li.item7 a:hover, #navigation.de-de li.item7 a:focus, #navigation.de-de li#current.item7 a { background-position:-652px -30px; } #xnavigation.de-de a { border:1px solid red; } #xnavigation.de-de li { border:1px solid blue; } #navigation2.de-de a { background-image:url('../images/nav/navigation2-de.png'); } * html #navigation2.de-de a { background-image:url('../images/nav/navigation2-de-ie.jpg'); } #navigation2.de-de li { padding:0 10px; } #navigation2.de-de .item92 a { background-position: -10px 0; width:61px; } #navigation2.de-de .item94 a { background-position:-210px 0; width:59px; } #navigation2.de-de .item93 a { background-position: -94px 0; width:94px; } #navigation2.de-de .item95 a { background-position:-290px 0; width:88px; } #navigation2.de-de .item96 a { background-position:-400px 0; width:68px; } #navigation2.de-de .item8 a { background-position: -491px 0; width:76px; } #navigation2.de-de .item97 a { background-position:-591px 0; width:107px; } #navigation2.de-de li.item92 a:hover, #navigation2.de-de li.item92 a:focus, #navigation2.de-de li#current.item92 a { background-position: -10px -30px; } #navigation2.de-de li.item94 a:hover, #navigation2.de-de li.item94 a:focus, #navigation2.de-de li#current.item94 a { background-position:-210px -30px; } #navigation2.de-de li.item93 a:hover, #navigation2.de-de li.item93 a:focus, #navigation2.de-de li#current.item93 a { background-position: -94px -30px; } #navigation2.de-de li.item95 a:hover, #navigation2.de-de li.item95 a:focus, #navigation2.de-de li#current.item95 a { background-position:-290px -30px; } #navigation2.de-de li.item96 a:hover, #navigation2.de-de li.item96 a:focus, #navigation2.de-de li#current.item96 a { background-position:-400px -30px; } #navigation2.de-de li.item8 a:hover, #navigation2.de-de li.item8 a:focus, #navigation2.de-de li#current.item8 a { background-position:-491px -30px; } #navigation2.de-de li.item97 a:hover, #navigation2.de-de li.item97 a:focus, #navigation2.de-de li#current.item97 a { background-position:-591px -30px; } /* ################ additional menus ################ */ #nav_left, #nav_right { position:absolute; top:152px; } #nav_right { right:-1px; } #nav_left { left:0; } #nav_pillar { position:absolute; top:510px; left:84px; } #nav_left ul, #nav_pillar ul, #nav_right ul { list-style-type:none; } #nav_left a { position:relative; display:block; width:175px; height:262px; background: transparent url('../images/nav/light_left_empty.jpg') no-repeat scroll 0 0; } #nav_left img { position: absolute; left: 83px; top:148px; opacity: 0.5; filter: alpha(opacity = 50); } #nav_right img { position: absolute; right: 80px; top:148px; opacity: 0.5; filter: alpha(opacity = 50); } #nav_left a:hover img, #nav_right a:hover img, #nav_left a:focus img, #nav_right a:focus img, #nav_left li#current a img, #nav_right li#current a img { opacity: 1; filter: alpha(opacity = 100); } #nav_right a { position:relative; display:block; width:174px; height:262px; background:transparent url('../images/nav/light_right_empty.jpg') no-repeat; background-position: right top; } #nav_pillar a { display:block; width:51px; height:51px; background:transparent url('../images/nav/button_facebook.jpg') no-repeat scroll 0 0; } .amsterdam #nav_pillar a, .brussels #nav_pillar a { background-position:left bottom; } .amsterdam #nav_pillar a:hover, .amsterdam #nav_pillar a:focus, .amsterdam #nav_pillar li#current a, .brussels #nav_pillar a:hover, .brussels #nav_pillar a:focus, .brussels #nav_pillar li#current a { background-position:left top; } #nav_left a:hover, #nav_left a:focus, #nav_pillar a:hover, #nav_pillar a:focus, #nav_left li#current a, #nav_pillar li#current a { background-position:left bottom; } #nav_right a:hover, #nav_right a:focus, #nav_right li#current a { background-position:bottom right; } #nav_left span, #nav_right span, #nav_pillar span { position:absolute; display:inline; top:-8000em; left:-8000em; } /*################### gateway ###################*/ #wrap.gateway #navigation { left:210px; } #navigation li.item52 a { background-image:url(../images/nav/nav_amsterdam.jpg); width:124px; } #navigation li.item53 a { background-image:url(../images/nav/nav_brussels.jpg); width:100px; } #navigation li.item55 a { background-image:url(../images/nav/nav_duesseldorf.jpg); width:123px; } #navigation li.item56 a { background-image:url(../images/nav/nav_frankfurt.jpg); width:107px; } #navigation li.item57 a { background-image:url(../images/nav/nav_heidelberg.jpg); width:117px; } #wrap.gateway #navigation li a:hover, #wrap.gateway #navigation li a:focus { background-position:center -40px; }