1button {
2  position: relative;
3  margin: 0;
4  padding: 17px 35px;
5  outline: none;
6  text-decoration: none;
7  display: flex;
8  justify-content: center;
9  align-items: center;
10  cursor: pointer;
11  text-transform: uppercase;
12  background-color: #fff;
13  border: 1px solid rgba(22, 76, 167, 0.6);
14  border-radius: 10px;
15  color: #1d89ff;
16  font-weight: 400;
17  font-family: inherit;
18  z-index: 0;
19  overflow: hidden;
20  transition: all 0.3s cubic-bezier(0.02, 0.01, 0.47, 1);
21}
22
23button span {
24  color: #164ca7;
25  font-size: 14px;
26  font-weight: 500;
27  letter-spacing: 0.7px;
28}
29
30button:hover {
31  animation: rotate624 0.7s ease-in-out both;
32}
33
34button:hover span {
35  animation: storm1261 0.7s ease-in-out both;
36  animation-delay: 0.06s;
37}
38
39@keyframes rotate624 {
40  0% {
41    transform: rotate(0deg) translate3d(0, 0, 0);
42  }
43
44  25% {
45    transform: rotate(3deg) translate3d(0, 0, 0);
46  }
47
48  50% {
49    transform: rotate(-3deg) translate3d(0, 0, 0);
50  }
51
52  75% {
53    transform: rotate(1deg) translate3d(0, 0, 0);
54  }
55
56  100% {
57    transform: rotate(0deg) translate3d(0, 0, 0);
58  }
59}
60
61@keyframes storm1261 {
62  0% {
63    transform: translate3d(0, 0, 0) translateZ(0);
64  }
65
66  25% {
67    transform: translate3d(4px, 0, 0) translateZ(0);
68  }
69
70  50% {
71    transform: translate3d(-3px, 0, 0) translateZ(0);
72  }
73
74  75% {
75    transform: translate3d(2px, 0, 0) translateZ(0);
76  }
77
78  100% {
79    transform: translate3d(0, 0, 0) translateZ(0);
80  }
81}
82
83.btn-shine {
84  border: 1px solid;
85  overflow: hidden;
86  position: relative;
87}
88
89.btn-shine span {
90  z-index: 20;
91}
92
93.btn-shine:after {
94  background: #38ef7d;
95  content: "";
96  height: 155px;
97  left: -75px;
98  opacity: 0.4;
99  position: absolute;
100  top: -50px;
101  transform: rotate(35deg);
102  transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
103  width: 50px;
104  z-index: -10;
105}
106
107.btn-shine:hover:after {
108  left: 120%;
109  transition: all 550ms cubic-bezier(0.19, 1, 0.22, 1);
110}