// variables to keep track of the previous state to change its color
			var strPrevColor = null;
			var intPrevIndex = -1;
// here we set up an array to house the associated pages and
			var NavArray = new Array(12);
			// insert your associated pages here in place of the #s
			NavArray[0]="login.php?page=join";
			NavArray[1]="index.php";
			NavArray[2]="index.php";
			NavArray[3]="index.php";
			NavArray[4]="index.php";
			NavArray[5]="index.php";
			NavArray[6]="index.php";
			NavArray[7]="index.php";
			NavArray[8]="login.php?page=aboutus";
			NavArray[9]="login.php?page=contact";
			NavArray[10]="index.php";
			NavArray[11]="login.php?page=forum";
//			NavArray[11]="/cancel.php";
//			NavArray[11]="/premium.php";
//			NavArray[13]="/account.php?action=chemail";
//			NavArray[14]="/account.php?action=chpwd";
//			NavArray[15]="/showfriend.php";
//			NavArray[16]="/showhot.php";
//			NavArray[17]="/uploadpic.php";
//			NavArray[18]="/managealbum.php";

			
			function MouseOverChangeClass(elem,strColor) {
				// don't bother to show the  rollover state if button is already clicked
				if (elem.className != strColor + "_click") {
					elem.className = strColor + "_over";
				}

			}
			
			function MouseOutChangeClass(elem, strColor) {
			// if button has been clicked, don't do anything, otherwise turn us off
				if (elem.className != strColor + "_click") {
					elem.className = strColor + "_off";
				}
			}
			
			function MouseClickChangeClassLaunch(elem, strColor) {
				// button has just been clicked, it needs to be set to the right state and
				//  previous clicked button turned off
				if (elem.id != intPrevIndex) {
					var i = elem.id;
					window.location = NavArray[i];
					elem.className = strColor + "_click";
					var strElemPrevId = intPrevIndex;
					if (intPrevIndex != -1) {
						var ElemPrev = document.getElementById(strElemPrevId);
						ElemPrev.className = strPrevColor + "_off";
					}
					intPrevIndex = i;
					strPrevColor = strColor;
				}
			}