Gradient button using CSS

gradient-button.css

/* view live example at http://goodies.wpengine.com/blog/gradient-buttons-using-css3/ */
.gradient-button {
color: #fff;
cursor: pointer;
background-color: #EA0738 ; /* background color for non-css3 browsers */
/* gradient */
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#FC5176), to(#EA0738));
background-image: -webkit-linear-gradient(#FC5176, #EA0738);
background-image: -moz-linear-gradient(#FC5176, #EA0738);
background-image: -o-linear-gradient(#FC5176, #EA0738);
background-image: linear-gradient(#FC5176, #EA0738);
-moz-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.2);
-webkit-box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.2);
box-shadow: 0px 0px 8px 0px rgba(0, 0, 0, 0.2);  
border-radius: 8px 8px 8px 8px;
padding: 16px 24px;
padding: 1rem 1.5rem;
font-weight:700;
text-shadow: 0px 1px 0px #444;
display: table;
white-space:nowrap;
}
 
.gradient-button:hover {
background-color: #FC5176 ; /* background color for non-css3 browsers */
/* gradient */
background-image: -webkit-gradient(linear, 0 0, 0 100%, from(#EA0738), to(#FC5176));
background-image: -webkit-linear-gradient(#EA0738, #FC5176);
background-image: -moz-linear-gradient(#EA0738, #FC5176);
background-image: -o-linear-gradient(#EA0738, #FC5176);
background-image: linear-gradient(#EA0738, #FC5176);
}