*,
*:before,
*:after {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
}

html {
  box-sizing: border-box;
  font-family: "Roboto", sans-serif;
  font-size: 62.5%;
}
@media only screen and (max-width: 800px) {
  html {
    font-size: 57%;
  }
}

@media only screen and (max-width: 1280px) {
  .container { display: none; }
  #mobile { display: block; }
}

@import url('https://fonts.googleapis.com/css2?family=Song+Myung&display=swap');
*, *:before, *:after {
  box-sizing: border-box;
}
img {
  max-width: 640px;
  max-height: 720px;
}
video {
  max-width: 100vw;
  max-height: 720px;
}


body {

    font-family: 'Song Myung', serif;
    background-image: url(./npaper.jpg);
    position: absolute;
    top:0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}
.imgresize {
  height: 720;
}
.imgresize2 {
  width: 1280;
}
.container {
  overflow: hidden;
}
.book-wrapper {
  position: relative;
  margin: 10% auto;
  width: 1280px;
}

.book-wrapper img {
      filter: drop-shadow(15px 5px 5px #49433820);
}

.pages-container {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}
.header-page {
  position: absolute;
  top: 200px;
  text-align: center;
  align-items: center;
  justify-content: center;
}
.pages [class^="page-num-"] {
	background-color: white;
  position: relative;
}

.background {
  align-items: center;
  justify-content: center;
}

.footer{  
  position: fixed;
  bottom: 0;
  z-index: 9;
  left: 500px;
  opacity: 0.5;
}

.logosized {
  width: 250px;
  align-items: center;
  justify-content: center;
}
.pages-content {
    text-align: center;
      position: absolute;
    width: 100%;
    height: 100%;
    display: table;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
}

.content-inner {
      text-align: center;
    display: table-cell;
    vertical-align: middle;
}

.book-wrapper {
   user-select: none;
}

.page-num-1 .pages-background {
    background: linear-gradient( rgba(255, 255, 255, 0.1), rgba(255, 255, 255, 0.1));
    background-size: auto;
    opacity: 0.2;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.images {

  opacity: 0.6;

}

.prices {

  color: #413e40;

}

.text {

  color: #000000;

}

.name {

  color: #b76e79;

}

@keyframes example {
  0%   {color:rgba(228, 228, 228, 0); left:0px; top:0px;}
  25%  {color:rgba(192, 192, 192, 0.207); left:100px; top:0px;}
  50%  {color:rgba(87, 87, 87, 0.459); left:100px; top:50px;}
  75%  {color:rgba(82, 82, 82, 0.658); left:0px; top:50px;}
  100% {color:rgb(0, 0, 0); left:0px; top:0px;}
}