function $t(term){
  document.write(Gucci.getTerm(term));
}

var Gucci = {
  locale: '',
  _animation: { menu: false },
  MAIN_MENU: 0,
  SUB_MENU: 1,
  PAGE_MENU: 2,
  MENU_TIMEOUT: 1000,
  currentMenuPanel: 0,
  _defaultMenuPanel: 0,
  _menuPanelTimeout: null,
  _smallScreen: false,
  _activeSubMenu: -1,
  cubic: function(pos) {
  pos /= 0.5; return pos<1 ? 0.5*pos*pos*pos : 0.5*((pos-2)*(pos-2)*(pos-2)+2);
  },
  _open: { 'menu-left':false, 'menu-right':false },
  projectedWidths: function(){
    var width = Position.getPageSize().window.width-65;
    var contentWidth = $A($('content').cleanWhitespace().childNodes).inject(0,function(memo,node){ return memo+(node.offsetWidth || 0) });
    var fillingWidth = width-contentWidth-(236*2+65);
    return [fillingWidth, contentWidth, width];
  },
  redraw: function(){
    var scrollLeft = Position.scrollX();
    var height     = Position.getPageSize().window.height;
  
    if($('thumbs-icon'))
      $('thumbs-icon').setStyle({ top: ((height-504)/2)+520+'px' });
   
    var t = (height-504)/2;
    $('layout').setStyle({top:(t<0?0:t)+'px'});
    
    if($('filling')){
      if(Gucci.beforeFillingEvent) Gucci.beforeFillingEvent();
      var widths = Gucci.projectedWidths();
      var width = widths[2], contentWidth = widths[1], fillingWidth = widths[0];
      
      if(fillingWidth>0){
        $('filling').show().setStyle({width: width-contentWidth-(236*2+65)+'px'});
        $('wrapper').setStyle({width: width+'px'});
        $('layout').setStyle({width: width+'px'});
      } else {
        $('filling').hide();
        $('wrapper').setStyle({width: contentWidth+(236*2+65)+'px'});
        $('layout').setStyle({width: contentWidth+(236*2+65)+'px'});
      }
    };
    setTimeout( function() {
      $('logo').setStyle({ top: ((height-504)/2)+(Gucci._smallScreen ? 400 : 520)+'px' });
      if($('layout').offsetLeft > 0) $('logo').setStyle({
        marginLeft: $('layout').offsetLeft-68-22+'px'
      });
      $('logo').show();
      if(Engine.isMSIE){
          if(Gucci.id != 'homepage'){
            $('logo').setStyle({
             top:  ((Position.getPageSize().window.height-504)/2)+(Gucci._smallScreen ? 400 : 520)+'px',
             left: (Position.scrollX()+36)+'px'
           });
          }
        var t = (height-504)/2;
        $('layout').setStyle({top:(t<0?0:t)+'px'});
         if(parseInt($("layout").getStyle('width')) < Position.getPageSize().window.width){
              $('minibag').setStyle({'position':'absolute','right':'100px'});
           } else {
             $('minibag').setStyle({'position':'absolute','right': ((Position.getPageSize().window.width - parseInt($('layout').getStyle('width')))*-1) - document.viewport.getScrollOffsets().left + 165 + 'px'});         
           };
           Event.observe(window,'scroll',function(){
            if(Gucci.id != 'homepage'){
             $('logo').setStyle({
               top:  ((Position.getPageSize().window.height-504)/2)+(Gucci._smallScreen ? 400 : 520)+'px',
               left: (Position.scrollX()+36)+'px'
             });
            }
             if(parseInt($("layout").getStyle('width')) < Position.getPageSize().window.width){
                $('minibag').setStyle({'position':'absolute','right':'30px'});
             } else {
               $('minibag').setStyle({'position':'absolute','right': ((Position.getPageSize().window.width - parseInt($('layout').getStyle('width')))*-1) - document.viewport.getScrollOffsets().left + 165 + 'px'});         
             };                
           });
      } else {
        if(parseInt($("layout").getStyle('width')) < Position.getPageSize().window.width){
          $('minibag').setStyle({'position':'absolute'});
        } else {
          $('minibag').setStyle({'position':'fixed'});
        };
      }
    }, 200);
  },
  enableIESupport: function(){
    Gucci.redraw = function(){
      var scrollLeft = Position.scrollX();
      var height     = Position.getPageSize().window.height;
      
      if($('layout').offsetLeft > 0) $('logo').setStyle({
        marginLeft: $('layout').offsetLeft+'px'
      });
      $('logo').setStyle({
        top:  ((Position.getPageSize().window.height-504)/2)+(Gucci._smallScreen ? 400 : 520)+'px',
        left: (Position.scrollX()+36)+'px'
      });
	  
      /*if($('thumbs-icon')) $('thumbs-icon').setStyle({ 
        top: ((height-504)/2)+520+'px'
      });*/
      
      if($('filling')){
        if(Gucci.beforeFillingEvent) Gucci.beforeFillingEvent();
        var widths = Gucci.projectedWidths();
        var width = widths[2], contentWidth = widths[1], fillingWidth = widths[0];
        
        if(fillingWidth>0){
          $('filling').show().setStyle({width: width-contentWidth-(236*2+65)+'px'});
          $('wrapper').setStyle({width: width+'px'});
          $('layout').setStyle({width: width+'px'});
        } else {
          $('filling').hide();
          $('wrapper').setStyle({width: contentWidth+(236*2+65)+'px'});
          $('layout').setStyle({width: contentWidth+(236*2+65)+'px'});
        }
      }
      
      var t = (height-504)/2;
      $('layout').setStyle({top:(t<0?0:t)+'px'});
      if(parseInt($("layout").getStyle('width')) < Position.getPageSize().window.width){
          $('minibag').setStyle({'position':'absolute','right':'100px'});
       } else {
         $('minibag').setStyle({'position':'absolute','right': ((Position.getPageSize().window.width - parseInt($('layout').getStyle('width')))*-1) - document.viewport.getScrollOffsets().left + 165 + 'px'});         
       };
    }
    $('page-body').addClassName('ie6');

    
    var biggerB = parseInt($("layout").getStyle('width')) < Position.getPageSize().window.width
    var calcPos = ((Position.getPageSize().window.width - parseInt($('layout').getStyle('width')))*-1);
    if($('minibag')){
      function _rePositionMinibagAndLogo () {
          $('logo').setStyle({
            top:  ((Position.getPageSize().window.height-504)/2)+(Gucci._smallScreen ? 400 : 520)+'px',
            left: (Position.scrollX()+36)+'px'
          });

        if (biggerB){
          $('minibag').setStyle({'position':'absolute','right': '30px'});
        } else {
           $('minibag').setStyle({'position':'fixed', 'right': '102px'});
        };
      };
      Event.observe(window,'scroll', _rePositionMinibagAndLogo);
    }
  },
  initialize: function(id){
    $('logo').hide();
    
    Gucci.id     = id;
    Gucci.locale = 'de';
    Gucci.parseMenu();
    if(Engine.isMSIE7) {
             Gucci.enableIESupport();
           };
    Event.observe(window,'resize',Gucci.redraw);
    Gucci.redraw();
    
    if(arguments[1]) {
      this._defaultMenuPanel = arguments[1];
      if(Gucci._activeSubMenu>-1 && this._defaultMenuPanel==this.SUB_MENU) {
        Gucci.openSubmenu(Gucci._activeSubMenu,{animation:false});
      } else {
        this.showMenuPanel(arguments[1],{animation:false});
      }
    }
    
    if(Gucci._activeSubMenu>-1) Gucci._renderSubMenu(Gucci._activeSubMenu);
    
    ['menu-left','menu-right'].each(function(side){
      if($(side)){
        Event.observe(side,'mouseout',this.startMenuPanelTimeout.bindAsEventListener(this));
        Event.observe(side,'mousemove',this.clearMenuPanelTimeout.bindAsEventListener(this));
      }
    }.bind(this));
    
    if($('logo') && !$('logo').hasClassName('noscroll')){
		if (typeof salenav!="undefined" && salenav && 1==2) {
			// scroll left for sale pages, no return to main page -- sale over, preventing behavior with '1==2' above
	   		Event.observe('logo','click',function(){new Effect.HScrollTo(0)});
	 		$('logo').up().href = "#";
		}
       else
			Event.observe('logo','click',function(){
        		// oog - copied from getCookie in localize.js

      			var dc = document.cookie;
      			var prefix = "site=";
      			var begin = dc.indexOf("; " + prefix);      
      			if (begin == -1) {
      	  			begin = dc.indexOf(prefix);
      	  			if (begin != 0) return;
      			}
      			else {
      	  			begin += 2;
      			}
      			var end = document.cookie.indexOf(";", begin);
      			if (end == -1) {
      	  			end = dc.length;
      			}
      			var page = '/' + unescape(dc.substring(begin + prefix.length, end))
          		+ '/index2.html';
      			prefix = "";
      			var durl = document.URL;
      			begin = durl.indexOf('://');
      			if(begin != -1) {
      	  			begin += 3;
      	  			end = durl.indexOf('/', begin);
      	  			if(end != -1) {
      	    			prefix = 'http://' + unescape(durl.substring(begin, end));
      	  			}
      			}
				Gucci.hbxHit('guccilogo');
        		document.location = prefix + page;
      		});  
    }
    $$('div.spacer-column').each(function(s,i){
      Event.observe(s,'click',function(event){
        Gucci.spacerEvent ? Gucci.spacerEvent(i, Event.localPointer(event)[0]<33 ? 1 : -1) : 
          new Effect.HScroll(Event.localPointer(event)[0]<33 ? 821 : -821);
      });
      Event.observe(s,'mousemove',function(event){
        var d = Event.localPointer(event)[0]<33 ? '-65' : '-130';
        s.style.backgroundPosition = d + 'px 0px';
      });
      Event.observe(s,'mouseout',function(event){
        s.style.backgroundPosition = '0px 0px';
      });
    });
    
  	if (typeof freeshipping != 'undefined' && freeshipping && $$('ul.legal-information') && $$('ul.legal-information').length > 0) {
  		var legalul = $$('ul.legal-information')[0];

  		var freeshipelement = document.createElement('li');
  		var freeshiplink = document.createElement('a');
  		var freeshiptext = document.createTextNode('free shipping');

  		freeshiplink.setAttribute("href","#");
  		freeshiplink.onclick = function() {Gucci.openPopup('/'+getCookie('site')+'/'+getCookie('language')+'/'+getCookie('site')+'/'+'popup_freeshipping.shtml'); return false;};
  		//freeshiplink.setAttribute("onclick","Gucci.openPopup('../../popup_freeshipping.shtml'); return false;");

  		freeshiplink.appendChild(freeshiptext);
  		freeshipelement.appendChild(freeshiplink);
  		legalul.appendChild(freeshipelement);
  	}    
    
    if(Engine.isMSIE) $$('a').each(function(n){ n.hidefocus = 'hidefocus' })
  },
  
  setSpacerEvent: function(callback){
    Gucci.spacerEvent = callback;
  },
  
  setOnBeforeFilling: function(callback){
    Gucci.beforeFillingEvent = callback;
  },
  
  setCustomTimeoutMenuEvent: function(e){
    this._customTimeoutMenuEvent = e;
  },
  
  startMenuPanelTimeout: function(event){
    if($('menu-left')) {
      var p = Event.localPointer(event,'menu-left');
      if(p[0]>0 && p[0]<236 && p[1]>0 && p[1]<504) return;
    }
    if($('menu-right')) {
      var p = Event.localPointer(event,'menu-right');
      if(p[0]>0 && p[0]<236 && p[1]>0 && p[1]<504) return;
    }
    this.clearMenuPanelTimeout();
    this._menuPanelTimeout = setTimeout(function(){
      if(Gucci._customTimeoutMenuEvent) {
        Gucci._customTimeoutMenuEvent();
        return;
      }
      Gucci.showMenuPanel(Gucci._defaultMenuPanel,{restore:true}) 
    }, Gucci.MENU_TIMEOUT);
  },
  clearMenuPanelTimeout: function(){
    if(this._menuPanelTimeout) {
      clearTimeout(this._menuPanelTimeout);
      this._menuPanelTimeout = null
    }
  },
  getTerm: function(term) {
    return Gucci._menu ? (Gucci._menu.term[term] || '!('+term+')') : '!(menu?)';
  },
  getScaledLayoutFactor: function(delta) {
    var curWidth = $('wrapper').offsetWidth;
    return ((curWidth+delta)/curWidth)*100;
  },
  scaleLayout: function(delta) {
    var pct = this.getScaledLayoutFactor(delta);
    return [
      new Effect.Scale('wrapper',pct, {scaleY:false,scaleContent:false,sync:true}),
      new Effect.Scale('layout', pct, {scaleY:false,scaleContent:false,sync:true})
    ]
  },
  setMenu: function(menu){
    Gucci._menu = menu;
  },
  parseMenu: function(){
    function _renderItem(item){
      var cl = (Gucci.id == item.id) ? ['active'] : [];
      if(item.klass) cl.push(item.klass);
      var c = '';
      var url = "http://" + location.host + item.url;
      if(item.secure) {
        url = "https://" + location.host + item.url;
      } 
      if(cl.length>0) c = ' class="'+cl.join(' ')+'"';
      
      Gucci._menuPanel += '<p><a href="'+url+'"'+c+'>'+item.name.gsub(/\n/,'<br/>').gsub(/\s/,'&nbsp;')+'</a></p>';
    }
    function _renderSubmenuItem(item){
      if(Gucci.id == item.id){
        Gucci._activeSubMenu = currentSubmenu;
      }
      var cl = (Gucci.id == item.id) ? ['active'] : [];
      if(item.klass) cl.push(item.klass);
      var c = '';
      if(cl.length>0) c = ' class="'+cl.join(' ')+'"';
      
      Gucci._subMenus[currentSubmenu] += '<p><a href="http://' + location.host + item.url+'"'+c+'>'+item.name.gsub(/\n/,'<br/>').gsub(/\s/,'&nbsp;')+'</a></p>';
    }
    function _renderSubmenu(submenu){
      currentSubmenu++;
      Gucci._subMenus.push('');
      
      var cl = ['submenu'];
      if(submenu.klass) cl.push(submenu.klass);
      
      Gucci._menuPanel += '<p><a class="'+cl.join(' ')+'" href="#" onclick="Gucci.openSubmenu('+currentSubmenu+'); return false">'+submenu.name.gsub(/\s/,'&nbsp;')+'</a></p>';
      if(submenu.item) submenu.item.each(_renderSubmenuItem);
    }
    function _renderList(list){
      if(list.item) list.item.each(_renderItem);
      if(list.submenu) list.submenu.each(_renderSubmenu);
    }
    function _renderBlock(block){
      if(block.item) block.item.each(_renderItem);
      if(block.list) block.list.each(_renderList);
      Gucci._menuPanel += '<br/>';
    }
    var currentSubmenu = -1;
    
    Gucci._menuPanel = '';
    Gucci._subMenus  = [];
    //Gucci._menu.block.each(_renderBlock);
    
    ['menu-left','menu-right'].each(function(side){
      if($(side+'-main')) $(side+'-main').update(Gucci._menuPanel);
    });
  },
  _renderSubMenu: function(submenu, custom){
    submenu = custom ? custom : Gucci._subMenus[submenu];
    if($('menu-left-submenu')) $('menu-left-submenu').update(submenu+
      '<p class="level-up"><a href="#" onclick="Gucci.showMenuPanel(Gucci.MAIN_MENU);return false">' +
      Gucci._menu.term.main +
      '</a></p>'
    );
    if($('menu-right-submenu')) $('menu-right-submenu').update(submenu+
      '<p class="level-up"><a href="#" onclick="Gucci.showMenuPanel(Gucci.MAIN_MENU);return false">' +
      Gucci._menu.term.main +
      '</a></p>'
    );
  },
  showMenuPanel: function(panel){
    if(Gucci._animation.menu) return;
    
    var options =  Object.extend({
      animation: true,
      restore:   false,
      custom:    false
    }, arguments[1] || {});
    
    if(options.restore && Gucci._activeSubMenu>-1){
      Gucci._renderSubMenu(Gucci._activeSubMenu, options.custom);
    }
    
    if(!options.animation){
      if($('menu-left-scroll')) {
        $('menu-left-scroll').style.left = -$('menu-left').offsetWidth * panel + 'px';
        $('menu-left-background').style.left = -$('menu-left').offsetWidth * panel + 'px';
      }
      if($('menu-right-scroll')) {
        $('menu-right-scroll').style.left = -$('menu-right').offsetWidth * (2-panel) + 'px';
        $('menu-right-background').style.left = -$('menu-right').offsetWidth * (2-panel) + 'px';
      }
      Gucci.currentMenuPanel = panel;
      return;
    }
    
    Gucci._animation.menu = true;
    if($('menu-left-scroll')) new Effect.Move('menu-left-scroll',{ 
      x: -(panel-Gucci.currentMenuPanel)*$('menu-left').offsetWidth,
      transition: Gucci.cubic, 
      duration: 0.6,
      afterUpdate: function(){
        $('menu-left-background').style.left = $('menu-left-scroll').style.left;
      },
      afterFinish: function(){
        Gucci.currentMenuPanel = panel;
        Gucci._animation.menu = false;
      }
    });
    if($('menu-right-scroll')) new Effect.Move('menu-right-scroll',{ 
      x: (panel-Gucci.currentMenuPanel)*$('menu-right').offsetWidth,
      transition: Gucci.cubic, 
      duration: 0.6,
      afterUpdate: function(){
        $('menu-right-background').style.left = $('menu-right-scroll').style.left;
      },
      afterFinish: function(){
        Gucci.currentMenuPanel = panel;
        Gucci._animation.menu = false;
      }
    });
  },
  openSubmenu: function(submenu){
    if(Gucci._animation.menu) return;
    if($('menu-left-submenu')) $('menu-left-submenu').update(Gucci._subMenus[submenu]+
      '<p class="level-up"><a href="#" onclick="Gucci.showMenuPanel(Gucci.MAIN_MENU);return false">' +
      Gucci._menu.term.main +
      '</a></p>'
    );
    if($('menu-right-submenu')) $('menu-right-submenu').update(Gucci._subMenus[submenu]+
      '<p class="level-up"><a href="#" onclick="Gucci.showMenuPanel(Gucci.MAIN_MENU);return false">' +
      Gucci._menu.term.main +
      '</a></p>'
    );
    
    Gucci.showMenuPanel(Gucci.SUB_MENU,arguments[1]||null);
  },
  getPageFragmentIdentifier: function(){
    return location.href.split('#')[1];
  },
  setPageFragmentIdentifier: function(productData) {
    var url = location.href.split('#');
	if (location.href.indexOf('/womens-runway/') != -1 || location.href.indexOf('/mens-runway/') != -1 || location.href.indexOf('/womens-fashion/') != -1)
		location.href = url[0] + '#' + productData;
	else
    	location.href = url[0] + '#' + Object.values(productData).join('-');
  },  
  openPopup: function(url) {
    var w = window.open(url,'gucci','height=450,width=395,directories=no,location=no,menubar=no,scrollbars=yes,status=no,toolbar=no,resizable=no');
    w.focus();
  },
  _scrollPanels: {},
  scrollPanel: function(panel, handle, track, scrollHeight) {
    if(panel.scrollHeight > (scrollHeight || 372)) {
      panel.addClassName('with-scrollbar');
      $(track).setStyle({ 'display': 'block' });
      this._scrollPanels[panel] = new Control.Slider( handle, track, { 
        axis: 'vertical',
        onSlide:function(v) { 
          var height = panel.scrollHeight;
          panel.scrollTop = (v*(height-(scrollHeight || 372)));
        },
        onChange:function(v) {
          var height = panel.scrollHeight;
          panel.scrollTop = (v*(height-(scrollHeight || 372)));
        }
      });
      wheelCallback = function(delta){
        var factor = Engine.isKHTML ? 0.03 : 0.07;
        Gucci._scrollPanels[panel].setValueBy(delta > 0 ? -factor : factor);
      }
    } else {
      //display none for scrollbar if not needed
      track.setStyle({display: "none"});
    }
  },
  centerPanel: function(panel, width){
    panel = $(panel);
    width = width || panel.offsetWidth;
    Position.prepare();
    var w = Position.getPageSize().window.width;
    var p = Position.cumulativeOffset(panel)[0];
    var d = (p - (w - width)/2) - Position.scrollX();
    if(d == 0) return false;    
    new Effect.HScroll(d,Object.extend({
      duration: (Math.log(Math.abs(d*d))/10),
      transition: Gucci.cubic
    }, arguments[2] || {}));
  },
  hbxHit: function(pageName){
     	if(typeof hbx != 'undefined') {
  	  var site = siteStuff.getSiteFromCookie();
  	  var t = siteStuff.getSiteData(site);
  	  if(t == null) {
  		t = {};
  		t.hbxRegion = "unknown";
  		t.region = "unknown";
  		t.language = "unknown";
  	  }
  	
  	  _hbSet('cpv.cacct',hbxCommerce);
        _hbSet('cpv.bd','Gucci');	
  	  var mlc2 = pageName+';/'+t.region+'/'+t.language+'/'+pageName+';/'+t.hbxRegion+'/'+t.region+'/'+t.language+'/'+pageName;
        _hbPageView(pageName,mlc2);
      }
  }
}

if(typeof localizedMenu != "undefined") document.write('<script type="text/javascript" src="'+localizedMenu+'"></script>');


/***********************************
	
	Variations Class
	Copyright wollzelle GmbH, 2008
	
***********************************/

var GUCCI = {};

GUCCI.VariationPanel = Class.create({
	initialize: function(mainObj, lightbox, lightboxObject, options) {
		this.options = {};
		Object.extend(this.options, options || {});
		
		/* Variations related */
		this.lightboxEl = $(lightbox);
		this.lightboxElObject = lightboxObject;
		this.DOMinitialized = false;
		this.variationsMap = [];
		this.mainObj = mainObj;

		
		/* Tooltips realted */
		this.tooltipTextFadeDuaration = 0.3;
		this.tooltipVisible = false;
		this.toolipTimeout = null;
	},
	buildPanel: function(){
		var i = this.lightboxEl.id;

	    this.lightboxEl.insert('<div class="variants" style="display:none; width: 0" id="' + i + '_variants">' +
	      '<div id="' + i + '_current-style-marker" class="current-style-marker"> </div>' +
	      '<div id="' + i + '_hover-style-marker" class="hover-style-marker" > </div>' +
	      '<div class="image-container" id="' + i + '_imagecontainer"></div>' +
	      '<div class="info" id="' + i + '_info" style="display:none"><div></div></div>' +
	      '</div>');
	
		//lightbox.down('div.variants').setStyle({left:'780px',width:'0px',display:'none'});
		
		this.DOMinitialized = true;
	},
	buildVariationsMap: function() {
		var imageContainer =  $(this.lightboxEl.id + '_imagecontainer');
		var images = imageContainer.select('img');
		for (var i = 0; i < images.length; i++) {
			var image = images[i];
			var position = Position.cumulativeOffset(image);
			var map = {
				image: image,
				x1: position[0],
				y1: position[1],
				x2: position[0] + image.getWidth(),
				y2: position[1] + image.getHeight()
			};
			this.variationsMap.push(map);
		}
	},
	prepareAndOpenVariation: function(variation, i) {
		var img;
		if (variation.images.thumb == '' || !variation.images.thumb) {
			// to activate textual overlays, do uncomment
			//naText = new Element('span', { className: 'not_available' });
			//naText.update(Gucci.getTerm('variation image unavailable'));
			img = new Element('img', { src: Gucci.variationsThumbUnavailable , alt: '' });
		} else {
			img = new Element('img', { src: variation.images.thumb, alt: '' });
		}

		if (Prototype.Browser.IE) {
			img.style.filter = "progid:DXImageTransform.Microsoft.AlphaImageLoader(src='" + img.src + "',sizingMethod='scale')";
			img.src = Shop.THUMB_EMPTY;
		}

		img.observe('mouseover', function(event) {
			this.showInfo(event, variation, i);
		}.bind(this));

		img.observe('tooltip:renew', function(event) {
			this.showInfo(event, variation, i);
		}.bind(this));

		return img;
	},
	prepareAndOpenVariations: function(thumbId) {
		var displayGroup = this.options.getDisplayGroupFromThumbId(thumbId);
		if (!displayGroup) return;
		
		var variations = displayGroup.getVariationsWithLeadStyleFirst();
		
		// If the product has only one variation we'll not show the variation panel. If the VP already shown we'll hide it.
		if(variations.length <= 1 && (typeof(GucciSearch)=='undefined')) {
			this.closeVariations();
			return;
		}
		
		// Building DOM elements
		if(!this.DOMinitialized) this.buildPanel();
		
		var colsCount = (variations.length/6).ceil();
		var imageContainer = $(this.lightboxEl.id + '_imagecontainer');
		imageContainer.setStyle({width: (colsCount * 65) + 'px', opacity: 0}).update('');

		var cols = [];
		colsCount.times(function(i) {
			cols.push(new Element('div', { className: 'variations-col' }));
			imageContainer.insert(cols[i]);
		});

		variations.each(function(variation, i){
			var img = this.prepareAndOpenVariation(variation, i);
			var colToInsert = cols[(i > 5) ? 1 : 0];
			colToInsert.insert(img);
		}.bind(this));

		$(this.lightboxEl.id + '_hover-style-marker').observe('mouseout', this.hideInfo.bindAsEventListener(this));
		this.openVariations(thumbId);
	},
	openVariations: function(thumbId) {
	  var displayGroupInfo = this.options.getDisplayGroupFromThumbId(thumbId);
	  if (!displayGroupInfo) return;
		var width = (displayGroupInfo.variations.length/6).ceil() * 65;
		var lightboxContainer = this.lightboxEl;
		var variantsContainer = $(this.lightboxEl.id + '_variants');
		var imageContainer    = $(this.lightboxEl.id + '_imagecontainer');
		var hoverStyleMarker  = $(this.lightboxEl.id + '_hover-style-marker').hide();
		var currentStyleMarker  = $(this.lightboxEl.id + '_current-style-marker').setOpacity(0).show();
		
		// In search results for 1 product we need an actual width of the lightbox container. For all other cases it's fixed 
		var lightboxContainerWidth = (typeof(GucciSearch)!='undefined') ? lightboxContainer.down('.container').getWidth() : 780;
		
		variantsContainer.show();
    	var _self = this;

		new Effect.Parallel([
			new Effect.Morph(variantsContainer, { style: 'width:' + width + 'px', sync: true }),
			new Effect.Morph(lightboxContainer, { style: 'width:' + (lightboxContainerWidth + width) + 'px', sync: true })
		].concat(Gucci.scaleLayout(width)),
		{
			transition: Gucci.cubic,
			duration: .7,
			queue: 'end',
			afterFinish: function() {        
				lightboxContainer.down('div.shadow-right').setStyle({visibility:'visible'});
				variantsContainer.setStyle({overflow:'visible'});
				this.buildVariationsMap();

				// reposition current style marker for Firefox2
				this.repositionCurrentStyleMarker(thumbId);

				new Effect.Morph(imageContainer, {
					style: { opacity: '1' },
					transition: Gucci.cubic,
					duration: 0.7,
					afterFinish: function() {
						currentStyleMarker.morph('opacity:0.46', { duration: 0.7 });
					}
				});
				_self.mainObj.adjustLayoutWidth();
			}.bind(this),
			beforeStart: function() {
				this.lightboxEl.down('div.shadow-right').setStyle({visibility:'hidden'});
			}.bind(this)
		});
	},
	clearVariations: function(){
		var imageContainer = $(this.lightboxEl.id + '_imagecontainer');
		var currentStyleMarker  = $(this.lightboxEl.id + '_current-style-marker')
		
		if(!imageContainer && !currentStyleMarker) return;
		
		new Effect.Parallel([
			new Effect.Morph(imageContainer, { style: "opacity: 0", sync: true}),
			new Effect.Fade(currentStyleMarker, { style: "opacity: 0", sync: true})
		], {
			transition: Gucci.cubic, 
			duration: 0.7
		});
	},
	selectVariation: function(event, thumbId, styleIndex) {
	  if (this.lightboxEl.isBusy()) return;
	  
		var displayGroup = this.options.getDisplayGroupFromThumbId(thumbId);
		var stylenumberToSelect = displayGroup.getStyleNumbersWithLeadStyleFirst()[styleIndex];

		var displayGroupInfo = this.options.DomIdToDisplayGroup.get(thumbId);
		displayGroupInfo.currentStyle = stylenumberToSelect;

		this.repositionCurrentStyleMarker(thumbId);
		this.lightboxEl.down('div.current-style-marker').setStyle('opacity:0').morph('opacity:0.46');

		var selectedThumb = $(thumbId).down('img') || $(thumbId).down('div.panel-thumb-unavailable') || $(thumbId);
		this.mainObj.selectStyle(selectedThumb, stylenumberToSelect);

		var newThumb = this.mainObj.changeThumbnail($(thumbId), displayGroup.getProduct(displayGroupInfo.currentStyle));
		this.lightboxEl.activeThumbnail = newThumb.up();
		this.lightboxElObject.activeProduct = newThumb;

		// TODO: make this work for variation tooltips
		this.hideInfo(event);
	},
  closeVariations: function(options) {
  		var variants = $(this.lightboxEl.id + '_variants');
		var lightbox = this.lightboxEl;
  		var options = options || {};
  		// If no variations exist, then exit
  		if(!variants) {
				if (options.afterFinish)
             		options.afterFinish();
	   			return;
		}

		new Effect.Parallel([
			new Effect.Morph(variants, { style: 'width: 0px', sync: true }),
			new Effect.Morph(lightbox, { style: 'width: 780px', sync: true })
		], 	
		{
  			transition: Gucci.cubic,
  			duration: .7,
  			beforeStart: function() {
  				variants.setStyle({ overflow:'hidden', borderLeft: "" });
  				this.lightboxEl.down('div.shadow-right').setStyle({visibility:'hidden'});
  				this.lightboxEl.down('div.shadow-bottom').setStyle({visibility:'hidden'});
  			}.bind(this),
  			afterFinish: function() {
  				variants.hide();
  				this.mainObj.adjustLayoutWidth();
  				this.lightboxEl.down('div.shadow-right').setStyle({visibility:'visible'});
  				this.lightboxEl.down('div.shadow-bottom').setStyle({visibility:'visible'});
  				if (options.afterFinish)
             		options.afterFinish();
  			}.bind(this)
  		});
	},
	repositionCurrentStyleMarker: function(thumbId) {
		var displayGroupInfo = this.options.DomIdToDisplayGroup.get(thumbId);
		var displayGroup = this.options.getDisplayGroupFromThumbId(thumbId);

		for (var idx=0;idx<displayGroup.variations.size();idx++) {
			if (displayGroup.variations[idx].style_number == displayGroupInfo.currentStyle) {
				currentThumbIndex = idx; break;
			}
		}

		var i = $(this.lightboxEl.id + '_imagecontainer').select('img')[currentThumbIndex];
		var p = [i.offsetLeft, i.offsetTop];
		$(this.lightboxEl.id + '_current-style-marker').setStyle('top:'+p[1]+'px;left:'+p[0]+'px');
	},
	showInfo: function(event, variation, variationsIndex) {
		var currentImg = event.element();
		
		this.tooltipMovedLeft = false;
		
		if(Engine.isMSIE6)
			this.prepareIE('hidden');

		function cutText(tooltip) {
			var tooltip_p = tooltip.down('p');
			if (tooltip_p.scrollHeight <= 48) {  
				return;
			}
			tooltip_p.setStyle({ height: '36px' }); 
			tooltip.getElementsByClassName("infotext")[0].down('p').insert({after:'<div class="more">[…]</div>'}); 
		}

		if (this.toolipTimeout) {
			clearTimeout(this.toolipTimeout);
		}
		var tooltip = this.lightboxEl.down('div.info');
		if (this.mainObj.currentInfo == variation) {
			return;
		}

		this.mainObj.currentInfo = variation;
		var headerText = variation.formatStyleNumber(' ');
		var text = '<div class="info-bg">' +
		'<div style="opacity:0" class="info-fade">' +
		'<div class="wrapper">' +
		(!variation.images.thumb ? '<div class="message">' + Gucci.getTerm('photo unavailable') + '</div>' : '') +
		'<h1>'+ headerText +'</h1><div class="infotext">' +
		'<p>' + (variation.text.vardesc ? variation.text.vardesc.escapeHTML() : '') + '</p></div>' +
		'<p class="price">' +
		(variation.priceDisplay ? variation.priceDisplay : '') +
		'</p></div>' +
		'</div>' +
		'</div>';
		
		var hoverStyleMarkerId = this.lightboxEl.id + '_hover-style-marker';
		var hoverStyleMarker = $(hoverStyleMarkerId);
		if (hoverStyleMarker) {
			hoverStyleMarker.remove();
		}
		hoverStyleMarker = new Element('div', { id: hoverStyleMarkerId });

		this.__hoverStyleMarkerPosition = {
			x: event.element().offsetLeft,
			y: event.element().offsetTop
		};

		hoverStyleMarker.setStyle({
			top: this.__hoverStyleMarkerPosition.y + 'px',
			left: this.__hoverStyleMarkerPosition.x + 'px'
		}).addClassName('hover-style-marker');
		var thumbId = this.options.getThumbIdFromDisplayGroupId(variation._parent.displayGroup_id);
		
		hoverStyleMarker.observe('click', this.selectVariation.bindAsEventListener(this, thumbId, variationsIndex));

		if (!this.__detailswrapper_observed) {
			var wrapper = $(this.lightboxEl.id + '_details-wrapper') || this.lightboxEl.getChild('details');
			this._detailsWrapperMouseOverHandler = this.detailsWrapperMouseOverHandler.bindAsEventListener(this, this.lightboxElObject, wrapper);
			wrapper.observe('mouseover', this._detailsWrapperMouseOverHandler);
			this.__detailswrapper_observed = true;
		}
		hoverStyleMarker.observe('mouseout', this.hideInfo.bindAsEventListener(this));
		$(this.lightboxEl.id + '_variants').insertBefore(hoverStyleMarker, $(this.lightboxEl.id + '_info'));

		// move tooltip out of the way
		// afterFinish, check if the mouse is positioned above another image
		// if so, fire a custom event which calls Shop.info again to dispaly the correct tooltip
		if (!this.__tooltip_observed) {
			this.__tooltip_observed = true;
			tooltip.observe('mouseover', function(event) {
				if(event.element() != tooltip && event.element() != tooltip.down('.info-bg'))
					return;
				
				var imgParentOffset = this.__hoverStyleMarkerPosition.x;
				var morphTarget = imgParentOffset == 130 ? -125 : -190;
				
				this.tooltipMovedLeft = true;
				
				tooltip.morph({ left: morphTarget + 'px' }, {
					duration: this.tooltipTextFadeDuaration,
					afterFinish: function() {
						var mouseX = Shop._currentMousePosX + Position.scrollX();
						var mouseY = Shop._currentMousePosY;						
						var mapEntry = this.variationsMap.find(function(map){
							if (mouseX >= map.x1 && mouseX < map.x2 && mouseY >= map.y1 && mouseY < map.y2)
								return true;
						});
						if (mapEntry) {
							var displayGroupInfo = this.options.DomIdToDisplayGroup.get(thumbId);
							var currentThumbIndex = displayGroupInfo.currentThumbIndex || 0;
							var currentImage = this.lightboxEl.select('div.variants div.image-container img')[currentThumbIndex];
							// don't fire if this images is currently selected
							if(currentImage != mapEntry.image) {
								$(mapEntry.image).fire('tooltip:renew');
							}
						} else {
							this.hideInfo(event);
						}
					}.bind(this)
				});
			}.bind(this));
		}

		i = this.lightboxEl.select('div.variants div.image-container img')[variationsIndex];
		var p = [i.offsetLeft, i.offsetTop];
		var y = p[1]==0 ? 0 : (p[1] == 420 ? 360 : p[1] - 30);

		if (!this.tooltipVisible) {
			tooltip.update(text).setStyle({
				top:y+'px',
				left:(p[0]-190)+'px',
				opacity:1,
				display:'none'
			});
			
			tooltip.down('div.info-fade').setStyle({opacity: 1});
			cutText(tooltip);
			
			if(Prototype.Browser.IE) {
				cutText(tooltip);
				tooltip.show();
			} else {
				if(this.tooltipFX) this.tooltipFX.cancel();
				tooltip.appear({duration: this.tooltipTextFadeDuaration});
			}
		} else {
			var effx=[];
			effx.push(new Effect.Morph(tooltip,{style: {top: y+'px',left: (p[0]-190)+'px'}, duration: this.tooltipTextFadeDuaration}));
			effx.push(new Effect.Fade(tooltip.down('div.info-fade'), {duration: this.tooltipTextFadeDuaration}));
			new Effect.Parallel(effx, {duration: this.tooltipTextFadeDuaration,
				afterFinish: function () {
					tooltip.update(text);
					cutText(tooltip);
					tooltip.down('div.info-fade').appear({duration: this.tooltipTextFadeDuaration});
				}.bind(this)
			}); 
		}
		this.tooltipVisible = true;
	},
	hideInfo: function(event) {
		var tooltip = this.lightboxEl.down('div.info');
		if (!this.tooltipVisible) {
			return;
		}
		if (this.toolipTimeout) {
			clearTimeout(this.toolipTimeout);
		}
		var currentTarget = event.element();
		this.toolipTimeout = setTimeout(function() {
			// ensure info tooltip is hidden only when cursor is not over another variation
			if (currentTarget && !currentTarget.hasClassName("details-wrapper") && (this.tooltipMovedLeft && parseInt(tooltip.getStyle('left'), 10) > -190) )
				return;
			
			if(Prototype.Browser.IE) {
				tooltip.hide();
				if(!Shop._sizeGuideOpen)
					this.prepareIE('visible');
			} else {
				this.tooltipFX = new Effect.Fade(tooltip, {
					duration: this.tooltipTextFadeDuaration
				});
			}
			this.tooltipVisible = false;
			this.tooltipMovedLeft = false;
			$(this.lightboxEl.id + '_hover-style-marker').hide();
			this.mainObj.currentInfo = -1;
				
		}.bind(this), 100);
	},
	detailsWrapperMouseOverHandler: function(event, lightboxObject, wrapper) {
		this.hideInfo(event);
		wrapper.stopObserving('mouseover', this._detailsWrapperMouseOverHandler);
		lightboxObject.__detailswrapper_observed = false;
	},
	prepareIE: function(visibility){
		$$('select').invoke('setStyle', {visibility: visibility});
	}
});