css3 boxes with shadow

css3 boxes with shadow

by Andrew Pougher

HTML

<div class="row">
<div class="shadow im1"></div>
    <div class="shadow"></div>
    <div class="shadow"></div>
    </div>

    <div class="shadow"></div>
    <div class="shadow"></div>
    <div class="shadow"></div>
    <div class="shadow"></div>
    <div class="shadow"></div>
    <div class="shadow"></div>
    <div class="shadow"></div>

CSS

body{background:#ddd}

.shadow {
    box-shadow: 0 8px 6px -6px #000;
    -webkit-box-shadow: 0 8px 6px -6px #000;
    -moz-box-shadow: 0 8px 6px -6px #000;
    height: 200px;
    width: 200px;
    background-color: #eeeeee;
    margin: 10px;
    border:4px solid white;
    display:inline-block;
}
.im1{
    background: url('http://img.ffffound.com/static-data/assets/6/035bc882469906ed7016d03f442d9d59aaa1e5d3_m.jpg') no-repeat 0 0 scroll;}

.mask img {
    -webkit-transform: rotate(15deg);
    -moz-transform:rotate(15deg);
    -o-transform:rotate(15deg);
    -ms-transform:rotate(15deg);
    transform:rotate(15deg);
}