.post-authors { display: flex; align-items: center; } .post-author-images { display: flex; } .post-author-image { display: flex; justify-content: center; align-items: center; min-width: 53px; width: 53px; height: 53px; border-radius: 100%; border: 1px solid var(--text-color); overflow: hidden; background-color: var(--background-color); transition: all .2s ease; transform: translateY(0%); } .post-author-image:hover { transform: translateY(-4%); } .post-author-image { margin-left: -30px; } .post-author-image:first-of-type { margin-left: 0px; z-index: 5; } .post-author-image:nth-child(2){ z-index: 4; } .post-author-image:nth-child(3){ z-index: 3; } .post-author-image:nth-child(4){ z-index: 2; } .post-author-image:nth-child(5){ z-index: 1; } .post-author-image:last-of-type { margin-right: 15px; } .post-authors-text { display: flex; flex-direction: column; gap: 3px; width: 100%; } .post-authors-inner { display: flex; } .post-author-name { font-size: 14px; line-height: 150%; font-weight: 600; } .post-author-name a { display: inline-flex; } .post-author-name a:hover { text-decoration: underline; } .date-small-text { display: flex; align-items: center; line-height: 140%; white-space: nowrap; padding-right: 2px; } .author-avatar-wrapper { display: flex; align-items: center; justify-content: center; min-width: 25px; width: 25px; height: 25px; } /* Styles for large desktop */ @media (min-width: 1439px) { .post-author-image { min-width: calc(3.7vw * var(--scale)); width: calc(3.7vw * var(--scale)); height: calc(3.7vw * var(--scale)); } .post-author-name { font-size: calc(1.05vw * var(--scale)); } .post-author-image { margin-left: calc(-2vw * var(--scale)); } .post-authors-text { row-gap: calc(0.3vw * var(--scale)); } .post-author-image:last-of-type { margin-right: calc(1.1vw * var(--scale)); } .author-avatar-wrapper { min-width: calc(1.73vw * var(--scale)); width: calc(1.73vw * var(--scale)); height: calc(1.73vw * var(--scale)); } } /* Styles for tablet */ @media (max-width: 991px) { .post-authors { margin-top: 28px; } } /* Styles for mobile */ @media (max-width: 479px) { .post-authors { margin-top: 24px; } }