input.apple-switch {
    position: relative;
    -webkit-appearance: none;
    outline: none;
    width: 50px;
    height: 30px;
    background-color: #b1d5a9;
    border: 1px solid #b1d5a9;
    border-radius: 50px;
    box-shadow: inset -20px 0 0 0 #C0C0C0;
}

    input.apple-switch:after {
        content: "";
        position: absolute;
        top: 1px;
        left: 1px;
        background: #fff;
        width: 26px;
        height: 26px;
        border-radius: 50%;
        box-shadow: 2px 4px 6px #b1d5a9;
    }

    input.apple-switch:checked {
        box-shadow: inset 20px 0 0 0 #1AB394;
        border-color: #1AB394;
    }

        input.apple-switch:checked:after {
            left: 20px;
            box-shadow: -2px 4px 3px #1AB394;
        }

input.apple-switch-small {
    position: relative;
    -webkit-appearance: none;
    outline: none;
    width: 30px;
    height: 20px;
    background-color: #b1d5a9;
    border: 1px solid #b1d5a9;
    border-radius: 50px;
    box-shadow: inset -20px 0 0 0 #C0C0C0;
}

    input.apple-switch-small:after {
        content: "";
        position: absolute;
        top: 0px;
        left: 1px;
        background: #fff;
        width: 18px;
        height: 18px;
        border-radius: 50%;
        box-shadow: 2px 4px 6px #b1d5a9;
    }

    input.apple-switch-small:checked {
        box-shadow: inset 20px 0 0 0 #1AB394;
        border-color: #1AB394;
    }
    
        input.apple-switch-small:checked:after {
            left: 10px;
            box-shadow: -2px 4px 3px #1AB394;
        }