* {box-sizing: border-box;
scrollbar-width: thin;
scrollbar-color:#131313 #3c1516;

}

a, button {cursor:url(http://www.rw-designer.com/cursor-extern.php?id=136556), pointer}

body {
  color: #131313;
  font-family: Georgia;
  font-size: 14px;
  background-image:url(https://xixxii.neocities.org/images/bgs/19.png), url(https://xixxii.neocities.org/images/carpet.png); 
  background-repeat:repeat-x;
  background-position:top, bottom;
  background-attachment: fixed;
  margin:0px;
cursor: url(http://www.rw-designer.com/cursor-extern.php?id=136554), auto;
}

#overlay {
  position: fixed; /* Sit on top of the page content */
  width: 100%; /* Full width (cover the whole page) */
  height: 100%; /* Full height (cover the whole page) */
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.9); /* Black background with opacity */
  z-index: 200000; /* Specify a stack order in case you're using a different order for other elements */
  cursor: pointer; /* Add a pointer on hover */
}

#text{
  position: absolute;
  text-align:center;
  top: 50%;
  left: 50%;
  font-size: 20px;
  color: white;
  transform: translate(-50%,-50%);
  -ms-transform: translate(-50%,-50%);
}

.top {
height:425px;
position:relative;
}

.top img {max-width:200px;
max-height:200px;
transition:0.5s
}

.top div {width:fit-content;
position:absolute;}

#dn {top:30%;
left:5%;}

#adachi {top:20%;
left:20%;}

#anthy {top:65%;
left:25%}
#sims {top:70%;
left:55%;}
#bl {left:75%;
top:40%}
#itchgames {top:10%;
left:46%;}


.bottom {display: flex;
height:425px;
justify-content: space-between;
}


.book {position:relative;
top:30px;
left:55px;
}

.book:hover {
  cursor:pointer;
}

.stack {align-self: flex-end;
}

#bookpopover {
background-color:rgba(201, 192, 180, 0.6);
backdrop-filter: blur(20px);
border:#131313 double 3px;
padding:20px;
height:200px;
width:500px;
box-shadow:0px 0px 30px rgba(0,0,0,0.5);
position:absolute;
bottom:-500px;
font-size:16pt;
}

a:link {
  text-decoration:none;
    color:darkred;
    font-weight: bold;
  
}

a:visited {
  text-decoration: none;
  font-weight: bold;
  color:darkred;

}

a:hover {
  text-decoration: line-through;
  font-weight: bold;
  color:red;

}

a:active {
 text-decoration: none;
  font-weight: bold;
  color:red;
}

#sims, #anthy {filter:grayscale(100%)}

.imgtxt {
  width: fit-content;
  height: fit-content;
  display: inline-block;
  position: relative;
}
.imgtxt span {
  opacity: 0;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 99;
  font-size: 1.5rem;
  color: #FFF;
text-align:center;
  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;
}
.imgtxt:hover img, .imgtxt:focus img {
 max-width:250px;
max-height:250px;
z-index:98;
position:relative;
}
	