CodePen

HTML

            
              <input type="radio" name="foo" checked>
<input type="radio" name="foo">
<input type="radio" name="foo">
            
          
!
via HTML Inspector

CSS

            
              html {
    background: url("http://farm6.static.flickr.com/5074/5905795977_d2d2bec6a3_o.jpg");
    display: -webkit-flex;
    -webkit-justify-content: center;
    -webkit-align-items: center;
    height:100%;
}

input[type="radio"] {
    background-image: url('http://cl.ly/image/1Z0S0g1K1m0N/url.png');
    background-size:175px 175px;
    border-radius: 100%;
    cursor: pointer;
    display: inline-block;
    height: 175px;
    width: 175px;
    margin-right: 20px;
    -webkit-appearance: none;
}
input[type="radio"]:checked:after {
    border:5px solid #222;
    height: 155px;
    width: 155px;
    display:block;
    content:"";
    border-radius:100%;
    top:5px;
    left:5px;
    position:relative;
}
            
          
!
? ?
? ?
Must be a valid URL.
+ add another resource
via CSS Lint

JS

            
              
            
          
!
Must be a valid URL.
+ add another resource
via JS Hint
Loading ..................