var step = 1;

var off_total = 0;
var off_width = 191;
var off_move = (off_width*4);
var off_move_final = 0;
var off_steps = 0;
$(document).ready(function(){
	off_total = $('div.featureitem').length;
	off_move_final = (off_width*(off_total%4));
	off_move_final = (off_move_final == 0)?off_move:off_move_final;
	off_steps = Math.ceil(off_total/4);
	
	$('div#featuregroup').css('width', (off_total*off_width)+'px');

	$("img#featurearrowright").click(function(){
		if(step < off_steps-1){
			$("div#featuregroup").animate({"marginLeft": "-="+off_move+"px"}, "slow");
			step++;
		} else if(step == off_steps-1){
			$("div#featuregroup").animate({"marginLeft": "-="+off_move_final+"px"}, "slow");
			step++;
		}
	});
	
	$("img#featurearrowleft").click(function(){
		if(step == off_steps){
			$("div#featuregroup").animate({"marginLeft": "+="+off_move_final+"px"}, "slow");
			step--;
		} else if(step > 1){
			$("div#featuregroup").animate({"marginLeft": "+="+off_move+"px"}, "slow");
			step--;
		}
	});
});