// note that this uses the .bind('load') on the window object, rather than $(document).ready() 
    // because .ready() fires before the images have loaded, but we need to fire *after* because
    // our code relies on the dimensions of the images already in place.
    $(window).bind('load', function () {
        
        $('img.fade').hover(function () {
                    $(this).animate({
                        opacity: 0
                    }, 250);
                }, function () {
                    $(this).animate({
                        opacity: 1
                    }, 250);
                });
    });
	
	$(document).ready(function() { 
	
	 $(".group").fancybox({
		'frameWidth':512,'frameHeight':304
	}); 
	 $(".group2").fancybox({
		'frameWidth':352,'frameHeight':214
	}); 
	
	
	});