.gallery {
    width: 100%;
    max-width: 800px;
    margin: 10px auto;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    background-color: rgb(3, 2, 0);
  }

  .image {
    margin: 10px;
    width: calc(33.33% - 20px);
    overflow: hidden;
  }

  
  .image img {
    width: 100%;
    height: auto;
    transition: transform 0.5s;
  }

 

  .image:hover img {
    transform: scale(1.1);
  }


  @media screen and (max-width: 768px) {
    .image {
      width: calc(50% - 20px);
    }
  }
  
  @media screen and (max-width: 480px) {
    .image {
      width: 100%;
    }
  }