.book {
  transition: opacity 0.4s 0.2s;
}
.page {
  width: 36vw;
  height: 100vw;
  background-colour: #fff;
  float: left;
  margin-bottom: 0.5em;
}
.page:first-child {
  float: right;
}
.page:nth-child(even) {
  clear: both;
}
.bound {
  perspective: 250vw;
}
.bound .pages {
  width: 72vw;
  height: 100vw;
  position: relative;
  transform: rotateX(12deg);
  transform-style: preserve-3d;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  border-radius: 4px;
  box-shadow: 0 0 0 1px #e3dfd8;
}
.bound .page {
  float: none;
  clear: none;
  margin: 0;
  position: absolute;
  top: 0;
  width: 36vw;
  height: 50vw;
  transform-origin: 0 0;
  transition: transform 1.4s;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
  transform-style: preserve-3d;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}
.bound .page:before {
  content: '';
  position: absolute;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  background: rgba(0, 0, 0, 0);
  transition: background 0.7s;
  z-index: 2;
}
.bound .page:nth-child(odd) {
  pointer-events: all;
  transform: rotateY(0deg);
  right: 0;
  border-radius: 0 4px 4px 0;
}
.bound .page:nth-child(odd):hover {
  transform: rotateY(-10deg);
}
.bound .page:nth-child(odd):hover:before {
  background: rgba(0, 0, 0, 0.03);
}
.bound .page:nth-child(odd):before {
  background: rgba(0, 0, 0, 0);
}
.bound .page:nth-child(even) {
  pointer-events: none;
  transform: rotateY(180deg);
  transform-origin: 100% 0;
  left: 0;
  border-radius: 4px 0 0 4px;
}
.bound .page:nth-child(even):before {
  background: rgba(0, 0, 0, 0.2);
}
.bound .page.grabbing {
  transition: none;
}
.bound .page.flipped:nth-child(odd) {
  pointer-events: none;
  transform: rotateY(-180deg);
}
.bound .page.flipped:nth-child(odd):before {
  background: rgba(0, 0, 0, 0.2);
}
.bound .page.flipped:nth-child(even) {
  pointer-events: all;
  transform: rotateY(0deg);
}
.bound .page.flipped:nth-child(even):hover {
  transform: rotateY(10deg);
}
.bound .page.flipped:nth-child(even):hover:before {
  background: rgba(0, 0, 0, 0.03);
}
.bound .page.flipped:nth-child(even):before {
  background: rgba(0, 0, 0, 0);
}
*,
* :before,
*:after {
  box-sizing: border-box;
}
html,
body {
  background: #e3dfd8;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
html {
  height: 100%;
}
body {
  min-height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  padding: 2em 0;
  line-height: 1.5em;
}
.page {
  color: transparent;
  background: left top no-repeat;
  background-size: cover;
}
.page:nth-child(3),
.page:nth-child(5),
.page:nth-child(7),
.page:nth-child(9),
.page:nth-child(11),
.page:nth-child(13){
  background-position: right top;
}
.page:nth-child(1) {
  
  background-image: url('https://uc3849c1b12991db3480cccd1970.previews.dropboxusercontent.com/p/thumb/ABoi4jzsWKOsqnyzWKiJsjlcsiU7ajjM4YCwqwVx2BhXtDIJZrGyPt55fjUGIzkStUtlKe4nQt-49m-m4Y1nSO2CoQuUMocyG2RuUqGAektzLdbAg0QaFIUSY42nmdMD0wuOHp3p1I21XiAiZqJdWV5f9jNoVWDSwyfDFjvvhPIZFAd916UUWnYDGpbPWWoxvSZoiUXt6wAI7ey2AD3JsSTwxTHnD6LVYYMh5nkR_mPLI35Ecs6iWHPEhHYTL64o4NyO0EnMw7bMh-fw_M7xGEK-yhCqltnnEIdWaaItPtN6WX0Rwgs-mUee-tV-epRUfGszLaYKJLhKh2aWSJw2mt2ZnoVsQWxJ84LtEpYqU-PrjS6SIDq4KsNHGoUsEh_Utpw/p.jpeg');
}
.page:nth-child(2){
  background-image: url('https://ucfcbfbe241db1a1fcde1a696ff4.previews.dropboxusercontent.com/p/thumb/ABrsfTn5oRrDGj5DW-NJJAkP3sB3hGraJrPm1ThK8Xs0zpSD_XeJo30N3t0HDun4RsQbhflv5SYEG5lDBHXD0I2Iz5N6V2rj3JAs8EkoQAbJd-8zWKRSQNOkBIh4oHQ5EHUS5FIpXpM78EP0KrUhjNHPUXSWrgIDTROn2CXVj4sfcuC-_ffMI4cgJLWU0J9MbD0QhCp7ZUFsMtfmvp7kfAikozgIgJ8MKHKEKc_fV9YouR7-SrXLytwt4lXEhL08MVHT7lhEZIu7hfsQF4EuKqVbQvJzQBRssxlagtlJi6ge45dDEeN2LTsqQwrJSD-piVIvLXyQY9ZiIHCdV1ideQNeukldrkgWhKcJCH8QHbTD-2qwrB9keTAimlubmRfqZgQ/p.jpeg');
}
.page:nth-child(3) {
  background-image: url('https://uc443b6bd793e85df268e877df56.previews.dropboxusercontent.com/p/thumb/ABrU0Rr26YQc-eexIsGRWk6N4evbSyYwgjmCYeCugbFES1WwaQkYM7MaNS6AlAM9C6AAi2_f47vaq2DmTeqGo_Tg3fc_f-_H0SvH3e1EDm-2qViB-nzskNFoS2wmJMBnsV3N30G444DMSWk-O-t2OA25lA4nrTEjZw8BM3NsNNkMe0kdC-5rH7UZ58qLLHuFI3Z-4uyep0vIxDgR3U1zq3n8QjfCkeLIh4eP1p9IPeEpGxgPJBDl6oNP_4xCFUdP-g8JiONpALa1SrTrgxlWb3k9Z2w1Fpi8c2UurMxJLvZ-GNB8ShV8EjTu1U5bP6jZUzXFD4HXAb43Z_cNCtO1aG2X9krx7pZU_-BwvAhpiFQuRYDbzBlK-unpijyqlk31gps/p.jpeg');
}
.page:nth-child(4){
  background-image: url('https://ucf71c0c4bc0072720281e1cd1ed.previews.dropboxusercontent.com/p/thumb/ABoY_cELa60ijanUp5O9SnRplf6ruNR4_ONcq_7j8F1tx4Lc9_cSKt_0cjc6LXzV4vsdMszjDmK3wYtS0NcfMnEFPGMI-WjWa1aE6TNIRcayvz5NpYeYfShHQjxNliEpeqcGzajPRXvuPiOmSlkNtKG5OWX5XvEZxg8b3sYmjBdiwOEuzFeSxxT_LhaSBvlETbmQGKYLSKV-hz-xYgFdbAyTOPEBRg_O9eHS9KNBI2it0goj5_gpEYfYR62JZTAYKBcxd51luI0_5Uf6u4tSAtfq0Gxq3o7jlV0to4OtqX_c0NViQ1zQz7lLt8Pq0MLvEEbLC0C3m8-cpEgqIeHk4ZCkSww8buW-E4hmd5MeSIlWV3QGycEJJbOUg5WM34yG3vc/p.jpeg');
}
.page:nth-child(5) {
  background-image: url('https://uc578ee191bb74983babd25c621c.previews.dropboxusercontent.com/p/thumb/ABq-nwKitALlUkneRhPKr7zq0kEOKWFMTVgBnlsF0VtCele2AgJnlwWmDvAr1bMxdeC9dmWw__FuV8MYaHZ-4el020mYk95c4tJxHI0K0ukdgz1D9G_ZhfWj2q5_zEzh1NTTh1FJzdLvW1eLvx_SbDyk8GlHCHqMlxypQSO0T8vSjWJWHhnotF40BgrET6qX3vOVVnpGJAZO-LVOzKk60KIEToXkJOdjIPh0zUoxcJyxX4Ai-hLdZV0KLTUm1oT_zQiz8vfF-DxiWozOt7xbgH-cQlr1vUlUlO7Ty8psg0Qn54ebq89VWSAXl7iNxwRkuMak1LoO69MeqrL8fzmCeVqYitffIs89e9PMorUvBq0mkj9aLZyjO6TkPk9J-zIuxao/p.jpeg');
}
.page:nth-child(6){
  background-image: url('https://uc727e4ab395cd5a35eabbc3e588.previews.dropboxusercontent.com/p/thumb/ABr280uzTZwHHS3qfBSlTOr2mnPupgGAkQzZdOdK60npVBeHY8tCixmK1nwuXSakyJxegUklvbe80YECfXZTHdFN3AdP-e7VMIZtcVf0I1nqK3XMcwj6J_2lmD3ICdqa3H_gF1yBgpP4C0vI38hQerq7EHe39VQBqxvZ5RjMitqMFzjby8hEsnjHbHdBG4mY42ltTXfmZHIYfU56FtZfCVszyQkkI7dVfmioin4dzNZnYsJXVbmNKzTAmYgVl4S-M8h3Ki27Z6xoRLHpz4UYTxNWXbMzKDlTfD5cza2SlLURJlhFNcY3kChmHeXGuqYJBHOA4cTtzRuibqWCF4EKitMoW4gGLZobQTssOPaNQC0mr2ONa1esYo7pk1G8y0Mrapw/p.jpeg');
}
.page:nth-child(7) {
  background-image: url('https://ucd4180640de32553865c2a1ed96.previews.dropboxusercontent.com/p/thumb/ABo7FdeRcyMsyxRdwiSjZ9DvzY9CHjNTwY1TbzbyhxiBegsLKeeniGDQvFFRthvM8fpwru8jNPI7HlnZKqOoCnq9TCP8QeXXw5MltJq2g82unVNCeVasN71pVT_9Ou2_zbyy2EmVpcXRNQVwyOnaiTUIsArrDLJdQQi13hxK4ZnrZ8IDfGwf9iA4_Iyd4fFJgF_65_7C9iqTPnvUkST56l25oc0_bXnhLqF14E9timEgdBNfnbwtKq_VQ5j4-em4GGtvRRsTLwPX6tZLeklHj4SdgG_-pdDiwzdt8G1vgISvqP3-b1HfTicka5jy1iLuDmRVCb0ogPISb59dwdDjwVWRSwzVVrRpBQeEnV6IT7VA8yvzyJll7B0Z4z6zSPjKYEA/p.jpeg');
}
.page:nth-child(8){
  background-image: url('https://uc998d7f61416b6c3849c7b7f548.previews.dropboxusercontent.com/p/thumb/ABqGSuzemIZpoHmrDH9pX-RSY46aoxjkqTnHCt-B_Y7FHyaXwzMhUhjIm9zUQMJ2i9x3towzhwSrhWcCJVe0ZDleQqyyM_e_O3g9VZJzKBoLeaVtfhoJqynsT-WhhNjeGAFKlv-wEojK_wrC6R9mmRBrjLuvGpst6p2jJflRd-z_MZ3fOFs2PAskiequAizbL0_sa2ye2gs3EEhYgzephUmWYbw7i1NcK_3E3n7HoQblm6-6iYtLT07uAGllUPCrNDyodqNEo3LcTR0SN7Qq5hwwit8DDSkL-mInzNE6ewZCQ35Z8iBv8pCaj-cdS8JM6Ft1gW3D0kEvl4hBFKZM02UkK-DcIvrXmxgRRixiGuoVFSV1-j7hGnuVf90t-fGjz0U/p.jpeg');
}
.page:nth-child(9) {
  background-image: url('https://uc4a6612e17855835feff82b8211.previews.dropboxusercontent.com/p/thumb/ABo7BXee5xmR7NDgvmepR0x0mVIiALMJCfOAt-wi2TQTuHQOB5smgrpcKjhzMIYY7vmIj2Ytercrd_a_c-gaHiT_1bjkO5lZeYz8qhDMWp-lbY0uOXLnYRlmR6yqpzo23MRUlbG94LBDRBlzsVggzmp5NGahEh7zz8cug2T2u3PSIrblCSKBP_Af7GzqzM1N9b0co-eActrY72SqnUMJC9CHb7XxrWYsSFFMYodIW6OxnrvdjToICi9hfoiB-BbZK7R1-u2E8N32j7dm2RrLv-JaSc8jUDw9zddKOg7qcSfqpS_AtY9AXAKEBxgGFlmCHLep4mlPaveMjfVeSndIuMnT0kpIT3ERFP_efyqfHLRDL1zdSaNT077Y8YZ6DwNl7nQ/p.jpeg');
}
.page:nth-child(10){
  background-image: url('https://uce38eb4b04c8a86c735eed78d51.previews.dropboxusercontent.com/p/thumb/ABrmySXZXyZ4kWO9W5XWfCWn25SVQy5jHwElcuCW0Ne60ERJ-QxXXVx28HrZT9DOGMFzixr9t9toFS4qCW__7xoboRrJvloNwXkLUm35ochJkuL_em14WHPMyMrvn4r3U5NtjRG-rFFRMrqPZYxdzvw-ulciHbPIqBQQQe8oJp85s-r3Q8KkdYcGUNJquFOenjsvOGJWH5Xz7l51AODCOLGTHrPnQBnbj3cq55DKTUrzJRcnyAEdSUjZFvlyVOxIaQeOVWrLFnhp7C_864eurRiCmB-hBqA9SlJV7Uk_H3dL-K-MeQRtdDW45JRC_d4M1OFO_CTIpt3pzCzepZRgtX0uLAiZAEekx5qKPUFSlk8P1-OIcvne-TIM8oreN7y7nvI/p.jpeg');
}
.page:nth-child(11) {
  background-image: url('https://uc17bda507db256721e9e658a1ae.previews.dropboxusercontent.com/p/thumb/ABrE7QRidea8H8vz_h2otKEwCbUYSazA18ZyPWo7GYJLO2UcvxxNJfCeuI9W5qz6tM6fb35qL_35_xmTBXSboAPEkN3Kp3Wy36V_CiW-3ysdupHAau89-v-ckr5-538Pvs8bdpM6aSygQjiPeqQ6BxDrG3wPDRIKge_EVv8CA3OPL9_-tdCwhDEyludSVfTcgYHgyx8Eokz3xm1D5hKH2_8yy7FgF-P9eypvFCdGQe-lcuM8EP4sqR2ZcarsNfhRl6j2jypY4axG8Du7h-k2oGf64IK1hQ8LYU_z2psnnQQvIeNbuNRQwUuYKKaza9rG97mudAkizkjJ8KORh5dbV07Xn4vqqdOQy5ahRZUp87qo-lESsQZ85gksXttgaU8P6iU/p.jpeg');
}
.page:nth-child(12){
  background-image: url('https://uc82749581263c52b743fac3b217.previews.dropboxusercontent.com/p/thumb/ABpQggLiFlQVXSovnTW1fRpniAWY8JYIX7cT8UoD1tCi6j8uixgm9RmTdaQ119PW4REbbDgX0GxehWGgxo2RWaMOVaHCT6dpfrV1uuGmGvRuzMHWnrdRjcAiBmnhOQLOamgO8Gzgqs83o5UQXx3TO18YgVUHGDqOqldiRkm9MO8Fs3kksFcJAd9pbcwFX4DkB_TjKfkj5iKrO_LHMzwRgYgQJFE6qAgT7Xad6qDGPHe7P-t6ihY6B8SIKwf4mDinNzGMbsdTeav7DD5DzP-eUioCFYx1ydL_pVL-npM63vD7mHtMtIK_gVCtfTb6Q_11S34XzVDG0Qy13Byx1FmS1yQ0vAzM9QUr81UZN6blcyeMP82b6rY_ESvcQ1wsUS6Bvp8/p.jpeg');
}