Help with custom field css image rollover

I have this:

a.thumb:hover {
	background-position: 0 -150px;
}

a.thumb {
	display: block;
	width: 314px;
	height: 150px;
	padding: 0px;
	/* background: transparent url(https://estevancarlos.com/wp-content/uploads/2010/01/5cards_thumb.jpg) no-repeat; */
	text-align: center;
	color: #fff;
	text-decoration: none;
}

And this in my template page:

<a class="thumb" style="background:url(<?php $values = get_post_custom_values('thumb'); echo $values[0]; ?>) no-repeat;" href="<?php the_permalink() ?>" rel="bookmark" title="<?php the_title(); ?>">&nbsp;</a>

The image, “thumb” appears but it’s position doesn’t change with the hover. However if I remove it and place the background-image in the CSS (or uncomment it) the entire CSS rollover effect works.

I obviously want to use the custom field to assign images when posting. Any suggestions on how to do this?