CSS - Checkbox Image

HTML

<script src="http://github.com/downloads/SteveSanderson/knockout/knockout-2.1.0.js"></script>
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap-responsive.css">
<link rel="stylesheet" href="http://twitter.github.com/bootstrap/assets/css/bootstrap.css">
<!--Wijmo Widgets CSS-->
<link href="http://cdn.wijmo.com/jquery.wijmo-complete.all.2.1.3.min.css" rel="stylesheet" type="text/css" />

<!--Wijmo Widgets JavaScript-->
<script src="http://cdn.wijmo.com/jquery.wijmo-open.all.2.1.3.min.js" type="text/javascript"></script>

<!--Wijmo Knockout Integration Library-->
<script src="http://cdn.wijmo.com/external/knockout.wijmo.js" type="text/javascript"></script>

<section class="row">
    <!-- ko foreach:pastries -->
    <article class="span3">
        <label data-bind="text:name"></label>
        <input type="checkbox" data-bind="wijcheckbox: { disabled: inStock, checked: selected }" />
        <input type="checkbox" data-bind="enable: !inStock, checked: selected" />
    </article>
    <!-- /ko -->
</section>

CSS

body { 
    background: #dddddd; 
    margin:20px; 
    font-family:'Segoe UI Light', 'Segoe UI', 'Verdana'
    font-size: 32px;
}

article{
    height: 48px;
    border: 1px solid whitesmoke;
    padding: 4px 20px;
    min-width: 150px;
}

article:hover{
    cursor: pointer;
    background: #14649E;
    color: white;
}

label
{
 float:left;   
}
.wijmo-checkbox
{
    float:right;
   cursor: pointer;
   opacity: .6;
   padding: 0;
   height: 32px;
   width: 32px;
   margin:8px 0;
}
div.wijmo-checkbox .wijmo-checkbox-box
{
   height: 32px;
   width: 32px;
}

div.wijmo-checkbox .wijmo-checkbox-box .wijmo-checkbox-icon
{
    display:block;
   height: 32px;
   width: 32px;
    background: url(http://johnpapa.net/files/downloads/images/bookmark.png);
    opacity: 1;
}
div.wijmo-checkbox .ui-state-hover .wijmo-checkbox-icon
{
    background: url(http://johnpapa.net/files/downloads/images/bookmark.png);
    opacity: 0.6;
}
div.wijmo-checkbox .ui-state-active .ui-icon-check
{
    background: url(http://johnpapa.net/files/downloads/images/bookmarkchecked.png);
    opacity: 1;
}
div.wijmo-checkbox .ui-state-active.ui-state-hover .wijmo-checkbox-icon
{
    opacity: 0.6;
}
div.wijmo-checkbox .ui-state-disabled .wijmo-checkbox-icon
{
    background: red;
}
div.wijmo-checkbox .wijmo-checkbox-icon
{
}



/* responsive */
@media (max-width: 480px) {
    article > span {
        font-size: 100%;
    }
}

@media (min-width: 481px) and (max-width: 767px) {
    article > span {
        font-size: 120%;
    }
}

@media (min-width: 768px) and (max-width: 979px) {
    article > span {
        font-size: 140%;
    }
}

@media (min-width: 980px) {
    article > span {
        font-size: 180%;
    }
}

JavaScript

var vm = (function() {
    var pastries = ko.observableArray([
        {
        name: 'Cake',
        selected: ko.observable(false),
        inStock: true},
    {
        name: 'Cookie',
        selected: ko.observable(false),
        inStock: false},
    {
        name: 'Cracker',
        selected: ko.observable(false),
        inStock: true},
    {
        name: 'Cannoli',
        selected: ko.observable(false),
        inStock: true},
    {
        name: 'Crepe',
        selected: ko.observable(true),
        inStock: false},
    {
        name: 'Cheesecake',
        selected: ko.observable(false),
        inStock: true},
    {
        name: 'Cream puff',
        selected: ko.observable(false),
        inStock: true},
    {
        name: 'Cheese danish',
        selected: ko.observable(false),
        inStock: false},
    {
        name: 'Cinnamon roll',
        selected: ko.observable(false),
        inStock: true},
    {
        name: 'Chocolate Ă©clair',
        selected: ko.observable(false),
        inStock: true},
    {
        name: 'Cherry pie',
        selected: ko.observable(false),
        inStock: true},
    {
        name: 'Croissant',
        selected: ko.observable(false),
        inStock: true}].sort());
    return {
        pastries: pastries
    }
})();

ko.applyBindings(vm);