﻿.album_container {
    position: relative;
    margin: 10px auto;
    width: 250px;
    height: 250px;
    perspective: 1000px;
}

.picture {
    width: 100%;
    height: 100%;
    box-shadow: -5px 5px 5px #aaa;
    transform-style: preserve-3d;
    transition: all 1.0s linear;
}

.front {
    position: absolute;
    width: 100%;
    height: 100%;
    z-index: 2;
    backface-visibility: hidden;
    transform: rotateY(0deg);
}

.back {
    position: absolute;
    width: 100%;
    height: 100%;
    padding: 10px;
    color: white;
    text-align: center;
    background-color: #aaa;
    transform: rotateY(180deg);
}


#albumtoprow .album_container:hover .picture {
    transform: rotateY(180deg);
}


#albumbottmrow .back {
    transform: rotateZ(180deg) rotateY(180deg);
}


#albumbottmrow .album_container:hover .picture {
    transform: rotateX(180deg);
}
