1.btn2 {
2  position: relative;
3  display: inline-block;
4  padding: 15px 30px;
5  border: 2px solid #fefefe;
6  text-transform: uppercase;
7  color: #fefefe;
8  text-decoration: none;
9  font-weight: 600;
10  font-size: 20px;
11  transition: 0.3s;
12}
13
14.btn2::before {
15  content: '';
16  position: absolute;
17  top: -2px;
18  left: -2px;
19  width: calc(100% + 4px);
20  height: calc(100% - -2px);
21  background-color: #212121;
22  transition: 0.3s ease-out;
23  transform: scaleY(1);
24}
25
26.btn2::after {
27  content: '';
28  position: absolute;
29  top: -2px;
30  left: -2px;
31  width: calc(100% + 4px);
32  height: calc(100% - 50px);
33  background-color: #212121;
34  transition: 0.3s ease-out;
35  transform: scaleY(1);
36}
37
38.btn2:hover::before {
39  transform: translateY(-25px);
40  height: 0;
41}
42
43.btn2:hover::after {
44  transform: scaleX(0);
45  transition-delay: 0.15s;
46}
47
48.btn2:hover {
49  border: 2px solid #fefefe;
50}
51
52.btn2 span {
53  position: relative;
54  z-index: 3;
55}
56
57button {
58  text-decoration: none;
59  border: none;
60  background-color: transparent;
61}