function changeDiv(the_div, the_change) {
  var the_style = getStyleObject(the_div);
  if (the_style != false)
  {
  	changeObjectDisplay(the_div, the_change);
  }
}

// function getStyleObject(string) -> returns style object
//  given a string containing the id of an object
//  the function returns the stylesheet of that object
//  or false if it can't find a stylesheet.  Handles
//  cross-browser compatibility issues.
//
function getStyleObject(objectId) {
  // checkW3C DOM, then MSIE 4, then NN 4.
  //
  if(document.getElementById && document.getElementById(objectId)) {
	return document.getElementById(objectId).style;
   }
   else if (document.all && document.all(objectId)) {
	return document.all(objectId).style;
   }
   else if (document.layers && document.layers[objectId]) {
	return document.layers[objectId];
   } else {
	return false;
   }
}

function changeObjectDisplay(objectId, newDisplay) {
    // first get a reference to the cross-browser style object
    // and make sure the object exists
    var styleObject = getStyleObject(objectId);
    if(styleObject) {
	styleObject.display = newDisplay;
	return true;
    } else {
	// we couldn't find the object, so we can't change its visibility
	return false;
    }
}

function HoverCell(the_cell,the_change)
{
  var the_style2 = getStyleObject(the_cell);
  if (the_style2 != false)
  {
    the_style2.background = the_change;
  }
}

var divArray = new Array(8)
divArray[0] = "DivA"
divArray[1] = "DivB"
divArray[2] = "DivC"
divArray[3] = "DivD"
divArray[4] = "DivE"
divArray[5] = "DivF"
divArray[6] = "DivG"
divArray[7] = "DivH"

function hideAll(div_id) {
  for (i = 0; i <= 7; i++) {
  	if (divArray[i]!=div_id) {
  		changeDiv(divArray[i],"none");
  	} else {
  		changeDiv(divArray[i],"block");
  	}
  }
}

function loadPage(div_id){
	changeElementsStyleByClass('a','id',sMainNav,'#003366');
	changeElementsStyleByClass('a','id',sSubNav,'#663300');
	hideAll(div_id)
}

function changeElementsStyleByClass(myElementName,myNodeName,myNodeValue,myNewColor){	//changes the properties of the designated class
if(document.getElementsByTagName)//check that browser supports object method
   {
   var nodes = document.getElementsByTagName(myElementName)  //find all the elements of type element name - these are 'items'
   var max = nodes.length	//count them
   for(var i = 0;i < max;i++)	//for each item
      {
      var nodeObj = nodes.item(i);
      var attrMax = nodeObj.attributes.length	//find out how long it is
      for(var j = 0; j < attrMax; j++)	//for each of its attributes (these are numerous - all the attributes this kind of element can have)
         {
          if(nodeObj.attributes.item(j).nodeName == myNodeName)  //look for the attribute element, if there is one
             {
            if(nodeObj.attributes.item(j).nodeValue == myNodeValue)		//and the attribute is of the specific type we want to change
             nodeObj.style.color = myNewColor;	//change the attribute to the newclass we specify
             }
         }
      }
   }
}