3d Pushbutton Titles using CSS3

3d Titles that act as pushbuttons on mouseover. Includes noise body-background.

by Reusablecode

HTML

<link href="http://fonts.googleapis.com/css?family=Yanone+Kaffeesatz" rel="stylesheet" type="text/css" />

<a href="http://team3cx.com">Team C3X</a>
<a href="http://nutri-concepts.com">Metabolic Activator</a>
<a href="http://nutri-concepts.com/research">Nutri-Concepts</a>
<a href="http://nutri-concepts.com/media">Media Center</a>
<a href="http://nutri-concepts.com/products">Products</a>

CSS

body {
    background: #D4D7DF url('http://img21.imageshack.us/img21/7868/mootoolifiedbg.png');
    font-family: 'Yanone Kaffeesatz', Helvetica, Arial, serif;
    text-shadow: 0 1px 0 #fff;
    text-align: center;
    color: #73799C;
    font-size: 4em;
}

.shadow {
    
}
a {
    text-decoration: none;
    color: #fff;
    -webkit-transition: all 0.12s ease-out;
    position: relative;
    text-transform: uppercase;
    text-shadow: 1px 1px #73799C, 2px 2px #73799C, 3px 3px #73799C, 4px 4px #73799C, 5px 5px #73799C, 6px 6px #73799C;
    top: -7px;
    left: -7px;
    display: block;
}

a:hover {
    text-decoration: none;
    text-shadow: 1px 1px #73799C, 2px 2px #73799C;
    top: -3px;
    left: -3px;
    color: #fff;
}