CSS3 Gradient Button

<style>
.button {
display: inline-block;
zoom: 1;
*display: inline;
vertical-align: baseline;
margin: 0 2px;
outline: none;
cursor: pointer;
text-align: center;
text-decoration: none;
font-size: 15px;
padding: 10px 20px;
text-shadow: 0 1px 1px rgba(0,0,0,.3);
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 1px 2px rgba(0,0,0,.4);
-moz-box-shadow: 0 1px 2px rgba(0,0,0,.4);
box-shadow: 0 1px 2px rgba(0,0,0,.4);
}
.button:link,.button:hover,.button:active {
text-decoration: none;
color:#fff;
}
.black,.black:active {
color: #d7d7d7;
border: solid 1px #666;
background: #777;
background: -webkit-gradient(linear, left top, left bottom, from(#999), to(#333));
background: -moz-linear-gradient(top, #999, #333);
}
.black:hover {
background: #000;
border: solid 1px #000;
background: -webkit-gradient(linear, left top, left bottom, from(#777), to(#000));
background: -moz-linear-gradient(top, #777, #000);
}
</style>
<a href='#' class='button black'>CSS3 Gradient Button</a>