.post-container {
  display: flex;
  justify-content: center;
}

.post {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 10px;
  max-width: 1020px;
}

.image-column img {
    width: 1080px;
    max-width: 100%;
    height: auto;
    box-shadow:rgba(0, 0, 0, 1) 1px 1px 4px 1px, rgba(163, 151, 151, 0.5) -1px -1px 1px 1px ;
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
}
.image-column img:hover {
    box-shadow:rgba(0, 0, 0, 1) 2px 2px 4px 1px, rgba(163, 151, 151, 0.4) -1px -1px 1px 1px;filter:brightness(120%)  contrast(105%)  ;
    transition: 0.3s;
}
.prom {
    width: 367px;
    position: relative;
    border-radius: 10px;
    cursor: pointer;
    transition: 0.3s;
    max-width:  100%;
    height: auto;
}
a > img.prom:hover {
    box-shadow:rgba(0, 0, 0, .7) -1px -1px 4px 1px,rgba(0, 0, 0, 1) 2px 2px 4px 1px ;filter:brightness(120%)  contrast(105%)  ;
    transition: 0.3s;
}
@media (max-width: 768px) {
  .post {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .post {
    grid-template-columns: 1fr;
  }
}