Photo butt color to bar beneath-need transparent left & right of color bar

Hello,
I have a photo starting at the top of a page and beneath it is a color bar that’s taking up 86% of the width of the page. I would like the photo to be on the left and right side of the color bar, so it takes up the border area on left to right. When I tell the background area to be transparent, it shows the ‘child theme color’ on the outside. I also tried setting the photo box so it’s -60 bottom margin so that the green box will come up in to the photo. I have screenshots I could send, but don’t see where I can ‘attach’ it so someone can see. I posted something a few days ago, and someone responded, but haven’t heard back from my responses. I’ve resolved all my issues but this one. Does anyone know if this can be accomplished using the Enfold Child Theme?

The CSS I’ve tried last with no luck is:
.page-id-16554 .apt-pad-transparent {
border-left-color: rgba(255,255,255,0) !important;
border-left-width: 7%px !important;
border-right-color: rgba(255,255,255,0) !important;
border-right-width: 7%px !important;
padding: 0px !important; }

Any assistance or advice would be greatly appreciated. Thank you!!