$(document).ready(function(){
				//To switch directions up/down and left/right just place a "-" in front of the top/left attribute
				
				//Horizontal Sliding
				$('.boxgrid.slideup').hover(function(){
					$(".cover", this).stop().animate({top:'-260px'},{queue:false,duration:300});
					this.style.zIndex = 10;
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300});
						this.style.zIndex = 0;
				});
				//Vertical Sliding
				$('.boxgrid.slidedown').hover(function(){
					$(".cover", this).stop().animate({top:'260px'},{queue:false,duration:300});
					this.style.zIndex = 10;
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300,
						complete:function(){
							this.parentNode.style.zIndex = 0;	
						}}
					);
					this.style.zIndex = 9;
						
				});
				//Vertical Sliding tall
				$('.boxgrid.slidedowntall').hover(function(){
					$(".cover", this).stop().animate({top:'412px'},{queue:false,duration:300});
					this.style.zIndex = 10;
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300,
						complete:function(){
							this.parentNode.style.zIndex = 0;	
						}}
					);
					this.style.zIndex = 9;
						
				});
				
				//Vertical Sliding tall from bottom
				$('.boxgrid.slideuptall').hover(function(){
					$(".cover", this).stop().animate({top:'-200px'},{queue:false,duration:300});
					this.style.zIndex = 10;
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300,
						complete:function(){
							this.parentNode.style.zIndex = 0;	
						}}
					);
					this.style.zIndex = 9;
						
				});
				
				
				//Vertical Sliding short
				$('.boxgrid.slidedownshort').hover(function(){
					$(".cover", this).stop().animate({top:'200px'},{queue:false,duration:300});
					this.style.zIndex = 10;
				}, function() {
					$(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300,
						complete:function(){
							this.parentNode.style.zIndex = 0;	
						}}
					);
					this.style.zIndex = 9;
						
				});
				
				
				
				//overlay Sliding short
				$('.boxgrid').hover(function(){
					$(".overlay", this)[0].style.visibility='visible';
					$(".overlay", this).stop().fadeTo('fast', 1);
				}, function() {
					$(".overlay", this).stop().fadeTo('fast', 0, 
					function(){
						this.style.visibility='hidden';
					});
				});
				
			
			});

