for my reference only. button transition effect and box shadow for everyday use
.button.secondary {
text-shadow: 1px 1px 0px rgba(255, 255, 255, 0.6);
background-image: -webkit-linear-gradient( #ffefc3, #ffdf89);
background-image: linear-gradient( #ffefc3, #ffdf89);
color: #b68733;
border: 1px solid #dab861;
box-shadow: inset 0 1px 0px rgba(255, 255, 255, 0.7),inset 0 -1px 0px rgba(218, 184, 97, 0.4);
}
.button.radius {
-webkit-border-radius: 5px;
border-radius: 5px;
}
.button.secondary {
transition: all 2.25s;
padding: 10px;
text-decoration: none;
}
.background {
background: #85c3af;
background-image: -webkit-linear-gradient( #77af9d, #cee7df);
background-image: linear-gradient( #77af9d, #cee7df);
box-shadow: 0 2px 3px rgba(0, 0, 0, 0.15);
background-position: 36px 0px !important;
background-size: auto 36px !important;
}