table{
    width: 60%;
    border: 1pt solid yellow;
}
td{
    border: 1pt solid yellow;
    text-align: center; /*выравнивание текста*/
}
#tabel1{
    background-color: blue;
}
#tabel2{
    background-color: magenta;
}
#tabel3{
    background-color: green;
}
#tabel4{
    background-color: darkslateblue;
}
img {
    border-radius: 50%;
}
input[type="radio"] {
    border: 0 ;
    clip: rect(1px, 1px, 1px, 1px);
    height: 1px ;
    overflow: hidden;
    padding: 0 ;
    position: absolute ;
    width: 1px
}
input[type="radio"]:checked + label {
    color: black;
}
input[type="radio"]:checked + label::before {
    background: radial-gradient(0.75em circle at center, currentColor 50%, transparent 55%);
    box-shadow: 0 0 1em 0 rgba(10, 150, 255, 0.75);
    border-color: currentColor;
}

input[type="radio"]:checked + label,
input[type="radio"]:focus + label {
    color: black;
}

input[type="radio"]:focus + label::before {
    box-shadow: 0 0 1em 0 rgba(10, 150, 255, 0.75);
    border-color: currentColor;
}
#pilt{
    width: 200px;
    height: 200px   ;
}
label {
    display: inline-flex;
    align-items: center;
}
label::before {
    content: '';
    display: block;
    height: 1.25em;
    width: 1.25em;
    border: solid 1px #ccc;
    border-radius: 50%;
    margin-right: 0.5em;
}
label::before {
...
transition: border ease-in 150ms, box-shadow ease-in 150ms;
}