Как кроссбраузерно стилизовать type="checkbox"?
Делаете label для чекбокса, сам чекбокс скрываете, для label через :before добавляете нужные стили. (когда checkbox:checked и checkbox в обычном состоянии, но важен порядок тегов в коде). На хабрахабре описывался подобный способ.
Псевдокод:<input type="checkbox" id="checkbox"><label for="checkbox">Test</label>
<style>
    #checkbox {
        display: none;
    }
    
    #checkbox:checked + label:before {
        content: "* ";
    }
    
    #checkbox + label:before {
        content: " ";
    }
</style>
Будет отображать звездочку для отмеченного чекбокса и галочку для пустого чекбокса. Тебе остается просто заменить это все на картинки. Клик по ним тоже будет работать, т.к. :before :)
Странно конечно что по Вашим словам у гогла сегодня выходной ). 
Вот курс на правильное направление у label<labe for="test">Test</label>
<input type="чекбокс" id="test">
 есть классный атрибут "for" он привязывает поле к лейблу, 
Попробуйте кастомизировать лейбл