.container { padding: 0 24px 24px 16px; .title { margin: 14px 0 15px; } .minAmount { margin-top: 4px; color: #14cc9e; font-size: 10px; line-height: 14px; &.unavailable { color: #ff5733; } } .availableMoneyOut { display: flex; align-items: center; column-gap: 16px; margin-bottom: 16px; font-size: 14px; color: #777777; .value { font-size: 18px; font-weight: 700; color: #29bbe4; } } .exchangeRate { display: flex; justify-content: space-between; margin-bottom: 12px; font-size: 14px; color: #777777; .value { font-weight: 700; } } .currency_amount { display: flex; justify-content: space-between; margin-bottom: 12px; .label { font-size: 14px; color: #777777; } .value { font-size: 14px; color: #29bbe4; font-weight: 700; } } .detailModal { position: relative; width: calc(100vw - 50px); max-width: 363px; padding: 32px 29px 42px; background-color: #fff; box-sizing: border-box; .closeIcon { position: absolute; top: 18px; right: 21px; width: 17px; height: 17px; } .modalTitle { font-size: 28px; color: #333333; font-weight: 700; } .titleWrapper { padding: 12px; margin: 12px 0 24px; box-shadow: -1px 0 5px 1px rgba(0, 0, 0, 0.1); .loginsWrapper { display: flex; flex-direction: column; .loginWrapper { display: flex; align-items: center; column-gap: 4px; color: #333333; font-size: 21px; line-height: 35px; font-weight: 700; .mtLoginOut { color: #29bbe4; } .mtLoginIn { color: #0f3675; } .transferTo { font-size: 20px; line-height: 29px; font-weight: 400; } } } .title { margin: 0; font-size: 24px; font-weight: 700; line-height: 34px; } .divider { margin: 11px 0px; height: 1px; background-color: #ececec; } .amount { font-size: 21px; font-weight: 700; color: #333333; line-height: 35px; } } } }