#switchbox {
    visibility: hidden;
    position: absolute;
}

label {
    background-color: grey;
    width: 4em;
    height: 2em;
    border-radius: 2em;
    display: block;
    transition: all 1s cubic-bezier(0.54, 1.6, 0.5, 1);
}

span {
    position: absolute;
    top: 6.25rem;
    left: 9.75rem;
}

#switchbox + label::after {
    content: "";
    background-color: #fff;
    width: 1.8em;
    height: 1.8em;
    position: absolute;
    top: 4.2em;
    left: 8.8em;
    border: 0.1em solid black;
    border-radius: 50%;
    transition: all 1s cubic-bezier(0.54, 1.6, 0.5, 1);
}

#switchbox:checked + label::after {
    left: 10.8em;
}

#switchbox:checked + label {
    background-color: rgb(98, 215, 104);
}