$(document).ready( function()
	{
	var currentPosition = 0;
	var slides = $('.slide');
	var slideWidth = 185;
	var totalSlide = slides.length;	
	
	
	// remove scroller 	
	$('#slideCon').css('overflow', 'hidden');
	// wrape all slide	
	slides.wrapAll('<div id="slideInner"></div>');
	$('#slideInner').css( {'float' : 'left', 'width' : slideWidth * totalSlide});
	$(slides).css('float', 'left');	
	// insert left aero and right aero
	$('#slideContainer').prepend('<span id="left" class="control" ></span> <span id="leftdis" class="controldis"></span>')
	$('#slideContainer').append('<span id="right" class="control" ></span> <span id="rightdis" class="controldis"></span>');
	manageControl(currentPosition);	
	
	$('.control').click(function()
		{
			currentPosition = ($(this).attr('id') == 'right') ? currentPosition-1 : currentPosition+1;			
			$('#slideInner').animate({'marginLeft': slideWidth * currentPosition});			
			manageControl(currentPosition);			
		});
		
	function manageControl(position)
		{
			if (position == 0)	
				{					
					$('#left').fadeOut("fast");	
					$('#leftdis').fadeIn("slow");	
					$('#leftdis').attr("disabled", true); 
									
				}
			else{
					$('#leftdis').fadeOut("slow");
					$('#left').fadeIn("fast");		
				}
				
			if (position == -(totalSlide)+5 )	
				{				
					$('#right').fadeOut("fast");
					$('#rightdis').fadeIn("slow");
					$('#rightdis').attr("disabled", true); 						
					return false;	
				}
				
			else {
					$('#rightdis').fadeOut("fast");
					$('#right').fadeIn("fast");		
				}		
			
			
			if (totalSlide == 4)	
				{					
					$('#right').fadeOut("fast");
					$('#rightdis').fadeIn("slow");						
				}
			else{
					$('#rightdis').fadeOut("slow");
					$('#right').fadeIn("fast");		
				}
			
			
			}
		
	
	})















$(document).ready( function()
	{
	var currentPosition = 0;
	var slides = $('.slide1');
	var slideWidth = 185;
	var totalSlide = slides.length;	
	
	
	// remove scroller 	
	$('#slideCon1').css('overflow', 'hidden');
	// wrape all slide	
	slides.wrapAll('<div id="slideInner1"></div>');
	$('#slideInner1').css( {'float' : 'left', 'width' : slideWidth * totalSlide});
	$(slides).css('float', 'left');	
	// insert left aero and right aero
	$('#slideContainer1').prepend('<span id="left1" class="control1" ></span> <span id="leftdis1" class="controldis1"></span>')
	$('#slideContainer1').append('<span id="right1" class="control1" ></span> <span id="rightdis1" class="controldis1"></span>');
	manageControl(currentPosition);	
	
	$('.control1').click(function()
		{
			currentPosition = ($(this).attr('id') == 'right1') ? currentPosition-1 : currentPosition+1;			
			$('#slideInner1').animate({'marginLeft': slideWidth * currentPosition});			
			manageControl(currentPosition);			
		});
		
	function manageControl(position)
		{
			if (position == 0)	
				{					
					$('#left1').fadeOut("fast");	
					$('#leftdis1').fadeIn("slow");	
					$('#leftdis1').attr("disabled", true); 
									
				}
			else{
					$('#leftdis1').fadeOut("slow");
					$('#left1').fadeIn("fast");		
				}
				
			if (position == -(totalSlide)+5 )	
				{				
					$('#right1').fadeOut("fast");
					$('#rightdis1').fadeIn("slow");
					$('#rightdis1').attr("disabled", true); 						
					return false;	
				}
				
			else {
					$('#rightdis1').fadeOut("fast");
					$('#right1').fadeIn("fast");		
				}		
			
			
			if (totalSlide == 4)	
				{					
					$('#right1').fadeOut("fast");
					$('#rightdis1').fadeIn("slow");						
				}
			else{
					$('#rightdis1').fadeOut("slow");
					$('#right1').fadeIn("fast");		
				}
			
			
			}
		
	
	})
	
	
	
	




$(document).ready( function()
	{
	var currentPosition = 0;
	var slides = $('.slide2');
	var slideWidth = 185;
	var totalSlide = slides.length;	
	
	
	// remove scroller 	
	$('#slideCon2').css('overflow', 'hidden');
	// wrape all slide	
	slides.wrapAll('<div id="slideInner2"></div>');
	$('#slideInner2').css( {'float' : 'left', 'width' : slideWidth * totalSlide});
	$(slides).css('float', 'left');	
	// insert left aero and right aero
	$('#slideContainer2').prepend('<span id="left2" class="control2" ></span> <span id="leftdis2" class="controldis2"></span>')
	$('#slideContainer2').append('<span id="right2" class="control2" ></span> <span id="rightdis2" class="controldis2"></span>');
	manageControl(currentPosition);	
	
	$('.control2').click(function()
		{
			currentPosition = ($(this).attr('id') == 'right2') ? currentPosition-1 : currentPosition+1;			
			$('#slideInner2').animate({'marginLeft': slideWidth * currentPosition});			
			manageControl(currentPosition);			
		});
		
	function manageControl(position)
		{
			if (position == 0)	
				{					
					$('#left2').fadeOut("fast");	
					$('#leftdis2').fadeIn("slow");	
					$('#leftdis2').attr("disabled", true); 
									
				}
			else{
					$('#leftdis2').fadeOut("slow");
					$('#left2').fadeIn("fast");		
				}
				
			if (position == -(totalSlide)+5 )	
				{				
					$('#right2').fadeOut("fast");
					$('#rightdis2').fadeIn("slow");
					$('#rightdis2').attr("disabled", true); 						
					return false;	
				}
				
			else {
					$('#rightdis2').fadeOut("fast");
					$('#right2').fadeIn("fast");		
				}		
			
			
			if (totalSlide == 4)	
				{					
					$('#right2').fadeOut("fast");
					$('#rightdis2').fadeIn("slow");						
				}
			else{
					$('#rightdis2').fadeOut("slow");
					$('#right2').fadeIn("fast");		
				}
			
			
			}
		
	
	})