Rieccomi!

Questa volta voglio che un'immagine si ingrandisca al passaggio del mouse, ma che resti cmq centrata rispetto all'immagine originale. L'ho già fatto altre volte, ma questa volta non va, e non riesco a capire perchè. In pratica non riesco ad impostare i margini dell' img:hover in modo corretto. Resta troppo bassa e troppo a dx. Sarà sicuramente una svista del cavolo, ma non la trovo!
lascio il codice qui sotto, grazie mille per l'aiuto.

codice:
 <style type="text/css">
	#main{ position: relative;
			   margin: 0;}
	#info { position: absolute;
				margin-left: 900px;
				margin-top: 0px;
				z.index: 1;}
	#sfondo { position: absolute;
			  margin-left: 159px;
			  margin-top: 57px;
			  z-index: 2;}
	#foglie { position: absolute;
			  z-index: 5;}
	#foglie a:hover { opacity: 0.0;}
	#centro { position: absolute;
			  margin-left: 336px;
			  margin-top: 234px;
			  z-index: 6;}
	#progetti img { position: absolute;
				    margin-left: 343px;
			    	margin-top: 242px;
			    	width: 130px;
			    	z-index: 7;
			    	opacity: 0.7;}
	#progetti img:hover { position: absolute;
						  margin-left: 193px;
			              margin-top: 92px;
						  width: 430px;
						  opacity: 1.0;}
	#menu { position: absolute;
			  margin-left: 650px;
			  margin-top: 170px;
			  z-index: 3;}
        </style>
        </head>
        <body>
        		<div id="main">
                <div id="info">
            	[img]img/menu_home.png[/img]
            	<map name="info">
            	<area shape="rect" coords=" 6, 8, 69, 35" href="html/chi_sono.html">
            	<area shape="rect" coords=" 80, 8, 155, 35" href="html/mission.html">
            	<area shape="rect" coords=" 165, 8, 270, 35" href="html/ringraziamenti.html">
            	<area shape="rect" coords=" 280, 8, 340, 35" href="html/contatti.html">
            	</map>
            	</div>
            	
            	 <div id="sfondo">
                [img]img/home/foglie.jpg[/img]
                </div>
                
            	<div id="centro">
            	[img]img/home/centro.png[/img]
            	</div>
            	
            	<div id="foglie">
            	[img]img/home/top_sx.jpg[/img]
            	[img]img/home/top_dx.jpg[/img]
            	

            	[img]img/home/down_sx.jpg[/img]
            	[img]img/home/down_dx.jpg[/img]
            	</div>
            	
            	[img]img/home/progetti.jpg[/img]
            	
            	<div id="menu">
            	<iframe name="iframe" width="650" height="400" frameborder="0" src="html/home/web.html">
            	</iframe>
            	</div>
            	
            </div>
         </body>

</html>