Hover Button

by JamesKyle

HTML

<div class="hover-button">
    <img src="http://scm-l3.technorati.com/10/09/26/18941/dexter-main.jpg" />
</div>

CSS

body {font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif}
.hover-button {text-align: center;float: left;cursor: pointer;}
.hover-button img {display: block}
.hover-button::after {
    content: 'Button ›';
    display: inline;
    position: relative;
    padding: 10px 20px;
    top: -50px;
    
    background: rgba(0,0,0,0.7);
    background: -moz-linear-gradient(top, rgba(0,0,0,0.75) 0%, rgba(0,0,0,0.95) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.75)), color-stop(100%,rgba(0,0,0,0.95)));
    background: -webkit-linear-gradient(top, rgba(0,0,0,0.75) 0%,rgba(0,0,0,0.95) 100%);
    background: -o-linear-gradient(top, rgba(0,0,0,0.75) 0%,rgba(0,0,0,0.95) 100%);
    background: -ms-linear-gradient(top, rgba(0,0,0,0.75) 0%,rgba(0,0,0,0.95) 100%);
    background: linear-gradient(top, rgba(0,0,0,0.75) 0%,rgba(0,0,0,0.95) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#bf000000', endColorstr='#f2000000',GradientType=0 );
    color: #fff;
    text-shadow: #000 0px -1px 0px;
    border: rgba(0,0,0,0.9) solid 1px;
    
    
    opacity: 0;
    
    -webkit-border-radius: 3px;
     -khtml-border-radius: 3px;
       -moz-border-radius: 3px;
        -ms-border-radius: 3px;
         -o-border-radius: 3px;
            border-radius: 3px;
    -webkit-box-shadow: rgba(0,0,0,0.2) 0px 1px 3px, 
                  inset rgba(255,255,255,0.2) 0px 1px 0px, inset rgba(255,255,255,0.2) 0px -1px 0px,
                  inset rgba(255,255,255,0.2) 1px 0px 0px, inset rgba(255,255,255,0.2) -1px 0px 0px;
     -khtml-box-shadow: rgba(0,0,0,0.2) 0px 1px 3px, 
                  inset rgba(255,255,255,0.2) 0px 1px 0px, inset rgba(255,255,255,0.2) 0px -1px 0px,
                  inset rgba(255,255,255,0.2) 1px 0px 0px, inset rgba(255,255,255,0.2) -1px 0px 0px;
       -moz-box-shadow: rgba(0,0,0,0.2) 0px 1px 3px, 
                  inset rgba(255,255,255,0.2) 0px 1px 0px, inset rgba(255,255,255,0.2) 0px -1px...