.results-wrap { display: grid; grid-template-columns: 1fr; grid-auto-columns: 1fr; gap: 2rem 2rem; grid-auto-flow: row;}@media screen and (min-width: 36em) and (max-width: 48em) { .body-wrap { display: grid; grid-template-columns: 3fr 4fr; grid-auto-columns: 1fr; gap: 5rem; grid-template-areas: "filters results"; } .body-wrap h1.h-main { visibility: hidden; }} @media screen and (min-width: 25em) { .results-wrap { grid-template-columns: repeat(2,1fr); }}@media screen and (min-width: 36em) { .results-wrap { grid-template-columns: repeat(1,1fr); }}@media screen and (min-width: 48em) { .results-wrap { grid-template-columns: repeat(2,1fr); }}@media screen and (min-width: 62em) { .results-wrap { grid-template-columns: repeat(3,1fr); }}@media screen and (min-width: 75em) { .body-wrap { grid-template-columns: 1fr 3fr; } .results-wrap { grid-template-columns: repeat(4,1fr); grid-auto-rows: auto; } .card-constructor { aspect-ratio: auto; }} #typeFilter { display: grid;}  .add-constructor { color: var(--text-light); font-size: 1.4rem; margin-top: 2rem;} .card-constructor { aspect-ratio: 1; background-color: var(--white); border: .1rem solid #70707030; width: 100%; transition: .3s ease-in-out;}@media screen and (max-width: 25em) { .card-constructor { max-width: 30rem; margin-left: auto; margin-right: auto; }} .card-constructor:hover { transform: scale(1.05);} .card-constructor a { position: relative; display: flex; height: 100%; justify-content: center; align-items: center; padding: 4rem;} .card-constructor a .name-constructor { position: absolute; top: 1.5rem; right: 50%; transform: translateX(50%); width: 90%; text-align: center; color: var(--text-main); font-size: 1.4rem; background-color: var(--white);} .card-constructor .logo-constructor { text-align: center;} #results { position: relative;} #new-society { position: absolute; right: 0; top: 0; transform: translateY(-130%);} @media screen and (max-width: 25em) { h1.h-main { visibility: hidden; }}