/*******************************************************************************
  Rules for the navigation bar at the top.
*******************************************************************************/

#navbar {
  height: 30px;
  margin: auto;
  margin-top: 0;
  min-width: 848px;
  text-align: center;
}

#navbar img {
  border: none;
  position: relative;
  top: 1px;
}

#navbar a:link, #navbar a:visited {
  border-left: 1px #111 solid;
  border-right: 1px #444 solid;
  color: #ddd;
  display: inline-block;
  font-family: Arial, sans-serif;
  height: 19px;
  letter-spacing: 1px;
  margin: 0;
  min-width: 35px;
  padding: 10px 5px;
  padding-left: 20px;
  padding-right: 20px;
  text-align: center;
  text-decoration: none;
  text-shadow: #333 -1px -1px;
  vertical-align: bottom;
}

#navbar .unhover, #navbar .unhover:hover, #navbar a:link, #navbar a:visited {
  /* Source: /static/ui/normal_sliver.gif */
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAnCAAAAADri31+AAAAAXNSR0IArs4c6QAAAC1JREFUCNdjiGBiYPrL9J/pHxD+B+O/QBEIDSL/w+X+gFl/mb5C1f1DIUHq+AA7fSNtBmf7IQAAAABJRU5ErkJggg==) top;
  /* Special case for IE. */
  *background: url(ui/normal_sliver.png) top;
}

#navbar a:hover, #navbar a.hover {
  /* Source: /static/ui/hover_sliver.gif */
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAAEAAAAnCAAAAADri31+AAAAAXNSR0IArs4c6QAAAC1JREFUCNdjKGFiYPrH9B+M/0NZMBGIGAOU9Rcq+g7IArH/MP0G499Q+X9MAgAYWSJ3EOa3GgAAAABJRU5ErkJggg==) top;
  /* Special case for IE. */
  *background: url(ui/hover_sliver.png) top;
}

#navbar a:first-child, #navbar a:first-child div {
  -khtml-border-radius: 0 0 0 10px;
  -moz-border-radius: 0 0 0 10px;
  -webkit-border-bottom-left-radius: 10px;
  border-left: none;
  border-radius: 0 0 0 10px;
}

#navbar a:last-child, #navbar a:last-child div {
  -khtml-border-radius: 0 0 10px 0;
  -moz-border-radius: 0 0 10px 0;
  -webkit-border-bottom-right-radius: 10px;
  border-radius: 0 0 10px 0;
  border-right: none;
}

/* For browsers that do not support corners and/or :(last/first)-child. */

#navbar a.first {
  background: url('ui/normal.png') top left;
  border-left: none;
}

#navbar a.first.unhover, #navbar a.first.unhover:hover {
  background: url('ui/normal.png') top left;
}

#navbar a.first:hover, #navbar a.first.hover {
  background: url('ui/hover.png') top left;
}

#navbar a.last {
  background: url('ui/normal.png') top right;
  border-right: none;
}

#navbar a.last.unhover, #navbar a.last.unhover:hover {
  background: url('ui/normal.png') top right;
}

#navbar a.last:hover, #navbar a.last.hover {
  background: url('ui/hover.png') top right;
}