$(document).ready(function(){	
	$('.bar').hide();
	//$('dd.class'+linkIdNumber).css("background-color","#ffffff");
	// on hover 
	$('.person').hover(function () {
		// extract the identifier number from the link's id
		var linkId 			= $(this).attr('id');
		var linkIdNumber 	= linkId;
		// hide all the images
		$('.bar').hide();
		//$('dd.class'+linkIdNumber).css("background-color","#ffffff");
		//show the new img
		$('#colorbar'+linkIdNumber).show();
		$('a.class'+linkIdNumber).css({'background-color':'#550800', 'color':'#ffffff'});
      },
      
           
  	  function () {
  	  	var linkId 			= $(this).attr('id');
		var linkIdNumber 	= linkId;
      	$('.bar').hide();
      	$('a.class'+linkIdNumber).css({"background-color":"#ffffff","color":"#333333"});
  	  });
  	  
  	 
  	  $("#360").click(function() 
    {
            $("#illo").css("visibility","hidden");
            $("#mov").css("visibility","visible");
            $("#illo-views").css("visibility","hidden");
            $("#close").css("display","block");
    });  

	$("#close").click(function() 
    {
            $("#illo").css("visibility","visible");
            $("#mov").css("visibility","hidden");
            $("#illo-views").css("visibility","visible");
            $("#close").css("display","none");
     });
  	  
});