StackOverflow - Vignette effect with css opacity and two images

http://stackoverflow.com/questions/27634023/add-circular-fading-opacity-vignette-effect-to-images-in-css

HTML

<div class="circle-opaque">
    <img src="http://www.catchannel.com/images/articles/0805/orange-kitten-200px.jpg" />
</div>
<div class="circle-transparent">
    <img src="http://www.catchannel.com/images/articles/0805/orange-kitten-200px.jpg" />
</div>

CSS

.circle-opaque {
    border-radius: 50%;
    display: inline-block;
    position: absolute;
    left:0px;
    top:0px;
    z-index: -1;
}
.circle-opaque img {
    border-radius: 50%;
    z-index: -1;
}
.circle-transparent {
    border-radius: 50%;
    position: absolute;
    left:0px;
    top:0px;
    z-index: 1;
}
.circle-transparent img {
    width: 200px;
    opacity: 0.4;
    filter: alpha(opacity=40);
    z-index: 1;
}