Footer

<footer class="u-textSize01">
  <nav class="Noir">
    <div class="u-containPage u-padSides1 u-padEnds4 u-lg-padEnds6 u-spaceItems4">
      <div class="Grid Grid--withGutter Grid--alignMiddle">
        <div class="Grid-cell u-spaceItems03 ">
          <h4 class="u-textSize2 u-textWhite u-inlineBlock u-spaceRight03">Need help?</h4>
          <p class="u-inlineBlock">Mon – Fri, 8:30am – 5pm (Pacific)<p>
        </div>
        <div class="Grid-cell u-spaceTop03 ">
          <ul class="Grid Grid--withGap u-listReset">
            <li class="Grid-cell u-sm-size1of2 u-lg-sizeFill">
              <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
            <svg width="20" height="20" viewBox="0 0 20 20" class="Icon">
  <path d="M15.09,2H4.91A2.89,2.89,0,0,0,2,4.88V14.1A2.89,2.89,0,0,0,4.91,17H6.46A3.8,3.8,0,0,1,5.8,18.8c-.33.38.22.41.43.36a6.3,6.3,0,0,0,2.23-1.3L9.24,17h5.85A2.89,2.89,0,0,0,18,14.1V4.88A2.89,2.89,0,0,0,15.09,2ZM10.92,13.88a.6.6,0,0,1-.6.6H8.83a.6.6,0,0,1-.6-.6v-1.1a.6.6,0,0,1,.6-.6h1.5a.6.6,0,0,1,.6.6Zm3-5.93c0,.93-.66,1.42-2,2.28l-.77.49a.32.32,0,0,0-.17.3v.27H8.83a.6.6,0,0,1-.6-.6v0c0-1,1-1.63,2.06-2.35L11,7.83a.36.36,0,0,0,.17-.32V7a.26.26,0,0,0-.26-.26H9.06A.26.26,0,0,0,8.8,7v.26a.6.6,0,0,1-.6.6H6.71a.6.6,0,0,1-.6-.6V6.4A2,2,0,0,1,8.06,4.45h3.88A2,2,0,0,1,13.89,6.4Z"/>
</svg>
            Help Center
          </a>
            </li>
            <li class="Grid-cell u-sm-size1of2 u-lg-sizeFill">
              <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
            <svg width="22" height="28" viewBox="0 0 22 28" class="Icon">
  <path d="M22 19.375c0 0.562-0.25 1.656-0.484 2.172-0.328 0.766-1.203 1.266-1.906 1.656-0.922 0.5-1.859 0.797-2.906 0.797-1.453 0-2.766-0.594-4.094-1.078-0.953-0.344-1.875-0.766-2.734-1.297-2.656-1.641-5.859-4.844-7.5-7.5-0.531-0.859-0.953-1.781-1.297-2.734-0.484-1.328-1.078-2.641-1.078-4.094 0-1.047 0.297-1.984 0.797-2.906 0.391-0.703 0.891-1.578 1.656-1.906 0.516-0.234 1.609-0.484 2.172-0.484 0.109 0 0.219 0 0.328 0.047 0.328 0.109 0.672 0.875 0.828 1.188 0.5 0.891 0.984 1.797 1.5 2.672 0.25 0.406 0.719 0.906 0.719 1.391 0 0.953-2.828 2.344-2.828 3.187 0 0.422 0.391 0.969 0.609 1.344 1.578 2.844 3.547 4.813 6.391 6.391 0.375 0.219 0.922 0.609 1.344 0.609 0.844 0 2.234-2.828 3.187-2.828 0.484 0 0.984 0.469 1.391 0.719 0.875 0.516 1.781 1 2.672 1.5 0.313 0.156 1.078 0.5 1.188 0.828 0.047 0.109 0.047 0.219 0.047 0.328z"/>
</svg>
            1-877-338-0999
          </a>
            </li>
            <li class="Grid-cell u-sm-size1of2 u-lg-sizeFill">
              <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
            <svg width="28" height="28" viewBox="0 0 28 28" class="Icon">
  <path d="M28 11.094v12.406c0 1.375-1.125 2.5-2.5 2.5h-23c-1.375 0-2.5-1.125-2.5-2.5v-12.406c0.469 0.516 1 0.969 1.578 1.359 2.594 1.766 5.219 3.531 7.766 5.391 1.313 0.969 2.938 2.156 4.641 2.156h0.031c1.703 0 3.328-1.188 4.641-2.156 2.547-1.844 5.172-3.625 7.781-5.391 0.562-0.391 1.094-0.844 1.563-1.359zM28 6.5c0 1.75-1.297 3.328-2.672 4.281-2.438 1.687-4.891 3.375-7.313 5.078-1.016 0.703-2.734 2.141-4 2.141h-0.031c-1.266 0-2.984-1.437-4-2.141-2.422-1.703-4.875-3.391-7.297-5.078-1.109-0.75-2.688-2.516-2.688-3.938 0-1.531 0.828-2.844 2.5-2.844h23c1.359 0 2.5 1.125 2.5 2.5z"/>
</svg>
            Email Us
          </a>
            </li>
            <li class="Grid-cell u-sm-size1of2 u-lg-sizeFill">
              <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
            Live Chat
          </a>
            </li>
          </ul>
        </div>
      </div>
      <hr>
      <div>
        <div class="Grid Grid--withGap">
          <div class="Grid-cell u-sm-flexOrderLast u-sm-size1of2">
            <h4 class="u-textSize2 u-textWhite">Products</h4>
            <ul class="Grid Grid--withGutter u-listReset">
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Generator Selector</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Portable Generators</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Home Standby Generators</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Log Splitters</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Cultivators &amp; Tillers</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Winches &amp; Hoists</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Water Pumps</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Engines</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Accessories</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Pressure Washers</a></li>
              <li class="Grid-cell u-spaceTop03 u-md-size1of2"><a href="#">Other Outdoor</a></li>
            </ul>
          </div>
          <div class="Grid-cell u-sm-size1of2">
            <div class="Grid Grid--withGap">
              <div class="Grid-cell u-md-size1of2">
                <h4 class="u-textSize2 u-textWhite">Support</h4>
                <ul class="Grid Grid--withGutter u-listReset">
                  <li class="Grid-cell u-spaceTop03"><a href="#">Knowledge Base</a></li>
                  <li class="Grid-cell u-spaceTop03"><a href="#">Product Registration</a></li>
                  <li class="Grid-cell u-spaceTop03"><a href="#">Product Manuals</a></li>
                  <li class="Grid-cell u-spaceTop03"><a href="#">Tech Bulletins</a></li>
                  <li class="Grid-cell u-spaceTop03"><a href="#">Generator Safety</a></li>
                </ul>
              </div>
              <div class="Grid-cell u-md-size1of2">
                <h4 class="u-textSize2 u-textWhite">About</h4>
                <ul class="Grid Grid--withGutter u-listReset">
                  <li class="Grid-cell u-spaceTop03"><a href="#">Why Champion?</a></li>
                  <li class="Grid-cell u-spaceTop03"><a href="#">Where To Buy</a></li>
                  <li class="Grid-cell u-spaceTop03"><a href="#">Sponsored Champions</a></li>
                  <li class="Grid-cell u-spaceTop03"><a href="#">News &amp; Updates</a></li>
                  <li class="Grid-cell u-spaceTop03">
                    <a href="#">
                      <svg width="28" height="28" viewBox="0 0 28 28" class="Icon">
  <path d="M20,1H4A3,3,0,0,0,1,4V20a3,3,0,0,0,3,3h8.75V14.48H9.88V11.16h2.87V8.71A4,4,0,0,1,17,4.32a23.52,23.52,0,0,1,2.56.13v3H17.83A1.38,1.38,0,0,0,16.18,9v2.12h3.29L19,14.48H16.18V23H20a3,3,0,0,0,3-3V4A3,3,0,0,0,20,1Z"/>
</svg> Facebook
                    </a>
                  </li>
                  <li class="Grid-cell u-spaceTop03">
                    <a href="#">
                      <svg width="28" height="28" viewBox="0 0 28 28" class="Icon">
  <path d="M21,3H3C1.3,3,0,4.3,0,6v12c0,1.7,1.3,3,3,3h18c1.7,0,3-1.3,3-3V6C24,4.3,22.7,3,21,3z M15.9,12.9l-7,3
    C8.8,16,8.6,16,8.5,16c-0.2,0-0.4-0.1-0.6-0.2c-0.3-0.2-0.4-0.5-0.4-0.8V9c0-0.3,0.2-0.6,0.4-0.8C8.1,8.1,8.3,8,8.5,8
    c0.1,0,0.3,0,0.4,0.1l7,3c0.4,0.2,0.6,0.5,0.6,0.9S16.3,12.8,15.9,12.9z"/>
</svg> YouTube
                    </a>
                  </li>
                </ul>
              </div>
            </div>
          </div>
        </div>
      </div>
    </div>
  </nav>
  <div class="Noir Noir--muted">
    <div class="u-containPage u-pad1">
      <div class="Grid Grid--withGutter Grid--alignMiddle u-textCenter u-md-textLeft">
        <div class="Grid-cell u-md-sizeFill">
          <div class="Grid Grid--withGutter">
            <div class="Grid-cell u-md-sizeFit">
              <p>
                &copy; 2023 Champion Power Equipment
              </p>
            </div>
            <div class="Grid-cell u-md-sizeFit">
              <ul class="u-listInline u-flexInline">
                <li><a href="#">Privacy Policy</a></li>
                <li><a href="#">Terms &amp; Conditions</a></li>
              </ul>
            </div>
          </div>
        </div>
        <div class="Grid-cell u-md-sizeFit u-spaceTop03 u-md-despaceTop">
          <p class="u-textYellow u-textGrow2">
            <b class="u-textNoWrap">Powering your life.</b>
          </p>
        </div>
      </div>
    </div>
  </div>
</footer>

<div class="Grid Grid--withGutter Grid--alignMiddle">
  <div class="Grid-cell u-spaceItems03 u-md-size1of3">
    <h4 class="u-textSize2 u-textWhite u-inlineBlock u-spaceRight03">Need help?</h4>
    <p class="u-inlineBlock">Mon – Fri, 8:30am – 5pm (Pacific)<p>
  </div>
  <div class="Grid-cell u-spaceTop03 u-md-despaceTop u-md-size2of3">
    <ul class="Grid Grid--withGap u-listReset">
      <li class="Grid-cell u-sm-size1of2">
        <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
        <svg width="22" height="28" viewBox="0 0 22 28" class="Icon">
  <path d="M22 19.375c0 0.562-0.25 1.656-0.484 2.172-0.328 0.766-1.203 1.266-1.906 1.656-0.922 0.5-1.859 0.797-2.906 0.797-1.453 0-2.766-0.594-4.094-1.078-0.953-0.344-1.875-0.766-2.734-1.297-2.656-1.641-5.859-4.844-7.5-7.5-0.531-0.859-0.953-1.781-1.297-2.734-0.484-1.328-1.078-2.641-1.078-4.094 0-1.047 0.297-1.984 0.797-2.906 0.391-0.703 0.891-1.578 1.656-1.906 0.516-0.234 1.609-0.484 2.172-0.484 0.109 0 0.219 0 0.328 0.047 0.328 0.109 0.672 0.875 0.828 1.188 0.5 0.891 0.984 1.797 1.5 2.672 0.25 0.406 0.719 0.906 0.719 1.391 0 0.953-2.828 2.344-2.828 3.187 0 0.422 0.391 0.969 0.609 1.344 1.578 2.844 3.547 4.813 6.391 6.391 0.375 0.219 0.922 0.609 1.344 0.609 0.844 0 2.234-2.828 3.187-2.828 0.484 0 0.984 0.469 1.391 0.719 0.875 0.516 1.781 1 2.672 1.5 0.313 0.156 1.078 0.5 1.188 0.828 0.047 0.109 0.047 0.219 0.047 0.328z"/>
</svg>
        1-877-338-0999
      </a>
      </li>
      <li class="Grid-cell u-sm-size1of2">
        <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
        <svg width="28" height="28" viewBox="0 0 28 28" class="Icon">
  <path d="M28 11.094v12.406c0 1.375-1.125 2.5-2.5 2.5h-23c-1.375 0-2.5-1.125-2.5-2.5v-12.406c0.469 0.516 1 0.969 1.578 1.359 2.594 1.766 5.219 3.531 7.766 5.391 1.313 0.969 2.938 2.156 4.641 2.156h0.031c1.703 0 3.328-1.188 4.641-2.156 2.547-1.844 5.172-3.625 7.781-5.391 0.562-0.391 1.094-0.844 1.563-1.359zM28 6.5c0 1.75-1.297 3.328-2.672 4.281-2.438 1.687-4.891 3.375-7.313 5.078-1.016 0.703-2.734 2.141-4 2.141h-0.031c-1.266 0-2.984-1.437-4-2.141-2.422-1.703-4.875-3.391-7.297-5.078-1.109-0.75-2.688-2.516-2.688-3.938 0-1.531 0.828-2.844 2.5-2.844h23c1.359 0 2.5 1.125 2.5 2.5z"/>
</svg>
        Email Us
      </a>
      </li>
    </ul>
  </div>
</div>

<div class="Grid Grid--withGutter Grid--alignMiddle">
  <div class="Grid-cell u-spaceItems03 u-lg-size1of4">
    <h4 class="u-textSize2 u-textWhite u-inlineBlock u-spaceRight03">Need help?</h4>
    <p class="u-inlineBlock">Mon – Fri, 8:30am – 5pm (Pacific)<p>
  </div>
  <div class="Grid-cell u-spaceTop03 u-lg-despaceTop u-lg-size3of4">
    <ul class="Grid Grid--withGap u-listReset">
      <li class="Grid-cell u-md-size1of3">
        <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
        <svg width="20" height="20" viewBox="0 0 20 20" class="Icon">
  <path d="M15.09,2H4.91A2.89,2.89,0,0,0,2,4.88V14.1A2.89,2.89,0,0,0,4.91,17H6.46A3.8,3.8,0,0,1,5.8,18.8c-.33.38.22.41.43.36a6.3,6.3,0,0,0,2.23-1.3L9.24,17h5.85A2.89,2.89,0,0,0,18,14.1V4.88A2.89,2.89,0,0,0,15.09,2ZM10.92,13.88a.6.6,0,0,1-.6.6H8.83a.6.6,0,0,1-.6-.6v-1.1a.6.6,0,0,1,.6-.6h1.5a.6.6,0,0,1,.6.6Zm3-5.93c0,.93-.66,1.42-2,2.28l-.77.49a.32.32,0,0,0-.17.3v.27H8.83a.6.6,0,0,1-.6-.6v0c0-1,1-1.63,2.06-2.35L11,7.83a.36.36,0,0,0,.17-.32V7a.26.26,0,0,0-.26-.26H9.06A.26.26,0,0,0,8.8,7v.26a.6.6,0,0,1-.6.6H6.71a.6.6,0,0,1-.6-.6V6.4A2,2,0,0,1,8.06,4.45h3.88A2,2,0,0,1,13.89,6.4Z"/>
</svg>
        Help Center
      </a>
      </li>
      <li class="Grid-cell u-md-size1of3">
        <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
        <svg width="22" height="28" viewBox="0 0 22 28" class="Icon">
  <path d="M22 19.375c0 0.562-0.25 1.656-0.484 2.172-0.328 0.766-1.203 1.266-1.906 1.656-0.922 0.5-1.859 0.797-2.906 0.797-1.453 0-2.766-0.594-4.094-1.078-0.953-0.344-1.875-0.766-2.734-1.297-2.656-1.641-5.859-4.844-7.5-7.5-0.531-0.859-0.953-1.781-1.297-2.734-0.484-1.328-1.078-2.641-1.078-4.094 0-1.047 0.297-1.984 0.797-2.906 0.391-0.703 0.891-1.578 1.656-1.906 0.516-0.234 1.609-0.484 2.172-0.484 0.109 0 0.219 0 0.328 0.047 0.328 0.109 0.672 0.875 0.828 1.188 0.5 0.891 0.984 1.797 1.5 2.672 0.25 0.406 0.719 0.906 0.719 1.391 0 0.953-2.828 2.344-2.828 3.187 0 0.422 0.391 0.969 0.609 1.344 1.578 2.844 3.547 4.813 6.391 6.391 0.375 0.219 0.922 0.609 1.344 0.609 0.844 0 2.234-2.828 3.187-2.828 0.484 0 0.984 0.469 1.391 0.719 0.875 0.516 1.781 1 2.672 1.5 0.313 0.156 1.078 0.5 1.188 0.828 0.047 0.109 0.047 0.219 0.047 0.328z"/>
</svg>
        1-877-338-0999
      </a>
      </li>
      <li class="Grid-cell u-md-size1of3">
        <a href="#" class="Button Button--primary u-block u-textSize u-textNoWrap">
        <svg width="28" height="28" viewBox="0 0 28 28" class="Icon">
  <path d="M28 11.094v12.406c0 1.375-1.125 2.5-2.5 2.5h-23c-1.375 0-2.5-1.125-2.5-2.5v-12.406c0.469 0.516 1 0.969 1.578 1.359 2.594 1.766 5.219 3.531 7.766 5.391 1.313 0.969 2.938 2.156 4.641 2.156h0.031c1.703 0 3.328-1.188 4.641-2.156 2.547-1.844 5.172-3.625 7.781-5.391 0.562-0.391 1.094-0.844 1.563-1.359zM28 6.5c0 1.75-1.297 3.328-2.672 4.281-2.438 1.687-4.891 3.375-7.313 5.078-1.016 0.703-2.734 2.141-4 2.141h-0.031c-1.266 0-2.984-1.437-4-2.141-2.422-1.703-4.875-3.391-7.297-5.078-1.109-0.75-2.688-2.516-2.688-3.938 0-1.531 0.828-2.844 2.5-2.844h23c1.359 0 2.5 1.125 2.5 2.5z"/>
</svg>
        Email Us
      </a>
      </li>
    </ul>
  </div>
</div>