window.addEvent('load', function () {
	
		var abswith = 0;
		var stageWidth = $('slide').getStyle('width').toInt();
		
		$$('div#tabs a img').each(function(item){
			abswith += item.getStyle('width').toInt() + 1;
		})
		
		var maxLeftMargin	= abswith - stageWidth ;//-1
	
		var duration = 500,
		
			links = $$('div#tabs a'),
			
			tab = new Carousel({
				container: 'slide',
				scroll: 1,
				circular: true,
				current: 0,
				/* mode: 'horizontal', */
				onChange: function (index) {
				
					links.each(function (el, off) {
					
						el[off == index ? 'addClass' : 'removeClass']('selected')
					})
				},
				fx: {
				
					duration: duration
				}
			});
			
			[$('prev'), $('next')].map(function (el, index) {
			
				el.addEvent('click', function (e) {
				
					e.stop();
					
					tab.move(tab.first() + (index == 0 ? -1 : 1) * tab.options.scroll);

				})
			});
			
			
		links.each(function (el, index) {
			el.addEvent('click', function (e) {
				e.stop();
				tab.move(index);
			})
		})
		
		if (abswith <= stageWidth) {
			$('tabs').setStyle('width', abswith);
			$('slideRight').setStyle('display', 'none');
			$('slideLeft').setStyle('display', 'none');
			
		} else {
		
			// Global Tween Setting
			$('tabContainer').set('tween', {duration: 2000, transition: Fx.Transitions.Expo.easeOut});
		
			$('slideRight').addEvent('mouseover', function(e){
				$('tabContainer').tween('margin-left', - (maxLeftMargin));
			})
		
			$('slideRight').addEvent('mouseout', function(e){

				var actualPosition = $('tabContainer').getStyle('margin-left').toInt();	// console.log("" + actualPosition + ' > ' + maxLeftMargin + " -30= " + -(maxLeftMargin -30));
				var offset = (actualPosition > -(maxLeftMargin -30)) ? actualPosition - 30 : - maxLeftMargin;

				$('tabContainer').tween('margin-left', offset);
			})
		
		
			$('slideLeft').addEvent('mouseover', function(e){
				$('tabContainer').tween('margin-left', 0);
			})
		
			$('slideLeft').addEvent('mouseout', function(e){
				var actualPosition = $('tabContainer').getStyle('margin-left').toInt();					
				var offset = (actualPosition < -30) ? actualPosition + 30 : 0;

				$('tabContainer').tween('margin-left', offset);
			})
		}
		
		
		// Transition Thumbnail Stage
		$('tabs').set('tween', {duration: 300, transition: Fx.Transitions.Expo.easeOut, link: 'cancel'});

		$('stage').addEvent('mouseenter', function(e){
			$('tabs').tween('height', 78);
		});
		
		$('stage').addEvent('mouseleave', function(e){
			$('tabs').tween('height', 0);
		});
		
		
		
	})