Just another button

by mnk

HTML

<a href="javascript:void(0)" class="btn">Button</a>

CSS

.btn {
    position: absolute;
    left: 45%;
    top: 45%;
}

.btn {
    width: 150px;
    font: 16px/18px Helvetica;
    color: white;
    text-decoration: none;
    background-color: #6bbefd;
    text-align: center;
    
    padding: 12px 0 0 0;
    height: 30px;
    
    -webkit-box-shadow: 0 5px 0 0 rgba(45,147,212,1);
    box-shadow: 0 5px 0 0 rgba(45,147,212,1);
    
    -webkit-border-radius: 4px;
    border-radius: 4px;
    
    -webkit-transition: all .2s ease;
    -moz-transition: all .2s ease;
    -ms-transition: all .2s ease;
    -o-transition: all .2s ease;
    transition: all .2s ease;
}

.btn:hover {
    -webkit-box-shadow: 0 2px 0 0 rgba(45,147,212,1);
    box-shadow: 0 2px 0 0 rgba(45,147,212,1);
    
    background-color: #95D6FD;
    
    margin-top: 5px;
    -webkit-transition: all .2s ease;
-moz-transition: all .2s ease;
-ms-transition: all .2s ease;
-o-transition: all .2s ease;
transition: all .2s ease;
}