@import url('https://fonts.googleapis.com/css?family=Sofia&display=swap');
@import url('https://fonts.googleapis.com/css?family=Unbounded&display=swap');

body {
  background: linear-gradient(135deg, #86ed78 0%, #c33939 100%);
  background-size: 400% 400%;
  animation: gradient 15s ease infinite;
  }
#book-container {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
  }
  
  .book {
    flex: 0 0 20%;
    text-align: center;
    margin: 1em;
    margin-bottom: 10px;
  }
  
  .book img {
    width: 100%;
    height: 500px;
    object-fit: cover;
    border: 4px solid rgba(15, 15, 15, 0.423);
    border-radius: 4px;
  }
  
  .book img:hover {
    box-shadow: 0 0 8px 0 rgb(0, 0, 0);
  }
  h1 {
    color: rgb(0, 0, 0);
    text-align: center;
     font-family: "Sofia";
     font-size: 45px;
     margin-bottom: 0.01em;
}
::-webkit-scrollbar {
  display: none;  
}

h2 {
  text-align: center;
  font-family: "Unbounded";
  font-size: 30;
}
h3 {
  text-align: center;
  font-family: "Unbounded";
  font-size: 20;
}  
@keyframes gradient {
  0% {
      background-position: 0% 50%;
  }
  50% {
      background-position: 100% 50%;
  }
  100% {
      background-position: 0% 50%;
  }
}
.clasified {
  position: absolute;
  top: 0;
  left: 0;
  width: calc(100% - 10px);
  height: calc(100% - 10px);
  width: auto;
  height: auto;
}