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

#divDocSearch {

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

  background-color: var(--baseBG);

  div {

    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;
      }

    }

  }

}

#ulDocs, .docs-recent-list {

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

  li {

    margin:     0.66rem 0.3rem;

    font-size:  0.9rem;

    p:first-of-type { margin: 0; font-size: 0.9rem; }
    p:last-of-type  { margin: 0 ; font-size: 0.7rem; }

  }

  p { text-align: left !important; }

}