@charset "utf-8";
/* CSS Document */


.main-book3DM{
    display: flex;
    justify-content: center;
    align-content: center;
    margin: 50px 15px;
    height: 250px;  
}
.main-book3DM section{
    display: flex;
    justify-content: center;
    align-content: center;
    transform-style: preserve-3d;
    perspective: 1000px;
}
.main-book3DM section .book{
    position: relative;
    width: 169px;  /*383  */
    height: 250px; /*  567*/
    box-shadow: 10px 10px 10px rgba(0,0,0,0.2);
    transform-style: preserve-3d;
    transition: 0.5s;
  
    
}
.main-book3DM section .book:hover{
    transform: rotateY(35deg);
    box-shadow: 0px 5px 5px rgba(0,0,0,0.2);
}
.main-book3DM section .book:active{
    transform: rotateY(180deg);
}
.main-book3DM section .book:before{
    content: '';
    position: absolute;
    width: 30px;
    height: 100%;
    transform-origin: left;
    background: url("../images/carteles/side.jpg");
    /*background: url(images/carteles/side.jpg);*/
    background-position: center;
    transform:  rotateY(90deg);
}
.main-book3DM section .book:after{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    transform-origin: center;
    background: url("../images/carteles/back.jpg");
    background-position: center;
    transform:  rotateY(180deg) translateZ(30px);
}
.main-book3DM section .book img{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.main-book3DM .btn-cartel{
    position: absolute;
    top: 320px;
}