.ui-helper-hidden-accessible
{
    position: absolute;
    left: -999em;
}
/* 
			 * The state classes are a little bit complex, because of the doubble class bug in IE6
			 * The state class looks like this:
			 * 
			 * .ui-radio-state[-checked][-disabled][-hover] or .ui-checkbox-state[-checked][-disabled][-hover]
			 * 
			 * Examples:
			 * 
			 * .ui-radio-state-checked (simply checked) 
			 * .ui-radio-state-checked-hover (checked and hovered/focused)
			 * .ui-radio-state-hover (unchecked and hovered/focused)
			 * 
			 */

.ui-radio-state-disabled, .ui-radio-state-checked-disabled, .ui-radio-state-disabled-hover, .ui-radio-state-checked-disabled-hover
{
    color: #999;
}
span.ui-checkbox, span.ui-radio
{
    display: block;
    float: left;
    width: 15px;
    height: 17px;
    background: url(/images/bg_radio_button.gif) 0px 4px no-repeat;
}

span.ui-helper-hidden
{
    display: none;
}
/*label
{
    padding: 2px;
}*/
span.ui-radio-state-hover, span.ui-checkbox-state-hover
{
    background-position: 0 4px;
}

span.ui-checkbox-state-checked, span.ui-checkbox-state-checked-disabled, span.ui-checkbox-state-checked-disabled-hover
{
    background-position: 0 -1px;
}

span.ui-checkbox-state-checked-hover
{
    background-position: 0 -75px;
}
span.ui-radio-state-checked-disabled-hover, span.ui-radio-state-checked-disabled, span.ui-radio-state-checked
{
    background-position: 0 -83px;
}


span.ui-radio-state-checked-hover
{
    background-position: 0 -83px;
}