body {
  margin: 0;
  padding: 0;
   background-image: url('https://overthesea.neocities.org/images/wallpaperflora.jpg');
   background-repeat: repeat;
   background-size:500px;
}

.bookcasewrapper {
  position: relative;
  width: 100%;
  max-width: 900px;
  margin: 0 auto;
  margin-top:20px;
  margin-bottom:20px;
}

.bookcase {
  width: 100%;
  display: block;
  filter:drop-shadow(10px 10px 2px rgba(0,0,0,0.8))
}

.itemwrapper {
  position: absolute;
  display: inline-block;
}

.item {
  width: 100%; 
  height: auto;
  transition: transform 0.2s ease;
  filter:drop-shadow(1px 1px 1px rgba(0,0,0,0.4));
  z-index: 13;
  position: relative;
  display: inline-block;
}

.itemwrapper:hover .item {
 transform: translate(0, -7px);
  z-index: 555 !important;
  filter: drop-shadow(0 0 5px #f6f0d1)
}

/*hover text by ribo.zone*/
.imgtxt {
  width: fit-content;
  height: fit-content;
  display: inline-block;
  position: relative;
}
.imgtxt span {
  opacity: 0;
  position: absolute;
  top: 110%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2000;
  font-size: 1.1rem;
  color: #FFF;
  filter: drop-shadow(1px 1px 1px rgba(0,0,0,0.8)) 
    drop-shadow(-1px 1px 1px rgba(0,0,0,0.8))
    drop-shadow(1px -1px 1px rgba(0,0,0,0.8))
    drop-shadow(-1px -1px 1px rgba(0,0,0,0.8));
   transition: transform 0.2s ease;
   font-family:Georgia;
}
.imgtxt:hover span, .imgtxt:focus span {
  opacity: 0.7;
   transition: transform 0.2s ease;
   
}
.imgtxt:hover img, .imgtxt:focus img {
  /* add hover effects like transform or filter to your images here! */
}

.back {
  position: fixed;
  top: 20px;
  left: 20px;
  padding: 8px 14px;
  z-index: 3000;
  max-width:5%;
  transition: 0.2s ease;
}

.back:hover {
  filter: drop-shadow(0 0 6px #f6f0d1);
}

.back img{
  width:100%;
}



@media(max-width:750px){
   .bookcase-wrapper {
  position: relative;
  width: 100%;
  max-width: 300px;
  height:auto;
  margin: 0 auto;
}

.itemwrapper:hover .item {
 transform: scale(1.6);
  z-index: 555 !important;
  filter: drop-shadow(0 0 1px #f6f0d1)
}

.back {
  top: 20px;
  left: 0px;
  padding: 8px 14px;
  max-width:10%;
  filter: drop-shadow(0 0 2px black);
}

.imgtxt span {
  top: 150%;}
   
}