/***************************/
				
/***************************/

	
$(document).ready(function() {

	$('.showme').fadeOut(1);
	$('#tabcoding').fadeOut(10);
	$('#tab1').fadeIn(1000);
	$('.tab1').addClass('active');
	$('#tab1').addClass('active');
	
	$('#tabweb').addClass('active');
	
	$('#filter .web').addClass('active');
	
	$('.web').click(function() {
		$('#filter').find('.active').removeClass('active');
		$('#filter .web').addClass('active');
		$("#containerwerk div.active").fadeOut( 10, function(){
			$('#containerwerk').removeClass('active');
			$('#tabweb').addClass('active');
			$('#tabweb').fadeIn(500);
		});
	});
	
	$('.coding').click(function() {
		$('#filter').find('.active').removeClass('active');
		$('#filter .coding').addClass('active');
		$("#containerwerk div.active").fadeOut( 10, function(){
			$('#containerwerk').removeClass('active');
			$('#tabcoding').addClass('active');
			$('#tabcoding').fadeIn(500);
		});
	});
	
	$('.project').hover(function(){  
	  $(this).children('.showme').fadeIn(100)}  
	  , function(){  
	  $(this).children('.showme').fadeOut();
	}); 

	$('.bekijkproject').hover(function(){  
		$('.bekijkproject').stop().animate({"left": '10px'}, 100)}  
	  , function(){  
	  $('.bekijkproject').stop().animate({"left": '0px'}, 100); 
	});  


  

	$('.tab1').click(function() {
		$('.paging a').removeClass('active');
		$('.tab1').addClass('active');
		$("#containergallery div.active").fadeOut( 300, function(){
			$("#tab1").fadeIn(300);
			$('#containergallery .active').removeClass('active');
			$('#tab1').addClass('active');
			$('.tab1').addClass('active');
		});
	});

	$('.tab2').click(function() {
		$('.paging a').removeClass('active');
		$('.tab2').addClass('active');
		$("#containergallery div.active").fadeOut( 300, function(){
			$("#tab2").fadeIn(300);
			$('#containergallery .active').removeClass('active');
			$('#tab2').addClass('active');
			$('.tab2').addClass('active');
		});
	});
	
	$('.tab3').click(function() {
		$('.paging a').removeClass('active');
		$('.tab3').addClass('active');
		$("#containergallery div.active").fadeOut( 300, function(){
			$("#tab3").fadeIn(300);
			$('#containergallery .active').removeClass('active');
			$('#tab3').addClass('active');
			$('.tab3').addClass('active');
		});
	});
	
	
	

});