body {
        background-image: url(https://kamifubukiseries.neocities.org/images/stars%202.gif);
        display: grid;
        place-items: center; /* Centers both horizontally and vertically */
      
    }

#content {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50%;
  max-width:1100px;
  min-width: 1100px;
  padding: 2px;
   box-sizing: border-box;
}

#mass-holder {
  margin-top:10px;
 box-sizing: border-box;
 width: 100%;
 overflow: hidden;
 display: flex;
 flex-direction: column;
 gap: 10px;
 text-align: center;
}

iframe {
  box-sizing: border-box;
 height: 100vh; 
 max-width: 100%;
 border: 5px inset;
 border-color: #cedeed;
}

.now-reading-header {
  box-sizing: border-box;
  display: flex;
 justify-content: center;
 width: 100%;
 text-align: center;
 padding: 20px;
 background-color: rgb(31, 34, 102);
border: 10px double;
border-radius: 10px;
 border-color: rgb(121, 127, 242);
 color: rgb(189, 197, 242);
 font-family: georgia;
}

.what span {
 font-size: 30px; 
 font-family: georgia;
}

button {
    box-sizing: border-box;
 width: 100%;
 text-align: center;
 padding: 20px;
 background-color: rgb(31, 34, 102);
border: 10px double;
border-radius: 10px;
 border-color: rgb(121, 127, 242);
 font-size: 25px; 
 color: rgb(189, 197, 242);
 font-family: georgia;
}

button:hover {
 cursor: pointer; 
 background-color: #100B29; 
}

#responsive-container {
 width:100%;
 height: 800px;
 gap: 5px;
 display: flex;
 flex-direction: row;
 box-sizing: border-box;
}

#page-holder {
 box-sizing: border-box;
 width: 65%;
 height: 100%;
 background-image: url(https://sadhost.neocities.org/images/tiles/926glitter.gif);
 padding:20px;
 overflow: auto;
 display:flex;
 flex-direction: column;
 gap:15px;
 border-radius:10px;
 border: 10px double;
 border-color: rgb(115, 121, 245) ;
}

.title-header {
 box-sizing: border-box;
 width: 100%;
 padding: 10px;
  display: flex;
 justify-content: center;
 text-align: center;
 background-color: rgb(31, 34, 102);
border: 10px double;
border-radius: 10px;
 border-color: rgb(121, 127, 242);
 color: rgb(189, 197, 242);
 font-family: georgia;
}

.title-header span {
 font-size: 24px; 
}

.page-img {
 width: 100%; 
}

#chapter-holder {
  overflow: auto;
  box-sizing: border-box;
 width: 35%;
 height: 100%;
  background-image: url(https://kamifubukiseries.neocities.org/images/purple%20star%20bg.gif); 
 padding: 20px;
 display: flex;
 flex-direction: column;
 border-radius:10px;
 border: 10px double;
 border-color: rgb(115, 121, 245) ;
 gap: 15px;
}



/* style for smaller devices */
    
    @media screen and (max-width: 768px) {
      
      
      #content {
       width: 100%; 
       min-width: 0px;
       padding: 0;
      }
      
      #mass-holder {
       width: 100%; 
       max-height: none;
       padding: 5px;
      }
      
      #responsive-container {
       flex-direction: column; 
       height: auto;
      }
      
      #page-holder {
       width: 100%; 
       padding: 2px;
       height: 1000px;

      }
      
      .title-header span {
       font-size: 18px; 
      }
      
      .what span {
       font-size: 22px; 
      }
      
      #chapter-holder {
       width: 100%; 
       height:300px;
      }
      
      button {
       font-size: 18px; 
      }
    }