// JavaScript Document
jQuery(document).ready(function(){
	
	jQuery(".square-1-card").click(function(e){
		oneSquare("open");
	
		twoSquare();
		threeSquare();
		fourSquare();
	
	});
	
	jQuery(".square-2-card").click(function(e){
		twoSquare("open");
		
		oneSquare();
		threeSquare();
		fourSquare();
		
	});
	
	jQuery(".square-3-card").click(function(e){
		threeSquare("open");
		
		oneSquare();
		twoSquare();
		fourSquare();
	
	});
	
	jQuery(".square-4-card").click(function(e){
		fourSquare("open");
		
		oneSquare();
		twoSquare();
		threeSquare();

	});
	
});

function oneSquare(action){
	if(action == "open"){
		jQuery('.square-1').find(".moveablesquare").animate({'top':'-300px'},1000,"easeOutQuad");
	}
	else{
		jQuery('.square-1').find(".moveablesquare").animate({'top':'0'},1000,"easeOutQuad");
	}
}

function twoSquare(action){
	if(action == "open"){
		jQuery('.square-2').find(".moveablesquare").animate({'left':'0'},1000,"easeOutQuad");
	}
	else{
		jQuery('.square-2').find(".moveablesquare").animate({'left':'-255px'},1000,"easeOutQuad");
	}
}

function threeSquare(action){
	if(action == "open"){
		jQuery('.square-3').find(".moveablesquare").animate({'left':'-370'},1000,"easeOutQuad");
	}
	else{
		jQuery('.square-3').find(".moveablesquare").animate({'left':'0'},1000,"easeOutQuad");
	}
}

function fourSquare(action){
	if(action == "open"){
		jQuery('.square-4').find(".moveablesquare").animate({'top':'0'},1000,"easeOutQuad");
	}
	else{
		jQuery('.square-4').find(".moveablesquare").animate({'top':'-284'},1000,"easeOutQuad");
	}
}