addLoadListener(equalHeight);
window.onresize= resizehandler;


function resizehandler() {
  //alert("The window has been resized!");  
  resetwidth('ctl07_ctl00_SpotsBox1','ctl07_ctl01_SpotsBox3','ctl07_ctl02_SpotsBox5');
  resetwidth('ctl07_ctl03_SpotsBox2','ctl07_ctl04_SpotsBox4','ctl07_ctl05_SpotsBox6');  
  resetheight('ctl07_ctl00_SpotsBox1','ctl07_ctl01_SpotsBox3','ctl07_ctl02_SpotsBox5');
  resetheight('ctl07_ctl03_SpotsBox2','ctl07_ctl04_SpotsBox4','ctl07_ctl05_SpotsBox6');
  document.location.reload(true);
  var browser=navigator.appName;
  if (browser != "Microsoft Internet Explorer") {
	equalHeight();  
  }
}
function resetwidth(LeftColID, MidColID, RightColID) {
var tempstring1 = LeftColID.substring(12)  + "OuterContainer";
var tempstring2 = MidColID.substring(12)  + "OuterContainer";
var tempstring3 = RightColID.substring(12)  + "OuterContainer";
var myLeftColumn = document.getElementById(tempstring1);
var myMidColumn = document.getElementById(tempstring2);
var myRightColumn = document.getElementById(tempstring3);
myLeftColumn.style.width = "" ;
myRightColumn.style.width = "";
myMidColumn.style.width = "";
}

function resetheight(LeftColID, MidColID, RightColID) {
var myLeftColumn = document.getElementById(LeftColID);
var myMidColumn = document.getElementById(MidColID);
var myRightColumn = document.getElementById(RightColID);
myLeftColumn.style.height = "" ;
myRightColumn.style.height = "";
myMidColumn.style.height = "";
}

function equalHeight() {
var screenconstants = 800;
var screenwidth = getwidth ();
var d = document;

//alert ('equalheight');
if (screenwidth <= screenconstants) {
	var animationimage = document.getElementById("AnimationImage");
	//alert (' screenwidth < 800 ? image width = ' + animationimage.style.width  + ' screenwidth = ' + screenwidth);
	animationimage.style.width = screenconstants;
	//alert (animationimage.style.width);
}
else {
	var animationimage = document.getElementById("AnimationImage");
	//alert ('screenwidth > 800 ?  image width = ' + animationimage.style.width  + ' screenwidth = ' + screenwidth);
	animationimage.style.width = "100%";
	//alert (animationimage.style.width);
}
var min = equalWidth('ctl07_ctl00_SpotsBox1','ctl07_ctl01_SpotsBox3','ctl07_ctl02_SpotsBox5', 0);
equalColumns('ctl07_ctl00_SpotsBox1','ctl07_ctl01_SpotsBox3','ctl07_ctl02_SpotsBox5');
equalWidth('ctl07_ctl03_SpotsBox2','ctl07_ctl04_SpotsBox4','ctl07_ctl05_SpotsBox6', min);
equalColumns('ctl07_ctl03_SpotsBox2','ctl07_ctl04_SpotsBox4','ctl07_ctl05_SpotsBox6');
}


function equalWidth(LeftColID, MidColID, RightColID, min) {
var tempstring1 = LeftColID.substring(12)  + "OuterContainer";
var tempstring2 = MidColID.substring(12)  + "OuterContainer";
var tempstring3 = RightColID.substring(12)  + "OuterContainer";
//alert ('ids = ' + tempstring1 + ',' + tempstring2 + ',' + tempstring3);

var myLeftColumn = document.getElementById(tempstring1);
var myMidColumn = document.getElementById(tempstring2);
var myRightColumn = document.getElementById(tempstring3);

//alert ('LeftColID, MidColID, RightColID = ' + LeftColID + MidColID + RightColID);

var myLeftWidth = myLeftColumn.offsetWidth;
var myMidWidth = myMidColumn.offsetWidth;
var myRightWidth = myRightColumn.offsetWidth;
var Lowest = GetLowest(myLeftWidth, myMidWidth, myRightWidth);
if (min > 0) {
  if (Lowest > min) {
  	Lowest = min
  }
}
//alert('leftWidth = ' + myLeftWidth + ' right Width = ' + myRightWidth + 'mid Width = ' + myMidWidth);
//alert ('Lowest = ' + Lowest);

myLeftColumn.style.width = Lowest + "px" ;
myRightColumn.style.width = Lowest + "px";
myMidColumn.style.width = Lowest + "px";
return (Lowest);
}


function equalColumns(LeftColID, MidColID, RightColID) {
var tempstring1 = LeftColID.substring(12) + "InnerContainer";
var tempstring2 = MidColID.substring(12) + "InnerContainer";
var tempstring3 = RightColID.substring(12) + "InnerContainer";
//alert ('ids = ' + tempstring1 + ',' + tempstring2 + ',' + tempstring3);



var myLeftColumn = document.getElementById(tempstring1);
var myMidColumn = document.getElementById(tempstring2);
var myRightColumn = document.getElementById(tempstring3);

var myLeftColumn_2 = document.getElementById(LeftColID);
var myMidColumn_2 = document.getElementById(MidColID);
var myRightColumn_2 = document.getElementById(RightColID);

//alert ('LeftColID, MidColID, RightColID = ' + LeftColID + MidColID + RightColID);

var myLeftHeight = myLeftColumn.offsetHeight;
var myMidHeight = myMidColumn.offsetHeight;
var myRightHeight = myRightColumn.offsetHeight;
var Highest = GetHighest(myLeftHeight, myMidHeight, myRightHeight);

//alert('leftheight = ' + myLeftHeight + ' right height = ' + myRightHeight + 'mid height = ' + myMidHeight);
//alert ('Highest = ' + Highest);

//myLeftColumn.style.height = Highest + "px" ;
//myRightColumn.style.height = Highest + "px";
//myMidColumn.style.height = Highest + "px";

//alert('offsetheights = ' + myLeftColumn_2.offsetHeight  + ' ' + myMidColumn_2.offsetHeight  + ' ' + myRightColumn_2.offsetHeight );
if (correctdiff(Highest - myRightHeight) >= 0) {
 myRightColumn_2.style.height = (myRightColumn_2.offsetHeight + correctdiff(Highest - myRightHeight) ) + "px";}
if (correctdiff(Highest - myMidHeight) >= 0) {
 myMidColumn_2.style.height = (myMidColumn_2.offsetHeight + correctdiff(Highest - myMidHeight)) + "px";}
if (correctdiff(Highest - myLeftHeight) >= 0) {
 myLeftColumn_2.style.height = (myLeftColumn_2.offsetHeight + correctdiff(Highest - myLeftHeight)) + "px";}
// myLeftColumn_2.style.height = (myLeftColumn_2.offsetHeight + 4) + "px";}

}


function GetHighest(myLeftHeight, myMidHeight, myRightHeight)
{
	var Highest;
	if (myLeftHeight >= myRightHeight) 	{
		if (myLeftHeight >= myMidHeight) {
			Highest = myLeftHeight;
		}
		else {

			Highest = myMidHeight;

		}
	}
	else
	{
		if (myRightHeight >= myMidHeight) {
			Highest = myRightHeight;
		}
		else {
			Highest = myMidHeight;

		}
	}
	return Highest;
}

function GetLowest(myLeftHeight, myMidHeight, myRightHeight)
{
	var Lowest;
	if (myLeftHeight <= myRightHeight) 	{
		if (myLeftHeight <= myMidHeight) {
			Lowest = myLeftHeight;
		}
		else {

			Lowest = myMidHeight;

		}
	}
	else
	{
		if (myRightHeight <= myMidHeight) {
			Lowest = myRightHeight;
		}
		else {
			Lowest = myMidHeight;

		}
	}
	return Lowest;
}


function correctdiff(diff)
{
	var browser=navigator.appName;
	if (browser == "Microsoft Internet Explorer")
	{
//		alert('IE subtract -> = ' + diff);
		if (diff > 10){
			return(diff);
		} else {
			return(diff);
		}
	}
	return diff;
}



function retrieveComputedStyle(element, styleProperty)
{
		var computedStyle = null;

		if (typeof element.currentStyle != "undefined")
		{
			computedStyle = element.currentStyle;
		}
		else
		{
			computedStyle = document.defaultView.getComputedStyle(element, null);
		}
//		alert ('style property = ' + styleProperty + ' ' + computedStyle[styleProperty]);
		return computedStyle[styleProperty];
}

function addLoadListener(fn)
{
	if (typeof window.addEventListener != 'undefined')
	{
	window.addEventListener('load', fn, false);
}
else if (typeof document.addEventListener != 'undefined')
{
	document.addEventListener('load', fn, false);
}
else if (typeof window.attachEvent != 'undefined')
{
	window.attachEvent('onload', fn);	
}
else
{
	var oldfn = window.onload;
	if (typeof window.onload != 'function')
	{
	window.onload = fn;
	}
	else
	{
	window.onload = function()
	{
	oldfn();
	fn();
	};
	}
	}
}

function getwidth () {

var viewportwidth;
var viewportheight;

 // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight

 if (typeof window.innerWidth != 'undefined')
 {
      viewportwidth = window.innerWidth;
      viewportheight = window.innerHeight;
 }

// IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document)

 else if (typeof document.documentElement != 'undefined'
     && typeof document.documentElement.clientWidth !=
     'undefined' && document.documentElement.clientWidth != 0)
 {
       viewportwidth = document.documentElement.clientWidth;
       viewportheight = document.documentElement.clientHeight;
 }

 // older versions of IE

 else
 {
       viewportwidth = document.getElementsByTagName('body')[0].clientWidth;
       viewportheight = document.getElementsByTagName('body')[0].clientHeight;
 }
// alert ('viewport width/height = ' + viewportwidth + ' , ' + viewportheight);
return viewportwidth;
}

