// JavaScript Document
$(document).ready(function(){
	
	
	// wrap big images so that they can be clicked and shrunk
	$('.fillScreen').wrap('<div class="toggleSizeOnClick"></div>');
	$('.toggleSizeOnClick').wrap('<div class="imageGroup"></div>');
    
    
    // show zoom function image on hover
	//$(".imageGroup").hover(
	//	function () {
	//		$(this).prepend('<div class="makeSmaller">&nbsp;</div>');
	//	},
	//	function () {
	//		$('.makeSmaller').remove();
	//	});

	// shrink the images on click, remove shrink option and add expand on click option
	$(".imageGroup").toggle(
		function () {
			$(this).animate({width:'640px'}, 400 );
		},
		function () {
			$(this).animate({width: '100%'}, 400 );
		});
	
	
	// salon images
	
	$("ul#salon li img").mouseover(function () {
      $(this).css("opacity",0.8);
		});
		$("ul#salon li img").mouseout(function () {
      $(this).css("opacity",1);
		});

    
});