$(function() {
	var tabContentList = [];
	
	
	var tmp = $(".info-area").remove();
	var tabContent = $("<div>").addClass("tab-container");
	var tabHeader = $("<div>").addClass("tab-header");
	var tabArea = $("<div>").addClass("tab-area");
	var subMenus = $(".sub-menu");
	tabArea.append(tabHeader);
	tabArea.append(tabContent);
	
	var i=0;
	var selected = 0
	tmp.each(function() {
		
		var tab = $("<div>").addClass("tab tab-"+i);
		tab.append($(this).find("h2")).append($(this).find(".short-desc"));
		tab.data("tab-index",i);
		
		tab.mouseover(function() {
			showTab($(this).data("tab-index"))
		});
		
		tabContentList[i] = $(this).find(".tab-content");
		tabContentList[i].find(".col-right").append($(subMenus.get(i)).clone());
		tabHeader.append(tab);
		
		i++;
	});
	
	
	$("#content").append(tabArea);
	showTab(0);
	function showTab(i) {
		$(".tab-"+selected).removeClass("selected");
		$(".tab-"+i).addClass("selected");
		tabContent.empty();
		tabContent.append(tabContentList[i]);
		selected = i;
	}
	
});
