<div
  #vendorCategories
  class="d-none"
>
  <div style="margin: 0px auto; max-width: 715px">
    <table
      align="center"
      border="0"
      cellpadding="0"
      cellspacing="0"
      role="presentation"
      style="width: 100%"
    >
      <tbody>
        <tr>
          <td style="direction: ltr; font-size: 0px; padding: 0; text-align: center">
            <!--[if mso | IE]><table role="presentation" border="0" cellpadding="0" cellspacing="0"><tr><td class="" style="vertical-align:top;width:596px;" ><![endif]-->
            <div
              class="mj-column-px-596 mj-outlook-group-fix"
              style="font-size: 0px; text-align: left; direction: ltr; display: inline-block; vertical-align: top; width: 100%"
            >
              <table
                border="0"
                cellpadding="0"
                cellspacing="0"
                role="presentation"
                style="vertical-align: top"
                width="100%"
              >
                <tbody>
                  <tr>
                    <td
                      align="center"
                      style="font-size: 0px; padding: 0; padding-bottom: 7px; word-break: break-word"
                    >
                      <p style="border-top: solid 3px #3a494e; font-size: 1px; margin: 0px auto; width: 118px"></p>
                      <!--[if mso | IE
                        ]><table
                          align="center"
                          border="0"
                          cellpadding="0"
                          cellspacing="0"
                          style="border-top: solid 3px #3a494e; font-size: 1px; margin: 0px auto; width: 118px"
                          role="presentation"
                          width="118px"
                        >
                          <tr>
                            <td style="height: 0; line-height: 0">&nbsp;</td>
                          </tr>
                        </table><!
                      [endif]-->
                    </td>
                  </tr>
                  <tr>
                    <td
                      align="center"
                      class="uppercase"
                      style="text-transform: uppercase; font-size: 0px; padding: 0; word-break: break-word"
                    >
                      <div style="font-family: Arial; font-size: 28px; font-weight: 700; line-height: 38px; text-align: center; color: #3a494e">
                        you’ll find
                      </div>
                    </td>
                  </tr>
                </tbody>
              </table>
            </div>
            <!--[if mso | IE]></td></tr></table><![endif]-->
          </td>
        </tr>
      </tbody>
    </table>
  </div>
  <div style="margin: 0px auto; max-width: 715px">
    <table
      align="center"
      border="0"
      cellpadding="0"
      cellspacing="0"
      role="presentation"
      style="width: 100%"
    >
      <tbody>
        <tr>
          <td style="direction: ltr; font-size: 0px; padding: 20px 0; padding-top: 30px; text-align: center">
            <div
              class="mj-column-px-596 mj-outlook-group-fix"
              style="font-size: 0; line-height: 0; text-align: left; display: inline-block; width: 100%; direction: ltr"
            >
              <ng-container *ngFor="let vendor of eventVendorInfo?.eventVendorRequirements; let i = index">
                <div
                  class="mj-column-per-33-333333333333336 mj-outlook-group-fix"
                  style="font-size: 0px; text-align: left; direction: ltr; display: inline-block; vertical-align: top; width: 33%"
                >
                  <table
                    border="0"
                    cellpadding="0"
                    cellspacing="0"
                    role="presentation"
                    style="vertical-align: top"
                    width="100%"
                  >
                    <tbody>
                      <tr>
                        <td
                          align="left"
                          style="font-size: 0px; padding: 0; word-break: break-word"
                        >
                          <table
                            align="left"
                            border="0"
                            cellpadding="0"
                            cellspacing="0"
                            role="presentation"
                            style="float: none; display: inline-table"
                          >
                            <tbody>
                              <tr>
                                <td style="padding: 4px; vertical-align: middle">
                                  <table
                                    border="0"
                                    cellpadding="0"
                                    cellspacing="0"
                                    role="presentation"
                                    style="border-radius: 3px; width: 20px"
                                  >
                                    <tbody>
                                      <tr>
                                        <td style="font-size: 0; height: 20px; vertical-align: middle; width: 20px">
                                          <img
                                            height="20"
                                            src="https://redlimecdn.blob.core.windows.net/production/Email_assets/event-invitation-email/chevrons-right.png"
                                            style="border-radius: 3px; display: block"
                                            width="20"
                                          />
                                        </td>
                                      </tr>
                                    </tbody>
                                  </table>
                                </td>
                                <td style="vertical-align: middle">
                                  <span style="color: #333333; font-size: 13px; font-family: Arial; line-height: 22px; text-decoration: none">
                                    {{ vendor.vendorType.name }}{{ i + 1 }}
                                  </span>
                                </td>
                              </tr>
                            </tbody>
                          </table>
                        </td>
                      </tr>
                    </tbody>
                  </table>
                </div>
              </ng-container>
            </div>
          </td>
        </tr>
      </tbody>
    </table>
  </div>
</div>