<section id="body-wrapper" class="section blog-listing">
  <section class="container {{ site.Params.GridSize }}">
    <div class="frame-box">
    {{ .content | markdownify }}
    <br>
    {{ $containerType := default "panel" .containerType }}
    <div class="columns">
      {{ range .products }}
      <div id="item" class="column col-3 col-md-6 col-sm-6" style="display: flex;  padding-bottom: .4rem; padding-top: .4rem;" >
        <div class="{{ $containerType }}">
          {{ $ctx := . }} {{ with .image }}
          <div class="{{ $containerType }}-image">
            <a href="{{ $ctx.RelPermalink }}">
              <img alt="" src="{{ . | relURL }}" />
            </a>
          </div>
          {{ end }}
          <div class="{{ $containerType }}-header text-center">
            <div class="{{ $containerType }}-title">
                <div class="h2">{{.price}}</div>
            </div>
          </div>
          <div class="{{ $containerType }}-body">
            <div class="{{ $containerType }}-header">
                <div class="{{ $containerType }}-title h5">{{ .name }}</div>
                {{ with .subtitle }}
                <div class="{{ $containerType }}-subtitle text-gray">{{ . }}</div>
                {{ end }}
              </div>
        </div>
        </div>
      </div>
      {{ end }}
    </div>
    </div>
  </section>
</section>
