In TABLE: Customize Checkboxes And Radio Buttons With CSS3 - button

Question

I styled my radiobuttons using this tutorial:
a link
It works perfect without a tablelayout! But..
I have a fix tablelayout and I can not change anything on this layout (the layout comes from an old generator). The label and the inputtype (radiobutton) are in separate tables.
Have anyone a idea? How can I style the radiobutton inside the table?
My jsfiddle:
http://jsfiddle.net/ETp5w/
The HTML
<!-- Tablelayout .. is not working!!! -->
<table class="" width="100.0%" cellpadding="0" cellspacing="0">
<colgroup>
<col width="100.0%">
</colgroup>
<tbody>
<tr>
<td class="">
<table cellpadding="0" cellspacing="0" class="">
<tbody>
<tr>
<td>
<input type="radio" name="answer" value="1" class="abc" id="radiobutton1">
</td>
<td>
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<label for="radiobutton1"><span class="spantext">answer1<br></span></label>
</td>
</tr>
</tbody>
</table>
</td>
<td class="next">
</td>
</tr>
</tbody>
</table>
<table cellpadding="0" cellspacing="0" class="">
<tbody>
<tr>
<td>
<input type="radio" name="answer" value="2" class="abc" id="radiobutton2">
</td>
<td>
<table cellpadding="0" cellspacing="0">
<tbody>
<tr>
<td>
<label for="radiobutton2"><span class="spantext">answer2<br></span></label>
</td>
</tr>
</tbody>
</table>
</td>
<td class="next">
</td>
</tr>
</tbody>
</table>
</td>
</tr>
</tbody>
</table>
<!-- Same code without tables. Works! -->
<input id="answer3" type="radio" name="answer" value="3"></td>
<label for="answer3">answer3</label>
<input id="answer4" type="radio" name="answer" value="4">
<label for="answer4">answer4</label>
The CSS
label {
display: inline-block;
cursor: pointer;
position: relative;
padding-left: 25px;
margin-right: 15px;
font-size: 13px;
width: 100%;
}
label:checked::before {
background-color: yellow;
}
input[type=radio] {
display: none;
}
label:before {
content: "";
display: inline-block;
width: 20px;
height: 20px;
margin-right: 10px;
position: absolute;
left: -15;
bottom: 1px;
background-color: #aaa;
box-shadow: inset 0px 2px 3px 0px rgba(0, 0, 0, .3), 0px 1px 0px 0px rgba(255, 255, 255, .8);
}
label:hover::before {
background-color: red;
}
input[type=radio]:checked + label:before {
content: "\2022";
color: blue;
font-size: 30px;
text-align: center;
line-height: 18px;
background-color: red;
}
.radio label:before {
border-radius: 8px;
}