/* primary navigation */
#nav {position: relative; margin: 0 auto; width: 100px; height: 80px;} /* change height to 100px when turning on 5th link */
#nav li {position: absolute; top: 0; background: url(../images/global/nav.gif) 0 0 no-repeat; display: block; list-style: none;}
#nav a {display: block; border: 0;}
#nav a:hover {border: 0;}
#nav #box1 {top: 0; background-position: -100px 0; width: 100px; height: 20px;}
#nav #box2 {top: 20px; background-position: -100px -20px; width: 100px; height: 20px;}
#nav #box3 {top: 40px; background-position: -100px -40px; width: 100px; height: 20px;}
#nav #box4 {top: 60px; background-position: -100px -60px; width: 100px; height: 20px;}
#nav #box5 {top: 80px; background-position: -100px -80px; width: 100px; height: 20px;}
#nav #box1 a:hover {background: url(../images/global/nav.gif) -200px 0 no-repeat;}
#nav #box2 a:hover {background: url(../images/global/nav.gif) -200px -20px no-repeat;}
#nav #box3 a:hover {background: url(../images/global/nav.gif) -200px -40px no-repeat;}
#nav #box4 a:hover {background: url(../images/global/nav.gif) -200px -60px no-repeat;}
#nav #box5 a:hover {background: url(../images/global/nav.gif) -200px -80px no-repeat;}
#nav #box1on {top: 0; background-position: 0 0; width: 100px; height: 20px;}
#nav #box2on {top: 20px; background-position: 0 -20px; width: 100px; height: 20px;}
#nav #box3on {top: 40px; background-position: 0 -40px; width: 100px; height: 20px;}
#nav #box4on {top: 60px; background-position: 0 -60px; width: 100px; height: 20px;}
#nav #box5on {top: 80px; background-position: 0 -80px; width: 100px; height: 20px;}