Ingrandimento immagine con CSS

[g.bianchi]

Un cordiale saluto a tutti.
Con questo CSS riesco ad ingrandire un'immagine quando mi posiziono con il mouse sopra.
Tuttavia vorrei poter fissare la posizione sempre al centro dello schermo indipendentemente da dove si trova il thumbnail. Adesso, se la foto piccola si trova in basso sullo schermo, l'ingrandimento scompare.
Mi potete aiutare oppure indicare qualche altra soluzione? Grazie. Ciao
Giovanni

<style type="text/css">
.thumbnail{
position: relative;
z-index: 0;
}

.thumbnail:hover{
background-color: transparent;
z-index: 50;
}

.thumbnail span{ /*CSS per ingrandire immagine*/
position: absolute;
background-color: lightyellow;
padding: 5px;
left: -1000px;
border: 1px dashed gray;
visibility: hidden;
color: black;
text-decoration: none;
}

.thumbnail span img{ /*CSS per ingrandire immagine*/
border-width: 0;
padding: 2px;
}

.thumbnail:hover span{ /*CSS per ingrandire immagine su mouseover*/
position:relative;
visibility: visible;
top: 50;
left: 50px; /*posizione dell'immagine ingrandita*/
}
</style>

[g.bianchi]

Ciao a tutti,
ho risolto implementando l'ultima parte di codice così:

.thumbnail:hover span{ /*CSS per ingrandire immagine su mouseover*/
visibility: visible;
width:500px;height:380px;
left:55%;top:50%;
margin:-200px 0 0 -450px;
border:1px solid #000;
position:fixed;
}

Se può essere utile ...
Ciao e grazie
Giovanni