item added - fade out

[bigbadboy]

I've added a sneaky little effect that shows/ hides an "item added" message.
Currently the message shows the div then, after a few seconds, hides it again.
What I want to do is fade out instead of just hide.

You can see it in action here (click 'add to basket' then message appears top right):
http://tinyurl.com/sf-effect

This is the script placed in the head:

<script type="text/javascript">
function hideIt() {
  document.getElementById("message").style.display = "none";
}
setTimeout("hideIt()", 3000); // after 3 sec
</script>

Here is the CSS:

.messageStackSuccess {
	width:100px;
	float:right;
	background-color:#b64926;
	color:#ffff00;
	text-transform:uppercase;
	text-align:center;
	font-size:80%;
	font-weight:bold;
	padding-right:20px;
	}

Thanks in advance.