Country profile international resources graphic

## I'm submitting a ...
Check one of the following options with "x" and add the appropriate label to the issue as well

[X] Bug report 

[ ] Regression (behaviour that used to work and stopped working in a new release)

**Describe the Issue**
The Inflows VS Outflows diagram, located under the International Resources tab of Country Profiles, is unclear. Specifically, it is unclear how the parent categories (like ODA) relate to the children metrics (eg interest payments, capital repayments. Also, long term debt and short term debt should be amended to long-term debt and short-term debt respectively.
**To Reproduce**
Replace the content below with the steps to reproduce the behaviour.
1. Go to any country profile
2. Click on the 'International Resources' tab.

**Expected Behaviour**
We'd like this to be clearer, and it would be great if you could present some options of how we might do this as easily as possible. For example, a square bracket beside ODA indicating that it breaks down into interest payments and capital repayments, or shading alternate sections to make it clear where distinctions are.

**Screenshots/GIF**

**Desktop (please complete the following information):**
- OS: [windows 8]
- Browser [Chrome]
- Version [71.0.3578.98]

**Smartphone (please complete the following information):**
- Device: []
- OS: []
- Browser []
- Version []

**Environment/Server:**

- [X] Production

- [ ] Staging

- [ ] Test

- [ ] Development

**Additional Context**
Add any other context about the problem here.

Requested Delivery Date: 30 January 2019