Accordion - border overlap opacity issue

[jcfilben]

Expected Behavior

The borders of the Accordion should all be consistent.

Actual Behavior

The Accordion has a negative margin so that the top and bottom border are overlapping. This causes an issue when the border has an opacity (ex. in the HPE theme). The borders between Accordion panels appear darker than the top and bottom borders on edge of the Accordion.

Using a negative margin isn't a great practice. We should explore alternatives to this approach.

URL, screen shot, or Codepen exhibiting the issue

Steps to Reproduce

Your Environment

• Grommet version:
• Browser Name and version:
• Operating System and version (desktop or mobile):