Using Color Section Code on WooCommerce Shop Page

Hi all,

I’m trying to keep my site consistent and use a color section at the top of my shop pages like I have on the rest of my pages. See my work in progress site here: http://staging.eyemagic.net/about/

I’m using this code to add the color section (the Avia Layout Builder does not work with WooCommerce pages):

<div style="width:100%;" id="av_section_1" class="avia-section alternate_color avia-section-small avia-no-border-styling avia-bg-style-scroll  avia-builder-el-0  el_before_av_three_fifth  avia-builder-el-first  container_wrap fullsize"><div class="container"><main role="main" itemprop="mainContentOfPage" class="template-page content  twelve alpha units"><div class="post-entry post-entry-type-page post-entry-31"><div class="entry-content-wrapper clearfix">
<div style="padding-bottom:0px;color:#ffffff;" class="av-special-heading av-special-heading-h1 custom-color-heading blockquote modern-quote  avia-builder-el-1  avia-builder-el-no-sibling "><h1 class="av-special-heading-tag" itemprop="headline" style="padding-bottom:0px;color:#ffffff;">Eye Magic Products</h1><div class="special-heading-border"><div class="special-heading-inner-border" style="border-color:#ffffff"></div></div></div>
</div></div></main><!-- close content main element --></div></div>

My question is, how do I get the color section background to stretch across the entire width of the screen like it does on my other pages?

Thanks in advance!

Dave