// JavaScript Document
window.addEvent('domready', function() {

			/* <![CDATA[ 		version Mootools 1.11 */
			
			function makeScrollbar(content,scrollbar,handle,horizontal,ignoreMouse){

				var steps = (horizontal?(content.getSize().scrollSize.x - content.getSize().size.x):(content.getSize().scrollSize.y - content.getSize().size.y))
				var slider = new Slider(scrollbar, handle, {	
					steps: steps,
					mode: (horizontal?'horizontal':'vertical'),
					onChange: function(step){
						// Scrolls the content element in x or y direction.
						var x = (horizontal?step:0);
						var y = (horizontal?0:step);
						content.scrollTo(x,y);
					}
				}).set(0);
				if( !(ignoreMouse) ){
					// Scroll the content element when the mousewheel is used within the 
					// content or the scrollbar element.
					$$(content, scrollbar).addEvent('mousewheel', function(e){	
						e = new Event(e).stop();
						var step = slider.step - e.wheel * 30;	
						slider.set(step);					
					});
				}
				// Stops the handle dragging process when the mouse leaves the document body.
				$(document.body).addEvent('mouseleave',function(){slider.drag.stop()});
			}
						
			window.addEvent('domready', function(){				
				makeScrollbar( $('scrollC1'), $('scrollbar1'), $('scrollhand1') );
				makeScrollbar( $('scrollC2'), $('scrollbar2'), $('scrollhand2') );

			});
			/* ]]> */

});


window.addEvent('domready', function(){
			var myFx = new Fx.Style('scrollhand1', 'opacity', {duration: 400, wait: false}); 
			  myFx.start(0);
			  $('scrollbar1').addEvent('mouseenter', function(){
				myFx.start(1);
			  });
			  $('scrollbar1').addEvent('mouseleave', function(){
				myFx.start(0);
			  });  
			  $('scrollC1').addEvent('mouseenter', function(){
				myFx.start(1);
			  });
			  $('scrollC1').addEvent('mouseleave', function(){
				myFx.start(0);
			  });			  
}); 
window.addEvent('domready', function(){
			var myFx = new Fx.Style('scrollhand2', 'opacity', {duration: 400, wait: false}); 
			  myFx.start(0);
			  $('scrollbar2').addEvent('mouseenter', function(){
				myFx.start(1);
			  });
			  $('scrollbar2').addEvent('mouseleave', function(){
				myFx.start(0);
			  });  
			  $('scrollC2').addEvent('mouseenter', function(){
				myFx.start(1);
			  });
			  $('scrollC2').addEvent('mouseleave', function(){
				myFx.start(0);
			  });
});