window.addEvent('domready', function() {


    //offer flyout
    var imageGrow = $$('.pngGrow'); var flyoutOffer = $$('.grow'); var flyout = 'true';

    /* Individual image grow - 10 in total */
    flyoutOffer.each(function(el, i) {
        el.set('morph', { link: 'cancel' });
        el.addEvents({
            'mouseenter': function() {
                if(i == 0)
                   imageGrow[i].morph({ 'height': '77px', 'width': '79px'});
                if(i == 1)
                   imageGrow[i].morph({ 'height': '77px', 'width': '124px', 'margin-right': '0px', 'margin-left': '0px'});
                if(i == 2)
                   imageGrow[i].morph({ 'height': '77px', 'width': '110px'});
                if(i == 3)
                   imageGrow[i].morph({ 'height': '77px', 'width': '135px'});
                if(i == 4)
                   imageGrow[i].morph({ 'height': '77px', 'width': '121px'});
                if(i == 5)
                   imageGrow[i].morph({ 'height': '77px', 'width': '141px'});
                if(i == 6)
                   imageGrow[i].morph({ 'height': '77px', 'width': '120px'});
                if(i == 7)
                   imageGrow[i].morph({ 'height': '77px', 'width': '105px'});
                if(i == 8)
                   imageGrow[i].morph({ 'height': '77px', 'width': '100px'});
                if(i == 9)
                   imageGrow[i].morph({ 'height': '77px', 'width': '89px'});
            },
            'mouseleave': function() {
                if(i == 0)
                   imageGrow[i].morph({ 'height': '64px', 'width': '67px'});
                if(i == 1)
                   imageGrow[i].morph({ 'height': '64px', 'width': '104px'});
                if(i == 2)
                   imageGrow[i].morph({ 'height': '64px', 'width': '93px'});
                if(i == 3)
                   imageGrow[i].morph({ 'height': '64px', 'width': '115px'});
                if(i == 4)
                   imageGrow[i].morph({ 'height': '64px', 'width': '100px'});
                if(i == 5)
                   imageGrow[i].morph({ 'height': '64px', 'width': '127px'});
                if(i == 6)
                   imageGrow[i].morph({ 'height': '64px', 'width': '102px'});
                if(i == 7)
                   imageGrow[i].morph({ 'height': '64px', 'width': '90px'});
                if(i == 8)
                   imageGrow[i].morph({ 'height': '64px', 'width': '84px'});
                if(i == 9)
                   imageGrow[i].morph({ 'height': '64px', 'width': '75px'});
            }
        });
    });

var mouseArea = $$('#dock');
    var ico1 = $$('#ico_1');
    var ico2 = $$('#ico_2');
    var ico3 = $$('#ico_3');
    //var ico4 = $$('#ico_4');
    //var ico5 = $$('#ico_5');
    //var ico6 = $$('#ico_6');
    //var ico7 = $$('#ico_7');

    //Initial Images Shuffle

    //imageGrow.setStyle('margin-left', '-15px'); //imageGrow.setStyle('margin-right', '-10px');
    //ico1.setStyle('height', '64px'); ico1.setStyle('width', '67px'); ico1.setStyle('margin-top', '0px');
    //ico2.setStyle('height', '64px'); ico2.setStyle('width', '67px'); ico2.setStyle('margin-top', '0px');
    //ico3.setStyle('height', '64px'); ico3.setStyle('width', '96px'); ico3.setStyle('margin-top', '0px');
    //ico4.setStyle('height', '59px'); ico4.setStyle('width', '59px');
    //ico5.setStyle('height', '51px'); ico5.setStyle('width', '51px'); ico5.setStyle('margin-top', '6px');
    //ico6.setStyle('height', '42px'); ico6.setStyle('width', '42px'); ico6.setStyle('margin-top', '12px');
    //ico7.setStyle('height', '34px'); ico7.setStyle('width', '34px'); ico7.setStyle('margin-top', '18px');


    /* z index */

    //ico1.setStyle('margin-left', '0px');
    //ico2.setStyle('margin-left', '-25px'); ico2.setStyle('margin-right', '-15px');
    //ico4.setStyle('z-index', '5'); ico4.setStyle('position', 'relative'); ico4.setStyle('margin-left', '-40px'); ico4.setStyle('margin-right', '-20px');
    //ico5.setStyle('z-index', '4'); ico5.setStyle('position', 'relative'); ico5.setStyle('margin-left', '-20px'); ico5.setStyle('margin-right', '-10px');
    //ico6.setStyle('z-index', '3'); ico6.setStyle('position', 'relative'); ico6.setStyle('margin-left', '-20px'); ico6.setStyle('margin-right', '-10px');
    //ico7.setStyle('z-index', '2'); ico7.setStyle('position', 'relative');


    /* Mouse over dock area */

    mouseArea.addEvents({ 'mouseenter': function() {

    //ico1.setStyle('margin-right', '10px'); ico1.setStyle('width', '88px'); ico1.setStyle('height', '85px');
    //ico2.setStyle('margin-right', '10px'); ico2.setStyle('width', '89px'); ico2.setStyle('height', '85px');
    //ico3.setStyle('margin-right', '10px'); ico3.setStyle('width', '128px'); ico3.setStyle('height', '85px');
    //ico4.setStyle('margin', ''); ico4.setStyle('width', '59px'); ico4.setStyle('height', '59px');
    //ico5.setStyle('margin', ''); ico5.setStyle('width', '59px'); ico5.setStyle('height', '59px');
    //ico6.setStyle('margin', ''); ico6.setStyle('width', '59px'); ico6.setStyle('height', '59px');
    //ico7.setStyle('margin', ''); ico7.setStyle('width', '59px'); ico7.setStyle('height', '59px');
    //imageGrow.setStyle('margin-right', '5px');

}, 'mouseleave': function() {


//imageGrow.setStyle('margin-left', '-15px'); //imageGrow.setStyle('margin-right', '-10px');
//ico1.setStyle('height', '64px'); ico1.setStyle('width', '68px'); ico1.setStyle('margin-right', '0px');
//ico2.setStyle('height', '64px'); ico2.setStyle('width', '67px'); ico2.setStyle('margin-right', '0px');
//ico3.setStyle('height', '64px'); ico3.setStyle('width', '96px'); ico3.setStyle('margin-right', '0px');
//ico4.setStyle('height', '59px'); ico4.setStyle('width', '59px');
//ico5.setStyle('height', '51px'); ico5.setStyle('width', '51px'); ico5.setStyle('margin-top', '6px');
//ico6.setStyle('height', '42px'); ico6.setStyle('width', '42px'); ico6.setStyle('margin-top', '12px');
//ico7.setStyle('height', '34px'); ico7.setStyle('width', '34px'); ico7.setStyle('margin-top', '18px');


/* z index */
//ico1.setStyle('margin-left', '0px');
//ico2.setStyle('margin-left', '-25px'); ico2.setStyle('margin-right', '-15px');
//ico4.setStyle('z-index', '5'); ico4.setStyle('position', 'relative'); ico4.setStyle('margin-left', '-40px'); ico4.setStyle('margin-right', '-20px');
//ico5.setStyle('z-index', '4'); ico5.setStyle('position', 'relative'); ico5.setStyle('margin-left', '-20px'); ico5.setStyle('margin-right', '-10px');
//ico6.setStyle('z-index', '3'); ico6.setStyle('position', 'relative'); ico6.setStyle('margin-left', '-20px'); ico6.setStyle('margin-right', '-10px');
//ico7.setStyle('z-index', '2'); ico7.setStyle('position', 'relative');
  } });


});
