
input[type="checkbox"]
{
}
 
.form_wrapper input[type="checkbox"]
{
	position: absolute;
	-moz-opacity: 0;
	-webkit-opacity: 0;
	opacity: 0;       
}

.form_wrapper input[type="checkbox"]
{
	position: static\9;
        width: 19px;
        height: 19px;
}

.form_wrapper input[type="checkbox"] + span::before
{
	content: "";
	display: inline-block;
	width: 18px;
	height: 18px;
	vertical-align: middle;
	background-repeat:  no-repeat;
        -webkit-transition: all 0.15s ease-in-out;
        -moz-transition: all 0.15s ease-in-out;
        -o-transition: all 0.15s ease-in-out;
        transition: all 0.15s ease-in-out;
  
}

.form_wrapper input[type="checkbox"]:checked + span::before
{
	background-image: url('images/check.png');        
}


.form_wrapper input[type="checkbox"] + span::before
{
	border: 1px solid #c5c5c5;
        background-color: #fff;
        background-repeat: no-repeat;
        background-position: 50% 50%;
}

/* 
    Hide the original radios and checkboxes
    (but still accessible)
    
    :not(#foo) > is a rule filter to block browsers
                 that don't support that selector from
                 applying rules they shouldn't
       
*/
li:not(#foo) > fieldset > div > span > input[type='radio'], 
li:not(#foo) > fieldset > div > span > input[type='checkbox'] {
    
    /* Hide the input, but have it still be clickable */
    opacity: 0;
    
    float: left;
    width: 18px;
}


li:not(#foo) > fieldset > div > span > input[type='radio'] + label,
li:not(#foo) > fieldset > div > span > input[type='checkbox'] + label {
    margin: 0;
    clear: none;
    
    /* Left padding makes room for image */
    padding: 5px 0 4px 24px;

    /* Make look clickable because they are */
    cursor: pointer;
    
    background: url(off.png) left center no-repeat; 
}

/*
    Change from unchecked to checked graphic
*/
li:not(#foo) > fieldset > div > span > input[type='radio']:checked + label {
    background-image: url(radio.png);
}
li:not(#foo) > fieldset > div > span > input[type='checkbox']:checked + label {
    background-image: url(check.png);
}