$(document).ready(function(){
				//To switch directions up/down and left/right just place a "-" in front of the top/left attribute
		
				//Full Caption Sliding (Hidden to Visible)
				$('.box.captionfull').hover(function(){
					$(".cover", this).stop().animate({bottom:'0px'},{queue:false,duration:200});
					var img= $(this).find('img').get(0);
					var src=img.src;
					src = src.replace(/bw.jpg/i, "colour.jpg");
					img.src=src;
				}, function() {
					$(".cover", this).stop().animate({bottom:'-100px'},{queue:false,duration:400});
					var img= $(this).find('img').get(0);
					var src=img.src;
					src = src.replace(/colour.jpg/i, "bw.jpg");
					img.src=src;
				});
				
				//Full Caption Sliding (Hidden to Visible)
				$('.box.captionsmall').hover(function(){
					$(".cover", this).stop().animate({bottom:'0px'},{queue:false,duration:200});
					var img= $(this).find('img').get(0);
					var src=img.src;
					src = src.replace(/bw.jpg/i, "colour.jpg");
					img.src=src;
				}, function() {
					$(".cover", this).stop().animate({bottom:'-100px'},{queue:false,duration:400});
					var img= $(this).find('img').get(0);
					var src=img.src;
					src = src.replace(/colour.jpg/i, "bw.jpg");
					img.src=src;
				});
				//XL Caption Sliding (Hidden to Visible) - individual fuction as it's bigger
				$('.box.captionxl').hover(function(){
					$(".cover", this).stop().animate({bottom:'0px'},{queue:false,duration:200});
					var img= $(this).find('img').get(0);
					var src=img.src;
					src = src.replace(/bw.jpg/i, "colour.jpg");
					img.src=src;
				}, function() {
					$(".cover", this).stop().animate({bottom:'-150px'},{queue:false,duration:400});
					var img= $(this).find('img').get(0);
					var src=img.src;
					src = src.replace(/colour.jpg/i, "bw.jpg");
					img.src=src;
				});

				
			});

