@media screen and (max-width: 4500px) { .chat { width: 100%; direction: rtl; align-items: center; margin-bottom: 10px; position: relative; padding: 0px 0px 0px; text-decoration: none; .avatar { background-color: #b4b4b4; width: 55px; height: 55px; // padding: 5px; border-radius: 35px; object-fit: cover; } &__data { text-align: right; flex: 1; justify-content: space-around; height: 100%; padding: 10px 10px 20px; border-bottom: rgba(209, 208, 208, 0.7) solid 1px; &--name { font-size: 18px; } h1 { font-family: numeralMedium; font-size: 15px; margin: 0; font-weight: 600; color: #6f7074; } p { font-size: 12px; margin: 0; max-width: calc(100vw - 100px); font-family: numeralLight; color: #6f7074; } span { background-color: #25d366; min-width: 20px; font-size: 11px; height: 20px; display: flex; justify-content: center; align-items: center; border-radius: 13px; position: absolute; padding-top: 1px; padding: 0 5px; left: 20px; bottom: 10px; color: white; } div { color: rgb(99, 99, 99); position: absolute; left: 20px; font-size: 12px; top: 5px; } } } } a{ text-decoration: none; }