$(document).ready(function() {	

  //Get all the LI from the #tabMenu UL
  $('#content-left > h2.eventtop').addClass('eventaktiv');
  $('#content-left > h2').click(function(){
  
    //remove the selected class from all LI    
    $('#content-left > h2').removeClass('eventaktiv');
    
    //Reassign the LI
    $(this).addClass('eventaktiv');
    
    //Hide all the DIV in .boxBody
    $('#content-center-start div').slideUp('1500');
    
    //Look for the right DIV in boxBody according to the Navigation UL index, therefore, the arrangement is very important.
    $('#content-center-start div:eq(' + $('#content-left > h2').index(this) + ')').slideDown('1500');
    
  }).mouseover(function() {

    //Add and remove class, Personally I dont think this is the right way to do it, anyone please suggest    
    $(this).addClass('mouseover');
    $(this).removeClass('mouseout');   
    
  }).mouseout(function() {
    
    //Add and remove class
    $(this).addClass('mouseout');
    $(this).removeClass('mouseover');    
    
  });


	
});

$(document).ready(function(){

	$(".button-slide").click(function(){
		$("#panel").slideToggle("fast");
		$(this).toggleClass("active"); return false;
	});
	
	 
});
