//Adjusts the column container's height => displays the columns
//separators right, depeniding on the columns heights.
function fixColumnsHeights()
{
	//Initial heights of the content container block and the column container
	//and the default value of the columns. Need this to adjust the heights
	//of all elements in respect to the heights of the columns.
	var CONTENT_CONTAINER = 530;
	var COLUMN_CONTAINER = 201;
	var COLUMN = 170;
	var PADDING_COL_CONTAINER = 11;
	var PADDING_CONT_CONTAINER = 30;
	
	//The highest column will determine the height of the columns container
	var highest = 0;
	
	var body_ = document.getElementById("body");
	var container = document.getElementById("column_container");
	var col1 = document.getElementById("col1");
	var col2 = document.getElementById("col2");
	var col3 = document.getElementById("col3");
	
	//Array to store the heights of the columns
	var nums = new Array()
	nums[0] = col1.scrollHeight;
	nums[1] = col2.scrollHeight;
	nums[2] = col3.scrollHeight;
	
	for(var i=0;i<3;i++)
	{
		if(nums[i] > highest) highest = nums[i];
	}
	
	if(detectBrowser() == "Microsoft Internet Explorer")
	{
		col1.style.height = highest+"px"
		col2.style.height = highest+"px"
		col3.style.height = highest+"px"
	}
	else
	{
		col1.style.setProperty("height",highest+"px","");
		col2.style.setProperty("height",highest+"px","");
		col3.style.setProperty("height",highest+"px","");
		
		/* All except IE render this "correctly" and therefore
		we don't see the expected result. That's why we have to make a few
		more adjustments. */
		
		/* Adjust the height of the content container and the column container */
		var bodyHeight = (highest - COLUMN) + CONTENT_CONTAINER + PADDING_CONT_CONTAINER;
		var columnContainerHeight = (highest - COLUMN) + COLUMN_CONTAINER - PADDING_COL_CONTAINER;
		
		body_.style.setProperty("height",bodyHeight+"px","");
		container.style.setProperty("height",columnContainerHeight+"px","");
	}
}

//Adjusts the column container's height => displays the columns
//separators right, depeniding on the columns heights.
function fixColumnsHeights_main()
{
	//Initial heights of the content container block and the column container
	//and the default value of the columns. Need this to adjust the heights
	//of all elements in respect to the heights of the columns.
	var CONTENT_CONTAINER = 530;
	var COLUMN_CONTAINER = 201;
	var COLUMN = 170;
	var PADDING_COL_CONTAINER = 11;
	var PADDING_CONT_CONTAINER = 30;
	
	//The highest column will determine the height of the columns container
	var highest = 0;
	
	var body_ = document.getElementById("body");
	var container = document.getElementById("column_container");
	var col1 = document.getElementById("col1");
	var col2 = document.getElementById("col2");
	
	//Array to store the heights of the columns
	var nums = new Array()
	nums[0] = col1.scrollHeight;
	nums[1] = col2.scrollHeight;
	
	for(var i=0;i<2;i++)
	{
		if(nums[i] > highest) highest = nums[i];
	}
	
	if(detectBrowser() == "Microsoft Internet Explorer")
	{
		col1.style.height = highest+"px"
		col2.style.height = highest+"px"
	}
	else
	{
		col1.style.setProperty("height",highest+"px","");
		col2.style.setProperty("height",highest+"px","");
		
		/* All except IE render this "correctly" and therefore
		we don't see the expected result. That's why we have to make a few
		more adjustments. */
		
		/* Adjust the height of the content container and the column container */
		var bodyHeight = (highest - COLUMN) + CONTENT_CONTAINER + PADDING_CONT_CONTAINER;
		var columnContainerHeight = (highest - COLUMN) + COLUMN_CONTAINER - PADDING_COL_CONTAINER;
		
		body_.style.setProperty("height",bodyHeight+"px","");
		container.style.setProperty("height",columnContainerHeight+"px","");
	}
}

//Adjusts the column container's height => displays the columns
//separators right, depeniding on the columns heights.
function fixColumnsHeights_alt()
{
	//Initial heights of the content container block and the column container
	//and the default value of the columns. Need this to adjust the heights
	//of all elements in respect to the heights of the columns.
	var CONTENT_CONTAINER = 0;
	var COLUMN_CONTAINER = 0;
	var COLUMN = 0;
	var PADDING_COL_CONTAINER = 0;
	var PADDING_CONT_CONTAINER = 0;
	
	//The highest column will determine the height of the columns container
	var highest = 0;
	
	var body_ = document.getElementById("body");
	var container = document.getElementById("column_container");
	var col1 = document.getElementById("leftPartHolder");
	var col2 = document.getElementById("rightPartHolder");
	
	//Array to store the heights of the columns
	var nums = new Array()
	nums[0] = col1.scrollHeight;
	nums[1] = col2.scrollHeight;
	
	for(var i=0;i<2;i++)
	{
		if(nums[i] > highest) highest = nums[i];
	}
		
	if (highest < 478) {
		highest = 478;
	}
	
	if(detectBrowser() == "Microsoft Internet Explorer")
	{
		col1.style.height = highest+"px"
		col2.style.height = highest+"px"
	}
	else
	{
		col1.style.setProperty("height",highest+"px","");
		col2.style.setProperty("height",highest+"px","");
		
		/* All except IE render this "correctly" and therefore
		we don't see the expected result. That's why we have to make a few
		more adjustments. */
		
		/* Adjust the height of the content container and the column container */
		var bodyHeight = (highest - COLUMN) + CONTENT_CONTAINER + PADDING_CONT_CONTAINER;
		var columnContainerHeight = (highest - COLUMN) + COLUMN_CONTAINER - PADDING_COL_CONTAINER;
		
		//body_.style.setProperty("height",bodyHeight+"px","");
		//container.style.setProperty("height",columnContainerHeight+"px","");
	}
}


/*	Detects the browser */
function detectBrowser()
{
	var browser=navigator.appName;
	return browser;
}

