.categories{
  margin: 1rem auto; padding: 0px; display: grid; grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr)); justify-content: center; gap: 1rem; --color: darkgoldenrod; list-style-type: none;} .categories > *{
  box-sizing: border-box;} .categories > * a{
  box-sizing: border-box; padding: 1rem 1rem 0.5rem; background-color: var(--color); border-radius: 0.5rem; display: flex; flex-flow: column; height: 100%; border-bottom: none; text-align: left;} .categories > * a > *{ transition-property: transform; transition-duration: 0.3s; } .categories > * a > h3{ margin: 0px; } .categories > * a > img{ margin: auto 0px; padding: 1rem 0.5rem; height: 4rem; max-width: 75%; align-self: flex-start; } .categories > * a:hover{
  opacity: 1;} .categories > * a:hover > *{ transform: scale(1.05) translateX(0.2rem) translateY(0.1rem); }