[mmoskva]

I need some help with this image rollover. Once, I rollover the image, for some reason the rollover image is not displaying at all? So the main image displays but the rollover will not show up.

In my .tpl file I have the following:

{config_load file="$skin_config"}
{if $is_nomail ne 'Y'}
{literal}
<STYLE type="text/css">
.nav a:hover {visibility:visible;
}
.nav a:hover {visibility:visible;
}
</STYLE>
{/literal}
{/if}


<div class="nav">
<a href="#">
<img src="{$ImagesDir}/custom/img.gif" border="0" width="77" height="32">
</a>
</div>



AND



In my css file I have the following:

.nav {
height: 32px;
width: 77px;
margin:0;
padding:0;
background-image:url("images/custom/imgover.gif") no-repeat 0 0;
}

.nav a, div.nav a:link, div.nav a:visited {
display:block;
}

.nav img {
width:100%;
height:100%;
border:0;
}

.nav a:hover img {
visibility:hidden;
}

Appreciate the help!