<main id="main-section" class="main main--collected-components">
    <div class="l-collected-components l-collected-components--paragraph">
        Handle: <code>@paragraph</code>
        <p class="paragraph u-text-center">This page collects checkout components for snapshot testing.</p>

    </div>
    <div class="l-collected-components l-collected-components--checkout-express">
        Handle: <code>@checkout-express</code>
        <div class="checkout-express">
            <h2 class="checkout-express__iframe-header">Express Checkout Options - Skip the Line</h2>
            <iframe class="checkout-express__iframe" src="../../assets/static/html/express-checkout.html" frameborder="0"></iframe>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--checkout-cart--default">
        Handle: <code>@checkout-cart--default</code>
        <div class="checkout-cart checkout-cart--default">
            <h4 class="checkout-cart__title">Order Summary</h4>
            <ul class="checkout-cart__items">
                <li class="checkout-cart__item">
                    <table class="checkout-cart__item-details">
                        <tr>
                            <td><img class="checkout-cart__item-image" src="https://mauijim.scene7.com/is/image/mauijim/202-02_front?$config1800$&amp;wid&#x3D;120" alt="Gloss Black"></td>
                            <td class="checkout-cart__item-qty"><strong>Qty:</strong> 1</td>
                            <td class="checkout-cart__item-price">
                                $149.00
                                <div class="checkout-cart__item-tax-info">
                                    <span class="checkout-cart__item-tax-value">Inkl. MWST</span>
                                </div>
                            </td>
                        </tr>
                    </table>
                    <div class="checkout-cart__item-info-group">
                        <span class="checkout-cart__item-name"><strong>PEAHI</strong> - 202-02</span>
                        <span class="checkout-cart__item-info">Gloss Black</span>
                        <span class="checkout-cart__item-info">Neutral Grey | SuperThin Glass</span>
                        <span class="checkout-cart__item-info">Single Gradient</span>
                    </div>
                </li>
                <li class="checkout-cart__item">
                    <table class="checkout-cart__item-details">
                        <tr>
                            <td><img class="checkout-cart__item-image" src="https://s7d2.scene7.com/is/image/mauijim/HTS267-15C_front?$config1800$&amp;wid&#x3D;120" alt="Olive Stripe"></td>
                            <td class="checkout-cart__item-qty"><strong>Qty:</strong> 1</td>
                            <td class="checkout-cart__item-price">
                                $219.00
                                <div class="checkout-cart__item-tax-info">
                                    <span class="checkout-cart__item-tax-value">Inkl. MWST</span>
                                </div>
                                <div class="checkout-cart__item-vip-info">
                                    <span class="checkout-cart__item-vip-card-value">VIP Card 30%</span>
                                    <span class="checkout-cart__item-vip-original-price">$319.00</span>
                                </div>
                            </td>
                        </tr>
                    </table>
                    <div class="checkout-cart__item-info-group">
                        <span class="checkout-cart__item-name"><strong>WATERWAYS</strong> - HTS267-15C</span>
                        <span class="checkout-cart__item-info">Olive Stripe</span>
                        <span class="checkout-cart__item-info">Maui HT™ | SuperThin Glass</span>
                        <span class="checkout-cart__item-info">Single Gradient</span>
                    </div>
                </li>
                <li class="checkout-cart__item">
                    <table class="checkout-cart__item-details">
                        <tr>
                            <td><img class="checkout-cart__item-image" src="https://s7d2.scene7.com/is/image/mauijim/H257-16C_front?$config1800$&amp;wid&#x3D;120" alt="Tortoise with Antique Gold"></td>
                            <td class="checkout-cart__item-qty"><strong>Qty:</strong> 1</td>
                            <td class="checkout-cart__item-price">
                                $299.00
                                <div class="checkout-cart__item-vip-info">
                                    <span class="checkout-cart__item-vip-card-value">VIP Card 30%</span>
                                    <span class="checkout-cart__item-vip-original-price">$319.00</span>
                                </div>
                            </td>
                        </tr>
                    </table>
                    <div class="checkout-cart__item-info-group">
                        <span class="checkout-cart__item-name"><strong>KAWIKA</strong> - H257-16C</span>
                        <span class="checkout-cart__item-info">Tortoise with Antique Gold</span>
                        <span class="checkout-cart__item-info">HCL® Bronze | MauiPure</span>
                        <span class="checkout-cart__item-info">Single Gradient</span>
                    </div>
                </li>
                <li class="checkout-cart__item">
                    <table class="checkout-cart__item-details">
                        <tr>
                            <td><img class="checkout-cart__item-image" src="https://s7d2.scene7.com/is/image/mauijim/H178-10_front?$config1800$&amp;wid&#x3D;120" alt="Tortoise"></td>
                            <td class="checkout-cart__item-qty"><strong>Qty:</strong> 1</td>
                            <td class="checkout-cart__item-price">
                                $219.00
                            </td>
                        </tr>
                    </table>
                    <div class="checkout-cart__item-info-group">
                        <span class="checkout-cart__item-name"><strong>VOYAGER</strong> - H178-10</span>
                        <span class="checkout-cart__item-info">Tortoise</span>
                        <span class="checkout-cart__item-info">HCL® Bronze | SuperThin Glass</span>
                        <span class="checkout-cart__item-info">Single Gradient</span>
                    </div>
                </li>
                <li class="checkout-cart__item">
                    <table class="checkout-cart__item-details">
                        <tr>
                            <td><img class="checkout-cart__item-image" src="https://s7d2.scene7.com/is/image/mauijim/RS708-26D_front?$config1800$&amp;wid&#x3D;120" alt="Brown Feathered"></td>
                            <td class="checkout-cart__item-qty"><strong>Qty:</strong> 1</td>
                            <td class="checkout-cart__item-price">
                                $299.00
                            </td>
                        </tr>
                    </table>
                    <div class="checkout-cart__item-info-group">
                        <span class="checkout-cart__item-name"><strong>LEIA</strong> - RS708-26D</span>
                        <span class="checkout-cart__item-info">Brown Feathered</span>
                        <span class="checkout-cart__item-info">Maui Rose® | SuperThin Glass</span>
                        <span class="checkout-cart__item-info">Single Gradient</span>
                    </div>
                </li>
                <li class="checkout-cart__item">
                    <table class="checkout-cart__item-details">
                        <tr>
                            <td><img class="checkout-cart__item-image" src="https://s7d2.scene7.com/is/image/mauijim/H711-18_front?$config1800$&amp;wid&#x3D;120" alt="Copper"></td>
                            <td class="checkout-cart__item-qty"><strong>Qty:</strong> 1</td>
                            <td class="checkout-cart__item-price">
                                $279.00
                            </td>
                        </tr>
                    </table>
                    <div class="checkout-cart__item-info-group">
                        <span class="checkout-cart__item-name"><strong>KOHALA</strong> - H711-18</span>
                        <span class="checkout-cart__item-info">Copper</span>
                        <span class="checkout-cart__item-info">HCL® Bronze | MauiPure</span>
                        <span class="checkout-cart__item-info">Single Gradient</span>
                    </div>
                </li>
                <li class="checkout-cart__item">
                    <table class="checkout-cart__item-details">
                        <tr>
                            <td><img class="checkout-cart__item-image" src="https://s7d2.scene7.com/is/image/mauijim/H706-16C_front?$config1800$&amp;wid&#x3D;120" alt="Antique Gold"></td>
                            <td class="checkout-cart__item-qty"><strong>Qty:</strong> 1</td>
                            <td class="checkout-cart__item-price">
                                $329.00
                            </td>
                        </tr>
                    </table>
                    <div class="checkout-cart__item-info-group">
                        <span class="checkout-cart__item-name"><strong>STILLWATER</strong> - H706-16C</span>
                        <span class="checkout-cart__item-info">Antique Gold</span>
                        <span class="checkout-cart__item-info">HCL® Bronze | SuperThin Glass</span>
                        <span class="checkout-cart__item-info">Single Gradient</span>
                    </div>
                </li>
            </ul>
            <div class="checkout-cart__footer">
                <ul class="checkout-cart__totals">
                    <li class="checkout-cart__totals-item">
                        <span class="checkout-cart__totals-label">Subtotal (7):</span>
                        <span class="checkout-cart__totals-value">$1,389.97</span>
                    </li>
                    <li class="checkout-cart__totals-item">
                        <span class="checkout-cart__totals-label">Gift Bag (1):</span>
                        <span class="checkout-cart__totals-value">$3.99</span>
                    </li>
                    <li class="checkout-cart__totals-item">
                        <span class="checkout-cart__totals-label">Gift Card:</span>
                        <span class="checkout-cart__totals-value">- $300.00</span>
                    </li>
                    <li class="checkout-cart__totals-item">
                        <span class="checkout-cart__totals-label">Est. Tax:</span>
                        <span class="checkout-cart__totals-value checkout-cart__totals-value--tbd">Based on Shipping Information</span>
                    </li>
                    <li class="checkout-cart__totals-item">
                        <span class="checkout-cart__totals-label">Delivery:</span>
                        <span class="checkout-cart__totals-value checkout-cart__totals-value--tbd">Based on Shipping Method</span>
                    </li>
                    <li class="checkout-cart__totals-item checkout-cart__totals-item--total">
                        <span class="checkout-cart__totals-label">Total:</span>
                        <span class="checkout-cart__totals-value">$1,206.30</span>
                    </li>
                </ul>
            </div>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--checkout-cart--repairs">
        Handle: <code>@checkout-cart--repairs</code>
        <div class="checkout-cart checkout-cart--repairs">
            <h4 class="checkout-cart__title">Order Summary</h4>
            <ul class="checkout-cart__items">
                <li class="checkout-cart__item checkout-cart__item--repair">
                    <div class="checkout-cart__repair-details">
                        <div class="checkout-cart__repair-header">
                            <img class="checkout-cart__repair-image" src="https://mauijim.scene7.com/is/image/mauijim/202-02_front?$config1800$&amp;wid&#x3D;580" alt="Gloss Black">
                            <div class="checkout-cart__repair">
                                <span class="checkout-cart__repair-lens">Non-prescription</span>
                                <strong>
              <span class="checkout-cart__repair-name">PEAHI</span>
              <span class="checkout-cart__repair-variant">202-02</span>
            </strong>
                            </div>
                        </div>
                        <div class="checkout-cart__repair-info-group">
                            <span class="checkout-cart__repair-purchase"><strong>Purchase Date:</strong> May 2017</span>
                            <span class="checkout-cart__repair-note"><strong>Repair Notes:</strong> Please fix my favourite frame as soon as possible.</span>
                            <ul class="checkout-cart__repair-list">
                                <li class="checkout-cart__repair-item">
                                    <span class="checkout-cart__repair-type">Lens Replacement Package</span>
                                    <span class="checkout-cart__repair-price">$75.00</span>
                                </li>
                                <li class="checkout-cart__repair-item">
                                    <span class="checkout-cart__repair-type">Frame Replacement Package</span>
                                    <span class="checkout-cart__repair-price">$50.00</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li class="checkout-cart__item checkout-cart__item--repair">
                    <div class="checkout-cart__repair-details">
                        <div class="checkout-cart__repair-header">
                            <img class="checkout-cart__repair-image" src="https://s7d2.scene7.com/is/image/mauijim/HTS267-15C_front?$config1800$&amp;wid&#x3D;580" alt="Olive Stripe">
                            <div class="checkout-cart__repair">
                                <span class="checkout-cart__repair-lens">Prescription</span>
                                <strong>
              <span class="checkout-cart__repair-name">WATERWAYS</span>
              <span class="checkout-cart__repair-variant">HTS267-15C</span>
            </strong>
                            </div>
                        </div>
                        <div class="checkout-cart__repair-info-group">
                            <span class="checkout-cart__repair-purchase"><strong>Purchase Date:</strong> May 2017</span>
                            <span class="checkout-cart__repair-note"><strong>Repair Notes:</strong> Please fix my favourite frame as soon as possible.</span>
                            <ul class="checkout-cart__repair-list">
                                <li class="checkout-cart__repair-item">
                                    <span class="checkout-cart__repair-type">Lens Replacement Package</span>
                                    <span class="checkout-cart__repair-price">$75.00</span>
                                </li>
                            </ul>
                        </div>
                    </div>
                </li>
                <li class="checkout-cart__item checkout-cart__item--surcharge">
                    <div class="checkout-cart__surcharge">
                        <svg class="icon icon--tools">
  <use xlink:href="/assets/icons/icons.svg#tools"></use>
</svg>

                        <span class="checkout-cart__repair-type">Standard Repair Process</span>
                        <span class="checkout-cart__repair-price">$10.00</span>
                    </div>
                </li>
            </ul>
            <div class="checkout-cart__footer">
                <ul class="checkout-cart__totals">
                    <li class="checkout-cart__totals-item">
                        <span class="checkout-cart__totals-label">Subtotal (3):</span>
                        <span class="checkout-cart__totals-value">$210.00</span>
                    </li>
                    <li class="checkout-cart__totals-item">
                        <span class="checkout-cart__totals-label">Est. Tax:</span>
                        <span class="checkout-cart__totals-value checkout-cart__totals-value--tbd">Based on Shipping Information</span>
                    </li>
                    <li class="checkout-cart__totals-item">
                        <span class="checkout-cart__totals-label">Delivery:</span>
                        <span class="checkout-cart__totals-value checkout-cart__totals-value--tbd">Based on Shipping Method</span>
                    </li>
                    <li class="checkout-cart__totals-item checkout-cart__totals-item--total">
                        <span class="checkout-cart__totals-label">Total:</span>
                        <span class="checkout-cart__totals-value">$210.00</span>
                    </li>
                </ul>
            </div>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--confirmation-details">
        Handle: <code>@confirmation-details</code>
        <div class="confirmation-details">
            <ul class="confirmation-details__items">
                <li class="confirmation-details__item">
                    <span class="confirmation-details__item-label">Date:</span>
                    <span class="confirmation-details__item-value">3/13/2017</span>
                </li>
                <li class="confirmation-details__item">
                    <span class="confirmation-details__item-label">Order N.:</span>
                    <span class="confirmation-details__item-value">W000153817911</span>
                </li>
                <li class="confirmation-details__item">
                    <span class="confirmation-details__item-label">Shipping Method:</span>
                    <span class="confirmation-details__item-value">FedEx - Ground Free</span>
                </li>
                <li class="confirmation-details__item">
                    <span class="confirmation-details__item-label">Estimated Delivery:</span>
                    <span class="confirmation-details__item-value">Wednesday, January 31st</span>
                </li>
            </ul>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--confirmation-products--default">
        Handle: <code>@confirmation-products--default</code>
        <div class="confirmation-products">
            <div class="confirmation-products__item">
                <img class="confirmation-products__item-image" src="https://mauijim.scene7.com/is/image/mauijim/202-02_front?$config1800$&amp;wid&#x3D;225" alt="Gloss Black">
                <span class="confirmation-products__item-info confirmation-products__item-info--qty">
      <strong>Qty:</strong> 1
    </span>
                <span class="confirmation-products__item-info confirmation-products__item-info--price">
      <strong>Price:</strong> $149.00
      <span class="confirmation-products__item-tax">Inkl. MWST</span>
                </span>
                <span class="confirmation-products__item-info confirmation-products__item-info--name">
      PEAHI
      <span class="confirmation-products__item-info confirmation-products__item-info--sku" aria-label="SKU">
        202-02
      </span>
                </span>
                <div class="confirmation-products__item-details">
                    <span class="confirmation-products__item-info"><strong>Frame:</strong> Gloss Black</span>
                    <span class="confirmation-products__item-info"><strong>Lens:</strong> Neutral Grey</span>
                    <span class="confirmation-products__item-info"><strong>Lens Material:</strong> SuperThin Glass</span>
                    <span class="confirmation-products__item-info"><strong>Gradient:</strong> Single Gradient</span>
                </div>
            </div>
            <div class="confirmation-products__item">
                <img class="confirmation-products__item-image" src="https://s7d2.scene7.com/is/image/mauijim/HTS267-15C_front?$config1800$&amp;wid&#x3D;225" alt="Olive Stripe">
                <span class="confirmation-products__item-info confirmation-products__item-info--qty">
      <strong>Qty:</strong> 1
    </span>
                <span class="confirmation-products__item-info confirmation-products__item-info--price">
      <strong>Price:</strong> $219.00
      <div class="confirmation-products__item-vip-info">
        <span class="confirmation-products__item-vip-card-value">VIP Card 30%</span>
                <span class="confirmation-products__item-vip-original-price">$319.00</span>
            </div>
            <span class="confirmation-products__item-tax">Inkl. MWST</span>
            </span>
            <span class="confirmation-products__item-info confirmation-products__item-info--name">
      WATERWAYS
      <span class="confirmation-products__item-info confirmation-products__item-info--sku" aria-label="SKU">
        HTS267-15C
      </span>
            </span>
            <div class="confirmation-products__item-details">
                <span class="confirmation-products__item-info"><strong>Frame:</strong> Olive Stripe</span>
                <span class="confirmation-products__item-info"><strong>Lens:</strong> Maui HT™</span>
                <span class="confirmation-products__item-info"><strong>Lens Material:</strong> SuperThin Glass</span>
                <span class="confirmation-products__item-info"><strong>Gradient:</strong> Single Gradient</span>
            </div>
        </div>
        <div class="confirmation-products__item">
            <img class="confirmation-products__item-image" src="https://s7d2.scene7.com/is/image/mauijim/H257-16C_front?$config1800$&amp;wid&#x3D;225" alt="Tortoise with Antique Gold">
            <span class="confirmation-products__item-info confirmation-products__item-info--qty">
      <strong>Qty:</strong> 1
    </span>
            <span class="confirmation-products__item-info confirmation-products__item-info--price">
      <strong>Price:</strong> $299.00
      <div class="confirmation-products__item-vip-info">
        <span class="confirmation-products__item-vip-card-value">VIP Card 30%</span>
            <span class="confirmation-products__item-vip-original-price">$319.00</span>
        </div>
        </span>
        <span class="confirmation-products__item-info confirmation-products__item-info--name">
      KAWIKA
      <span class="confirmation-products__item-info confirmation-products__item-info--sku" aria-label="SKU">
        H257-16C
      </span>
        </span>
        <div class="confirmation-products__item-details">
            <span class="confirmation-products__item-info"><strong>Frame:</strong> Tortoise with Antique Gold</span>
            <span class="confirmation-products__item-info"><strong>Lens:</strong> HCL® Bronze</span>
            <span class="confirmation-products__item-info"><strong>Lens Material:</strong> MauiPure</span>
            <span class="confirmation-products__item-info"><strong>Gradient:</strong> Single Gradient</span>
        </div>
    </div>
    <div class="confirmation-products__item">
        <img class="confirmation-products__item-image" src="https://s7d2.scene7.com/is/image/mauijim/H178-10_front?$config1800$&amp;wid&#x3D;225" alt="Tortoise">
        <span class="confirmation-products__item-info confirmation-products__item-info--qty">
      <strong>Qty:</strong> 1
    </span>
        <span class="confirmation-products__item-info confirmation-products__item-info--price">
      <strong>Price:</strong> $219.00
    </span>
        <span class="confirmation-products__item-info confirmation-products__item-info--name">
      VOYAGER
      <span class="confirmation-products__item-info confirmation-products__item-info--sku" aria-label="SKU">
        H178-10
      </span>
        </span>
        <div class="confirmation-products__item-details">
            <span class="confirmation-products__item-info"><strong>Frame:</strong> Tortoise</span>
            <span class="confirmation-products__item-info"><strong>Lens:</strong> HCL® Bronze</span>
            <span class="confirmation-products__item-info"><strong>Lens Material:</strong> SuperThin Glass</span>
            <span class="confirmation-products__item-info"><strong>Gradient:</strong> Single Gradient</span>
        </div>
    </div>
    <div class="confirmation-products__item">
        <img class="confirmation-products__item-image" src="https://s7d2.scene7.com/is/image/mauijim/RS708-26D_front?$config1800$&amp;wid&#x3D;225" alt="Brown Feathered">
        <span class="confirmation-products__item-info confirmation-products__item-info--qty">
      <strong>Qty:</strong> 1
    </span>
        <span class="confirmation-products__item-info confirmation-products__item-info--price">
      <strong>Price:</strong> $299.00
    </span>
        <span class="confirmation-products__item-info confirmation-products__item-info--name">
      LEIA
      <span class="confirmation-products__item-info confirmation-products__item-info--sku" aria-label="SKU">
        RS708-26D
      </span>
        </span>
        <div class="confirmation-products__item-details">
            <span class="confirmation-products__item-info"><strong>Frame:</strong> Brown Feathered</span>
            <span class="confirmation-products__item-info"><strong>Lens:</strong> Maui Rose®</span>
            <span class="confirmation-products__item-info"><strong>Lens Material:</strong> SuperThin Glass</span>
            <span class="confirmation-products__item-info"><strong>Gradient:</strong> Single Gradient</span>
        </div>
    </div>
    </div>

    </div>
    <div class="l-collected-components l-collected-components--confirmation-products--repairs">
        Handle: <code>@confirmation-products--repairs</code>
        <div class="confirmation-products confirmation-products--repairs">
            <div class="confirmation-products__item confirmation-products__item--repair">
                <div class="confirmation-products__repair-details">
                    <div class="confirmation-products__repair-header">
                        <img class="confirmation-products__repair-image" src="https://mauijim.scene7.com/is/image/mauijim/202-02_front?$config1800$&amp;wid&#x3D;225" alt="Gloss Black">
                        <div class="confirmation-products__repair">
                            <span class="confirmation-products__repair-lens">Non-Prescription Sunglasses</span>
                            <span class="confirmation-products__repair-name">PEAHI</span>
                            <span class="confirmation-products__repair-variant">202-02</span>
                        </div>
                    </div>
                    <div class="confirmation-products__repair-info-group">
                        <span class="confirmation-products__repair-purchase"><strong>Purchase Date:</strong> May 2017</span>
                        <span class="confirmation-products__repair-note"><strong>Repair Notes:</strong> Please fix my favourite frame as soon as possible.</span>
                        <ul class="confirmation-products__repair-list">
                            <li class="confirmation-products__repair-item">
                                <span class="confirmation-products__repair-type">Lens Replacement Package</span>
                                <ul class="confirmation-products__repair-includes">
                                    <li class="confirmation-products__repair-include">Temple and Nose Pad Evaluation</li>
                                    <li class="confirmation-products__repair-include">Cleaning &amp; Alignment as Needed</li>
                                </ul>
                            </li>
                            <li class="confirmation-products__repair-item">
                                <span class="confirmation-products__repair-type">Frame Replacement Package</span>
                                <ul class="confirmation-products__repair-includes">
                                    <li class="confirmation-products__repair-include">Temple and Nose Pad Evaluation</li>
                                    <li class="confirmation-products__repair-include">Cleaning &amp; Alignment as Needed</li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="confirmation-products__item confirmation-products__item--repair">
                <div class="confirmation-products__repair-details">
                    <div class="confirmation-products__repair-header">
                        <img class="confirmation-products__repair-image" src="https://s7d2.scene7.com/is/image/mauijim/HTS267-15C_front?$config1800$&amp;wid&#x3D;225" alt="Olive Stripe">
                        <div class="confirmation-products__repair">
                            <span class="confirmation-products__repair-lens">Non-Prescription Sunglasses</span>
                            <span class="confirmation-products__repair-name">WATERWAYS</span>
                            <span class="confirmation-products__repair-variant">HTS267-15C</span>
                        </div>
                    </div>
                    <div class="confirmation-products__repair-info-group">
                        <span class="confirmation-products__repair-purchase"><strong>Purchase Date:</strong> May 2017</span>
                        <span class="confirmation-products__repair-note"><strong>Repair Notes:</strong> Please fix my favourite frame as soon as possible.</span>
                        <ul class="confirmation-products__repair-list">
                            <li class="confirmation-products__repair-item">
                                <span class="confirmation-products__repair-type">Lens Replacement Package</span>
                                <ul class="confirmation-products__repair-includes">
                                    <li class="confirmation-products__repair-include">Temple and Nose Pad Evaluation</li>
                                    <li class="confirmation-products__repair-include">Cleaning &amp; Alignment as Needed</li>
                                </ul>
                            </li>
                        </ul>
                    </div>
                </div>
            </div>
            <div class="confirmation-products__item confirmation-products__item--surcharge">
                <div class="confirmation-products__surcharge">
                    <svg class="icon icon--tools">
  <use xlink:href="/assets/icons/icons.svg#tools"></use>
</svg>

                    <span class="confirmation-products__repair-type">Standard Repair Process</span>
                    <span class="confirmation-products__surcharge-desc">$10 fee includes nose pads and temple evaluation, cleaning and alignment as needed, and insurred shipping.</span>
                </div>
            </div>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--confirmation-return-instructions">
        Handle: <code>@confirmation-return-instructions</code>
        <div class="confirmation-return-instructions">
            <h4 class="confirmation-return-instructions__headline">Please follow the instruction below to ship your repair.</h4>
            <ul class="confirmation-return-instructions__steps">
                <li class="confirmation-return-instructions__step">
                    <h5 class="confirmation-return-instructions__step-label">Print and include return slip in package:</h5>
                    <a href="/assets/pdfs/repair-sunglasses.pdf" class="button button--primary confirmation-return-instructions__step-action js-confirmation-return-instructions-print-button" target="_blank">Print return slip</a>
                </li>
                <li class="confirmation-return-instructions__step">
                    <h5 class="confirmation-return-instructions__step-label">Package your sunglasses and include return slip:</h5>
                    <p class="confirmation-return-instructions__step-value">Please package your sunglasses in their case or wrapped and placed inside a sturdy cardboard container.<br>Include printed return request silp.</p>
                </li>
                <li class="confirmation-return-instructions__step">
                    <h5 class="confirmation-return-instructions__step-label">Ship us your sunglasses:</h5>
                    <p class="confirmation-return-instructions__step-value">Maui Jim, Inc.<br>Repair Department<br>One Aloha Lane<br>Peoria, IL 61615<br><br>If you have any questions, we’ll contact you by email.<br>If you still need assistance, just call us at 888-666-5602</p>
                </li>
            </ul>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--confirmation-summary--default">
        Handle: <code>@confirmation-summary--default</code>
        <div class="confirmation-summary">
            <dl class="confirmation-summary__fees-list">
                <dt class="confirmation-summary__fees-list-label">Subtotal</dt>
                <dd class="confirmation-summary__fees-list-value">$1,389.97</dd>
                <dt class="confirmation-summary__fees-list-label">Gift Bag (1)</dt>
                <dd class="confirmation-summary__fees-list-value">$3.99</dd>
                <dt class="confirmation-summary__fees-list-label">Shipping</dt>
                <dd class="confirmation-summary__fees-list-value">FREE</dd>
                <dt class="confirmation-summary__fees-list-label">Estimated Tax</dt>
                <dd class="confirmation-summary__fees-list-value">$142.88</dd>
                <dt class="confirmation-summary__fees-list-label confirmation-summary__fees-list-label--total">Total</dt>
                <dd class="confirmation-summary__fees-list-value confirmation-summary__fees-list-value--total">$1,536.84</dd>
            </dl>
            <div class="confirmation-summary__meta">
                <div class="confirmation-summary__group">
                    <span class="confirmation-summary__group-label">Shipping Address</span>
                    <div class="confirmation-summary__data">
                        <span class="confirmation-summary__data-value">John Doe<br>One Aloha Lane<br>Peoria, IL 61615<br>United States</span>
                    </div>
                </div>
                <div class="confirmation-summary__group confirmation-summary__group--billing">
                    <span class="confirmation-summary__group-label">Billing Information</span>
                    <div class="confirmation-summary__data">
                        <span class="confirmation-summary__data-value">John Doe<br>Apple, Inc.<br>888-888-1234<br>One Aloha Lane<br>Peoria, IL 61615<br>United States</span>
                    </div>
                    <div class="confirmation-summary__data">
                        <span class="confirmation-summary__data-value">American Express<br>John Doe<br>****-****-****-3456<br>10/2018</span>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--confirmation-summary--wide">
        Handle: <code>@confirmation-summary--wide</code>
        <div class="confirmation-summary">
            <dl class="confirmation-summary__fees-list">
                <dt class="confirmation-summary__fees-list-label">Subtotal</dt>
                <dd class="confirmation-summary__fees-list-value">$1,389.97</dd>
                <dt class="confirmation-summary__fees-list-label">Gift Bag (1)</dt>
                <dd class="confirmation-summary__fees-list-value">$3.99</dd>
                <dt class="confirmation-summary__fees-list-label">Shipping</dt>
                <dd class="confirmation-summary__fees-list-value">FREE</dd>
                <dt class="confirmation-summary__fees-list-label">Estimated Tax</dt>
                <dd class="confirmation-summary__fees-list-value">$142.88</dd>
                <dt class="confirmation-summary__fees-list-label confirmation-summary__fees-list-label--total">Total</dt>
                <dd class="confirmation-summary__fees-list-value confirmation-summary__fees-list-value--total">$1,536.84</dd>
            </dl>
            <div class="confirmation-summary__meta confirmation-summary__meta--wide">
                <div class="confirmation-summary__group">
                    <span class="confirmation-summary__group-label">Customer Number:</span>
                    <div class="confirmation-summary__data">
                        <span class="confirmation-summary__data-value">1234567890123456</span>
                    </div>
                </div>
                <div class="confirmation-summary__group">
                    <span class="confirmation-summary__group-label">Order Number:</span>
                    <div class="confirmation-summary__data">
                        <span class="confirmation-summary__data-value">1234567890123456</span>
                    </div>
                </div>
                <div class="confirmation-summary__group">
                    <span class="confirmation-summary__group-label">Address:</span>
                    <div class="confirmation-summary__data">
                        <span class="confirmation-summary__data-value">One Aloha Lane<br>Peoria, IL 61615<br>United States</span>
                    </div>
                    <div class="confirmation-summary__data">
                        <span class="confirmation-summary__data-value">888-888-1234</span>
                    </div>
                </div>
            </div>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--confirmation-thanks">
        Handle: <code>@confirmation-thanks</code>
        <div class="confirmation-thanks">
            <span class="confirmation-thanks__headline">Mahalo John Doe!</span>
            <p class="confirmation-thanks__description">Your order has been placed.</p>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--payment-faqs">
        Handle: <code>@payment-faqs</code>
        <div class="payment-faqs js-payment-faqs">
            <h2 class="payment-faqs__title">FAQs</h2>
            <div class="payment-faqs__content-wrapper js-payment-faqs-content-wrapper js-payment-faqs-content-wrapper--active">
                <button class="payment-faqs__control js-payment-faqs-control">
      Security Payment
      <svg class="icon icon--arrow-up">
  <use xlink:href="/assets/icons/icons.svg#arrow-up"></use>
</svg>

      <svg class="icon icon--arrow-down">
  <use xlink:href="/assets/icons/icons.svg#arrow-down"></use>
</svg>

    </button>
                <div class="payment-faqs__content">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam elementum enim velit, id sagittis enim consequat sed. Curabitur ante nisi, posuere vitae velit et, posuere laoreet lectus.
                    <ul class="payment-faqs__payment-methods">
                        <li class="payment-faqs__payment-method"><img class="payment-method payment-method--visa" src="/assets/images/payment-method-visa.png" alt="">
                        </li>
                        <li class="payment-faqs__payment-method"><img class="payment-method payment-method--mastercard" src="/assets/images/payment-method-mastercard.png" alt="">
                        </li>
                        <li class="payment-faqs__payment-method"><img class="payment-method payment-method--amex" src="/assets/images/payment-method-amex.png" alt="">
                        </li>
                        <li class="payment-faqs__payment-method"><img class="payment-method payment-method--discover" src="/assets/images/payment-method-discover.png" alt="">
                        </li>
                    </ul>
                </div>
            </div>
            <div class="payment-faqs__content-wrapper js-payment-faqs-content-wrapper">
                <button class="payment-faqs__control js-payment-faqs-control">
      Can We Help?
      <svg class="icon icon--arrow-up">
  <use xlink:href="/assets/icons/icons.svg#arrow-up"></use>
</svg>

      <svg class="icon icon--arrow-down">
  <use xlink:href="/assets/icons/icons.svg#arrow-down"></use>
</svg>

    </button>
                <div class="payment-faqs__content">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam elementum enim velit, id sagittis enim consequat sed. Curabitur ante nisi, posuere vitae velit et, posuere laoreet lectus.
                </div>
            </div>
            <div class="payment-faqs__content-wrapper js-payment-faqs-content-wrapper">
                <button class="payment-faqs__control js-payment-faqs-control">
      Conditions of Sale
      <svg class="icon icon--arrow-up">
  <use xlink:href="/assets/icons/icons.svg#arrow-up"></use>
</svg>

      <svg class="icon icon--arrow-down">
  <use xlink:href="/assets/icons/icons.svg#arrow-down"></use>
</svg>

    </button>
                <div class="payment-faqs__content">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam elementum enim velit, id sagittis enim consequat sed. Curabitur ante nisi, posuere vitae velit et, posuere laoreet lectus.
                </div>
            </div>
            <div class="payment-faqs__content-wrapper js-payment-faqs-content-wrapper">
                <button class="payment-faqs__control js-payment-faqs-control">
      Free Shipping and Returns
      <svg class="icon icon--arrow-up">
  <use xlink:href="/assets/icons/icons.svg#arrow-up"></use>
</svg>

      <svg class="icon icon--arrow-down">
  <use xlink:href="/assets/icons/icons.svg#arrow-down"></use>
</svg>

    </button>
                <div class="payment-faqs__content">
                    Lorem ipsum dolor sit amet, consectetur adipiscing elit. Etiam elementum enim velit, id sagittis enim consequat sed. Curabitur ante nisi, posuere vitae velit et, posuere laoreet lectus.
                </div>
            </div>
        </div>

    </div>
    <div class="l-collected-components l-collected-components--shopping-cart--maui-jim">
        Handle: <code>@shopping-cart--maui-jim</code>
        <div class="shopping-cart js-shopping-cart">
            <h1 class="shopping-cart__title">Your Cart</h1>
            <table class="shopping-cart__items">
                <thead class="shopping-cart__items-header">
                    <tr class="shopping-cart__items-header-row">
                        <td class="shopping-cart__items-header-cell shopping-cart__items-header-cell--image">Image</td>
                        <td class="shopping-cart__items-header-cell shopping-cart__items-header-cell--items">Product Information</td>
                        <td class="shopping-cart__items-header-cell shopping-cart__items-header-cell--qty">Quantity</td>
                        <td class="shopping-cart__items-header-cell shopping-cart__items-header-cell--total">Total</td>
                    </tr>
                </thead>
                <tbody class="shopping-cart__items-body">
                    <tr class="shopping-cart__item ">
                        <td class="shopping-cart__item-image-col">
                            <a href="#202-02"><img class="shopping-cart__item-image" src="https://mauijim.scene7.com/is/image/mauijim/202-02_front?$config1800$&amp;wid&#x3D;225" alt="Gloss Black"></a>
                        </td>
                        <td class="shopping-cart__item-info-col">
                            <span class="shopping-cart__item-name">PEAHI</span>
                            <span class="shopping-cart__item-info"><strong>Frame:</strong> Gloss Black</span>
                            <span class="shopping-cart__item-info"><strong>Lens:</strong> Neutral Grey</span>
                            <span class="shopping-cart__item-info"><strong>Lens Material:</strong> SuperThin Glass</span>
                            <span class="shopping-cart__item-info"><strong>Gradient:</strong> Single Gradient</span>
                            <span class="shopping-cart__item-info"><strong>SKU:</strong> 202-02</span>
                        </td>
                        <td class="shopping-cart__item-qty-col">
                            <div class="shopping-cart__item-qty">
                                <div class="form-item form-item--select">
                                    <div class="select-wrapper">
                                        <label for="" class="label">
    
    <select id="" name="shopping-cart-qty" class="select js-select">
      <option value="1" >1</option>
      <option value="2" >2</option>
      <option value="3" >3</option>
      <option value="4" >4</option>
      <option value="5" >5</option>
    </select>
    </label>
                                    </div>
                                </div>

                            </div>
                        </td>
                        <td class="shopping-cart__item-total-col">
                            <div class="shopping-cart__item-vip-info">
                                <span class="shopping-cart__item-vip-card-value"> </span>
                                <span class="shopping-cart__item-vip-original-price"></span>
                            </div>
                            <span class="shopping-cart__item-price">$149.00</span>
                            <span class="shopping-cart__item-tax">Inkl. MWST</span>
                            <button class="shopping-cart__item-remove button button--plain-text">Remove</button>
                        </td>
                    </tr>
                    <tr class="shopping-cart__item ">
                        <td class="shopping-cart__item-image-col">
                            <a href="#HTS267-15C"><img class="shopping-cart__item-image" src="https://s7d2.scene7.com/is/image/mauijim/HTS267-15C_front?$config1800$&amp;wid&#x3D;225" alt="Olive Stripe"></a>
                        </td>
                        <td class="shopping-cart__item-info-col">
                            <span class="shopping-cart__item-name">WATERWAYS</span>
                            <span class="shopping-cart__item-info"><strong>Frame:</strong> Olive Stripe</span>
                            <span class="shopping-cart__item-info"><strong>Lens:</strong> Maui HT™</span>
                            <span class="shopping-cart__item-info"><strong>Lens Material:</strong> SuperThin Glass</span>
                            <span class="shopping-cart__item-info"><strong>Gradient:</strong> Single Gradient</span>
                            <span class="shopping-cart__item-info"><strong>SKU:</strong> HTS267-15C</span>
                        </td>
                        <td class="shopping-cart__item-qty-col">
                            <div class="shopping-cart__item-qty">
                                <div class="form-item form-item--select">
                                    <div class="select-wrapper">
                                        <label for="" class="label">
    
    <select id="" name="shopping-cart-qty" class="select js-select">
      <option value="1" >1</option>
      <option value="2" >2</option>
      <option value="3" >3</option>
      <option value="4" >4</option>
      <option value="5" >5</option>
    </select>
    </label>
                                    </div>
                                </div>

                            </div>
                        </td>
                        <td class="shopping-cart__item-total-col">
                            <div class="shopping-cart__item-vip-info">
                                <span class="shopping-cart__item-vip-card-value">VIP Card 30%</span>
                                <span class="shopping-cart__item-vip-original-price">$319.00</span>
                            </div>
                            <span class="shopping-cart__item-price">$219.00</span>
                            <span class="shopping-cart__item-tax">Inkl. MWST</span>
                            <button class="shopping-cart__item-remove button button--plain-text">Remove</button>
                        </td>
                    </tr>
                    <tr class="shopping-cart__item ">
                        <td class="shopping-cart__item-image-col">
                            <a href="#H257-16C"><img class="shopping-cart__item-image" src="https://s7d2.scene7.com/is/image/mauijim/H257-16C_front?$config1800$&amp;wid&#x3D;225" alt="Tortoise with Antique Gold"></a>
                        </td>
                        <td class="shopping-cart__item-info-col">
                            <span class="shopping-cart__item-name">KAWIKA</span>
                            <span class="shopping-cart__item-info"><strong>Frame:</strong> Tortoise with Antique Gold</span>
                            <span class="shopping-cart__item-info"><strong>Lens:</strong> HCL® Bronze</span>
                            <span class="shopping-cart__item-info"><strong>Lens Material:</strong> MauiPure</span>
                            <span class="shopping-cart__item-info"><strong>Gradient:</strong> Single Gradient</span>
                            <span class="shopping-cart__item-info"><strong>SKU:</strong> H257-16C</span>
                        </td>
                        <td class="shopping-cart__item-qty-col">
                            <div class="shopping-cart__item-qty">
                                <div class="form-item form-item--select">
                                    <div class="select-wrapper">
                                        <label for="" class="label">
    
    <select id="" name="shopping-cart-qty" class="select js-select">
      <option value="1" >1</option>
      <option value="2" >2</option>
      <option value="3" >3</option>
      <option value="4" >4</option>
      <option value="5" >5</option>
    </select>
    </label>
                                    </div>
                                </div>

                            </div>
                        </td>
                        <td class="shopping-cart__item-total-col">
                            <div class="shopping-cart__item-vip-info">
                                <span class="shopping-cart__item-vip-card-value">VIP Card 30%</span>
                                <span class="shopping-cart__item-vip-original-price">$319.00</span>
                            </div>
                            <span class="shopping-cart__item-price">$299.00</span>
                            <span class="shopping-cart__item-tax"></span>
                            <button class="shopping-cart__item-remove button button--plain-text">Remove</button>
                        </td>
                    </tr>
                    <tr class="shopping-cart__item shopping-cart__item--extra shopping-cart__item--gift-bag js-shopping-cart-item-gift-bag">
                        <td colspan="2">
                            <div class="shopping-cart__item-toggle">
                                <div class="form-item form-item--checkbox">
                                    <input type="checkbox" id="shopping-cart-gift-bag" name="gift-bag" class="checkbox checkbox--default">
                                    <label for="shopping-cart-gift-bag">
                Add Gift Bag
                <svg class="icon icon--gift-bag">
  <use xlink:href="/assets/icons/icons.svg#gift-bag"></use>
</svg>

              </label>
                                </div>
                            </div>
                        </td>
                        <td class="shopping-cart__item-qty-col">
                            <div class="shopping-cart__item-qty">
                                <div class="form-item form-item--select">
                                    <div class="select-wrapper">
                                        <label for="shopping-cart-gift-bag" class="label">
    
    <select id="shopping-cart-gift-bag" name="shopping-cart-gift-bag" class="select js-select">
      <option value="1" >1</option>
      <option value="2" >2</option>
      <option value="3" >3</option>
    </select>
    </label>
                                    </div>
                                </div>

                            </div>
                        </td>
                        <td class="shopping-cart__item-price-col">
                            <span class="shopping-cart__item-price">$3.99</span>
                        </td>
                    </tr>
                </tbody>
            </table>
            <table class="shopping-cart__items-subtotal">
                <tfoot>
                    <tr>
                        <td class="shopping-cart__items-footer-cell" colspan="2">
                        </td>
                        <td class="shopping-cart__items-footer-cell" colspan="2">
                            <ul class="shopping-cart__totals">
                                <li class="shopping-cart__totals-item">
                                    <span class="shopping-cart__totals-label">
                Order Subtotal (4)
              </span>
                                    <span class="shopping-cart__totals-value">
                  $1096.00
              </span>
                                </li>
                                <li class="shopping-cart__totals-item">
                                    <span class="shopping-cart__totals-label">
                Estimated Tax*
              </span>
                                    <span class="shopping-cart__totals-value">
                  TBD
              </span>
                                </li>
                                <li class="shopping-cart__totals-item">
                                    <span class="shopping-cart__totals-label">
                Shipping*
              </span>
                                    <span class="shopping-cart__totals-value">
                  TBD
              </span>
                                </li>
                                <li class="shopping-cart__totals-item">
                                    <span class="shopping-cart__totals-label shopping-cart__totals-label--tbd">
                * Calculated at Checkout
              </span>
                                </li>
                            </ul>
                        </td>
                    </tr>
                </tfoot>
            </table>
            <button class="gift-card-form-toggle js-shopping-cart-item-gift-card" type="button" aria-expanded="false">Have a Gift Card or VIP Card?</button>
            <form class="gift-card-apply-form js-gift-card-apply-form" aria-hidden="true">
                <div class="gift-card-apply-form__item gift-card-apply-form__item--number">
                    <div class="form-item form-item--text form-item--gift-card-apply-gift-card-number">
                        <label for="gift-card-apply-gift-card-number" class="label label--text">
  Card Number
  <input type="text"  name="gift-card-number" class="input input--text" >
  </label>
                    </div>

                </div>
                <div class="gift-card-apply-form__item gift-card-apply-form__item--pin">
                    <div class="form-item form-item--text form-item--gift-card-apply-gift-card-pin">
                        <label for="gift-card-apply-gift-card-pin" class="label label--text">
  Pin
  <input type="text"  name="gift-card-pin" class="input input--text" >
  </label>
                    </div>

                </div>
                <div class="gift-card-apply-form__submit">
                    <button class="button button--outlined">Apply</button>

                </div>
            </form>
            <table class="shopping-cart__items-footer">
                <tr>
                    <td class="shopping-cart__items-footer-cell" colspan="2">
                        <ul class="shopping-cart__totals">
                            <li class="shopping-cart__totals-item">
                                <span class="shopping-cart__totals-label">Order Subtotal (4):</span>
                                <span class="shopping-cart__totals-value">
              $1096.00
          </span>
                            </li>
                            <li class="shopping-cart__totals-item">
                                <span class="shopping-cart__totals-label">Estimated Tax*:</span>
                                <span class="shopping-cart__totals-value">
              TBD
          </span>
                            </li>
                            <li class="shopping-cart__totals-item">
                                <span class="shopping-cart__totals-label">Shipping*:</span>
                                <span class="shopping-cart__totals-value">
              TBD
          </span>
                            </li>
                            <li class="shopping-cart__totals-item">
                                <span class="shopping-cart__totals-label shopping-cart__totals-label--tbd">* Calculated at Checkout</span>
                            </li>
                            <li class="shopping-cart__totals-item shopping-cart__totals-item--total">
                                <span class="shopping-cart__totals-label">Total:</span>
                                <span class="shopping-cart__totals-value">$799.99</span>
                            </li>
                        </ul>
                        <div class="shopping-cart__totals-item__checkout">
                            <button class="button button--primary shopping-cart__checkout">Checkout</button>
                            <div class="shopping-cart__applied-gift">
                                <div class="shopping-cart__applied-gift-item">
                                    <form class="shopping-cart__applied-gift-info">
                                        <span class="shopping-cart__applied-gift-info-label">VIP Card Applied: </span>
                                        <span class="shopping-cart__applied-gift-info-value">12345678901234567890</span>
                                        <button class="button button--plain-text">Remove</button>

                                    </form>
                                </div>
                                <div class="shopping-cart__applied-gift-item">
                                    <form class="shopping-cart__applied-gift-info">
                                        <span class="shopping-cart__applied-gift-info-label">Gift Card Applied: </span>
                                        <span class="shopping-cart__applied-gift-info-value">12345678901234567890</span>
                                        <button class="button button--plain-text">Remove</button>

                                    </form>
                                </div>
                            </div>
                        </div>
                    </td>
                </tr>
            </table>

        </div>

    </div>
    <div class="l-collected-components l-collected-components--shopping-cart--maui-jim--empty">
        Handle: <code>@shopping-cart--maui-jim--empty</code>
        <div class="shopping-cart js-shopping-cart">
            <h1 class="shopping-cart__title">Your Cart</h1>
            <div class="shopping-cart__empty">
                <img class="shopping-cart__empty-brand-logo" src="/assets/images/mauijim-brand-mark-grey-small.png">
                <span class="shopping-cart__empty-label">Your Shopping Cart is Empty</span>
                <a class="shopping-cart__empty-button button button--primary">Shop Now</a>
            </div>
        </div>

    </div>
</main>
{{#if header}}
{{render (dynamicComponent header)}}
{{/if}}
<main id="main-section" class="main main--collected-components">
  {{#each components}}
  <div class="l-collected-components l-collected-components--{{component}}{{#each modifiers}} l-collected-components--{{this}}{{/each}}">
    Handle: <code>@{{component}}</code>
    {{render (dynamicComponent component) context merge=true}}
  </div>
  {{/each}}
</main>
{{#if footer}}
{{render '@subscribe'}}
{{render (dynamicComponent footer)}}
{{/if}}
{
  "snapshot": true,
  "pageCss": [
    "checkout"
  ],
  "components": [
    {
      "component": "paragraph",
      "context": {
        "value": "This page collects checkout components for snapshot testing.",
        "classes": [
          "u-text-center"
        ]
      }
    },
    {
      "component": "checkout-express"
    },
    {
      "component": "checkout-cart--default"
    },
    {
      "component": "checkout-cart--repairs"
    },
    {
      "component": "confirmation-details"
    },
    {
      "component": "confirmation-products--default"
    },
    {
      "component": "confirmation-products--repairs"
    },
    {
      "component": "confirmation-return-instructions"
    },
    {
      "component": "confirmation-summary--default"
    },
    {
      "component": "confirmation-summary--wide"
    },
    {
      "component": "confirmation-thanks"
    },
    {
      "component": "payment-faqs"
    },
    {
      "component": "shopping-cart--maui-jim"
    },
    {
      "component": "shopping-cart--maui-jim--empty"
    }
  ]
}
  • Content:
    .l-collected-components {
      position: relative;
      margin: 2rem 0;
      padding: 2rem 0;
    
      & + &::before {
        position: absolute;
        top: 0;
        left: 50%;
        width: 100vw;
        height: .1rem;
        margin-left: -50vw;
        background-color: $color-light;
        content: '';
      }
    
      &--narrow {
        max-width: 50rem;
        margin-right: auto;
        margin-left: auto;
      }
    }
    
  • URL: /components/raw/collected-components/collected-components.scss
  • Filesystem Path: src/components/03-pages/collected-components/collected-components.scss
  • Size: 363 Bytes

There are no notes for this item.