/* define main nav bar width, height and background image */
.nav {
  height:60px;
  margin:0px 0px 15px 0px;
  width:830px;
  background: url(../img/common/nav_main.gif) no-repeat;
  position: relative;
  list-style-type: none;
  padding: 0;
}

.nav li {
	display: block;
}

.nav li a {
  left: 0;
  width: 100%;
  text-indent: -9999em;
}

.nav li.current a {
  cursor: default;
}

.nav li .effect {
  left: 0;
  width: 100%;
}

.nav li,
.nav li a,
.nav li .effect {
  position: absolute;
  top: 0;
  margin: 0;
  padding: 0;
  height: 100%;
  overflow: hidden;
}

/* individual elements defined here */

/* - home - */
#nav_home { 
  left: 0px;
  width: 83px;
}
#nav_home .effect, #nav_home a:hover, #nav_home a:focus {
  background: url(../img/common/nav_main.gif) no-repeat 0px -61px;
}
#nav_home .mousedown, #nav_home a:active {
  background-position: 0px -122px;
}
#nav_home.current a:link, #nav_home.current a:visited {
  background: url(../img/common/nav_main.gif) no-repeat 0px -183px;
}

/* - how - */
#nav_how {
  left: 83px;
  width: 229px;
}
#nav_how .effect, #nav_how a:hover, #nav_how a:focus {
  background: url(../img/common/nav_main.gif) no-repeat -83px -61px;
}
#nav_how .mousedown, #nav_how a:active {
  background-position: -83px -122px;
}
#nav_how.current a:link, #nav_how.current a:visited {
  background: url(../img/common/nav_main.gif) no-repeat -83px -183px;
}

/* - animals - */
#nav_animals {
  left: 312px;
  width: 151px;
}
#nav_animals .effect, #nav_animals a:hover, #nav_animals a:focus {
  background: url(../img/common/nav_main.gif) no-repeat -312px -61px;
}
#nav_animals .mousedown, #nav_animals a:active {
  background-position: -312px -122px;
}
#nav_animals.current a:link, #nav_animals.current a:visited {
  background: url(../img/common/nav_main.gif) no-repeat -312px -183px;
}

/* - join - */
#nav_join {
  left: 463px;
  width: 124px;
}
#nav_join .effect, #nav_join a:hover, #nav_join a:focus {
  background: url(../img/common/nav_main.gif) no-repeat -463px -61px;
}
#nav_join .mousedown, #nav_join a:active {
  background-position: -463px -122px;
}
#nav_join.current a:link, #nav_join.current a:visited {
  background: url(../img/common/nav_main.gif) no-repeat -463px -183px;
}

/* - facility - */
#nav_facility {
  left: 587px;
  width: 83px;
}
#nav_facility .effect, #nav_facility a:hover, #nav_facility a:focus {
  background: url(../img/common/nav_main.gif) no-repeat -587px -61px;
}
#nav_facility .mousedown, #nav_facility a:active {
  background-position: -587px -122px;
}
#nav_facility.current a:link, #nav_facility.current a:visited {
  background: url(../img/common/nav_main.gif) no-repeat -587px -183px;
}

/* - links - */
#nav_links {
  left: 670px;
  width: 71px;
}
#nav_links .effect, #nav_links a:hover, #nav_links a:focus {
  background: url(../img/common/nav_main.gif) no-repeat -670px -61px;
}
#nav_links .mousedown, #nav_links a:active {
  background-position: -670px -122px;
}
#nav_links.current a:link, #nav_links.current a:visited {
  background: url(../img/common/nav_main.gif) no-repeat -670px -183px;
}

/* - contact - */
#nav_contact {
  left: 740px;
  width: 89px;
}
#nav_contact .effect, #nav_contact a:hover, #nav_contact a:focus {
  background: url(../img/common/nav_main.gif) no-repeat -740px -61px;
}
#nav_contact .mousedown, #nav_contact a:active {
  background-position: -740px -122px;
}
#nav_contact.current a:link, #nav_contact.current a:visited {
  background: url(../img/common/nav_main.gif) no-repeat -740px -183px;
}
