$(document).ready(function(){
         $('#top-left').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '150px', 'left' : '300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		  $('#top-center').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '150px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#bottom-center').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '-150px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#left').hover(function(){
		         $(this).children('.front').stop().animate({'left' : '300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#right').hover(function(){
		         $(this).children('.front').stop().animate({'left' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#top-right').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '150px','left' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#top-up').hover(function(){
		         $(this).children('.front').stop().animate({'left' : '150px','top' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'left' : '4px', 'top' : '4px'}, 500);});
		  $('#top-down').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'left' : '4px', 'top' : '4px'}, 500);});
		 $('#top-als').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '150px', 'left' : '300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 
		 
		  $('#top-centers').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '150px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#bottom-centers').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '-150px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#lefts').hover(function(){
		         $(this).children('.front').stop().animate({'left' : '300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#rights').hover(function(){
		         $(this).children('.front').stop().animate({'left' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#top-rights').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '150px','left' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 
		 
		 $('#top-ups').hover(function(){
		         $(this).children('.front').stop().animate({'left' : '150px','top' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'left' : '4px', 'top' : '4px'}, 500);});
		  $('#top-downs').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '-300px'}, 500);
		  }, function(){$(this).children('.front').stop().animate({'left' : '4px', 'top' : '4px'}, 500);});
			$('#newts').hover(function(){
		         $(this).children('.front').stop().animate({'left' : '300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 
		 $('#bottom-sale').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '-150px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		  $('#top-mond').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '150px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#right-superlauw').hover(function(){
		         $(this).children('.front').stop().animate({'left' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		  $('#right-smurf').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		  $('#top-thijs').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '150px','left' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'left' : '4px'}, 500);});
		 $('#top-lei').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'left' : '4px', 'top' : '4px'}, 500);});
		 $('#top-atelier').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '-300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'top' : '4px'}, 500);});
		 $('#top-margreet').hover(function(){
		         $(this).children('.front').stop().animate({'top' : '300px'}, 500);
		 }, function(){$(this).children('.front').stop().animate({'top' : '4px', 'top' : '4px'}, 500);});
		 
});