var BannerWidget = new Class({
                Implements: [Events],

                outOfBannerArea:true,

                initialize: function(tabs, banner){

                        tabs.getElements('div.tab').each(function(n){
                                n.setStyles({left: -340});
                        })
                        var i=4;
                        var j=20;
                        $('tab-1').setStyles({'position': 'absolute', 'zIndex': ++j});
                        $('tab-2').setStyles({'position': 'absolute', 'zIndex': ++j});
                        $('tab-3').setStyles({'position': 'absolute', 'zIndex': ++j});
                        $('label-1').setStyles({'position': 'absolute', 'zIndex': ++j});
                        $('label-2').setStyles({'position': 'absolute', 'zIndex': ++j});
                        $('label-3').setStyles({'position': 'absolute', 'zIndex': ++j});

                        tabs.getElements('a').each(function(n, index){
                                n.addEvent('mouseenter', function(event){
                                        n.getNext('div').get('tween', {property: 'left', duration: 400, transition: Fx.Transitions.Cubic.easeOut}).start(0);
                                                $('img'+(index+1)).setStyles({'position': 'absolute', 'zIndex': ++i, 'opacity': 0});
                                                $('img'+(index+1)).get('tween', {property: 'opacity', duration: 400, transition: Fx.Transitions.Cubic.easeOut}).start(1);
                                                $('tab-1').setStyles({'position': 'absolute', 'zIndex': ++j});
                                                $('tab-2').setStyles({'position': 'absolute', 'zIndex': ++j});
                                                $('tab-3').setStyles({'position': 'absolute', 'zIndex': ++j});
                                                $('label-1').setStyles({'position': 'absolute', 'zIndex': ++j});
                                                $('label-2').setStyles({'position': 'absolute', 'zIndex': ++j});
                                                $('label-3').setStyles({'position': 'absolute', 'zIndex': ++j});
                                })
                                n.addEvent('mouseleave', function(event){
                                        var tweenBack = function(){
                                                        n.getNext('div').get('tween', {property: 'left', duration: 400, transition: Fx.Transitions.Cubic.easeOut}).start(-340);
                                        }.bind(this);
                                        tweenBack();
                                }.bind(this));

                        }, this)

                }
})