window.addEvent('domready', function(){ 
	  var totIncrement		= 0;
	  var totIncrementt		= 0;
	  var totIncrementtt	= 0;
	  var increment			= 220;
	  var maxRightIncrement	= increment*(-1);
	  var fx = new Fx.Style('myList', 'margin-left', {
				duration: 1000,
				transition: Fx.Transitions.Back.easeInOut,
				wait: true
	   });
 
	   
	   //-------------------------------------
	  // EVENTS for the button "previous"
	  $('previous').addEvents({ 
          'click' : function(event){ 
		  if(totIncrement<0){
					totIncrement = totIncrement+increment;
					fx.stop()
					fx.start(totIncrement);
				}
			}			  	  
      }); 
	 
       //-------------------------------------
	  // EVENTS for the button "next"
  	  $('next').addEvents({ 
          'click' : function(event){ 
			 if(totIncrement>maxRightIncrement){
				 totIncrement = totIncrement-increment;
		    	fx.stop()
				fx.start(totIncrement);
			}
          }		  		  
      })
	  
	  
	  var fxx = new Fx.Style('myList-2', 'margin-left', {
				duration: 1000,
				transition: Fx.Transitions.Back.easeInOut,
				wait: true
	   });	  
	  
	  $('previous-2').addEvents({ 
          'click' : function(event){ 
		  if(totIncrementt<0){
					totIncrementt = totIncrementt+increment;
					fxx.stop()
					fxx.start(totIncrementt);
				}
			}			  	  
      }); 
	 
       //-------------------------------------
	  // EVENTS for the button "next"
  	  $('next-2').addEvents({ 
          'click' : function(event){ 
			 if(totIncrementt>maxRightIncrement){
				 totIncrementt = totIncrementt-increment;
		    	fxx.stop()
				fxx.start(totIncrementt);
			}
          }		  		  
      })	  





	  var fxxx = new Fx.Style('myList-3', 'margin-left', {
				duration: 1000,
				transition: Fx.Transitions.Back.easeInOut,
				wait: true
	   });	  
	  
	  $('previous-3').addEvents({ 
          'click' : function(event){ 
		  if(totIncrementtt<0){
					totIncrementtt = totIncrementtt+increment;
					fxxx.stop()
					fxxx.start(totIncrementtt);
				}
			}			  	  
      }); 
	 
       //-------------------------------------
	  // EVENTS for the button "next"
  	  $('next-3').addEvents({ 
          'click' : function(event){ 
			 if(totIncrementtt>maxRightIncrement){
				 totIncrementtt = totIncrementtt-increment;
		    	fxxx.stop()
				fxxx.start(totIncrementtt);
			}
          }		  		  
      })	   
});

function highlight(id) {
	document.getElementById(id).style.background = "#000";
	document.getElementById(id).style.color = "#fff";

	if (id == 'next') {
		document.getElementById('previous').style.background = "#fff";
		document.getElementById('previous').style.color = "#c00";
	}
	if (id == 'previous') {
		document.getElementById('next').style.background = "#fff";
		document.getElementById('next').style.color = "#c00";
	}

	if (id == 'next-2') {
		document.getElementById('previous-2').style.background = "#fff";
		document.getElementById('previous-2').style.color = "#c00";
	}
	if (id == 'previous-2') {
		document.getElementById('next-2').style.background = "#fff";
		document.getElementById('next-2').style.color = "#c00";
	}	
	if (id == 'next-3') {
		document.getElementById('previous-3').style.background = "#fff";
		document.getElementById('previous-3').style.color = "#c00";
	}
	if (id == 'previous-3') {
		document.getElementById('next-3').style.background = "#fff";
		document.getElementById('next-3').style.color = "#c00";
	}	
}