left to right color fill button
/* change class name and enjoy it */
.c-button > a {
overflow: hidden;
}
.c-button > a:before {
content: "";
display: block;
width: 100%;
height: 100%;
margin: auto;
position: absolute;
z-index: -1;
top: 0;
left: 0;
bottom: 0;
right: 0;
-webkit-transition: -webkit-transform 0.2s cubic-bezier(0.38, 0.32, 0.36, 0.98) 0s;
transition: -webkit-transform 0.2s cubic-bezier(0.38, 0.32, 0.36, 0.98) 0s;
-o-transition: transform 0.2s cubic-bezier(0.38, 0.32, 0.36, 0.98) 0s;
transition: transform 0.2s cubic-bezier(0.38, 0.32, 0.36, 0.98) 0s;
transition: transform 0.25s cubic-bezier(0.38, 0.32, 0.36, 0.98) 0s, -webkit-transform 0.25s cubic-bezier(0.38, 0.32, 0.36, 0.98) 0s;
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
-webkit-transform-origin: right center;
-ms-transform-origin: right center;
transform-origin: right center;
background-color: #B31255 !important;
}
.c-button > a:hover:before {
-webkit-transform: scale(1);
-ms-transform: scale(1);
transform: scale(1);
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
}
/* if you want to more learn you wisit our website http://roginetwork.com/ */
/* Rogi Network */
/* +923022020318 */
/* [email protected] */