CSS Exercise 01 : Transitions : Answer

HTML

<link rel="stylesheet" href="http://dl.dropbox.com/u/10057969/Resources/css3_ex01.css">
<h1>Amazing!</h1>
<div id="images">
    <img src="http://dl.dropbox.com/u/10057969/Resources/css3_ex01_i01.png" />
    <img src="http://dl.dropbox.com/u/10057969/Resources/css3_ex01_i02.png" />
    <img src="http://dl.dropbox.com/u/10057969/Resources/css3_ex01_i03.png" />
    <div class="clear"></div>
</div>

CSS

#images img {
    box-shadow: 0 5px 5px rgba(0,0,0,.75);
    opacity:0.75;
    -webkit-transition:all 0.5s linear;
    position:relative;
}

#images img:hover {
    opacity:.25;
    width:290px;
    margin:-25px;
    z-index: 1;
    box-shadow: 0 10px 10px rgba(0,0,0,.75);
}