Index: tensions/Wood/fix-ie7.css
===================================================================
--- /extensions/Wood/fix-ie7.css	(revision 25980)
+++ 	(revision )
@@ -1,3 +1,0 @@
-#theImage.infoshown			{ float: left;}
-#theImage.infohidden		{ float: right;}
-#imageToolBar .actionButtons	{ float: right;}
Index: /extensions/Wood/js/masonry.js
===================================================================
--- /extensions/Wood/js/masonry.js	(revision 25981)
+++ /extensions/Wood/js/masonry.js	(revision 25981)
@@ -0,0 +1,460 @@
+/**
+ * jQuery Masonry v2.0.110517 beta
+ * The flip-side of CSS Floats.
+ * jQuery plugin that rearranges item elements to a grid.
+ * http://masonry.desandro.com
+ *
+ * Licensed under the MIT license.
+ * Copyright 2011 David DeSandro
+ */
+ 
+(function( window, $, undefined ){
+
+  /*
+   * smartresize: debounced resize event for jQuery
+   *
+   * latest version and complete README available on Github:
+   * https://github.com/louisremi/jquery.smartresize.js
+   *
+   * Copyright 2011 @louis_remi
+   * Licensed under the MIT license.
+   */
+
+  var $event = $.event,
+      resizeTimeout;
+
+  $event.special.smartresize = {
+    setup: function() {
+      $(this).bind( "resize", $event.special.smartresize.handler );
+    },
+    teardown: function() {
+      $(this).unbind( "resize", $event.special.smartresize.handler );
+    },
+    handler: function( event, execAsap ) {
+      // Save the context
+      var context = this,
+          args = arguments;
+
+      // set correct event type
+      event.type = "smartresize";
+
+      if ( resizeTimeout ) { clearTimeout( resizeTimeout ); }
+      resizeTimeout = setTimeout(function() {
+        jQuery.event.handle.apply( context, args );
+      }, execAsap === "execAsap"? 0 : 100 );
+    }
+  };
+
+  $.fn.smartresize = function( fn ) {
+    return fn ? this.bind( "smartresize", fn ) : this.trigger( "smartresize", ["execAsap"] );
+  };
+
+
+
+// ========================= Masonry ===============================
+
+
+  // our "Widget" object constructor
+  $.Mason = function( options, element ){
+    this.element = $( element );
+
+    this._create( options );
+    this._init();
+  };
+  
+  // styles of container element we want to keep track of
+  var masonryContainerStyles = [ 'position', 'height' ];
+  
+  $.Mason.settings = {
+    isResizable: true,
+    isAnimated: false,
+    animationOptions: {
+      queue: false,
+      duration: 500
+    },
+    gutterWidth: 0,
+    isRTL: false,
+    isFitWidth: false
+  };
+
+  $.Mason.prototype = {
+
+    _getBricks: function( $elems ) {
+      var selector = this.options.itemSelector,
+          // if there is a selector
+          // filter/find appropriate item elements
+          $bricks = !selector ? $elems : 
+            $elems.filter( selector ).add( $elems.find( selector ) );
+      $bricks
+        .css({ position: 'absolute' })
+        .addClass('masonry-brick');
+      return $bricks;
+    },
+    
+    // sets up widget
+    _create : function( options ) {
+      
+      this.options = $.extend( true, {}, $.Mason.settings, options );
+      
+      this.styleQueue = [];
+      // need to get bricks
+      this.reloadItems();
+
+
+      // get original styles in case we re-apply them in .destroy()
+      var elemStyle = this.element[0].style;
+      this.originalStyle = {};
+      for ( var i=0, len = masonryContainerStyles.length; i < len; i++ ) {
+        var prop = masonryContainerStyles[i];
+        this.originalStyle[ prop ] = elemStyle[ prop ] || null;
+      }
+
+      this.element.css({
+        position : 'relative'
+      });
+      
+      this.horizontalDirection = this.options.isRTL ? 'right' : 'left';
+      this.offset = {};
+      
+      // get top left position of where the bricks should be
+      var $cursor = $( document.createElement('div') );
+      this.element.prepend( $cursor );
+      this.offset.y = Math.round( $cursor.position().top );
+      // get horizontal offset
+      if ( this.options.isRTL ) {
+        this.offset.x = Math.round( $cursor.position().left );
+      } else {
+        $cursor.css({ 'float': 'right', display: 'inline-block'});
+        this.offset.x = Math.round( this.element.outerWidth() - $cursor.position().left );
+      }
+      $cursor.remove();
+
+      // add masonry class first time around
+      var instance = this;
+      setTimeout( function() {
+        instance.element.addClass('masonry');
+      }, 0 );
+      
+      // bind resize method
+      if ( this.options.isResizable ) {
+        $(window).bind( 'smartresize.masonry', function() { 
+          instance.resize();
+        });
+      }
+      
+    },
+  
+    // _init fires when your instance is first created
+    // (from the constructor above), and when you
+    // attempt to initialize the widget again (by the bridge)
+    // after it has already been initialized.
+    _init : function( callback ) {
+      
+      this.reLayout( callback );
+
+    },
+
+    option: function( key, value ){
+      
+      // get/change options AFTER initialization:
+      // you don't have to support all these cases,
+      // but here's how:
+    
+      // signature: $('#foo').bar({ cool:false });
+      if ( $.isPlainObject( key ) ){
+        this.options = $.extend(true, this.options, key);
+    
+      // signature: $('#foo').option('cool');  - getter
+      } else if ( key && typeof value === "undefined" ){
+        return this.options[ key ];
+        
+      // signature: $('#foo').bar('option', 'baz', false);
+      } else {
+        this.options[ key ] = value;
+      }
+    
+      return this; // make sure to return the instance!
+    },
+    
+    // ====================== General Layout ======================
+
+    // used on collection of atoms (should be filtered, and sorted before )
+    // accepts atoms-to-be-laid-out to start with
+    layout : function( $bricks, callback ) {
+
+      // layout logic
+      var $brick, colSpan, groupCount, groupY, groupColY, j;
+      
+      for (var i=0, len = $bricks.length; i < len; i++) {
+        $brick = $( $bricks[i] );
+        //how many columns does this brick span
+        colSpan = Math.ceil( $brick.outerWidth(true) / this.columnWidth );
+        colSpan = Math.min( colSpan, this.cols );
+
+        if ( colSpan === 1 ) {
+          // if brick spans only one column, just like singleMode
+          this._placeBrick( $brick, this.cols, this.colYs );
+        } else {
+          // brick spans more than one column
+          // how many different places could this brick fit horizontally
+          groupCount = this.cols + 1 - colSpan;
+          groupY = [];
+
+          // for each group potential horizontal position
+          for ( j=0; j < groupCount; j++ ) {
+            // make an array of colY values for that one group
+            groupColY = this.colYs.slice( j, j+colSpan );
+            // and get the max value of the array
+            groupY[j] = Math.max.apply( Math, groupColY );
+          }
+        
+          this._placeBrick( $brick, groupCount, groupY );
+        }
+      }
+      
+      // set the size of the container
+      var containerSize = {};
+      containerSize.height = Math.max.apply( Math, this.colYs ) - this.offset.y;
+      if ( this.options.isFitWidth ) {
+        containerSize.width = this.cols * this.columnWidth - this.options.gutterWidth;
+      }
+      this.styleQueue.push({ $el: this.element, style: containerSize });
+
+      // are we animating the layout arrangement?
+      // use plugin-ish syntax for css or animate
+      var styleFn = !this.isLaidOut ? 'css' : (
+            this.options.isAnimated ? 'animate' : 'css'
+          ),
+          animOpts = this.options.animationOptions;
+
+      // process styleQueue
+      var obj;
+      for (i=0, len = this.styleQueue.length; i < len; i++) {
+        obj = this.styleQueue[i];
+        obj.$el[ styleFn ]( obj.style, animOpts );
+      }
+
+      // clear out queue for next time
+      this.styleQueue = [];
+
+      // provide $elems as context for the callback
+      if ( callback ) {
+        callback.call( $bricks );
+      }
+      
+      this.isLaidOut = true;
+
+      return this;
+    },
+    
+    // calculates number of columns
+    // i.e. this.columnWidth = 200
+    _getColumns : function() {
+      var container = this.options.isFitWidth ? this.element.parent() : this.element,
+          containerWidth = container.width();
+      
+      this.columnWidth = this.options.columnWidth ||
+                    // or use the size of the first item
+                    this.$bricks.outerWidth(true) ||
+                    // if there's no items, use size of container
+                    containerWidth;
+
+      this.columnWidth += this.options.gutterWidth;
+
+      this.cols = Math.floor( ( containerWidth + this.options.gutterWidth ) / this.columnWidth );
+      this.cols = Math.max( this.cols, 1 );
+
+      return this;
+
+    },
+
+    _placeBrick : function( $brick, setCount, setY ) {
+          // get the minimum Y value from the columns
+      var minimumY  = Math.min.apply( Math, setY ),
+          setHeight = minimumY + $brick.outerHeight(true),
+          i         = setY.length,
+          shortCol  = i,
+          setSpan   = this.cols + 1 - i,
+          position  = {};
+      // Which column has the minY value, closest to the left
+      while (i--) {
+        if ( setY[i] === minimumY ) {
+          shortCol = i;
+        }
+      }
+
+      // position the brick
+      position.top = minimumY;
+      // position.left or position.right
+      position[ this.horizontalDirection ] = this.columnWidth * shortCol + this.offset.x;
+      this.styleQueue.push({ $el: $brick, style: position });
+
+      // apply setHeight to necessary columns
+      for ( i=0; i < setSpan; i++ ) {
+        this.colYs[ shortCol + i ] = setHeight;
+      }
+
+    },
+    
+    
+    resize : function() {
+      var prevColCount = this.cols;
+      // get updated colCount
+      this._getColumns('masonry');
+      if ( this.cols !== prevColCount ) {
+        // if column count has changed, do a new column cound
+        this._reloadLayout();
+      }
+    },
+    
+    
+    reLayout : function( callback ) {
+      this._getColumns('masonry');
+      this._reloadLayout( callback );
+    },
+    
+    _reloadLayout : function( callback ) {
+      // reset columns
+      var i = this.cols;
+      this.colYs = [];
+      while (i--) {
+        this.colYs.push( this.offset.y );
+      }
+      // apply layout logic to all bricks
+      this.layout( this.$bricks, callback );
+    },
+    
+    // ====================== Convenience methods ======================
+    
+    // goes through all children again and gets bricks in proper order
+    reloadItems : function() {
+      this.$bricks = this._getBricks( this.element.children() );
+    },
+    
+    
+    reload : function( callback ) {
+      this.reloadItems();
+      this.reLayout( callback );
+    },
+    
+
+    // convienence method for working with Infinite Scroll
+    appended : function( $content, callback ) {
+      var $newBricks = this._getBricks( $content );
+      // add new bricks to brick pool
+      this.$bricks = this.$bricks.add( $newBricks );
+      this.layout( $newBricks, callback );
+    },
+    
+    // removes elements from Masonry widget
+    remove : function( $content ) {
+      this.$bricks = this.$bricks.not( $content );
+      $content.remove();
+    },
+    
+    // destroys widget, returns elements and container back (close) to original style
+    destroy : function() {
+
+      this.$bricks
+        .removeClass('masonry-brick')
+        .each(function(){
+          this.style.position = null;
+          this.style.top = null;
+          this.style.left = null;
+        });
+      
+      // re-apply saved container styles
+      var elemStyle = this.element[0].style;
+      for ( var i=0, len = masonryContainerStyles.length; i < len; i++ ) {
+        var prop = masonryContainerStyles[i];
+        elemStyle[ prop ] = this.originalStyle[ prop ];
+      }
+      
+      this.element
+        .unbind('.masonry')
+        .removeClass('masonry')
+        .removeData('masonry');
+      
+      $(window).unbind('.masonry');
+
+    }
+    
+  };
+  
+  
+  // ======================= imagesLoaded Plugin  ===============================
+  // A fork of http://gist.github.com/268257 by Paul Irish
+
+  // mit license. paul irish. 2010.
+  // webkit fix from Oren Solomianik. thx!
+
+  $.fn.imagesLoaded = function(callback){
+    var elems = this.find('img'),
+        len   = elems.length,
+        blank = "data:image/gif;base64,R0lGODlhAQABAIAAAAAAAP///ywAAAAAAQABAAACAUwAOw==",
+        _this = this;
+
+    // if no images, trigger immediately
+    if ( !len ) {
+      callback.call( this );
+      return this;
+    }
+    
+    elems.bind('load', function() {
+      if ( --len <= 0 && this.src !== blank ) {
+        callback.call( _this ); 
+      }
+    }).each(function(){
+      // cached images don't fire load sometimes, so we reset src.
+      if (this.complete || this.complete === undefined){
+        var src = this.src;
+        // webkit hack from http://groups.google.com/group/jquery-dev/browse_thread/thread/eee6ab7b2da50e1f
+        // data uri bypasses webkit log warning (thx doug jones)
+        this.src = blank;
+        this.src = src;
+      }  
+    }); 
+
+    return this;
+  };
+
+  
+  // =======================  Plugin bridge  ===============================
+  // leverages data method to either create or return $.Mason constructor
+  // A bit from jQuery UI
+  //   https://github.com/jquery/jquery-ui/blob/master/ui/jquery.ui.widget.js
+  // A bit from jcarousel 
+  //   https://github.com/jsor/jcarousel/blob/master/lib/jquery.jcarousel.js
+
+  $.fn.masonry = function( options ) {
+    if ( typeof options === 'string' ) {
+      // call method
+      var args = Array.prototype.slice.call( arguments, 1 );
+
+      return this.each(function(){
+        var instance = $.data( this, 'masonry' );
+        if ( !instance ) {
+          return $.error( "cannot call methods on masonry prior to initialization; " +
+            "attempted to call method '" + options + "'" );
+        }
+        if ( !$.isFunction( instance[options] ) || options.charAt(0) === "_" ) {
+          return $.error( "no such method '" + options + "' for masonry instance" );
+        }
+        // apply method
+        instance[ options ].apply( instance, args );
+      });
+    } else {
+      return this.each(function() {
+        var instance = $.data( this, 'masonry' );
+        if ( instance ) {
+          // apply options & init
+          instance.option( options || {} )._init();
+        } else {
+          // initialize new instance
+          $.data( this, 'masonry', new $.Mason( options, this ) );
+        }
+      });
+    }
+  };
+
+})( window, jQuery );
Index: tensions/Wood/js/masonry.min.js
===================================================================
--- /extensions/Wood/js/masonry.min.js	(revision 25980)
+++ 	(revision )
@@ -1,10 +1,0 @@
-/**
- * Vanilla Masonry v1.0.02
- * Dynamic layouts for the flip-side of CSS Floats
- * http://vanilla-masonry.desandro.com
- *
- * Licensed under the MIT license.
- * Copyright 2011 David DeSandro
- */
-(function(a,b){function r(a,b){if(!!a){this.element=a,this.options={};for(var c in r.defaults)this.options[c]=r.defaults[c];for(c in b)this.options[c]=b[c];this._create(),this.build()}}function q(a,b,c){a.removeEventListener?a.removeEventListener(b,c,!1):a.detachEvent&&(a.detachEvent("on"+b,a[b+c]),a[b+c]=null,a["e"+b+c]=null)}function p(b,c,d){b.addEventListener?b.addEventListener(c,d,!1):b.attachEvent&&(b["e"+c+d]=d,b[c+d]=function(){b["e"+c+d](a.event)},b.attachEvent("on"+c,b[c+d]))}function o(a,b,c){var d=b!=="height",e=d?a.offsetWidth:a.offsetHeight,f=d?"Left":"Top",g=d?"Right":"Bottom",h=j(a),i=parseFloat(h["padding"+f])||0,k=parseFloat(h["padding"+g])||0,l=parseFloat(h["border"+f+"Width"])||0,o=parseFloat(h["border"+g+"Width"])||0,p=h["margin"+f],q=h["margin"+g],r,s;m||(p=n(a,h,p),q=n(a,h,q)),r=parseFloat(p)||0,s=parseFloat(q)||0;if(e>0)c?e+=r+s:e-=i+k+l+o;else{e=h[b];if(e<0||e==null)e=a.style[b]||0;e=parseFloat(e)||0,c&&(e+=i+k+r+s+l+o)}return e}function n(a,b,c){if(c.indexOf("%")===-1)return c;var d=a.style,e=d.width,f;d.width=c,f=b.width,d.width=e;return f}function e(a){return new RegExp("(^|\\s+)"+a+"(\\s+|$)")}"use strict";var c=a.document,d="classList"in c.createElement("div"),f=d?function(a,b){return a.classList.contains(b)}:function(a,b){return e(b).test(a.className)},g=d?function(a,b){a.classList.add(b)}:function(a,b){f(a,b)||(a.className=a.className+" "+b)},h=d?function(a,b){a.classList.remove(b)}:function(a,b){a.className=a.className.replace(e(b)," ")},i=c.defaultView,j=i&&i.getComputedStyle?function(a){return i.getComputedStyle(a,null)}:function(a){return a.currentStyle},k=c.getElementsByTagName("body")[0],l=c.createElement("div");l.style.marginTop="1%",k.appendChild(l);var m=j(l).marginTop!=="1%";k.removeChild(l);var s=["position","height"];r.defaults={isResizable:!0,gutterWidth:0,isRTL:!1,isFitWidth:!1},r.prototype={_getBricks:function(a){var b;for(var c=0,d=a.length;c<d;c++)b=a[c],b.style.position="absolute",g(b,"masonry-brick"),this.bricks.push(b)},_create:function(){this.reloadItems();var b=this.element.style;this._originalStyle={};for(var c=0,d=s.length;c<d;c++){var e=s[c];this._originalStyle[e]=b[e]||""}this.element.style.position="relative",this.horizontalDirection=this.options.isRTL?"right":"left",this.offset={};var f=j(this.element),h=this.options.isRTL?"paddingRight":"paddingLeft";this.offset.y=parseFloat(f.paddingTop)||0,this.offset.x=parseFloat(f[h])||0,this.isFluid=this.options.columnWidth&&typeof this.options.columnWidth=="function";var i=this;setTimeout(function(){g(i.element,"masonry")}),this.options.isResizable&&p(a,"resize",function(){i._handleResize()})},build:function(a){this._getColumns(),this._reLayout(a)},_getColumns:function(){var a=this.options.isFitWidth?this.element.parentNode:this.element,b=o(a,"width");this.columnWidth=this.isFluid?this.options.columnWidth(b):this.options.columnWidth||o(this.bricks[0],"width",!0)||b,this.columnWidth+=this.options.gutterWidth,this.cols=Math.floor((b+this.options.gutterWidth)/this.columnWidth),this.cols=Math.max(this.cols,1)},reloadItems:function(){this.bricks=[],this._getBricks(this.element.children)},_reLayout:function(a){var b=this.cols;this.colYs=[];while(b--)this.colYs.push(0);this.layout(this.bricks,a)},layout:function(a,b){var c,d,e,f,g,h,i;for(var j=0,k=a.length;j<k;j++){c=a[j];if(c.nodeType!==1)continue;d=Math.ceil(o(c,"width",!0)/(this.columnWidth+this.options.gutterWidth)),d=Math.min(d,this.cols);if(d===1)i=this.colYs;else{e=this.cols+1-d,i=[];for(h=0;h<e;h++)g=this.colYs.slice(h,h+d),i[h]=Math.max.apply(Math,g)}var l=Math.min.apply(Math,i);for(var m=0,n=i.length;m<n;m++)if(i[m]===l)break;c.style.top=l+this.offset.y+"px",c.style[this.horizontalDirection]=this.columnWidth*m+this.offset.x+"px";var p=l+o(c,"height",!0),q=this.cols+1-n;for(h=0;h<q;h++)this.colYs[m+h]=p}var r={};this.element.style.height=Math.max.apply(Math,this.colYs)+"px";if(this.options.isFitWidth){var s=0;j=this.cols;while(--j){if(this.colYs[j]!==0)break;s++}this.element.style.width=(this.cols-s)*this.columnWidth-this.options.gutterWidth+"px"}b&&b.call(a)},_handleResize:function(){function b(){a.resize(),a._resizeTimeout=null}var a=this;this._resizeTimeout&&clearTimeout(this._resizeTimeout),this._resizeTimeout=setTimeout(b,100)},resize:function(){var a=this.cols;this._getColumns(),(this.isFluid||this.cols!==a)&&this._reLayout()},reload:function(a){this.reloadItems(),this.build(a)},appended:function(a,b,c){var d=this,e=function(){d._appended(a,c)};if(b){var f=o(this.element,"height")+"px";for(var g=0,h=a.length;g<h;g++)a[g].style.top=f;setTimeout(e,1)}else e()},_appended:function(a,b){this._getBricks(a),this.layout(a,b)},destroy:function(){var b;for(var c=0,d=this.bricks.length;c<d;c++)b=this.bricks[c],b.style.position="",b.style.top="",b.style.left="",h(b,"masonry-brick");var e=this.element.style;d=s.length;for(c=0;c<d;c++){var f=s[c];e[f]=this._originalStyle[f]}h(this.element,"masonry"),this.resizeHandler&&q(a,"resize",this.resizeHandler)}},r.getWH=o,a.Masonry=r})(window);
-
Index: /extensions/Wood/local_head.tpl
===================================================================
--- /extensions/Wood/local_head.tpl	(revision 25980)
+++ /extensions/Wood/local_head.tpl	(revision 25981)
@@ -1,5 +1,1 @@
-	<!--[if lt IE 8]>
-		<link rel="stylesheet" type="text/css" href="{$ROOT_URL}themes/elegant/fix-ie7.css">
-	<![endif]-->
-	
-{combine_script id='jquery.masonry.min' require='jquery' path='themes/Float/js/masonry.min.js' load='footer'}
+{combine_script id='jquery.masonry.min' require='jquery' path='themes/Float/js/masonry.js' load='footer'}
Index: /extensions/Wood/template/mainpage_categories.tpl
===================================================================
--- /extensions/Wood/template/mainpage_categories.tpl	(revision 25980)
+++ /extensions/Wood/template/mainpage_categories.tpl	(revision 25981)
@@ -1,4 +1,4 @@
+{define_derivative name='derivative_params' type='xsmall'}
 {html_style}
-
 {if $derivative_params->max_width() > 600}
 .thumbLegend {ldelim}font-size: 130%}
@@ -14,9 +14,8 @@
 <div class="thumbContent">
 
-<div id="container" >
+<div id="container">
 
 {foreach from=$category_thumbnails item=cat name=cat_loop}
-	<div class="box photo colMainpage">
-	<li class="{if $smarty.foreach.comment_loop.index is odd}odd{else}even{/if}">
+	<div class="box {if $smarty.foreach.comment_loop.index is odd}odd{else}even{/if}">
 		<div class="thumbnailCategory">
 			<div class="illustration">
@@ -44,5 +43,4 @@
 			</div>
 		</div>
-	</li>
 	</div>
 {/foreach}
@@ -51,15 +49,16 @@
 </div>
 {footer_script require='jquery'}{literal}
-			window.onload = function() {
-			  var wall1 = new Masonry( document.getElementById('container'), {
-				gutterWidth: 10,
-				isFitWidth: true,
-			  });
-				var wall2 = new Masonry( document.getElementById('containerThumb'), {
-				gutterWidth: 10,
-				isFitWidth: true,
-			  });
+  $(function(){
 
-			};
+    var $container = $('#container');
+  
+    $container.imagesLoaded( function(){
+      $container.masonry({
+        itemSelector : '.box',
+		isFitWidth: true
+      });
+    });
+  
+  });
 {/literal}{/footer_script}
 </div>
Index: /extensions/Wood/template/mainpage_categories1.tpl
===================================================================
--- /extensions/Wood/template/mainpage_categories1.tpl	(revision 25981)
+++ /extensions/Wood/template/mainpage_categories1.tpl	(revision 25981)
@@ -0,0 +1,66 @@
+{html_style}
+
+{if $derivative_params->max_width() > 600}
+.thumbLegend {ldelim}font-size: 130%}
+{else}
+{if $derivative_params->max_width() > 400}
+.thumbLegend {ldelim}font-size: 110%}
+{else}
+.thumbLegend {ldelim}font-size: 90%}
+{/if}
+{/if}
+{/html_style}
+
+<div class="thumbContent">
+
+<div id="container" >
+
+{foreach from=$category_thumbnails item=cat name=cat_loop}
+	<div class="box photo colMainpage">
+	<li class="{if $smarty.foreach.comment_loop.index is odd}odd{else}even{/if}">
+		<div class="thumbnailCategory">
+			<div class="illustration">
+				<img src="{$pwg->derivative_url($derivative_params, $cat.representative.src_image)}" alt="{$cat.TN_ALT}" title="{$cat.NAME|@replace:'"':' '|@strip_tags:false} - {'display this album'|@translate}">
+			<a href="{$cat.URL}">
+				<div class="description">
+						<div class="text">
+					<h2>
+						{$cat.NAME}
+						{if !empty($cat.icon_ts)}
+						<img title="{$cat.icon_ts.TITLE}" src="{$ROOT_URL}{$themeconf.icon_dir}/recent{if $cat.icon_ts.IS_CHILD_DATE}_by_child{/if}.png" alt="(!)">
+						{/if}
+					</h2>
+				
+							{if isset($cat.INFO_DATES) }
+							<p class="dates">{$cat.INFO_DATES}</p>
+							{/if}
+							<p class="Nb_images">{$cat.CAPTION_NB_IMAGES}</p>
+							{if not empty($cat.DESCRIPTION)}
+							<p>{$cat.DESCRIPTION}</p>
+							{/if}
+					</div>
+				</div>
+			</a>
+			</div>
+		</div>
+	</li>
+	</div>
+{/foreach}
+
+
+</div>
+{footer_script require='jquery'}{literal}
+			window.onload = function() {
+			  var wall1 = new Masonry( document.getElementById('container'), {
+				gutterWidth: 10,
+				isFitWidth: true,
+			  });
+				var wall2 = new Masonry( document.getElementById('containerThumb'), {
+				gutterWidth: 10,
+				isFitWidth: true,
+			  });
+
+			};
+{/literal}{/footer_script}
+</div>
+
Index: /extensions/Wood/template/thumbnails.tpl
===================================================================
--- /extensions/Wood/template/thumbnails.tpl	(revision 25980)
+++ /extensions/Wood/template/thumbnails.tpl	(revision 25981)
@@ -1,2 +1,3 @@
+{define_derivative name='derivative_params' type='xsmall'}
 {if !empty($thumbnails)}{strip}
 
@@ -41,5 +42,5 @@
 
 <div class="thumbContent">
-<div id="containerThumb" class="clearfix">
+<div id="containerThumb">
 
 {foreach from=$thumbnails item=thumbnail}
@@ -90,15 +91,16 @@
 </div>		
 {footer_script require='jquery'}{literal}
-			window.onload = function() {
-			  var wall1 = new Masonry( document.getElementById('container'), {
-				gutterWidth: 10,
-				isFitWidth: true
-			  });
-				var wall2 = new Masonry( document.getElementById('containerThumb'), {
-				gutterWidth: 10,
-				isFitWidth: true
-			  });
+  $(function(){
 
-			};
+    var $container = $('#containerThumb');
+  
+    $container.imagesLoaded( function(){
+      $container.masonry({
+        itemSelector : '.box',
+		isFitWidth: true
+      });
+    });
+  
+  });
 {/literal}{/footer_script}
 </div>
Index: /extensions/Wood/template/thumbnails1.tpl
===================================================================
--- /extensions/Wood/template/thumbnails1.tpl	(revision 25981)
+++ /extensions/Wood/template/thumbnails1.tpl	(revision 25981)
@@ -0,0 +1,104 @@
+{if !empty($thumbnails)}{strip}
+{combine_script id='jquery.ajaxmanager' path='themes/default/js/plugins/jquery.ajaxmanager.js' load='footer'}
+{combine_script id='thumbnails.loader' path='themes/default/js/thumbnails.loader.js' require='jquery.ajaxmanager' load='footer'}
+{*define_derivative name='derivative_params' width=160 height=90 crop=true*}
+{html_style}
+{*Set some sizes according to maximum thumbnail width and height*}
+
+{if $derivative_params->max_width() >= 1008}
+.col{ldelim}width:95%}
+{elseif $derivative_params->max_width() >= 792}
+.col{ldelim}width:49%}
+{elseif $derivative_params->max_width() >= 576}
+.col{ldelim}width:40%}
+{elseif $derivative_params->max_width() >= 500}
+.col{ldelim}width:32%}
+{elseif $derivative_params->max_width() >= 480}
+.col{ldelim}width:24%}
+{elseif $derivative_params->max_width() >= 380}
+.col{ldelim}width:19%}
+{else}
+.col{ldelim}width:15%}
+{/if}
+
+
+
+
+.thumbnails .wrap2{ldelim}
+	height: {$derivative_params->max_height()+3}px;
+}
+{if $derivative_params->max_width() > 600}
+.thumbLegend {ldelim}font-size: 130%}
+{else}
+{if $derivative_params->max_width() > 400}
+.thumbLegend {ldelim}font-size: 110%}
+{else}
+.thumbLegend {ldelim}font-size: 90%}
+{/if}
+{/if}
+{/html_style}
+
+<div class="thumbContent">
+<div id="containerThumb" class="clearfix">
+
+{foreach from=$thumbnails item=thumbnail}
+	<div class="box photo col">
+
+{assign var=derivative value=$pwg->derivative($derivative_params, $thumbnail.src_image)}
+
+	<li class="thumbs">
+		<div class="thumbnail">		
+			<div class="illustration">
+				<img class="thumbnail" src="{$derivative->get_url()}" alt="{$thumbnail.TN_ALT}" title="{$thumbnail.TN_TITLE}">
+			{if $SHOW_THUMBNAIL_CAPTION }
+			<a href="{$thumbnail.URL}">
+				<div class="description">
+				<div class="text">
+					<span class="thumbLegend">
+							<span class="thumbName">{$thumbnail.NAME}</span>
+							{if !empty($thumbnail.icon_ts)}
+								<img title="{$thumbnail.icon_ts.TITLE}" src="{$ROOT_URL}{$themeconf.icon_dir}/recent.png" alt="(!)">
+							{/if}
+						{if isset($thumbnail.NB_COMMENTS)}
+							<span class="{if 0==$thumbnail.NB_COMMENTS}zero {/if}nb-comments">
+								<br>
+								{$pwg->l10n_dec('%d comment', '%d comments',$thumbnail.NB_COMMENTS)}
+							</span>
+						{/if}
+						{if isset($thumbnail.NB_HITS)}
+							<span class="{if 0==$thumbnail.NB_HITS}zero {/if}nb-hits">
+								<br>
+								{$pwg->l10n_dec('%d hit', '%d hits',$thumbnail.NB_HITS)}
+							</span>
+						{/if}
+					</span>
+				</div>
+				</div>
+			</a>
+			</div>
+		</div>
+
+
+		{/if}
+	</li>
+	</div>
+{/foreach}
+
+{/strip}
+{/if}
+</div>		
+{footer_script require='jquery'}{literal}
+			window.onload = function() {
+			  var wall1 = new Masonry( document.getElementById('container'), {
+				gutterWidth: 10,
+				isFitWidth: true
+			  });
+				var wall2 = new Masonry( document.getElementById('containerThumb'), {
+				gutterWidth: 10,
+				isFitWidth: true
+			  });
+
+			};
+{/literal}{/footer_script}
+</div>
+
Index: /extensions/Wood/theme.css
===================================================================
--- /extensions/Wood/theme.css	(revision 25980)
+++ /extensions/Wood/theme.css	(revision 25981)
@@ -1,4 +1,4 @@
 BODY{background:url("images/background/wood_pattern.jpg") fixed repeat;color:#FF8a00}
-A,INPUT.rateButton {color:#6F6F6F}
+A,INPUT.rateButton {color:#373737}
 H2{background-image:none;padding:8px 0 0 10px}
 INPUT[type=submit],INPUT[type=reset]{cursor:pointer;background:-moz-linear-gradient(center top , #555555, #2C2C2C) repeat scroll 0% 0% transparent;color:#ff8a00;border-radius:8px 8px 8px 8px;text-shadow:none;box-shadow:none;border:none}
@@ -13,6 +13,6 @@
 #Header{margin-bottom:50px;background:none}
 #header_bgDef{background:none;width:20%;float:left}
-#theHeader{text-align:left;padding-top:40px;font-size:2.1em;position:fixed;width:20%;right:auto;padding-left:5px}
-#theHeader h1{text-align:left;color:rgba(0, 0, 0, 0.3);font-size:2.6em;margin-top:0px;margin-bottom:0}
+#theHeader{text-align:left;padding-top:40px;font-size:1.8em;position:fixed;width:18%;right:auto;padding-left:5px}
+#theHeader h1{text-align:left;color:rgba(0, 0, 0, 0.3);font-size:2.3em;margin-top:0px;margin-bottom:0}
 #headertransi{background:none;height:0}
 #headertransiH{background-image:none}
@@ -53,25 +53,24 @@
 #menubar{background:#000;height:35px}
 .dd_wrapper,.cl_wrapper,.cc_wrapper,#menubar dt,#menubar dt a{line-height:35px}
-.dd_wrapper:hover,.cl_wrapper:hover,.cc_wrapper:hover,.activate,#menubar dt a:hover,#menubar dt:hover{z-index:100;height:29px;background:#4f4f4f;color:#ff8a00;padding:0 16px 6px;text-shadow:none}
-#menubar dt a,#menubar dt a:hover{padding:0 0}
+.dd_wrapper:hover,.cl_wrapper:hover,.cc_wrapper:hover,.activate,#menubar dt:hover,#menubar dt a:hover{z-index:100;height:29px;background:#4f4f4f;color:#c2c2c2;padding:0 16px 6px;text-shadow:none}
+#menubar dt a:hover{z-index:100;height:29px;background:#4f4f4f;color:#c2c2c2;padding:0 0;text-shadow:none}
 span#menu_start{background:none}
 span#menu_start a{background:url(images/menu/home_w.png) no-repeat left top}
-ul#topnav #loger ul li a:hover,ul#topnav .sub ul li a:hover,ul#topnav .sub #menuTagCloud div a:hover,ul#topnav .liSub dt a:hover{color:#ff8a00}
+ul#topnav #loger ul li a:hover,ul#topnav .sub ul li a:hover,ul#topnav .sub #menuTagCloud div a:hover,ul#topnav .liSub dt a:hover{color:#c2c2c2}
 #topnav .liSub{background:none}
-#topnav .sub, #topnav #loger{top:35px;border-radius:0;box-shadow:5px 5px 20px #000;background:rgba(0, 0, 0, 0.8)}
-ul#topnav .sub ul li,ul#topnav #loger ul li,ul#topnav .sub #menuTagCloud div{border:none}
-ul#topnav .sub ul li a,ul#topnav #loger ul li a{background:none}
-ul#topnav .sub ul li.selected a{background:url(images/menu/navlist_arrow_select.png) no-repeat 0 5px}
-ul#topnav .sub ul li a:hover,ul#topnav .sub #menuTagCloud div a:hover{color:#ff8a00;background:url(images/menu/navlist_arrow_hover.png) no-repeat 0 5px}
-.sub p{color:#ff8a00}
+ul#topnav li .sub, ul#topnav li #loger{top:35px;border-radius:0;box-shadow:5px 5px 20px #000;background:rgba(0, 0, 0, 0.95)}
+ul#topnav .sub ul li,ul#topnav #loger ul li,ul#topnav .sub #menuTagCloud div{border:1px solid #2c2c2c}
+ul#topnav .sub ul li a,ul#topnav #loger ul li a{background:none;font-size:1.5em}
+ul#topnav .sub ul li a:hover,ul#topnav .sub #menuTagCloud div a:hover{color:#c2c2c2}
+.sub p{color:#c2c2c2}
 #quicksearch input[type=text]{background:#3F3F3F}
 #quicksearch input[type=submit]{background:url(images/menu/search.png) no-repeat}
-#log{color:#ff8a00}
+#log{color:#c2c2c2}
 #log INPUT[type=password],#log INPUT[type="text"]{background:#fff}
 #log INPUT[type=text]:hover{background-position:left bottom}
-#go INPUT[type=submit]{color:transparent;border:none;height:32px;width:64px;min-width:inherit;background:url(images/menu/go.png) no-repeat left top;margin-left:65px;margin-top:20px;text-shadow:none}
-#go INPUT[type="submit"]{background:-moz-linear-gradient(center top , #555555, #2C2C2C);color:#ff8a00;width:auto}
-#go INPUT[type="submit"]:hover{color:#ff8a00;background:-moz-linear-gradient(center top , #5f5f5f, #2C2C2C)}
-#go INPUT[type=submit]:active{color:#ff8a00;background:-moz-linear-gradient(center top , #555555, #2C2C2C);box-shadow:1px 1px 1px #000 inset,0px 1px 0px rgba(255,255,255,0.4)}
+#go INPUT[type=submit]{color:transparent;border:none;height:32px;width:64px;min-width:inherit;margin-left:65px;margin-top:20px;text-shadow:none}
+#go INPUT[type="submit"]{background:-moz-linear-gradient(center top , #555555, #2C2C2C);color:#c2c2c2;width:auto}
+#go INPUT[type="submit"]:hover{color:#c2c2c2;background:-moz-linear-gradient(center top , #5f5f5f, #2C2C2C)}
+#go INPUT[type=submit]:active{color:#c2c2c2;background:-moz-linear-gradient(center top , #555555, #2C2C2C);box-shadow:1px 1px 1px #000 inset,0px 1px 0px rgba(255,255,255,0.4)}
 
 /*======================================================Panel======================================================*/
@@ -83,4 +82,6 @@
 .box li{list-style: none outside none}
 .box img{display: block;margin-left:auto;margin-right:auto}
+.colMainpage{width:340px}
+.colMainpage img{width:340px}
 .col img{width:100%}
 .clearfix:before,.clearfix:after{content:"";display:table}
Index: /extensions/Wood/themeconf.inc.php
===================================================================
--- /extensions/Wood/themeconf.inc.php	(revision 25980)
+++ /extensions/Wood/themeconf.inc.php	(revision 25981)
@@ -2,9 +2,9 @@
 /*
 Theme Name: Wood
-Version: auto
+Version: 1.0.0
 Description: Piwigo theme.
-Theme URI: http://piwigo.org/ext/extension_view.php?eid=641
-Author:Miklfe [piwitheme.fr]
-Author URI: http://piwitheme.fr
+Theme URI: 
+Author: Miklfe
+Author URI: http://piwigo.org
 */
 $themeconf = array(
@@ -16,12 +16,10 @@
 
 add_event_handler('loc_begin_index', 'modify_nb_thumbnail_page');
-if(!function_exists('modify_nb_thumbnail_page'))
+function modify_nb_thumbnail_page()
 {
-	function modify_nb_thumbnail_page()
-	{
-	global $user, $page;
-		$user['nb_image_page']=999;
-		$page['nb_image_page']=999;
-	}
+global $user, $page;
+	$user['nb_image_page']=999;
+	$page['nb_image_page']=999;
+
 }
 
