1.number-control {
2  display: flex;
3  align-items: center;
4}
5
6.number-left::before,
7.number-right::after {
8  content: attr(data-content);
9  background-color: #333333;
10  display: flex;
11  align-items: center;
12  justify-content: center;
13  border: 1px solid black;
14  width: 20px;
15  color: white;
16  transition: background-color 0.3s;
17  cursor: pointer;
18}
19
20.number-left::before {
21  content: "-";
22}
23
24.number-right::after {
25  content: "+";
26}
27
28.number-quantity {
29  padding: 0.25rem;
30  border: 0;
31  width: 50px;
32  -moz-appearance: textfield;
33  border-top: 1px solid black;
34  border-bottom: 1px solid black;
35}
36
37.number-left:hover::before,
38.number-right:hover::after {
39  background-color: #666666;
40}
41