YUI().use('anim', function(Y) {

    var node = Y.one('#menu_1');

    var anim_1 = new Y.Anim({
        easing: 'easeOutStrong',
        node: node,
        from: {
            backgroundColor:node.getStyle('backgroundColor'),
            color: node.getStyle('color'),
            borderColor: node.getStyle('borderTopColor'),
            width: node.getStyle('width')
        },

        to: {
            backgroundColor: '#ff588f',
            color: '#ffffff',
            borderColor: '#DC004A',
            width: 200
        },

        duration: 0.5
    });

    var hover = function(e) {
        var reverse = false;
        if (anim_1.get('running')) {
            anim_1.pause();
        }
        if (e.type === 'mouseout') {
            reverse = true;
        }
        anim_1.set('reverse', reverse);
        anim_1.run();
    };
    node.on('mouseover', hover);
    node.on('mouseout', hover);
   
    
    var node = Y.one('#menu_2');

    var anim_2 = new Y.Anim({
       easing: 'easeOutStrong',
       node: node,
        from: {
            backgroundColor:node.getStyle('backgroundColor'),
            color: node.getStyle('color'),
            borderColor: node.getStyle('borderTopColor'),
            width: node.getStyle('width')
        },

        to: {
            backgroundColor: '#b8927b',
            color: '#ffffff',
            borderColor: '#75604F',
            width: 200
        },

        duration:0.5
    });

    var hover = function(e) {
        var reverse = false;
        if (anim_2.get('running')) {
            anim_2.pause();
        }
        if (e.type === 'mouseout') {
            reverse = true;
        }
        anim_2.set('reverse', reverse);
        anim_2.run();
    };
    node.on('mouseover', hover);
    node.on('mouseout', hover);
    
    
  var node = Y.one('#menu_3');

    var anim_3 = new Y.Anim({
       easing: 'easeOutStrong',
       node: node,
        from: {
            backgroundColor:node.getStyle('backgroundColor'),
            color: node.getStyle('color'),
            borderColor: node.getStyle('borderTopColor'),
            width: node.getStyle('width')
        },

        to: {
            backgroundColor: '#ffdf7f',
            color: '#ffffff',
            borderColor: '#F2B701',
            width: 200
        },

        duration:0.5
    });

    var hover = function(e) {
        var reverse = false;
        if (anim_3.get('running')) {
            anim_3.pause();
        }
        if (e.type === 'mouseout') {
            reverse = true;
        }
        anim_3.set('reverse', reverse);
        anim_3.run();
    };
    node.on('mouseover', hover);
    node.on('mouseout', hover);  
    
    
 var node = Y.one('#menu_4');

    var anim_4 = new Y.Anim({
       easing: 'easeOutStrong',
       node: node,
        from: {
            backgroundColor:node.getStyle('backgroundColor'),
            color: node.getStyle('color'),
            borderColor: node.getStyle('borderTopColor'),
            width: node.getStyle('width')
        },

        to: {
            backgroundColor: '#0dea70',
            color: '#ffffff',
            borderColor: '#4C9E21',
            width: 200
        },

        duration:0.5
    });

    var hover = function(e) {
        var reverse = false;
        if (anim_4.get('running')) {
            anim_4.pause();
        }
        if (e.type === 'mouseout') {
            reverse = true;
        }
        anim_4.set('reverse', reverse);
        anim_4.run();
    };
    node.on('mouseover', hover);
    node.on('mouseout', hover);   
    
    
    var node = Y.one('#menu_5');

    var anim_5 = new Y.Anim({
       easing: 'easeOutStrong',
       node: node,
        from: {
            backgroundColor:node.getStyle('backgroundColor'),
            color: node.getStyle('color'),
            borderColor: node.getStyle('borderTopColor'),
            width: node.getStyle('width')
        },

        to: {
            backgroundColor: '#EF6003',
            color: '#ffffff',
            borderColor: '#DC5700',
            width: 200
        },

        duration:0.5
    });

    var hover = function(e) {
        var reverse = false;
        if (anim_5.get('running')) {
            anim_5.pause();
        }
        if (e.type === 'mouseout') {
            reverse = true;
        }
        anim_5.set('reverse', reverse);
        anim_5.run();
    };
    node.on('mouseover', hover);
    node.on('mouseout', hover);   
    
});