// JavaScript Document

$(document).ready(function() {
   // AREA WEDDING
   // LOGO OVER
   $('#eventi').mouseover(function(){
   		$("#weddingArea").stop();
		$("#designArea").stop();
		//animazione dello sfondo
		$("#weddingArea").css("background-color","#355f8c");
		$("#weddingArea").animate({ width: '55%'}, 1000);
		$("#designArea").animate({ width: '45%'}, 1000);
		//animazione dell'immagine 
		 $("#imgOver").fadeIn();
   	})
	
	 // LOGO OUT
   	$('#imgOver').mouseout(function(){
		$("#weddingArea").stop();
		$("#designArea").stop();
 		//animazione dello sfondo
		$("#weddingArea").css("background-color","#ffffff");
		$("#weddingArea").animate({ width: '50%'}, 500);
		$("#designArea").animate({ width: '50%'}, 500);	
		//animazione dell'immagine 
		 $(this).fadeOut(); 
   	})
   
   // AREA DESIGN
   // LOGO OVER
   $('#italianDesign').mouseover(function(){
   		$("#weddingArea").stop();
		$("#designArea").stop();
		//animazione dello sfondo
   		$("#designArea").css("background-color","#00879a");
		$("#weddingArea").animate({ width: '45%'}, 1000);
		$("#designArea").animate({ width: '55%'}, 1000);
		//animazione dell'immagine 
		 $("#imgOver2").fadeIn();
   	})
	
	 // LOGO OUT
   	$('#imgOver2').mouseout(function(){
		$("#weddingArea").stop();
		$("#designArea").stop();
 		//animazione dello sfondo
		$("#designArea").css("background-color","#ffffff");	
		$("#weddingArea").animate({ width: '50%'}, 500);
		$("#designArea").animate({ width: '50%'}, 500);	
		//animazione dell'immagine 
		 $(this).fadeOut(); 
   	})
 });