1.btn {
2  padding: 10px 20px;
3  font-size: 18px;
4  background: rgb(240, 240, 240);
5  border: 1px solid transparent;
6  border-radius: 5px;
7  cursor: pointer;
8  transition: all .3s;
9  position: relative;
10  display: flex;
11  align-items: center;
12  justify-content: center;
13  overflow: hidden;
14  color: rgb(49, 48, 48);
15}
16
17.btn::before {
18  border-radius: 50%;
19  background-color: rgb(0, 98, 255, 0.2);
20  content: '';
21  position: absolute;
22  width: 0;
23  height: 0;
24}
25
26.btn:hover {
27  border-color: rgb(0, 98, 255);
28  color: rgb(0, 98, 255);
29}
30
31.btn:focus {
32  color: rgb(0, 98, 255);
33  border-color: rgb(0, 98, 255);
34  box-shadow: 0 0 0 3px rgb(0, 98, 255, 0.2);
35}
36
37.btn:focus::before {
38  transition: all 0.5s ease-out;
39  opacity: 0;
40  width: 250px;
41  height: 250px;
42}