#home-products-grid .grid > a {
  border: 1px solid #e6decc;
  background-color: black;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

#home-products-grid h2 {
  text-align:center;
  margin-block:0;
  padding-block: 1rem;
  border-top: 1px solid #e6decc; /* White Rock */
  background-color: #710000; /*Romance */
  color: white; /* Varden */
}

#home-products-grid .grid > a:hover > h2{
  background-color: #5a0000;
  color: #ffc300;
}

#home-products-grid .grid > a:hover > div{
  opacity: 0.9;
}

#home-products-grid img {
  display: flex;
  justify-content: center;
  overflow: hidden;
  width: 100%;
  height: auto;
}

@media only screen and (min-width:1024px) {
  #home-products-grid img {
    object-fit: cover;
    height:300px;
  }
}

@media only screen and (max-width:1024px) {
  #home-products-grid img {
    object-fit: cover;
    height: 250px;
  }
}

@media only screen and (max-width:768px) {
  #home-products-grid .grid {
    margin-inline: 20%;
  }
    #home-products-grid img {
    object-fit: cover;
    height: 200px;
  }
}

@media only screen and (max-width:480px) {
  #home-products-grid .grid {
    margin-inline: 10%;
  }
}

#home-services-grid div.container div.grid:nth-child(odd) {
  grid-template-columns: repeat(2, 1fr);
}

#home-services-grid div.container div.grid:nth-child(even) {
  grid-template-columns: repeat(2, 1fr);
}

.services-grid-image img {
  width: 100%;
  aspect-ratio: 1/1;
  object-fit: cover;
  border: 2px solid #5a0000;
}

@media only screen and (max-width:1024px) {
  .services-grid-image {
    display: none;
  }
}

#home-services-info h2 {
  border-bottom: 1px solid #e6e5e4; /*Mercury*/ 
}

#home-services-info .grid {
  margin-block: 1rem;
}
