.mason-grid {
    margin-top: 30px;
  }

.grid {
  display: grid;
  grid-template-columns: 300px 300px 300px;
  grid-gap: 10px;
}		

  .grid-item { 
    width: 100%; 
  }

  .grid-item:nth-child(odd) {
    border: 1px solid #edeef1;
    background: #f1f1f1;
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
  }   

  .grid-item:nth-child(odd):hover{
    background: #4a98b7;
  }

  .grid-item:nth-child(even) {
    border: 1px solid #edeef1;
    background: #e8e8e8;
    -webkit-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
  }

  .grid-item:nth-child(even):hover {
    background: #f36e2d;
  }

  .grid-item a{
    color: #3e4e84;
  }

  .grid-item:hover a{
    color: #fff;
  }

@media only screen and (max-width: 600px) {
  .grid {
  display: grid;
  grid-template-columns: 300px ;
  grid-gap: 10px;
} 
}
@media only screen and (max-width: 780px) {
  .grid {
  display: grid;
  grid-template-columns:  300px ;
  grid-gap: 10px;
} 
}