Checkbox Styling with Minimal CSS — See https://codepen.io/zaidaldabbagh/pen/pQBNEo

checkboxFilter.html

<div class="filter">
    <label class="filter__item">
        <input type="checkbox" id="chkStatDraft" checked="" value="DRAFT">
        <span>Draft</span>
    </label>
    <label class="filter__item">
        <input type="checkbox" id="chkStatWD" value="WITHDRAWN">
        <span>Withdrawn</span>
    </label>
    <label class="filter__item">
        <input type="checkbox" id="chkStatDecline" value="DECLINED">
        <span>Declined</span>
    </label>
</div>

checkboxFilter.scss

.filter {
    &__item {
        font-weight: normal !important;
        font-size: 12px;
        display: inline-block;
        padding: 4px 12px 3px 7px;
        border-radius: 20px;
        border: 2px solid #ccc;
        margin: 5px 5px 5px 0;
        text-transform: uppercase;
        -webkit-touch-callout: none; /* iOS Safari */
        -webkit-user-select: none; /* Safari */
        -khtml-user-select: none; /* Konqueror HTML */
        -moz-user-select: none; /* Firefox */
        -ms-user-select: none; /* Internet Explorer/Edge */
        user-select: none; /* Non-prefixed version, currently supported by Chrome and Opera */
        input[type="checkbox"] {
            vertical-align: middle;
            margin: 0;
            -webkit-appearance: initial; 
            appearance: initial; 
            width: 20px; 
            height: 20px; 
            border: none; 
            position: relative;
            outline: none;
            &:after { 
                content: "\D7"; 
                position: absolute;
                left: 50%;
                top: 50%;
                -webkit-transform: translate(-50%,-50%); 
                -moz-transform: translate(-50%,-50%); 
                -ms-transform: translate(-50%,-50%); 
                transform: translate(-50%,-50%);
                font-size: 18px;
            }
            &:checked { 
                &:after {
                    content: "\2713"; 
                    position: absolute;
                    left: 50%; 
                    top: 50%;
                    -webkit-transform: translate(-50%,-50%); 
                    -moz-transform: translate(-50%,-50%); 
                    -ms-transform: translate(-50%,-50%); 
                    transform: translate(-50%,-50%);
                    font-size: 12px;
                }
            }
        }
    }
}