<button class="cp_button10">button</button>
.cp_button10 {
position: relative;
display: flex;
justify-content: center;
align-items: center;
width: 160px;
padding: 1em;
cursor: pointer;
color: #ffffff;
background: #FFB300;
border: 1px solid #FFB300;
border-radius: 0.25rem;
overflow: hidden;
}
.cp_button10:after {
position: absolute;
display: block;
content: '';
margin-bottom: -100%;
margin-left: -120%;
padding-top: 240%;
padding-left: 240%;
border-radius: 50%;
background: rgba(255,255,255,0.3);
transition: all 1s;
opacity: 0;
}
.cp_button10:hover {
color: #ffffff;
border-color: #FF8F00;
background-color: #FF8F00;
}
.cp_button10:active:after {
margin-top: 0;
margin-left: 0;
padding-top: 0;
padding-left: 0;
transition: 0s;
opacity: 1;
}
.cp_button10:focus {
color: #ffffff;
border: 1px solid #FFB300;
}