/* link heights corresponds with image height */
.navButton, .navButton:visited 
		{
        height:397px;
        position:relative !important;
        }

/* link and list-item widths correspond with image widths */
#activities, #activitiesButton, #activitiesButton:visited 
		{
        width:201px;
        }
#programs, #programsButton, #programsButton:visited 
		{
        width:200px;
        }
#instructor, #instructorButton, #instructorButton:visited 
		{
        width:203px;
        }

        
/* span is same dimensions as link and positioned to superimpose */
.navButton span, .navButton:visited span 
		{
        display:block;
        height:397px;
        width:100%;
        position:absolute;
        left:0;
        top:0;
        z-index:1;
        background-repeat:no-repeat;
        }
        
/* button images are span background images */
#activitiesButton span, #activitiesButton:visited span 
		{
        background-image:url(http://www.horse-power.org/static/images/home/nav/nav-activitiesx201.gif);
        }
        
#programsButton span, #programsButton:visited span 
		{
        background-image:url(http://www.horse-power.org/static/images/home/nav/nav-programsx200.gif);
        }
        
#instructorButton span, #instructorButton:visited span 
		{
        background-image:url(http://www.horse-power.org/static/images/home/nav/nav-instructorx203.gif);
        }


        
/* rollovers are background position so that no preloading is necessary */
.navButton span, .navButton:visited span 
		{
		background-position: 0 0;
		}

.navButton:hover span, .navButton:focus span, .navButton:visited:hover span, .navButton.udmR span, .navButton.udmR:visited span, .navButton:active span 
			{
			background-position: 0 -397px;
			}