.cover {
    display: inline-block;
    box-shadow: 5px 5px 20px #333;
    margin: 10px;
}

.cover img {
    vertical-align: middle;
}

.csstransforms3d  .covers {
    -moz-perspective: 100px;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
}

.csstransforms3d  .cover {
    position: relative;
    -moz-perspective: 100px;
    -moz-transform: rotateY(-3deg);
    -webkit-transform: perspective(100) rotateY(-3deg);
    outline: 1px solid transparent;
    box-shadow: none;
    margin: 0;
}

.csstransforms3d  .cover img {
    position: relative;
    width: 240px;
    max-width: 100%;
}

.csstransforms3d  .cover:before,
.csstransforms3d  .cover:after {
    position: absolute;
    top: 2%;
    height: 96%;
    content: ' ';
    z-index: -1;
}

.csstransforms3d  .cover:before {
    width: 100%;
    left: 3.5%;
    background-color: #2f2b39;
    box-shadow: 5px 5px 20px #333;
}

.csstransforms3d  .cover:after {
    width: 2%;
    left: 100%;
    background-color: #efefef;
    box-shadow: inset 0px 0px 5px #aaa;
    -moz-transform: rotateY(20deg);
    -webkit-transform: perspective(100) rotateY(20deg);
}