Deal Card Production

deal-card.html

<figure class="card-ui cui-c-udc cui-is-embedded-card left-aligned-card is-local has-additional-value-message">
  <div class="cui-content hide-bottom-border">
    <a href="https://www.groupon.com/deals/big-break-marina-llc">
      <div class="cui-udc-image-container">
        <div class="cui-udc-image-overlay"></div>
        <div class="cui-image-lazy-container cui-image-hover-zoom">
          <img class="cui-svg-placeholder" src="data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' height='250' width='414'%2F%3E" alt="Shop Groupon">
          <img class="cui-image lazy-load lazy-loaded" src="data:image/svg+xml;charset=utf-8,%3Csvg xmlns%3D'http%3A%2F%2Fwww.w3.org%2F2000%2Fsvg' height='250' width='414'%2F%3E" alt="Up to 51% Off One-Hour Kayak Rental at Big Break Marina">
        </div>
      </div>
      <div class="cui-udc-details with-side-padding">
        <div class="cui-single-section">
          <div class="cui-udc-title-with-subtitle one-line-truncate">
            Big Break Marina
          </div>
        </div>
        <div class="cui-single-section">
          <div class="cui-review-rating">
            <ul class="rating ">
                <li><span class="full-star"></span></li>
                <li><span class="full-star"></span></li>
                <li><span class="full-star"></span></li>
                <li><span class="full-star"></span></li>
                <li><span class="full-star"></span></li>
            </ul>
            <div class="rating-count">
              (64)
            </div>
          </div>
        </div>
        <div class="cui-single-section">
          <div class="cui-location cui-truncate">
            <span class="cui-location-name">Northwest Oakley</span>
          </div>
        </div>
        <div class="cui-bottom-body">
          <div class="cui-combined-section">
            <div class="cui-price">
              <div class="cui-price-original c-txt-gray-dk">
                $15
              </div>&nbsp;
              <div class="cui-price-discount cui-verbose-urgency-pricing">
                $9
              </div>
            </div>
            <div class="cui-promotions cui-verbose-urgency-promotion-row">
              <div class="cui-urgent cui-offer">
                <div class="cui-verbose-urgency-text">
                  Limited Time&nbsp;
                </div>
                <div class="cui-verbose-urgency-price">$7.51</div>
              </div>
            </div>
          </div>
          <div class="cui-single-section">
            <div class="cui-udc-subtitle">
              One-Hour Kayak Rental
            </div>
          </div>
        </div>
      </div>
    </a>
  </div>
</figure>