.partner-categories { background: #f1f1f1; display: flex; flex-direction: column; min-height: 100vh; &__title { color: #000000; font-weight: 700; font-size: 22px; line-height: 32px; } &__items { display: flex; gap: 10px; flex-wrap: wrap; justify-content: center; } &__empty { font-size: 18px; font-weight: 500; margin-top: 20px; text-align: center; } .item { display: flex; flex-direction: column; padding: 33px 32px 25px 28px; width: 32%; background: #ffffff; border-radius: 12px; transition: all 0.3s ease; position: relative; @media (max-width: 1098px) { width: 48%; } @media (max-width: 650px) { width: 100%; } &:hover { box-shadow: 6px 5px 20px rgba(87, 98, 80, 0.21); transform: scale(1.02); text-decoration: none; } &__disable { opacity: 0.5; &:hover { box-shadow: none; transform: none; opacity: 1; background: #f8f8f8; .item__info { opacity: 0; } .item__disable-hover { opacity: 1; } } &-hover { position: absolute; display: flex; left: 0; width: 100%; align-items: center; justify-content: space-between; padding: 16px 13px 16px 21px; border: 3px solid #52b709; bottom: 0; border-radius: 12px; opacity: 0; transition: all 0.5s ease; p { color: #000000; font-weight: 500; font-size: 14px; line-height: 18px; max-width: 140px; margin-bottom: 0; } button { width: 140px; height: 50px; border: none; background: #52b709; border-radius: 44px; font-weight: 500; font-size: 15px; line-height: 32px; color: #ffffff; } } } &__title { display: flex; align-items: center; margin-bottom: 27px; h4 { color: #000000; font-weight: 500; font-size: 18px; line-height: 22px; margin-left: 18px; max-width: 190px; margin-bottom: 0; } } &__info { display: flex; justify-content: space-between; p { max-width: 181px; margin-bottom: 0; color: #6f6f6f; font-weight: 400; font-size: 12px; line-height: 20px; } .more { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: #ddeec6; border-radius: 50px; } } } .container { max-width: 1160px; display: flex; flex-direction: column; flex: 1; margin-top: 23px; @media (max-width: 570px) { margin-top: 0; } } .table { &__search { display: flex; width: 100%; gap: 10px; font-size: 18px; align-items: center; } &__avatar { max-width: 45px; } &__link { display: flex; column-gap: 10px; color: black; font-size: 16px; align-items: center; } &__pagination { width: 100%; display: flex; justify-content: space-between; font-size: 16px; align-items: center; } &__pages { display: flex; column-gap: 5px; align-items: center; } } }