@charset "UTF-8"; /* ÜTF-8 ENCÖDED */ /* before arrow */ /* navigation START */ #navigation { width : 700px; display : inline-block; float : right; text-align : right; } #navigation .button { color : #676767; font-weight : bold; height : 77px; margin-top : -7px; padding-top : 0px; text-shadow : 0px 1px 1px #FFFFFF; text-align : center; } #navigation-kombinator .button { background-image : url('/images/sprites/navigation-info.png'); background-position: 0px 0px; background-repeat : no-repeat; margin-right : -7px; padding-right : 40px; width : 211px; } .navigation-separator { background-image : url('/images/backgrounds/navigation-separator.png'); background-position : center center; background-repeat : no-repeat; height : 84px; width : 20px; } .navigation-separator.empty { background-image : none; } .navigation-separator.half { width : 10px; } #navigation .button, #navigation .navigation-separator { display : block; float : left; } #navigation #navigation-kombinator .button { float : right; } /* arrow */ #header .info-text-block:hover .arrow.gray, #navigation .button:hover .arrow.gray { background-position : 0px -30px; /* nach unten - orange */ } /* after arrow and still arrow */ #navigation .button:hover { color : #F48C07; } #navigation-box .active .button { background-color : #F48C07; color : #FCFCFC; height : 77px; text-shadow : 0px 1px 0px #0C0C0C; padding-top : 0px; margin-top : -7px; margin-bottom : 10px; } /* arrow */ #navigation .active .button .arrow.gray { background-position : 0px -20px; /* nach unten - weiss */ } #navigation .active.show .button .arrow.gray , #navigation-kombinator.active.show .button .arrow.gray { background-position : 0px -10px; /* nach unten - grau */ } #navigation .active.show .button:hover .arrow.gray { background-position : 0px -30px; /* nach unten - orange */ } #navigation-kombinator .button { background-position : 0px 0px; /* nach unten - schwarz */ } #navigation-kombinator.active .button { background-position : 0px -60px; /* orange bg */ color : #FCFCFC; text-shadow : 0px 1px 0px #0C0C0C; } #navigation-box { display : inline-block; width : 489px; } #navigation-box .button { width : 30%; } /* NEW */ #navigation .button-and-overlay .overlay { background-color : white; box-shadow : 0px 0px 10px #CCCCCC; border-color : silver; border-style : solid; border-width : 1px; color : #666666; display : none; height : auto; left : 0px; margin-left : auto; margin-right : auto; margin-top : 33px; overflow : hidden; padding : 32px; padding-top : 16px; position : absolute; right : 0px; top : 157px; z-index : 2; width : 1221px; } #navigation .button-and-overlay.show .overlay, .no-js #navigation .button-and-overlay:hover .overlay { display : block; } #navigation-box .button , #navigation-box .active .button { padding-top : 0px; } #navigation .button-and-overlay .navigation-element.button .tab { background-color : transparent; border-style : solid; border-width : 1px; border-color : transparent; border-bottom : 0px; display : inline-block; width : 82%; height : 54px; position : relative; margin-top : 22px; padding-top : 15px; } #navigation .button-and-overlay.show .navigation-element.button .tab , .no-js #navigation .button-and-overlay:hover .navigation-element.button .tab { background-color : white; border-color : silver; border-top-left-radius : 3px; border-top-right-radius : 3px; box-shadow : 0px 0px 10px #CCCCCC; z-index : 3; } #navigation .button-and-overlay.show .navigation-element.button .tab { height : 55px; } #navigation .button-and-overlay.show.active .navigation-element.button .tab , .no-js #navigation .button-and-overlay.active:hover .navigation-element.button .tab { border-color : transparent; box-shadow : 0px 0px 0px transparent; } #navigation .button-and-overlay .navigation-element .overlay-cover-up { background-color : white; display : none; height : 10px; position : relative; top : -1px; /* 1px | -3px */ width : 110%; /* 100% */ z-index : 4; left : -6px; /* not existing */ } #navigation #navigation-kombinator.button-and-overlay.show .navigation-element .overlay-cover-up { top : 1px; } #navigation .button-and-overlay.show .navigation-element .overlay-cover-up , .no-js #navigation .button-and-overlay:hover .navigation-element .overlay-cover-up { display : inline-block; } #navigation #navigation-kombinator.button-and-overlay.show .navigation-element .overlay-cover-up , .no-js #navigation #navigation-kombinator.button-and-overlay:hover .navigation-element .overlay-cover-up { width : 100%; } #navigation #navigation-handys.button-and-overlay.show .navigation-element .overlay-cover-up , .no-js #navigation #navigation-handys.button-and-overlay:hover .navigation-element .overlay-cover-up { display : inline; } .tab-overlay-cover-up { display : none; height : 20px; position : absolute; bottom : -10px; background-color : white; width : 100%; left : 0px; } #navigation .button-and-overlay.show .navigation-element .tab-overlay-cover-up , .no-js #navigation .button-and-overlay:hover .navigation-element .tab-overlay-cover-up { display : inline; } #navigation .button-and-overlay .navigation-element .navigation-text { color : #676767; } #navigation .button-and-overlay.active .navigation-element .navigation-text { color : #FFFFFF; } #navigation .button-and-overlay.show .navigation-element .navigation-text , .no-js #navigation .button-and-overlay:hover .navigation-element .navigation-text { color : #676767; text-shadow : 0px 1px 0px #FFFFFF; } #navigation .button-and-overlay .overlay { text-align : left; } #navigation { width : auto; } #navigation-box { float : left; width : auto; } #navigation-box .button { width : auto; padding-left : 12px; padding-right : 12px; } #navigation .button-and-overlay .navigation-element.button .tab { width : auto; padding-left : 12px; padding-right : 12px; } #navigation .button-and-overlay.show .navigation-element.button .no-tab, .no-js #navigation .button-and-overlay:hover .navigation-element.button .no-tab { background-color : transparent; border-bottom-right-radius : 3px; border-bottom-left-radius : 3px; border-bottom : 1px solid silver; height : 50px; } #navigation .button-and-overlay.show .navigation-element .no-tab .navigation-text, .no-js #navigation .button-and-overlay:hover .navigation-element .no-tab .navigation-text { color : white; text-shadow : 0px 1px 0px #0C0C0C; } #navigation #navigation-start.button-and-overlay.show .navigation-element.button .no-tab { border-color : transparent; height : auto; box-shadow : none; } #navigation #navigation-start.button-and-overlay.show .navigation-element.button .no-tab .navigation-text { color : #676767; text-shadow : 0px 1px 1px #FFFFFF; }