/**
These classes are for image replacement in navigational elements
The widths should be placed in the specialised stylesheet for the particular website

each navigation element is given the name navX where x starts at 1 and goes up eg nav1, nav2

Images for link, hover and active are named navX.gif, navX-hover.gif and navX-active.gif

**/

.ir a {
	display:block;
	text-indent:-9999px;
}

.ir {
	background:#faf3ec url(nav.gif) top left no-repeat;
}

.ir a:hover {
	background:#faf3ec url(nav-hover.gif) top left no-repeat;
}

.ir a.active {
	background:#faf3ec url(nav-active.gif) top left no-repeat;
}


/** The three items below need to be changed depending on the height of each item in the nav **/
.ir a {
	height:30px;
}

#nav2:hover, #nav2.active {
	background-position:0 -30px;
}

#nav3:hover,#nav3.active {
	background-position:0 -60px;
}
/** End of the three items that need to be adjusted **/