$(document).ready(function () {
	
	$('#section-01').click( function() {
	
		
		$('.middle-section.active').slideUp('slow', function()
		 {
			$('.middle-section.01').slideDown('slow');
			
		});
		
		$('.middle-section').removeClass('active');
		$('.middle-section.01').addClass('active');
			
		$('#section-02').removeClass('active');
		$('#section-03').removeClass('active');
		$('#section-04').removeClass('active');
		
		$('#section-01').addClass('active');
		
	});
	$('#section-02').click( function() {
	
		
		$('.middle-section.active').slideUp('slow', function ()
		{
			$('.middle-section.02').slideDown('slow');
			
		});
		
		$('.middle-section').removeClass('active');
		$('.middle-section.02').addClass('active');
		
		$('#section-01').removeClass('active');
		$('#section-03').removeClass('active');
		$('#section-04').removeClass('active');
		
		$('#section-02').addClass('active');
		
	});
	$('#section-03').click( function() {
		
		
		$('.middle-section.active').slideUp('slow', function ()
		{
			$('.middle-section.03').slideDown('slow');
			
		});	
		
		$('.middle-section').removeClass('active');
		$('.middle-section.03').addClass('active');
		
		$('#section-02').removeClass('active');
		$('#section-01').removeClass('active');
		$('#section-04').removeClass('active');
		
		$('#section-03').addClass('active');
		
	});
	$('#section-04').click( function() {
		
		
		$('.middle-section.active').slideUp('slow', function()
		{
			
			$('.middle-section.04').slideDown('slow');
			
		});
		
		$('.middle-section').removeClass('active');
		$('.middle-section.04').addClass('active');
		
		$('#section-02').removeClass('active');
		$('#section-03').removeClass('active');
		$('#section-01').removeClass('active');
		
		$('#section-04').addClass('active');
		
	});
	
});