$().ready(function() {
    	
        var item = $('div.mask li');
        var nItems = item.size();
        var maskHeight = $('div.mask').height();
        var itemHeight = item.height() + Number(item.css('margin-bottom').replace(/px/, ""));
        
        var currentScroll = 0;
        var maxScroll = nItems - Math.floor(maskHeight/itemHeight);
        
        var scrollTo = function(n) {
        	currentScroll = Math.max(0, Math.min(n, maxScroll));
            $('div.mask ul').animate({'top': -currentScroll * itemHeight}, 300);
        };
        
        var scrollNext = function() {
        	scrollTo(Math.min(currentScroll + 1, maxScroll));
        };
        
        var scrollPrevious = function() {
        	scrollTo(Math.max(currentScroll - 1, 0));
        };
        
        $('a.next').click(function(e) {
        	e.preventDefault();
            scrollNext();
        });
        
        $('a.previous').click(function(e) {
        	e.preventDefault();
            scrollPrevious();
        });
        
    });