article.home-books  {
  display:        flex;
  flex-direction: column;
}

#divBookSearch {
  display:          flex;
  flex-direction:   column;
  margin:           0 auto;
    padding:        2rem 5vw 1rem 5vw;
  width:            84vw;

  background-color: var(--baseBG);
}

  #divInputBookSearch {

    border-style:   solid;
    border-width:   0.05rem;
    border-radius:  0.25rem;
    display:        flex;
    flex-direction:   row;
    flex-wrap:			  wrap;
    justify-content:  end;
    margin:         1rem auto 0.25rem auto;
    padding:        0.125rem 1%;
    width:          100%;

    input {

      border:           0;
      margin:           0 auto 0 0;
      padding:          0.3rem 0.1rem;
      width:            75%;

      font-size:        0.9rem;

      background-color: transparent;
      color:            var(--basePrimary);

    }

    input:focus { outline: none; }

    input::placeholder { font-size: 0.9rem; font-style: italic; }

    /* Clears the 'X' from MS stuff: */
    input[type=search]::-ms-clear,
    input[type=search]::-ms-reveal { display: none; height: 0; width : 0; }

    /* Clears the 'X' from Chrome */
    input[type="search"]::-webkit-search-decoration,
    input[type="search"]::-webkit-search-cancel-button,
    input[type="search"]::-webkit-search-results-button,
    input[type="search"]::-webkit-search-results-decoration { display: none; }

    span.material-symbols-outlined {
      display:      inline-block;
      margin-left:  0.85rem;
      cursor:       pointer;
      font-size:    1.6rem;

      &:hover {
        color: var(--baseSecondary);
        text-decoration: none;
      }

    }

  }

#divBookList {

  border:     none;
  margin:     0 auto 1rem auto;
  max-height: 66vh;
  min-height: 2rem;
  overflow-y: auto;
  padding:    0;
  width:      90%;

  a             { color: var(--basePrimary); text-decoration: none; }
  a:visited     { color: var(--basePrimary);  }
  a:hover       { color: var(--linkActive); }
  a:focus       { color: var(--linkActive); }
  a:active      { color: var(--basePrimary);   }

  div.book-list-item { margin: 1.2rem 0; }

  div.book-list-item a {

    display:  flex;
      flex-direction: row;
    width:    fit-content;

    img.thumbnail { height: 6rem; width: auto; }

    ul { margin-left: 1rem; }

    li {
      list-style: none;
      margin-bottom: 0.25rem;

      text-align: left !important;

      &.title { font-weight: bold; font-size: 0.8rem;}
      &.authors { font-size: 0.7rem;}
      &.description_original { font-size: 0.7rem;}
      &.description_local { font-size: 0.6rem; font-style: italic; }

      img { margin-right: 0.25rem; height: 0.8rem; width: auto; }
    }

  }

}


@media only screen and (max-width: 767px) {

}

@media only screen and (max-width: 479px) {

  article.home_books  {
    #divInputSearch input { width: 70%; }
  }

}