1.checkbox-wrapper-23 *,
2  .checkbox-wrapper-23 *:after,
3  .checkbox-wrapper-23 *:before {
4  box-sizing: border-box;
5}
6
7.checkbox-wrapper-23 input {
8  position: absolute;
9  opacity: 0;
10}
11
12.checkbox-wrapper-23 input:checked + label svg path {
13  stroke-dashoffset: 0;
14}
15
16.checkbox-wrapper-23 input:focus + label {
17  transform: scale(1.03);
18}
19
20.checkbox-wrapper-23 input + label {
21  display: block;
22  border: 2px solid rgb(253, 237, 237);
23  width: var(--size);
24  height: var(--size);
25  border-radius: 6px;
26  cursor: pointer;
27  transition: all .2s ease;
28}
29
30.checkbox-wrapper-23 input + label:active {
31  transform: scale(1.05);
32  border-radius: 12px;
33}
34
35.checkbox-wrapper-23 input + label svg {
36  pointer-events: none;
37  padding: 5%;
38}
39
40.checkbox-wrapper-23 input + label svg path {
41  fill: none;
42  stroke: rgb(247, 247, 247);
43  stroke-width: 4px;
44  stroke-linecap: round;
45  stroke-linejoin: round;
46  stroke-dasharray: 100;
47  stroke-dashoffset: 101;
48  transition: all 250ms cubic-bezier(1,0,.37,.91);
49}
50