var hideTimer_1_1;
var hideTimer_1_2;
var hideTimer_2_1;
var hideTimer_2_2;
var hideTimer_5_1;
var hideTimer_5_2;
var hideTimer_5_2_1;
var hideTimer_10_1;
var hideTimer_10_2;

var firstY = 180;
var deltaX = 125;
var deltaY = 20;

var startPosX_1_1 = 0;
var endPosX_1_1 = startPosX_1_1 + deltaX;
var startPosY_1_1 = 180;
var endPosY_1_1 = startPosY_1_1;

var startPosX_1_2 = 0;
var endPosX_1_2 = startPosX_1_2 + deltaX;
var startPosY_1_2 = 180;
var endPosY_1_2 = startPosY_1_2 + deltaY;

var startPosX_2_1 = 0;
var endPosX_2_1 = startPosX_2_1 + deltaX;
var startPosY_2_1 = 200;
var endPosY_2_1 = startPosY_2_1;

var startPosX_2_2 = 0;
var endPosX_2_2 = startPosX_2_2 + deltaX;
var startPosY_2_2 = 200;
var endPosY_2_2 = startPosY_2_2 + deltaY;

var startPosX_5_1 = 0;
var endPosX_5_1 = startPosX_5_1 + deltaX;
var startPosY_5_1 = 260;
var endPosY_5_1 = startPosY_5_1;

var startPosX_5_2 = 0;
var endPosX_5_2 = startPosX_5_2 + deltaX;
var startPosY_5_2 = 260;
var endPosY_5_2 = startPosY_5_2 + deltaY;

var startPosX_5_2_1 = 125;
var endPosX_5_2_1 = startPosX_5_2_1 + deltaX;
var startPosY_5_2_1 = 280;
var endPosY_5_2_1 = startPosY_5_2_1;

var startPosX_10_1 = 0;
var endPosX_10_1 = startPosX_10_1 + deltaX;
var startPosY_10_1 = 360;
var endPosY_10_1 = startPosY_10_1;

var startPosX_10_2 = 0;
var endPosX_10_2 = startPosX_10_2 + deltaX;
var startPosY_10_2 = 360;
var endPosY_10_2 = startPosY_10_2 + deltaY;

function initNavigation()
{
	for(i = 1; i <= 10; i = i + 1)
	{
		for(j = 1; j <= 2; j = j + 1)
		{
			if(document.getElementById("Navigation_" + i + "_" + j))
			{
				document.getElementById("Navigation_" + i + "_" + j).style.left = deltaX * 0;
				document.getElementById("Navigation_" + i + "_" + j).style.top = 180 + (deltaY*(i-1));
			}
			for(k = 1; k <= 2; k = k + 1)
			{
				if(document.getElementById("Navigation_" + i + "_" + j + "_" + k))
				{
					document.getElementById("Navigation_" + i + "_" + j + "_" + k).style.left = deltaX * 1;
					document.getElementById("Navigation_" + i + "_" + j + "_" + k).style.top = 180 + (deltaY*(i-1)) + (deltaY*(j-1))
				}
			}
		}
	}
}

function reset(div, startPosX, startPosY)
{
	document.getElementById(div).className = "hidden";
	document.getElementById(div).style.left = startPosX;
	document.getElementById(div).style.top = startPosY;
}
function move(div, endPosX, endPosY)
{
	var timeoutPeriod = 50;
	if(parseInt(document.getElementById(div).style.left) < endPosX)
	{
		document.getElementById(div).style.left = parseInt(document.getElementById(div).style.left) + 25;
		setTimeout("move('" + div + "', '" + endPosX + "', '" + endPosY + "');", timeoutPeriod);
	}
	else if(parseInt(document.getElementById(div).style.top) < endPosY)
	{
		document.getElementById(div).style.top = parseInt(document.getElementById(div).style.top) + 5
		setTimeout("move('" + div + "', '" + endPosX + "', '" + endPosY + "');", timeoutPeriod);
	}
}
function makevisible(div)
{	
	document.getElementById(div).className = "visible";
	if(div == 'Navigation_1_1')
	{
		clearTimeout(hideTimer_1_1);
		if (parseInt(document.getElementById(div).style.left) == startPosX_1_1)
			move(div, endPosX_1_1, endPosY_1_1);
	}
	else if(div == 'Navigation_1_2')
	{
		clearTimeout(hideTimer_1_2);
		if (parseInt(document.getElementById(div).style.left) == startPosX_1_2)
			move(div, endPosX_1_2, endPosY_1_2);
	}
	else if(div == 'Navigation_2_1')
	{
		clearTimeout(hideTimer_2_1);
		if (parseInt(document.getElementById(div).style.left) == startPosX_2_1)
			move(div, endPosX_2_1, endPosY_2_1);
	}
	else if(div == 'Navigation_2_2')
	{
		clearTimeout(hideTimer_2_2);
		if (parseInt(document.getElementById(div).style.left) == startPosX_2_2)
			move(div, endPosX_2_2, endPosY_2_2);
	}
	else if(div == 'Navigation_5_1')
	{
		clearTimeout(hideTimer_5_1);
		if (parseInt(document.getElementById(div).style.left) == startPosX_5_1)
			move(div, endPosX_5_1, endPosY_5_1);
	}
	else if(div == 'Navigation_5_2')
	{
		clearTimeout(hideTimer_5_2);
		if (parseInt(document.getElementById(div).style.left) == startPosX_5_2)
			move(div, endPosX_5_2, endPosY_5_2);
	}
	else if(div == 'Navigation_5_2_1')
	{
		clearTimeout(hideTimer_5_2_1);
		if (parseInt(document.getElementById(div).style.left) == startPosX_5_2_1)
			move(div, endPosX_5_2_1, endPosY_5_2_1);
	}
	else if(div == 'Navigation_10_1')
	{
		clearTimeout(hideTimer_10_1);
		if (parseInt(document.getElementById(div).style.left) == startPosX_10_1)
			move(div, endPosX_10_1, endPosY_10_1);
	}
	else if(div == 'Navigation_10_2')
	{
		clearTimeout(hideTimer_10_2);
		if (parseInt(document.getElementById(div).style.left) == startPosX_10_2)
			move(div, endPosX_10_2, endPosY_10_2);
	}
}
function makehidden(div)
{
	var timeoutPeriod = 100
	if(div == 'Navigation_1_1')
		hideTimer_1_1 = setTimeout("reset('" + div + "', '" + startPosX_1_1 + "', '" + startPosY_1_1 + "');", timeoutPeriod);
	else if(div == 'Navigation_1_2')
		hideTimer_1_2 = setTimeout("reset('" + div + "', '" + startPosX_1_2 + "', '" + startPosY_1_2 + "');", timeoutPeriod);
	else if(div == 'Navigation_2_1')
		hideTimer_2_1 = setTimeout("reset('" + div + "', '" + startPosX_2_1 + "', '" + startPosY_2_1 + "');", timeoutPeriod);
	else if(div == 'Navigation_2_2')
		hideTimer_2_2 = setTimeout("reset('" + div + "', '" + startPosX_2_2 + "', '" + startPosY_2_2 + "');", timeoutPeriod);
	else if(div == 'Navigation_5_1')
		hideTimer_5_1 = setTimeout("reset('" + div + "', '" + startPosX_5_1 + "', '" + startPosY_5_1 + "');", timeoutPeriod);
	else if(div == 'Navigation_5_2')
		hideTimer_5_2 = setTimeout("reset('" + div + "', '" + startPosX_5_2 + "', '" + startPosY_5_2 + "');", timeoutPeriod);
	else if(div == 'Navigation_5_2_1')
		hideTimer_5_2_1 = setTimeout("reset('" + div + "', '" + startPosX_5_2_1 + "', '" + startPosY_5_2_1 + "');", timeoutPeriod);
	else if(div == 'Navigation_10_1')
		hideTimer_10_1 = setTimeout("reset('" + div + "', '" + startPosX_10_1 + "', '" + startPosY_10_1 + "');", timeoutPeriod);
	else if(div == 'Navigation_10_2')
		hideTimer_10_2 = setTimeout("reset('" + div + "', '" + startPosX_10_2 + "', '" + startPosY_10_2 + "');", timeoutPeriod);
}
function highlight(div)
{
	div.style.backgroundColor = "#000064";
	div.style.color = "#FFFFFF";
}
function lowlight(div)
{
	div.style.backgroundColor = "#FFCC00";
	div.style.color = "#000064";
}