.project-table {
    display: flex;
    flex-wrap: wrap;
    gap: 30px;
    padding: 0;
    margin: 0;
  }

  .portfolio-item-small {
    flex: 1 1 calc(33.333% - 20.5px);
    max-width: calc(33.333% - 20.5px);
    aspect-ratio: 16 / 9;
    position: relative;
    animation: fadeInUp 0.8s ease forwards;
  }
  
  .portfolio-item-small img {
    width: 100%;
    aspect-ratio: 16 / 9;
    object-fit: cover;
    display: block;
    opacity: 0.9;
    filter:grayscale(0.05);
    transition: transform 0.4s ease, opacity 0.4s ease;
  }
  
  .portfolio-item-small:hover img {
    transform: scale(1.02);
    filter:grayscale(0);
    opacity: 1;
  }
  


  @media (max-width: 1024px) {

    .project-table {
      gap: 20px;
      width: 90%;
      margin: auto;
    }

    .portfolio-item-small {
      flex: 1 1 calc(50% - 10.5px);
      max-width: calc(50% - 10.5px);
    }

  }

  @media (max-width: 568px) {
    .project-table {
      display: none;
    }
  }