<a href="#" class="buton">CSS3 Buton</a>
body {
  margin: 50px 0 0 20px;
}

a.buton{
    background:#d21b00;
    background: linear-gradient(top, #d21b00, #8e0700);
    padding:20px 25px;
    text-decoration:none;
    color:#fff;
    font:bold 36px Arial, Helvetica, sans-serif;
    border-radius: 7px;
    text-shadow: 0 -1px 1px rgba(0, 0, 0, 0.75);
    border:5px solid #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.75);
}

a.buton:hover{
    background: linear-gradient(top, #8e0700, #d21b00);
    text-shadow: 0 1px 1px rgba(0, 0, 0, 0.75);
    box-shadow: 0 -1px 2px rgba(0, 0, 0, 0.75);
}

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

This Pen doesn't use any external JavaScript resources.