Problemas con Checkbox

[leidy_03]

Buenas Días amigos del foro,

Estoy realizando una aplicación, la cual lleva muchos Checkbox, y queria darle un aspecto bonito a estos; en el css tengo este código:
li.cajita02 {
width: auto;
}
li.cajita02 br {
margin-bottom: 10px;
}
label.cajita02{
float: left;
font-weight: bold;
padding-right: 10px;
}
input[type="checkbox"].cajita02 {
display: none;
}
input[type="checkbox"].cajita02+label
{
background: #fff;
display: inline-block;
width: 16px;
height: 16px;
background: url(img/check_02.png) 0px 0px no-repeat;
text-indent: -1000em;
}
input[type=checkbox].cajita02:checked+label
{
background: url(img/check_02.png) 0px -16px no-repeat;
}
y el checkbox esta así:
<input type="checkbox" name="" onclick="codmateria(this.value)" class="cajita02"/>

el inconveniente es que por mozilla no muestra nada y por explorer muestra tanto la imagen como el checkbox.

Gracias por su colaboración.