.book {
    display: inline-block;
    box-shadow: 5px 5px 20px #333;
    max-width: 70%;
    margin: 5px;
}

.book img {
    vertical-align: middle;
}

.csstransforms3d {
    background: transparent;
    /*position: relative;*/

}

.csstransforms3d.singleBook {
    background: none;
    margin-top: 0;
    margin-right: 0;
    text-align: right;
    margin-bottom: 0;
}

.csstransforms3d .books {
    -moz-perspective: 100px;
    -moz-transform-style: preserve-3d;
    -webkit-transform-style: preserve-3d;
    padding: 10px 0 20px;
	margin-right:0;
	
}

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

.csstransforms3d .book img {
    position: relative;
    z-index: 3;
    max-width: 100%;
    border: 1px solid #D0CCCC;
}

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

.csstransforms3d .book:before {
    width: 100%;
    z-index: -1;
    right: 7.5%;
    background-color: #979797;
    border: 1px solid #D0CCCC;

}

.csstransforms3d .book:after {
    width: 5%;
    right: 100%;
    z-index: 1;
    background-color: #EFEFEF;
    box-shadow: inset 0px 0px 5px #aaa;
    -moz-transform: rotateY(-10deg);
    -webkit-transform: perspective(100) rotateY(-10deg);
    border: 1px solid #D0CCCC;
}

.book_container {
    text-align: center;
    margin: 20px 0 0 0;
    padding-bottom: 0;
    position: relative;
	overflow:hidden; float:right;
}

@media all and (max-width: 540px) {
    .csstransforms3d .books {
        padding:18px;
    }
}


/*-----------------*/
/***** Apollo *****/
/*-----------------*/

figure.effect-apollo {
    /*background: #3498db; */
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
	border-radius: 10px;
}

figure.effect-apollo:hover {
    background: rgba(101, 111, 117, 0.52);

}

figure.effect-apollo img {
    opacity: 0.95;
    -webkit-transition: opacity 0.35s, -webkit-transform 0.35s;
    transition: opacity 0.35s, transform 0.35s;
    -webkit-transform: scale3d(1.05,1.05,1);
    transform: scale3d(1.05,1.05,1);
}

figure.effect-apollo figcaption::before {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255,255,255,0.5);
    content: '';
    -webkit-transition: -webkit-transform 0.6s;
    transition: transform 0.6s;
    -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
    transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,-100%,0);
}

figure.effect-apollo p {
    position: absolute;
    right: 0;
    bottom: 0;
    margin: 1em;
    padding: 0 .5em;
    /*max-width: 150px; */
    border-right: 4px solid #F9F5B3;
    text-align: right;
    opacity: 0;
	font:13px dijFont-Bold;
    -webkit-transition: opacity 0.35s;
    transition: opacity 0.35s;
    
    color: #F9F5B3;
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.32);
}

figure.effect-apollo h2 {
    text-align: right;
    opacity: 0;
}

figure.effect-apollo a {
    opacity: 0;
    float: right;
    margin-left: 4%;
    color: #FFF;
}
figure.effect-apollo:hover img {
    opacity: 0.6;
    -webkit-transform: scale3d(1,1,1);
    transform: scale3d(1,1,1);
}

figure.effect-apollo:hover figcaption::before {
    -webkit-transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
    transform: scale3d(1.9,1.4,1) rotate3d(0,0,1,45deg) translate3d(0,100%,0);
}

figure.effect-apollo:hover p ,figure.effect-apollo:hover h2 ,figure.effect-apollo:hover a {
    opacity: 1;
    -webkit-transition-delay: 0.1s;
    transition-delay: 0.1s;
}

figure.effect-apollo h2 {
    font:15px dijFont-Bold;
    margin: 6% 4% 10px 1%;
    color: #FFF;
    
    
    text-shadow: 0px 0px 5px rgba(0, 0, 0, 0.32);
}






.bookShadow {
    z-index: 0;
    content: ' ';
    width: 100%;
    position: absolute;
    
    bottom: 6px;
    
    height: 0px;
    right: 0;
    left: 0;
    
    box-shadow: 3px 1px 25px 10px rgba(58, 57, 57, 0.60);
    
    -webkit-box-shadow: 3px 1px 37px 10px rgba(58, 57, 57, 0.67);
    -moz-box-shadow: 2px 2px 8px 5px rgba(58, 57, 57, 0.67);
    
    /* border-top: 10px solid transparent; */
    /* border-bottom: 10px solid transparent; */
    /* border-right:10px solid blue; */
}