var cur_client = 1;
    var ua = navigator.userAgent.toLowerCase();
    var old_width;

    function ShowDiv(clientID) {
      if (clientID != cur_client) {
        var cc = cur_client;
        document.getElementById('client'+clientID).style.display="";
        document.getElementById('client'+cc).style.display="none";
        Pixastic.revert(document.getElementById('but' + clientID));
        document.getElementById('but' + clientID).onmouseout = function(){return;};
        document.getElementById('but' + cc).onmouseout = function(){Des(cc);};
        document.getElementById('but' + cc).onclick = function(){ShowDiv(cc);};
        Pixastic.process(document.getElementById('but' + cc), "desaturate");
        var canv = document.getElementById('but'+cc);
        canv.onmouseover = function(){Pixastic.revert(canv);};
        cur_client = clientID;
      }
    }

    function Des(ID){
        Pixastic.process(document.getElementById('but'+ID), "desaturate");
        var canv = document.getElementById('but'+ID);
        canv.onmouseover = function(){Pixastic.revert(canv);};
    }

    function InitBut(butID) {
      if (butID>1) {
        var but = document.getElementById('but'+butID)
        document.getElementById('client'+butID).style.display="none";
        but.onmouseout = function(){Des(butID);};
        but.onclick = function(){ShowDiv(butID);};
        Pixastic.process(but, "desaturate");
        var canv = document.getElementById('but'+butID);
        canv.onmouseover = function(){Pixastic.revert(canv);};
      }
    }

    $(window).resize(function(){
			var i = $('.scrollable').scrollable().getIndex() + 3;
      var new_width = parseFloat($('.scrollable').attr('clientWidth'))/2-90;
      var new_margin = new_width/(-2)+90;
      var new_left = parseFloat($('.items').css('left')) - (new_width-old_width)*i;
  	  $('.item').css('width', new_width + 'px');
			$('.items').css('margin-left', new_margin + 'px');
			$('.items').css('left', new_left + 'px');
      old_width = new_width;
    });

    $(document).ready(function(){
   	  old_width = parseFloat($('.item').css('width'));
      var new_width = parseFloat($('.scrollable').attr('clientWidth'))/2-90;
      var new_margin = new_width/(-2) + 90;
      var new_left = parseFloat($('.items').css('left')) - (new_width-old_width)*4;
  	  $('.item').css('width', new_width + 'px');
 			$('.items').css('margin-left', new_margin + 'px');
      $('.items').css('left', new_left + 'px');
      old_width = new_width;

      $(".item.noactive").mouseout(function(){
        $(this).stop();
        $(this).fadeTo("fast", 0.3);
	    });
	    $(".item").mouseover(function(){
        $(this).stop();
        $(this).fadeTo("fast", 1.0);
	    });
      $('.item.noactive').fadeTo("fast", 0.3);
      $('.item.active').fadeTo("fast", 1.0);
		  $('.item.noactive').find('a').hide();
      $('.item.active').find('a').show();
      $('.item.active').find('img').bind('click',aClick);
  	});