$(document).ready(function() {
   
	var ref; 
	var total=0,total2=0;
	var c=0;

	$('ul#clientes li').each(function(){
		c++;
		total+=$(this).width()	   
	})
	total+=c*10+3;
	$('ul#clientes').css('width', total);
   
	function scrollLeft(){
		var pos = $('ul#clientes').css('margin-left').slice(0,-2)
		pos=pos*(-1)
		if(pos<(total-750)){
			$('#clientes').animate({marginLeft : '-=2.4px'},1)
		}
	}

	function scrollRight(){
		var pos = $('ul#clientes').css('margin-left').slice(0,-2)	
		if(pos<0){
			$('#clientes').animate({marginLeft : '+=2.4px'},1)
	   	}
	}

	$("#arrow-left").hover(function () {
		ref=setInterval(scrollLeft, 42)	   
	}, function () {
		clearInterval(ref)
	});

	$("#arrow-right").hover(function () {
		ref=setInterval(scrollRight, 42)	   
	}, function () {
		clearInterval(ref)
	});

});