.account-info-container { display: flex; flex-direction: column; align-items: center; max-width: 540px; text-align: center; margin-bottom: 4vh; width: 100%; } .account-paragraph-info { margin-bottom: 27px; } .account-buttons-wrapper { display: flex; gap: 22px; } .account-button { min-width: 142px; display: flex; align-items: center; justify-content: center; } .account-settings-button { text-decoration: underline; line-height: 140%; margin-top: 16px; } .account-subscribe-button { background-color: var(--background-color); color: var(--text-color); border: 1px solid var(--text-color); } .account-data { margin-bottom: 34px; width: 100%; border-top: 1px solid var(--text-color); } .account-data-row { gap: 38px; width: 100%; border-top: none; } .left-align { text-align: left; } .right-align { text-align: right; } /* Styles for large desktop */ @media (min-width: 1439px) { .account-info-container { max-width: calc(37.5vw * var(--scale)); } .account-paragraph-info { margin-bottom: calc(1.88vw * var(--scale)); } .account-buttons-wrapper { gap: calc(1.53vw * var(--scale)); } .account-button { min-width: calc(9.86vw * var(--scale)); } .account-settings-button { margin-top: calc(1.11vw * var(--scale)); } .account-data { margin-bottom: calc(2.36vw * var(--scale)) } .account-data-row { gap: calc(2.64vw * var(--scale)); } } /* Styles for mobile */ @media (max-width: 479px) { .account-paragraph-info { margin-bottom: 24px; } .account-buttons-wrapper { gap: 18px; } .account-button { min-width: 126px; } .account-settings-button { margin-top: 12px; } .account-data { margin-bottom: 32px; } }