:root{--largeur:300px;--ratio:calc(550 / 400);--hauteur:calc(var(--largeur) * var(--ratio))}.book-container{z-index:1;perspective:3000px}.book-container .book{position:relative;display:block;width:var(--largeur);height:var(--hauteur);margin:5% auto;border-radius:2px 4px 4px 2px;background:linear-gradient(45deg,#DAD5DC 0%,#f2ebf4 100%);font-family:acumin-pro,sans-serif;-webkit-box-shadow:13px 13px 8px 0 rgb(151 146 153 / .6);-moz-box-shadow:13px 13px 8px 0 rgb(151 146 153 / .6);box-shadow:13px 13px 8px 0 rgb(151 146 153 / .6);font-weight:400;color:#2b2b2b;-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transition:-webkit-transform .5s;-moz-transition:-moz-transform .5s;transition:transform .5s}.book-container .book:hover{-webkit-transform:rotate3d(0,1,0,35deg);-moz-transform:rotate3d(0,1,0,35deg);transform:rotate3d(0,1,0,35deg)}.book-container .book>div,.book-container .front>div{display:block;position:absolute}.book-container .front .cover{background-size:cover!important}.book-container .front{-webkit-transform-style:preserve-3d;-moz-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transform-origin:0% 50%;-moz-transform-origin:0% 50%;transform-origin:0% 50%;-webkit-transition:-webkit-transform .5s;-moz-transition:-moz-transform .5s;transition:transform .5s;-webkit-transform:translate3d(0,0,20px);-moz-transform:translate3d(0,0,20px);transform:translate3d(0,0,20px);z-index:10}.book-container .front>div{width:var(--largeur);height:var(--hauteur)}.book-container .left-side{width:40px;left:-20px;height:var(--hauteur);background-color:#e8e5ea;-webkit-transform:rotate3d(0,1,0,-90deg);-moz-transform:rotate3d(0,1,0,-90deg);transform:rotate3d(0,1,0,-90deg)}.cover svg{position:absolute;top:50%;left:45%;margin-top:-100px;margin-left:-110px;width:300px}#eye-right{padding-left:185px}.cover .num-up{position:absolute;top:64px;left:47px;letter-spacing:50px;transform:rotate(-90deg)}.cover .num-down{position:relative;top:65px;left:-95px;transform:rotate(-90deg)}.author{font-family:acumin-pro,sans-serif;font-weight:400;position:absolute;top:475px;left:50px;opacity:.8}.book-container .front>div{border-radius:0 3px 3px 0;box-shadow:inset 4px 0 10px rgb(0 0 0 / .1)}.book-container .front:after{content:'';position:absolute;top:1px;bottom:1px;left:-1px;width:1px}.book-container .cover:after{content:'';position:absolute;top:0;left:10px;bottom:0;width:3px;background:rgb(0 0 0 / .1);box-shadow:1px 0 3px rgb(255 255 255 / .1)}.book-container h2{width:500px;height:40px;color:#2b2b2b;line-height:40px;padding-right:10px;font-size:11px;text-align:left;-webkit-transform-origin:0 0;-moz-transform-origin:0 0;transform-origin:0 0;-webkit-transform:rotate(90deg) translateY(-40px);-moz-transform:rotate(90deg) translateY(-40px);transform:rotate(90deg) translateY(-40px)}.cover{background:linear-gradient(45deg,#DAD5DC 0%,#f2ebf4 100%)}.left-side h2 span:first-child{font-weight:400;font-size:13px;padding-right:20px}.left-side h2 span:last-child{font-family:acumin-pro,sans-serif}