$(document).ready(function(){
	var currentPosition = 0;
	var slideWidth = 720;
	var slides = $('.slide');
	var numberOfSlides = slides.length;
	$('#slideContainer').css('overflow', 'hidden');
	slides.wrapAll('<div id="slideInner"></div>')
	.css(
		 {
			'float' : 'left',
			'width' : slideWidth
		}
	);
	$('#slideInner').css('width', slideWidth * numberOfSlides );
	$('#slideshow')
	.prepend('<span class="control" id="leftControl"></span>')
	.append('<span class="control" id="rightControl"></span>');
	$('.control')
	.bind('click', function(){
		currentPosition = parseInt( $('#slideInner').css("margin-left"))
		btnClicked = $(this).attr('id');
		if(btnClicked == "leftControl" ){
			if( currentPosition == 0){
				$('#slideInner').animate({
					'marginLeft' : slideWidth - (slideWidth*numberOfSlides)
				});				
			}else{
				$('#slideInner').animate({
					'marginLeft' : currentPosition + slideWidth
				});
			}
		}else if(btnClicked == "rightControl" ){
			if( currentPosition == slideWidth - (slideWidth*numberOfSlides)){
				$('#slideInner').animate({
					'marginLeft' : 0
				});				
			}else{
				$('#slideInner').animate({
					'marginLeft' : currentPosition - slideWidth
				});
			}
		}
		});
	$('.gallery .gallery-item:first-child').css("display", "block");
})