/* link heights corresponds with image height */
.navButton, .navButton:visited {
	height:27px;
	position:relative !important;
	vertical-align:bottom;
	}
	

/* link and list-item widths correspond with image widths */
#services, #servicesButton, #servicesButton:visited {
	width:139px;
	}
#applications, #applicationsButton, #applicationsButton:visited {
	width:139px;
	}
#aboutus, #aboutusButton, #aboutusButton:visited {
	width:94px;
	}
#contactus, #contactusButton, #contactusButton:visited {
	width:139px;
	}
	
/* span is same dimensions as link and positioned to superimpose */
.navButton span, .navButton:visited span {
	display:block;
	height:28px;
	width:100%;
	position:absolute;
	left:0;
	top:0;
	z-index:1;
	background-repeat:no-repeat;
	}	
	
.activeButton span, .activeButton:visited span {
	display:block;
	height:28px;
	width:100%;
	position:absolute;
	left:0;
	top:0;
	z-index:1;
	background-repeat:no-repeat;
	}	
	
/* button images are span background images */
#servicesButton span, #servicesButton:visited span {
	background-image:url(/images/nav_ourservices.gif);
	}

#applicationsButton span, #applicationsButton:visited span {
	background-image:url(/images/nav_applications.gif);
	}

#aboutusButton span, #aboutusButton:visited span {
	background-image:url(/images/nav_aboutus.gif);
	}	
	
#contactusButton span, #contactusButton:visited span {
	background-image:url(/images/nav_contactus.gif);
	}	


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

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

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