$(document).ready(function() {
	
	//Random header Image
	bgImageTotal=12;
	randomNumber = Math.round(Math.random()*(bgImageTotal-1))+1;
	imgPath=('/images/hdr_main'+randomNumber+'.jpg');
	
	$("#headerContainer").css('background-image', ('url("'+imgPath+'")'));
	$("#close").hide();
	
 	// initialize scrollable 
	$("div.scrollable").scrollable().mousewheel();
	
	//onClick of product image buttons
	$("a.prod").click(function(){
		var thisButton = ("productpanes/" + $(this).children().attr("rel") + ".html");
		$('#productDiv').css('background-image','url(images/headerInner.gif)');
		$('#productDiv').load(thisButton);
		$("#close").show();
	});
	
	//onClick of brand image buttons
	$("a.brand").click(function(){
		var thisButton = ("brandpanes/" + $(this).children().attr("rel") + ".html");
		$('#productDiv').css('background-image','url(images/headerInner.gif)');
		$('#productDiv').load(thisButton);
		$("#close").show();
	});
	
	$("#close").click(function(){
		$("#productDiv").css("background-image", "none");
		$(".prodPane").addClass("hidden");
		$("#close").hide();
		return false;
	});
	
	// product/brand tabs
	$(".tab_content_pb").hide(); //Hide all tab content
	$("#header ul.tabs li:first").addClass("active").show(); //Activate first tab
	$(".tab_content_pb:first").show(); //Show first tab content

	$("#header ul.tabs li").click(function() {
		$("#header ul.tabs li").removeClass("active"); //Remove "active" class
		$(this).addClass("active"); //Add "active" class to selected tab
		$(".tab_content_pb").hide(); //Hide all tab content

		var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
		$(activeTab).fadeIn(); //Fade in the active ID content
		return false;
	});
	
	// left column tabs
	$(".tab_content_w").hide(); //Hide all tab content
	$("div.w ul.tabs li:first").addClass("active").show(); //Activate first tab
	$(".tab_content_w:first").show(); //Show first tab content

	$("div.w ul.tabs li").click(function() {
		$("div.w ul.tabs li").removeClass("active"); //Remove "active" class
		$(this).addClass("active"); //Add "active" class to selected tab
		$(".tab_content_w").hide(); //Hide all tab content

		var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
		$(activeTab).fadeIn(); //Fade in the active ID content
		return false;
	});
	
	// right column tabs
	$(".tab_content_e").hide(); //Hide all tab content
	$("div.e ul.tabs li:first").addClass("active").show(); //Activate first tab
	$(".tab_content_e:first").show(); //Show first tab content

	$("div.e ul.tabs li").click(function() {
		$("div.e ul.tabs li").removeClass("active"); //Remove "active" class
		$(this).addClass("active"); //Add "active" class to selected tab
		$(".tab_content_e").hide(); //Hide all tab content

		var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
		$(activeTab).fadeIn(); //Fade in the active ID content
		return false;
	});
	
	// local column tabs
	$(".tab_content_e").hide(); //Hide all tab content
	$("#local ul.tabs li:first").addClass("active").show(); //Activate first tab
	$(".tab_content_e:first").show(); //Show first tab content

	$("#local ul.tabs li").click(function() {
		$("#local ul.tabs li").removeClass("active"); //Remove "active" class
		$(this).addClass("active"); //Add "active" class to selected tab
		$(".tab_content_e").hide(); //Hide all tab content

		var activeTab = $(this).find("a").attr("href"); //Find the href attribute value to identify the active tab + content
		$(activeTab).fadeIn(); //Fade in the active ID content
		return false;
	});

});