1label {
2  display: block;
3  width: 20px;
4  height: 20px;
5  cursor: pointer;
6}
7
8input[type='checkbox'] {
9  position: absolute;
10  transform: scale(0);
11}
12
13input[type='checkbox']:checked ~ .checkbox {
14  transform: rotate(45deg);
15  width: 14px;
16  margin-left: 5px;
17  border-color: #24c78e;
18  border-width: 5px;
19  border-top-color: transparent;
20  border-left-color: transparent;
21  border-radius: 0;
22}
23
24.checkbox {
25  display: block;
26  width: inherit;
27  height: inherit;
28  border: solid 3px #2a2a2ab7;
29  border-radius: 6px;
30  transition: all 0.375s;
31}