body {
    margin: 0;
    padding: 1.5em;
   
}

.example {
    margin-bottom: 3px;
    color: #97b3c3;
}

input[type=checkbox]:not(old),
input[type=radio ]:not(old) {
    width: 28px;
    margin: 0;
    padding: 0;
    opacity: 0;
}

    input[type=checkbox]:not(old) + label,
    input[type=radio ]:not(old) + label {
        display: inline-block;
        margin-left: -28px;
        padding-left: 25px;
        background: url('../../images/checks.png') no-repeat 0 0;
        line-height: 26px;
        /*color: #ccc;*/
        color: red;
        cursor: pointer;
        text-decoration: none;
        text-decoration-color: #3d9733;
        text-decoration-style: double;
        text-decoration-skip: ink;
    }

    input[type=checkbox]:not(old):checked + label {
        background-position: 0 -24px;
        color: #3d9733;
        cursor: pointer;
        text-decoration: underline;
        text-decoration-color: #3d9733;
        text-decoration-style: double;
        text-decoration-skip: ink;
    }


    input[type=radio]:not(old):checked + label {
        background-position: 0 -48px;
        color: #97b3c3;
        cursor: pointer;
    }
