Shadow Class

by Paul Schmitt

HTML

<div>
    <div class="image">
        <img src="https://lh4.googleusercontent.com/-0k3cgMdPCYo/VDAztzf0rDI/AAAAAAAALag/Dn1I303i8aw/s200/helmet-b.png" alt="PNG added to div.">
    </div>
    <div class="shadow"></div>
</div>

CSS

.image {
    float:left;
    position:relative;
    width:200px;
    right:-200px;
    z-index:2;
}
.shadow {
    float:left;
    position:absolute;
    width:200px; /* Example Specific */
    height:40px; /* Example Specific */
    background: radial-gradient(rgba(90, 90, 90, .5), rgba(190, 190, 190, .2), rgba(255, 255, 255, .1));
    margin-top:180px; /* Example Specific */
    margin-left:200px; /* Example Specific */
    -moz-border-radius: 300px / 20px;
    -webkit-border-radius: 300px / 20px;
    border-radius: 300px / 20px;
    z-index:1;
}