xenbase Header styling

[OUTL4W]

I'm trying to use an image that is the width of xb_page_width but the overflow falls below the navbar which I'm trying to atleast hide on mobile.
in xb_header & navigation>LogoBlock PageContent> backgound field: image url then in the css box I have

min-height:250px;
min-width: @xb_page_width;
border-radius: 10px !important;
overflow: hidden;

@xb_page_width = 90% with boxed layout ticked.
in extra css I'm using:

<xen:if is="@enableResponsive">
     @media (max-width:@maxResponsiveNarrowWidth)
{
#header .pageContent .pageWidth {padding-bottom: .17%; overflow: hidden;}
}
</xen:if>

which results on mobile as:

Spoiler: result

trying to eliminate the redbox area...been trying everything I can think of: fixed height, %height and if all else fails {display:none;} would be acceptable. The overflow doesn't show when in landscape just portrait mode. The "padding-bottom" trick is used by determining (Image Height / Image Width) * 100% to auto size images in responsive mode. So now I'm deferring to the experts.

 

[OUTL4W]

Update- disregard...found my issue.