@import url("https://fonts.googleapis.com/css2?family=Rubik:ital,wght@0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap");*{margin:0;padding:0;-webkit-box-sizing:border-box;box-sizing:border-box;font-family:"Rubik", sans-serif}body{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;-webkit-box-align:center;-webkit-align-items:center;-ms-flex-align:center;align-items:center;min-height:100vh;background-color:rgba(126,237,255,0.2);-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-perspective:1000px;perspective:1000px}.book-3d{width:300px;height:500px;-webkit-box-shadow:20px 20px 20px rgba(0,0,0,0.2);box-shadow:20px 20px 20px rgba(0,0,0,0.2);-webkit-transform-style:preserve-3d;transform-style:preserve-3d;-webkit-transition:0.5s;-o-transition:0.5s;transition:0.5s;position:relative}.book-3d:hover{-webkit-transform:rotateY(35deg);transform:rotateY(35deg);-webkit-box-shadow:0px 15px 20px rgba(0,0,0,0.2);box-shadow:0px 15px 20px rgba(0,0,0,0.2)}.book-3d:active{-webkit-transform:rotateY(180deg);transform:rotateY(180deg);-webkit-box-shadow:-20px 30px 20px rgba(0,0,0,0.2);box-shadow:-20px 30px 20px rgba(0,0,0,0.2)}.book-3d__cover{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;background-image:-webkit-linear-gradient(135deg, #b97daa 50%, #8a7dcf 100%);background-image:-o-linear-gradient(135deg, #b97daa 50%, #8a7dcf 100%);background-image:linear-gradient(315deg, #b97daa 50%, #8a7dcf 100%);border:2px solid white;position:absolute}.book-3d__cover-title{text-align:center;color:#fff;font-size:1.7rem;padding:0 2rem;margin-top:4rem}.book-3d__binding{height:100%;width:60px;-webkit-transform-origin:left;-ms-transform-origin:left;transform-origin:left;background-image:-webkit-linear-gradient(135deg, #b97daa 50%, #8a7dcf 100%);background-image:-o-linear-gradient(135deg, #b97daa 50%, #8a7dcf 100%);background-image:linear-gradient(315deg, #b97daa 50%, #8a7dcf 100%);border:2px solid white;-webkit-transform:rotateY(90deg);transform:rotateY(90deg);position:absolute}.book-3d__back{display:-webkit-box;display:-webkit-flex;display:-ms-flexbox;display:flex;-webkit-box-pack:center;-webkit-justify-content:center;-ms-flex-pack:center;justify-content:center;width:100%;height:100%;background-image:-webkit-linear-gradient(135deg, #b97daa 50%, #8a7dcf 100%);background-image:-o-linear-gradient(135deg, #b97daa 50%, #8a7dcf 100%);background-image:linear-gradient(315deg, #b97daa 50%, #8a7dcf 100%);border:2px solid white;-webkit-transform-origin:center;-ms-transform-origin:center;transform-origin:center;-webkit-transform:rotateY(180deg) translateZ(60px);transform:rotateY(180deg) translateZ(60px);position:absolute}.book-3d__back-text{font-size:0.9rem;text-align:left;color:#fff;padding:0 2rem;margin-top:4rem}