/*@ navigation(s) */ div#nav { position: fixed; right: 0; left: 0; top: 0.8em; } div#nav > div { position: relative; margin: auto; width: 50em; text-align: center; } /*@ navigation(s) -- image(s) */ div#nav > div > a > img { position: relative; clear: left; display: block; margin: 0 auto; width: 17em; height: auto; z-index: 1; } /*@ navigation(s) -- list(s) */ div#nav ul { position: absolute; list-style-type: none; margin: 0; padding: 0; } div#nav > div > ul { top: 2.92em; width: 50%; } /*@ navigation(s) -- gift(s) */ ul#gifts { left: 0; } ul#food { right: 0; } div#nav span { display: block; overflow: hidden; height: 2.1em; line-height: 2.2em; } /*@ navigation(s) -- item(s) */ div#nav > div > ul > li { position: relative; background-color: lightblue; padding: 0.5em; border: 0.05em solid black; font-size: 0.9em; padding: 0 0.5em; width: 8.35em; height: 2.2em; } div#nav > div > ul > li:hover { background-color: lightsteelblue; } ul#gifts > li { float: left; } ul#food > li { float: right; } /*@ navigation(s) -- gift(s) */ div#nav > div > ul > li#leftedge { border-right-width: 0; -moz-border-radius-topleft: 1em; -moz-border-radius-bottomleft: 1em; margin-left: 0.3em; } div#nav > div > ul > li#leftedge:hover { -moz-border-radius-bottomleft: 0; } div#nav > div > ul > li#rightedge { border-left-width: 0; -moz-border-radius-topright: 1em; -moz-border-radius-bottomright: 1em; margin-right: 0.3em; } div#nav > div > ul > li#rightedge:hover { -moz-border-radius-bottomright: 0; } /*@ navigation(s) -- menu(s) */ ul.menu { top: 2.19em; background-color: lightblue; width: 15em; -moz-border-radius-bottomleft: 1em; -moz-border-radius-bottomright: 1em; border: 0.05em solid black; display: none; } /*@ food(s) & gift(s) */ ul#food ul.menu { -moz-border-radius-topleft: 1em; right: -0.07em; } ul#gifts ul.menu { -moz-border-radius-topright: 1em; left: -0.05em; } div#nav > div > ul > li:hover > ul.menu, ul.menu:hover { display: block; } ul.menu li { text-align: left; color: black; } /*@ link(s) in menu(s) */ ul.menu a { margin: 0.4em; padding: 0.5em; color: black; display: block; border: 0.05em solid lightblue; } ul.menu a:hover { background-color: lightsteelblue; -moz-border-radius: 0.8em; border: 0.05em solid black; text-decoration: none; } div#nav ul a:active { background-color: steelblue; }