1.CartBtn {
2  width: 140px;
3  height: 40px;
4  border-radius: 12px;
5  border: none;
6  background-color: rgb(255, 208, 0);
7  display: flex;
8  align-items: center;
9  justify-content: center;
10  cursor: pointer;
11  transition-duration: .5s;
12  overflow: hidden;
13  box-shadow: 0px 5px 10px rgba(0, 0, 0, 0.103);
14  position: relative;
15}
16
17.IconContainer {
18  position: absolute;
19  left: -50px;
20  width: 30px;
21  height: 30px;
22  background-color: transparent;
23  border-radius: 50%;
24  display: flex;
25  align-items: center;
26  justify-content: center;
27  overflow: hidden;
28  z-index: 2;
29  transition-duration: .5s;
30}
31
32.icon {
33  border-radius: 1px;
34}
35
36.text {
37  height: 100%;
38  width: fit-content;
39  display: flex;
40  align-items: center;
41  justify-content: center;
42  color: rgb(17, 17, 17);
43  z-index: 1;
44  transition-duration: .5s;
45  font-size: 1.04em;
46  font-weight: 600;
47}
48
49.CartBtn:hover .IconContainer {
50  transform: translateX(58px);
51  border-radius: 40px;
52  transition-duration: .5s;
53}
54
55.CartBtn:hover .text {
56  transform: translate(10px,0px);
57  transition-duration: .5s;
58}
59
60.CartBtn:active {
61  transform: scale(0.95);
62  transition-duration: .5s;
63}