@media screen and (max-width: 767px) {
  .nav-item-holder {
    display: none;
  }
  .nav{
    flex-direction: column;
  }
  .nav-item{
    justify-content: flex-start;
    align-content: start;
    padding: 8px;
  }
  .avatar-float-image {
    display: none;
  }

  .personal-info-container {
    display: flex;
    flex-direction: column;
  }

  .career-info {
    grid-template-columns: minmax(0, 1fr);
  }

  .cert-grid > *:nth-child(even)::before {
    display: none;
  }

  .cert-grid {
    grid-template-columns: 1fr;
  }

  .project-grid{
    grid-template-columns:  1fr;
  }
}
