$(document).ready(function() {
	//Set first tab in each box to 'active'
	$("ul#Attendees.BoxTabs li:first").addClass('active');
	$("ul#Exhibitors.BoxTabs li:first").addClass('active');
	$("ul#Spotlight.BoxTabs li:first").addClass('active');
	
	//Load initial content into areas
	var InitialAttendees = $("ul#Attendees.BoxTabs li:first div.Content").html();
	var InitialExhibitors = $("ul#Exhibitors.BoxTabs li:first div.Content").html();
	var InitialSpotlight = $("ul#Spotlight.BoxTabs li:first div.Content").html();
	$("#AttendeesArea .Content").html(InitialAttendees);
	$("#ExhibitorsArea .Content").html(InitialExhibitors);
	$("#SpotlightArea .Content").html(InitialSpotlight);
	
	
	//Click events for tab list
	$("ul.BoxTabs li").click(function switchTab(){ 
		if ($(this).is(".active")) {  //If it's already active, then...
			return false; // Don't change anything
		}
		else {
			//Set variables
			var theBox = $(this).parent().attr("id"); //Get the ID of the box to change
			var theArea = theBox + "Area"; //Get the box to change
			var theContent = $(this).find(".Content").html(); //Get HTML of content
		
			//Change the content
			$("#" + theArea + " .Content").html(theContent);
			
			// Animation?
			//$("#" + theArea + " .Content").animate({ opacity: 1 }, 100 , function(){
				//$("#" + theArea + " .Content").html(theContent).animate({ opacity: 1 }, 250 );
			//});
			
			//Change tab styling
			$("ul#" + theBox + ".BoxTabs li").removeClass('active'); //Remove class of 'active' on all tabs
			$(this).addClass('active');  //Add class of 'active' on this tab only
		}
		
		return false;
	});
	
}); //Close Function