@media only screen and (max-width:668px) {
  .about_grid {
    display: flex;
    flex-direction: column
  }

  #olho {
    width: 56%
  }

  nav {
    width: 70%
  }

  .modal {
    width: 90%;
  }

  .modal-body {
    flex-direction: column;
  }

  .modal-imgs.small-images {
    height: 100px;
  }

  .modal-imgs.large-images {
    height: 250px
  }

  .modal-imgs.x-large-images {
    height: 300px
  }

  .modal-body {
    flex-direction: column-reverse;
    align-items: center;
  }

  .modal-text p {
    padding: 1rem;
    font-size: 0.9rem;
  }

  .modal-text.small-size {
    align-items: flex-start;
  }

  .modal-text h2 {
    font-size: 1.8rem;
  }

  .modal-body img {
    width: 80%;
  }
}