1.button {
2  padding: 1em 2em;
3  border: none;
4  border-radius: 5px;
5  font-weight: bold;
6  letter-spacing: 2px;
7  text-transform: uppercase;
8  color: #ff6f69;
9  transition: all 500ms;
10  font-size: 18px;
11  position: relative;
12  overflow: hidden;
13  outline: 2px solid #ff6f69;
14}
15
16button:hover {
17  color: #ffffff;
18  transform: scale(1.05);
19  outline: 2px solid #ff6f69;
20  box-shadow: 2px 3px 10px -2px #ff6f69;
21}
22
23button::before {
24  content: "";
25  position: absolute;
26  left: -50px;
27  top: 0;
28  width: 0;
29  height: 100%;
30  background-color: #ff6f69;
31  transform: skewX(45deg);
32  z-index: -1;
33  transition: width 500ms;
34}
35
36button:hover::before {
37  width: 200%;
38}