.profile { background: #F1F1F1; height: 100%; min-height: 100vh; font-family: 'LabGrotesque', sans-serif; &__title { font-weight: 700; font-size: 22px; line-height: 32px; color: #000000; span { color: #52B709; } @media (max-width: 560px) { font-size: 17px; margin-top: 20px; } } &__info { min-height: 128px; background: white; border-radius: 12px; margin-top: 30px; display: flex; align-items: center; padding: 0 130px 0 45px; justify-content: space-between; } &__items { display: flex; flex-wrap: wrap; margin-top: 30px; row-gap: 25px; column-gap: 35px; @media (max-width: 1175px) { justify-content: center; } .item { max-width: 353px; width: 100%; padding: 35px 45px 15px 30px; background: #FFFFFF; border-radius: 12px; text-decoration: none; cursor: pointer; transition: all 0.3s ease; &:hover { box-shadow: 6px 5px 20px rgb(87 98 80 / 21%); transform: scale(1.02); } @media (max-width: 1175px) { width: 48%; max-width: none; } @media (max-width: 925px) { width: 100%; } &__about { display: flex; column-gap: 20px; align-items: center; margin-bottom: 30px; h3 { color: #000000; font-weight: 500; font-size: 18px; line-height: 22px; max-width: 125px; margin-bottom: 0; } } &__info { display: flex; justify-content: space-between; align-items: center; p { font-weight: 700; font-size: 12px; line-height: 20px; color: #000000; margin-bottom: 0; span { color: #52B709; font-weight: 700; } } &Link { width: 48px; height: 48px; background: #DDEEC6; border-radius: 50px; display: flex; justify-content: center; align-items: center; } } } } .container { max-width: 1160px; margin-top: 23px; @media (max-width: 570px) { margin-top: 0; } } footer { margin-top: 70px; } }