{**
 * 2007-2019 PrestaShop and Contributors
 *
 * NOTICE OF LICENSE
 *
 * This source file is subject to the Academic Free License 3.0 (AFL-3.0)
 * that is bundled with this package in the file LICENSE.txt.
 * It is also available through the world-wide-web at this URL:
 * https://opensource.org/licenses/AFL-3.0
 * If you did not receive a copy of the license and are unable to
 * obtain it through the world-wide-web, please send an email
 * to license@prestashop.com so we can send you a copy immediately.
 *
 * DISCLAIMER
 *
 * Do not edit or add to this file if you wish to upgrade PrestaShop to newer
 * versions in the future. If you wish to customize PrestaShop for your
 * needs please refer to https://www.prestashop.com for more information.
 *
 * @author    PrestaShop SA <contact@prestashop.com>
 * @copyright 2007-2019 PrestaShop SA and Contributors
 * @license   https://opensource.org/licenses/AFL-3.0 Academic Free License 3.0 (AFL-3.0)
 * International Registered Trademark & Property of PrestaShop SA
 *}
{extends file=$layout}

{block name='content'}
  <section id="main" class="flex flex-col gap-4">

    {block name='product_list_header'}
      <h2 id="js-product-list-header" class="h2">{$listing.label}</h2>
    {/block}

    <section id="products" class="flex flex-col gap-8">
      {if $listing.products|count}

        {block name='product_list_top'}
          {include file='catalog/_partials/products-top.tpl' listing=$listing}
        {/block}

        {block name='product_list'}
          {include file='catalog/_partials/products.tpl' listing=$listing}
        {/block}

        {block name='product_list_bottom'}
          {include file='catalog/_partials/products-bottom.tpl' listing=$listing}
        {/block}

      {else}
        <div id="js-product-list-top"></div>

        <div id="js-product-list">
          {include file='errors/not-found.tpl'}
        </div>

        <div id="js-product-list-bottom"></div>
      {/if}
    </section>
  </section>
  
  <div class="mx-auto my-24 flex items-center relative">
      <img src="/themes/elegance/assets/images/img2.jpg" 
           class="h-full w-full">
      <div class="absolute xl:px-40 lg:px-20 md:px-12 px-2">
          <h1 class="xl:text-6xl lg:text-4xl md:text-3xl text-sm lg:font-bold font-bold">
            How to measure 
          </h1>
          <p class="lg:text-xl md:text-lg text-xs lg:font-semibold font-medium lg:w-96 md:w-80 w-36 lg:pt-4 pt-2">
            Ten minutes is all it should take if you follow our simple step by step directions.
          </p>
      </div>
  </div>

  <div class="mx-auto lg:my-60 md:my-28 my-24 flex flex-col items-center">
    <h1 class="font-bold lg:text-4xl md:text-xl text-lg font-bold text-center">
      Our precise measuring system ensures your custom garment requirements are perfected.
    </h1>
    <p class="lg:pt-12 md:pt-9 pt-6 lg:w-8/12 w-10/12 text-center lg:text-xl md:text-lg
              text-sm lg:font-semibold font-medium">
       Your measurements are utilized by Brooks Bingham to create a tailored profile using advanced technology. 
       Each model undergoes thorough review and adjustment by our master tailors in our design studio. 
       Just follow each step, and your measurements will be perfect.
    </p>
  </div>

  <div class="flex md:flex-row justify-start mx-4 mt-24 mb-20 flex-col">
    <div class="xl:w-1/2 lg:w-3/5 w-full">
      <img src="/themes/elegance/assets/images/img3.jpg"
           class="image object-cover">
    </div>
    <div class="mx-4 w-full text-center md:text-left">
      <h1 class="font-bold xl:text-3xl lg:text-xl text-lg">
        Waist Circumference
      </h1>
      <p class="md:font-medium font-base xl:text-lg lg:text-sm text-xs pt-4">
         Place soft ruler along the customer's waist along the amount of a week, 
         two fingers in the soft ruler shall prevail, the combined point on the right side. 
         (For convex belly or fat customers, we should let the customer take a breath to record the data size) 
         (If it is all rubber waist, please subtract 10-15cm in the net body data) 
      </p>
      <h3 class="font-medium xl:text-lg lg:text-lg text-xs xl:pt-12 pt-4">
        Suggested Measurement: >40 inches (120cm)
      </h3>
    </div>
  </div>

  
  <div class="flex md:flex-row justify-start mx-4 mb-20 flex-col">
    <div class="xl:w-1/2 lg:w-3/5 w-full">
      <img src="/themes/elegance/assets/images/img3.jpg"
           class="image object-cover">
    </div>
    <div class="mx-4 w-full text-center md:text-left">
      <h1 class="font-bold xl:text-3xl lg:text-xl text-lg">
        Hip Circumference
      </h1>
      <p class="md:font-medium font-base xl:text-lg lg:text-sm text-xs pt-4">
         When measuring, let the customer's stand up and take out all the things of the pocket. 
         Half squat, find the most full part of the hip. Measure horizontally along the full ump 
         for a round and can add 1-2cm to that basis data.      
      </p>
      <h3 class="font-medium xl:text-lg lg:text-lg text-xs xl:pt-12 pt-4">
        Suggested Measurement: 37-39 inches (94-99cm)
      </h3>
    </div>
  </div>


  <div class="flex md:flex-row justify-start mx-4 mb-20 flex-col">
    <div class="xl:w-1/2 lg:w-3/5 w-full">
      <img src="/themes/elegance/assets/images/img3.jpg"
           class="image object-cover">
    </div>
    <div class="mx-4 w-full text-center md:text-left">
      <h1 class="font-bold xl:text-3xl lg:text-xl text-lg">
        Thigh Circumference
      </h1>
      <p class="md:font-medium font-base xl:text-lg lg:text-sm text-xs pt-4">
         Horizontally measure the fullest part of the thigh horizontally for a round, 
         and two fingers in the soft ruler shall prevail, neither loose nor tight, 
         (the joint point is on the right side).      
      </p>
      <h3 class="font-semibold xl:text-lg lg:text-lg text-xs xl:pt-12 pt-4">
        Suggested Measurement: 20-24 inches (51-61cm)
      </h3>
    </div>
  </div>


  <div class="flex md:flex-row justify-start mx-4 mb-20 flex-col">
    <div class="xl:w-1/2 lg:w-3/5 w-full">
      <img src="/themes/elegance/assets/images/img3.jpg"
           class="image object-cover">
    </div>
    <div class="mx-4 w-full text-center md:text-left">
      <h1 class="font-bold xl:text-3xl lg:text-xl text-lg">
        Crotch
      </h1>
      <p class="md:font-medium font-base xl:text-lg lg:text-sm text-xs pt-4">
         Soft rule from the waist high point through the crotch to the waist high point, 
         not loose or tight. (To have the action of lifting the ruler)
      </p>
      <h3 class="font-semibold xl:text-lg lg:text-lg text-xs xl:pt-12 pt-4">
        Suggested Measurement: 34-36 inches (86-91cm)
      </h3>
    </div>
  </div>

  
  <div class="flex md:flex-row justify-start mx-4 mb-20 flex-col">
    <div class="xl:w-1/2 lg:w-3/5 w-full">
      <img src="/themes/elegance/assets/images/img3.jpg"
           class="image object-cover">
    </div>
    <div class="mx-4 w-full text-center md:text-left">
      <h1 class="font-bold xl:text-3xl lg:text-xl text-lg">
        Knee Circumference
      </h1>
      <p class="md:font-medium font-base xl:text-lg lg:text-sm text-xs pt-4">
         Measure horizontally around the knee for a week, the man put 1 finger, 
         the woman does not put the fingers. (When measuring knee circumference, 
         certain contrast measures crus circumference, the size of knee circumference 
         and crus circumference which larger we take the size of which part)      
      </p>
      <h3 class="font-semibold xl:text-lg lg:text-lg text-xs xl:pt-12 pt-4">
        Suggested Measurement: 15-17 inches (38-43cm)
      </h3>
    </div>
  </div>


  <div class="flex md:flex-row justify-start mx-4 mb-20 flex-col">
    <div class="xl:w-1/2 lg:w-3/5 w-full">
      <img src="/themes/elegance/assets/images/img3.jpg"
           class="image object-cover">
    </div>
    <div class="mx-4 w-full text-justify md:text-left">
      <h1 class="font-bold xl:text-3xl lg:text-xl text-lg md:text-left text-center">
        Bottom Circumference
      </h1>
      <p class="md:font-medium font-base xl:text-lg lg:text-sm text-xs pt-3">
         Adjust according to the customer's request.
         Measuring for the finished clothes (ready- wear-size):<br>
         1.Female straight jeans: bottom circumference net size minus 2 cm<br>
         2.Boot cut jeans: bottom circumference size add 4-5 cm <br>
         3.Wide-leg jeans: bottom circumference net size minus 3-4 cm <br> 
         4.Flare jeans: bottom circumference net size plus 5 cm  <br>
         5.Pants: measure tightly      
      </p>
      <h3 class="font-semibold xl:text-lg lg:text-lg text-xs xl:pt-8 pt-4 md:text-left text-center">
        Suggested Measurement: 15-17 inches (38-43cm)
      </h3>
    </div>
  </div>


  <div class="flex md:flex-row justify-start mx-4 mb-20 flex-col">
    <div class="xl:w-1/2 lg:w-3/5 w-full">
      <img src="/themes/elegance/assets/images/img3.jpg"
           class="image object-cover">
    </div>
    <div class="mx-4 w-full text-center md:text-left">
      <h1 class="font-bold xl:text-3xl lg:text-xl text-lg">
        Length Circumference
      </h1>
      <p class="md:font-medium font-base xl:text-lg lg:text-sm text-xs pt-4">
         From the waist, along the side seam of the pants, the normal data is the measurement minus 1-2 cm.
      </p>
      <h3 class="font-semibold xl:text-lg lg:text-lg text-xs xl:pt-12 pt-4">
        Suggested Measurement: 30-36 inches (76-91cm)
      </h3>
    </div>
  </div>

{/block}

