label + p,
input + p {
    margin-top: 20px;
}

p > input {
    padding: 0;
    margin: 0;
    height: 16px;
    width: 16px;
    float: left;
    position: absolute;
    left: 0;
    opacity: 0;
}

p > label {
    float: left;
    line-height: 16px;
    padding: 0 0 0 22px;
    clear: both;
}

p:not(#foo) > input:hover + label, p:not(#foo) > input:focus + label,
p:not(#foo) > input + label:hover, p:not(#foo) > input:focus + label {
}

p:not(#foo) > input + label {
    background: url(/css/inputs/custom-inputs.png) 0 -1px no-repeat;
    height: 16px;
}

p:not(#foo) > input[type=radio] + label {
    background-position: 0 -161px;
}

/* Checked styles */
p:not(#foo) > input[type=radio]:checked + label {
    background-position: 0 -241px;
}

p:not(#foo) > input[type=checkbox]:checked + label {
    background-position: 0 -81px;
}

    p:not(#foo) > input[type=checkbox]:hover:checked + label,
    p:not(#foo) > input[type=checkbox]:focus:checked + label,
    p:not(#foo) > input[type=checkbox]:checked + label:hover,
    p:not(#foo) > input[type=checkbox]:focus:checked + label {
        background-position: 0 -101px;
    }

p:not(#foo) > input[type=radio]:hover:checked + label,
p:not(#foo) > input[type=radio]:focus:checked + label,
p:not(#foo) > input[type=radio]:checked + label:hover,
p:not(#foo) > input[type=radio]:focus:checked + label {
    background-position: 0 -261px;
}

/* Hover & Focus styles */
p:not(#foo) > input[type=checkbox]:hover + label,
p:not(#foo) > input[type=checkbox]:focus + label,
p:not(#foo) > input[type=checkbox] + label:hover {
    background-position: 0 -21px;
    cursor: pointer;
}

p:not(#foo) > input[type=radio]:hover + label,
p:not(#foo) > input[type=radio]:focus + label,
p:not(#foo) > input[type=radio] + label:hover {
    background-position: 0 -181px;
}

/* Active styles */
p:not(#foo) > input[type=checkbox]:active + label,
p:not(#foo) > input[type=checkbox] + label:hover:active {
    background-position: 0 -41px;
}

p:not(#foo) > input[type=radio]:active + label,
p:not(#foo) > input[type=radio] + label:hover:active {
    background-position: 0 -201px;
}

p:not(#foo) > input[type=checkbox]:active:checked + label,
p:not(#foo) > input[type=checkbox]:checked + label:hover:active {
    background-position: 0 -121px;
}

p:not(#foo) > input[type=radio]:active:checked + label,
p:not(#foo) > input[type=radio]:checked + label:hover:active {
    background-position: 0 -281px;
}

/* Disabled styles */
p:not(#foo) > input[type=checkbox].readonly + label,
p:not(#foo) > input[type=checkbox]:disabled + label,
p:not(#foo) > input[type=checkbox]:hover:disabled + label,
p:not(#foo) > input[type=checkbox]:focus:disabled + label,
p:not(#foo) > input[type=checkbox]:disabled + label:hover,
p:not(#foo) > input[type=checkbox]:disabled + label:hover:active {
    background-position: 0 -61px;
}

p:not(#foo) > input[type=radio].readonly + label,
p:not(#foo) > input[type=radio]:disabled + label,
p:not(#foo) > input[type=radio]:hover:disabled + label,
p:not(#foo) > input[type=radio]:focus:disabled + label,
p:not(#foo) > input[type=radio]:disabled + label:hover,
p:not(#foo) > input[type=radio]:disabled + label:hover:active {
    background-position: 0 -221px;
}

p:not(#foo) > input[type=checkbox].readonly:checked + label,
p:not(#foo) > input[type=checkbox]:disabled:checked + label,
p:not(#foo) > input[type=checkbox]:hover:disabled:checked + label,
p:not(#foo) > input[type=checkbox]:focus:disabled:checked + label,
p:not(#foo) > input[type=checkbox]:disabled:checked + label:hover,
p:not(#foo) > input[type=checkbox]:disabled:checked + label:hover:active {
    background-position: 0 -141px;
}

p:not(#foo) > input[type=radio].readonly:checked + label,
p:not(#foo) > input[type=radio]:disabled:checked + label,
p:not(#foo) > input[type=radio]:hover:disabled:checked + label,
p:not(#foo) > input[type=radio]:focus:disabled:checked + label,
p:not(#foo) > input[type=radio]:disabled:checked + label:hover,
p:not(#foo) > input[type=radio]:disabled:checked + label:hover:active {
    background-position: 0 -301px;
}