jQuery(document).ready(function($) {
// setting the tabs in the sidebar hide and show, setting the current tab
	jQuery('div.tabbed div').hide();
	jQuery('div.t1').show();
	jQuery('div.t1 div.tabContent').show();
	jQuery('div.t1 div.tabContent').children().show();
	jQuery('div.t1 div.tabContent').find("div").show();
	
	//set the first tab as selected
	jQuery('div.tabbed ul.tabs li.t1 a').addClass('tab-current');
	jQuery('div.tabbed div.t1, div.tabbed div.t2').addClass('tabbed-hidden'); //here.
	//this line means that the tabs are hidden by js not css on load so when js is disabled the divs are shown.
	
	jQuery('div.tabbed ul li a').click(function($){
		var thisClass = this.className.slice(0,2);
		jQuery('div.tabbed div').hide();
		jQuery('div.' + thisClass).show();
		jQuery('div.' + thisClass).children().show();
		jQuery('div.' + thisClass).find("div").show();
		//jQuery('div.' + thisClass + ' div.tabContent div').show();

		jQuery('div.tabbed ul.tabs li a').removeClass('tab-current');
		jQuery(this).addClass('tab-current');
		jQuery(this).removeClass('tabbed-hidden');		
	});
});


jQuery(function() {
        var fadeInSpeed     = 250;
        var animateInSpeed  = 150;
        var fadeOutSpeed    = 500;
        var animateOutSpeed = 200;
        var zoom            = 1.4;

        function setImageBaseValues($img) {
          // parseInt() strips 'px', || handles NaN (css() threw undefined)
          $img.data('base', {
            'height': 125,
            'left':   parseInt($img.css('left')) || 0,
            'top':    parseInt($img.css('top'))  || 0,
            'width':  125
          });
        };

        // use each() to scope things so we don't have to
        // look up the image in each hover function
        jQuery('.thumbs a').each(function() {

          // override our CSS shenanigans
          jQuery('> span', this).css('display', 'block').hide();

          var $img = jQuery('> img', this);

          // store our base values to curb calculation later
          // load() gets wonky with asset loading, so we check
          // and call setImageBaseValues() in two places to be
          // sure we get the image width/height we want
          //
          // essentially, try setting the image dimensions to
          // speed up things later, but catch it if load() fails
          $img.load(function() {
            if (!jQuery(this).data('base')) setImageBaseValues($img);
          });

          jQuery(this).hover(function() {
            // see comment above $img.load()
            if (!$img.data('base')) setImageBaseValues($img);

            var base = $img.data('base');

            // keep things nice and centered, respecting initial left/top values
            $img.stop().animate({
              'left':   (base.left - (((base.width  * zoom) - base.width)  / 2)),
              'top':    (base.top  - (((base.height * zoom) - base.height) / 2)),
              'height': (base.height * zoom),
              'width':  (base.width  * zoom)
            }, animateInSpeed);

            jQuery('> span', this).stop(false, true).fadeIn(fadeInSpeed);

          }, function() {
            $img.stop().animate($img.data('base'), animateOutSpeed);
            jQuery('> span', this).stop(false, true).fadeOut(fadeOutSpeed);
          });

        });

      });