.home-categories .grid {
  display:grid;
  grid-template-columns: auto auto auto auto;
  grid-template-rows: 1fr 1fr;
  min-height:calc(100vh - 150px);
}

.home-categories .grid article {
  background-color: rgba(255, 255, 255, 0.8);
  background-size:cover;
  text-align: center;
  padding: 0 0;
  color:white;
  transition:all 0.5s ease-in;
  -o-transition:all 0.5s ease-in;
  -moz-transition:all 0.5s ease-in;
  -webkit-transition:all 0.5s ease-in;
  position: relative;
  display: -webkit-flex; display: flex; -webkit-flex-flow: row wrap; flex-flow: row wrap;
      -webkit-justify-content:center;  justify-content:center; color:white;
    -webkit-align-items:center;  align-items:center;
}

.home-categories .grid > article a {
  position: relative; z-index: 2;
  padding:5px;
  border:1px solid white;
}
.home-categories .grid > article a:hover .name {
  background: rgba(37, 28, 46, 0.50);

}
.home-categories .grid article .name {
  /* z-index: 2;
  position: relative; */
  font: 300 calc(18px + 1vw)/1 "Josefin Sans", sans-serif;
  color: #ffffff;
  background: rgba(37, 28, 46, 0.10);
  display: block;
  margin:0 0 0 0;
  padding:0.875rem 1rem;
}

.home-categories .grid article:nth-child(1) {
  grid-column: 1 / 3;
  grid-row: 1 / 3;
  /* min-height: 300px; */
  text-align: left;
}
.home-categories .grid article:nth-child(2) { grid-column: 3 / 5;}

.home-categories .grid article::before,
.home-categories .grid article::after,
.home-categories .grid article,
.home-categories .grid article a,
.home-categories .grid article a span
{
  transition:all 0.5s ease-out;
  -o-transition:all 0.5s ease-out;
  -moz-transition:all 0.5s ease-out;
  -webkit-transition:all 0.5s ease-out;
}

.home-categories .grid article::before{
  content:"";
  position: absolute;
  z-index: 0;
  top:50%; left:50%; bottom:50%; right:50%;
  border:0.2rem solid white;
  background: rgba(255, 255, 255, 0.50);
}
.home-categories .grid article::after{
content:"";
position: absolute;
z-index: 0;
top:1rem; left:1rem; bottom:1rem; right:1rem;
border:0.2rem solid white;
background: rgba(37, 28, 46, 0.15);
}

.home-categories .grid article:hover::before{
  top:0%; left:0%; bottom:0%; right:0%;
  border:none;
  background: rgba(255, 255, 255, 0);
}
.home-categories .grid article:hover::after{
content:"";
position: absolute;
z-index: 0;
top:50%; left:50%; bottom:50%; right:50%;
border:none;
background: rgba(37, 28, 46, 0.0);
}

@media (max-width: 1024px) {
  .home-categories .grid {
    display:grid;
    grid-template-columns: auto auto;
    grid-template-rows: 1fr 1fr;
    min-height: calc( 100vw);
  }

  .home-categories .grid article:nth-child(1) {
    grid-column: 1 / 2;
    grid-row: 1 / 2;
    /* min-height: 300px; */
    text-align: left;
  }
  .home-categories .grid article:nth-child(2) { grid-column: 2 / 2;}

}
@media (max-width: 992px) {}
@media (max-width:768px) {}
@media (max-width:480px) {}