/* Global stylesheet for screen media */

@import "visual.css";

a[hreflang]:after
{
  content: " [" attr(hreflang) "]";
  color: #888888;
}

/*********
 * Menus *
 *********/

/*
 * Note: the menu width must be given separately, for instance:
 *   <div class="menu" style="width: 5em">...</div>
 */

html > body div.menu
{
  display: block;
  top: 2ex;
  padding: 0;
  margin: 0;
  border: 0;
  color: black;
}

html > body div.topleft
{
  position: absolute;
  left: 1em;
  right: auto;
}

html > body div.topright
{
  position: absolute;  /* fallback if 'fixed' is not supported */
  position: fixed;
  left: auto;
  right: 1em;
}

html > body div.menu > div > :first-child
{
  padding: 0;
  margin: 0;
  width: inherit;
  border: 1px solid black;
  background: silver;
  text-align: center;
  font-weight: bolder;
}

html > body div.menu sup
{
  vertical-align: baseline;
}

html > body div.menu a
{
  text-decoration: none;
}

html > body div.menu > div > :first-child > a
{
  cursor: help;
}

html > body div.menu .sub
{
  width: inherit;
}

html > body div.menu .sub > ul
{
  display: none;
  position: absolute;
  padding: 0;
  margin: 0;
  width: inherit;
  border: 1px solid black;
}

html > body div.menu .sub:hover > ul
{
  display: block;
}

html > body div.menu:hover li
{
  list-style-type: none;
  position: relative;
  padding: 0;
  margin: 0;
  background: silver;
  white-space: nowrap;
}

html > body div.menu li:hover
{
  background: yellow;
}

html > body div.menu:hover li a
{
  display: block;
  padding: 0 0 0 0.2em;
  margin: 0;
}

html > body div.topleft ul li:hover > ul
{
  top: -1px;
  left: 100%;
}

html > body div.topright ul li:hover > ul
{
  top: -1px;
  right: 100%;
}

/* $Id: screen.css 44104 2011-06-01 14:33:08Z vinc17/xvii $ */