
@media screen and (max-width: 775px) {
  #about article {
    display: block;
    max-height: 100vh;
  }
  #about figure {
    max-width: 50vw;
    max-height: 50vh;
    margin: 0 auto;
  }
  #about div.about-details {
    width: 100%;
  }
}

/* Mobile styles */
@media (max-width: 480px) {
  .project {
    min-width: 100%;
  }
}

 /* FROM PROJECTS STYLING */

/* Media Query for smaller screens */
@media (max-width: 900px) {
  .project {
    flex: 1 1 calc(50% - 20px); /* 2 columns */
  }
}
@media (max-width: 600px) {
  .project {
    flex: 1 1 100%; /* 1 column */
  }
}