@media (max-width: 1110px) {
  #cartoon-grid {
    width: auto;
    display: grid;
    gap: 20px;
    grid-template-columns: auto auto;
    grid-template-rows: auto auto;
  }
}

@media (max-width: 950px) {
  .nav-item {
    display: none;
  }
  .nav-btn {
    display: flex;
  }
  .name {
    flex-basis: 80%;
    min-width: 175px;
  }
  #download-icon {
    display: block;
  }
  #download-text {
    display: none;
  }
  .download-btn {
    width: 50px;
  }
  #notes-blank.regular,
  .font-size-18px {
    font-size: 15px;
  }
  .section {
    font-size: 1.2rem;
  }
  .subsection {
    font-size: 1rem;
  }
  .banner-title {
    font-size: 1.2rem;
  }
  .qed {
    font-size: 20px;
  }
  .date {
    font-size: 1.1rem;
  }
  .password {
    font-size: 1rem;
  }
  .filter {
    font-size: 1.1rem;
  }
  .filter-input {
    font-family: Helvetica, Arial, sans-serif;
    font-size: 0.8rem;
    padding: 10px 10px;
    width: 160px;
  }
  .go-btn.red {
    width: 175px;
  }
  #cv {
    font-size: 1.3rem;
  }
}

@media (min-width: 950px) {
  .research-box {
    min-width: 50%;
  }
}

@media (max-width: 900px) {
  .about-me {
    grid-template-columns: 1fr;
    justify-items: center;
  }
  #about-bottom {
    /* display: flex; */
    grid-column: 1 / 2;
  }
  #about-bottom hr {
    margin: 20px 0px 10px 0px;
  }
  #notes-blank {
    font-size: 30px;
  }
}
@media (max-width: 600px) {
  .about-me {
    width: 90%;
  }
}
@media (max-width: 560px) {
  .filter-inputs,
  .description,
  .dates,
  .places {
    display: block;
  }
  .filter-name,
  .filter-city {
    margin-bottom: 5px;
  }
  #input-end-date {
    margin-bottom: 15px;
  }
  .filter-elements {
    max-width: 300px;
  }
  #cartoon-grid {
    width: auto;
    display: grid;
    gap: 20px;
    grid-template-rows: auto auto auto auto;
    grid-template-columns: auto;
  }
  #notes-blank {
    font-size: 20px;
  }
  .under-construction {
    width: 300px;
  }
}