1.center {
2  width: 100%;
3  text-align: center;
4}
5
6input[type="checkbox"] {
7  position: relative;
8  top: 8px;
9  width: 40px;
10  height: 40px;
11  -webkit-appearance: none;
12  outline: none;
13  transition: 0.5s;
14}
15
16input[type="checkbox"]:before {
17  content: "";
18  position: absolute;
19  top: 0;
20  left: 0;
21  width: 100%;
22  height: 100%;
23  border: 4px solid #262626;
24  box-sizing: border-box;
25  transition: 0.5s;
26}
27
28input:checked[type="checkbox"]:before {
29  border-left: none;
30  border-top: none;
31  width: 20px;
32  border-color: rgb(24, 196, 24);
33  transform: rotate(45deg) translate(5px, -10px);
34}