html {
  background-image: url("cuttingmatt.jpg");
  background-repeat: no-repeat;
background-size: cover;
background-position: center center;
}


.book {
  border: 7px solid black;
  background-color: white;
  border-radius: 15px;
  padding: 0 4px;
  width: 800px; /* adjust size */
  max-width: 100%;
  aspect-ratio: 3 / 2;
  display: flex;
    text-align: right;
    margin-top: 0;
    margin-left: 225px;
    z-index: 0;
}
.pageL,	.pageR {
  height: 100%;
  width: 50%;
  display: inline-block;
  position: relative;
  border-radius: 10px;
}
.pageL {
  border-left: 1px grey solid;
}
.pageR { 
  border-right: 1px grey solid;
}
.seam {
  width: 7px;
  background:
    linear-gradient(to right,
    white, grey, white);
}




.imgtxt1 {
  background-image:url('glue.png');
  width: 500px;
  height: 600px;
  display: inline-block;
  position: absolute;
  top:0px;
  margin-right:1500px;
  margin-left:-200px;
  transform: rotate(-20deg);
  z-index:2;
}
.imgtxt1 span {
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99;
  font-size: 2.5rem;
  color: #FFF;
  filter: drop-shadow(1px 1px 0 black) 
    drop-shadow(-1px 1px 0 black)
    drop-shadow(1px -1px 0 black)
    drop-shadow(-1px -1px 0 black);
}
.imgtxt1:hover span, .imgtxt:focus span {
  opacity: 1;
}


.imgtxt2 {
  background-image:url('scissors.png');
  width: 260px;
  height: 480px;
  display: inline-block;
  position: absolute;
  top:-20px;
  margin-right:100px;
  margin-left:1000px;
  z-index:2;
}
.imgtxt2 span {
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99;
  font-size: 2.5rem;
  color: #FFF;
  filter: drop-shadow(1px 1px 0 black) 
    drop-shadow(-1px 1px 0 black)
    drop-shadow(1px -1px 0 black)
    drop-shadow(-1px -1px 0 black);
}
.imgtxt2:hover span, .imgtxt:focus span {
  opacity: 1;
}

.imgtxt {
  width: fit-content;
  height: fit-content;
  position: relative;
  display: block;
  margin-left: auto;
  margin-right: auto;
  top: 20px;

}
.imgtxt span {
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99;
  font-size: 2.5rem;
  color: #FFF;
  filter: drop-shadow(1px 1px 0 black) 
    drop-shadow(-1px 1px 0 black)
    drop-shadow(1px -1px 0 black)
    drop-shadow(-1px -1px 0 black);
}
.imgtxt:hover span, .imgtxt:focus span {
  opacity: 1;
}