$(document).ready(function(){
	var currentPosition = 0;
	var slideWidth = 1124;
	var slides = $('.slide-contact-us');
	var numberOfSlides = slides.length;

	// Remove scrollbar in JS
	$('#slidescontainer-contact-us').css('overflow', 'hidden');

	// Wrap all .slides with #slideInner div
	slides
	.wrapAll('<div id="slideInner2"></div>')
	// Float left to display horizontally, readjust .slides width
	.css({
		'float' : 'left',
		'width' : slideWidth
	});

	// Set #slideInner width equal to total width of all slides
	$('#slideInner2').css('width', slideWidth * numberOfSlides);

	// Insert left and right arrow controls in the DOM
	$('#slideshow-contact-us')
	    //.prepend('<span class="control" id="leftControl">Move left</span>')
    	//.append('<span class="control" id="rightControl">Move right</span>');

		// Hide left arrow control on first load
		manageControls(currentPosition);

		// Create event listeners for .controls clicks
		$('.control1')
		  .bind('click', function(){
		  // Determine new position
		  currentPosition = ($(this).attr('id')=='rightControl') ? currentPosition+1 : currentPosition-1;

		// Hide / show controls
		//manageControls(currentPosition);
		// Move slideInner using margin-left
		$('#slideInner2').animate({
		  'marginLeft' : slideWidth*(0)
		});
	});
				
	$('.control-contact-us')
		.bind('click', function(){
				
			$('#contact-us-bg').removeClass();
			$('#contact-us-bg').addClass('contactus-bg');
				
			$('#contact-us-top').removeClass();
			$('#contact-us-top').addClass('contactus-top');
				
			$('#slideInner2').animate({
				'marginLeft' : slideWidth*(currentPosition)
            });
				
	    });
		
    	$('.control-jointeam')
	    	.bind('click', function(){
		        
             	$('#contact-us-bg').removeClass();
    			$('#contact-us-bg').addClass('joinus-bg');
				
	    		$('#contact-us-top').removeClass();
		    	$('#contact-us-top').addClass('joinus-top');

		    	$('#slideInner2').animate({
			    	'marginLeft' : slideWidth*(currentPosition - 1)
    			});
			
	    	});
		
		// manageControls: Hides and shows controls depending on currentPosition
		function manageControls(position){
			// Hide left arrow if position is first slide
			if(position==0){ $('#leftControl2').hide() }
			else{ $('#leftControl2').show() }
				// Hide right arrow if position is last slide
			if(position==numberOfSlides-1){ $('#rightControl2').hide() }
				else{ $('#rightControl2').show() }
			}
	});

