"use client";
import Link from "next/link";
import shopProductImg9 from "../../../public/assets/images/shop/product-9.png";
import shopProductImg8 from "../../../public/assets/images/shop/product-8.png";

function CheckOut() {
  return (
    <div>
      <section className="checkout-page">
        <div className="container">
          <div className="row">
            <div className="col-lg-8 col-md-12 col-sm-12">
              <form
                action="#"
                className="checkout contact-page__form-box contact-form-validated"
              >
                <div className="contact-details checkout-row">
                  <div className="contact-title">
                    <h3>Contact</h3>
                    <p>
                      Have an account ?
                      <Link href="#" className="login">
                        Log in
                      </Link>
                    </p>
                  </div>
                  <input
                    type="text"
                    placeholder="Email or mobile phone number"
                    id="name-8e54"
                    name="name-1"
                    className="input-text"
                    required=""
                  />
                  <input
                    type="checkbox"
                    className="contact-checkbox"
                    id="checkbox-123"
                    required=""
                  />
                  <label
                    htmlFor="checkbox-123"
                    className="contact-checkbox-label"
                  >
                    Email me with news and offers
                  </label>
                </div>
                <div className="delivery-details checkout-row">
                  <div className="delivery-title">
                    <h3>Delivery</h3>
                  </div>
                  <select
                    name="country"
                    className=" input-text selectpicker"
                    data-show-subtext="false"
                    data-live-search="true"
                  >
                    <option value="Afghanistan">Afghanistan</option>
                    <option value="Albania">Albania</option>
                    <option value="Algeria">Algeria</option>
                    <option value="American Samoa">American Samoa</option>
                    <option value="Andorra">Andorra</option>
                    <option value="Angola">Angola</option>
                    <option value="Anguilla">Anguilla</option>
                    <option value="Antigua Barbuda">Antigua Barbuda</option>
                    <option value="Argentina">Argentina</option>
                    <option value="Armenia">Armenia</option>
                    <option value="Aruba">Aruba</option>
                    <option value="Australia">Australia</option>
                    <option value="Austria">Austria</option>
                    <option value="Azerbaijan">Azerbaijan</option>
                    <option value="Bahamas">Bahamas</option>
                    <option value="Bahrain">Bahrain</option>
                    <option value="Bangladesh">Bangladesh</option>
                    <option value="Barbados">Barbados</option>
                    <option value="Belarus">Belarus</option>
                    <option value="Belgium">Belgium</option>
                    <option value="Belize">Belize</option>
                    <option value="Benin">Benin</option>
                    <option value="Bermuda">Bermuda</option>
                    <option value="Bhutan">Bhutan</option>
                    <option value="Bolivia">Bolivia</option>
                    <option value="Bonaire">Bonaire</option>
                    <option value="Bosnia Herzegovina">
                      Bosnia Herzegovina
                    </option>
                    <option value="Botswana">Botswana</option>
                    <option value="Brazil">Brazil</option>
                    <option value="Brunei">Brunei</option>
                    <option value="Bulgaria">Bulgaria</option>
                    <option value="Burundi">Burundi</option>
                    <option value="Cambodia">Cambodia</option>
                    <option value="Cameroon">Cameroon</option>
                    <option value="Canada">Canada</option>
                    <option value="Central African">Central African</option>
                    <option value="Chad">Chad</option>
                    <option value="Chile">Chile</option>
                    <option value="China">China</option>
                    <option value="Colombia">Colombia</option>
                    <option value="Comoros">Comoros</option>
                    <option value="Congo">Congo</option>
                    <option value="Croatia">Croatia</option>
                    <option value="Cuba">Cuba</option>
                    <option value="Curacao">Curacao</option>
                    <option value="Cyprus">Cyprus</option>
                    <option value="Czech">Czech</option>
                    <option value="Denmark">Denmark</option>
                    <option value="Djibouti">Djibouti</option>
                    <option value="Dominica">Dominica</option>
                    <option value="East Timor">East Timor</option>
                    <option value="Ecuador">Ecuador</option>
                    <option value="Egypt">Egypt</option>
                    <option value="Eritrea">Eritrea</option>
                    <option value="Estonia">Estonia</option>
                    <option value="Ethiopia">Ethiopia</option>
                    <option value="Finland">Finland</option>
                    <option value="France">France</option>
                    <option value="Gabon">Gabon</option>
                    <option value="Gambia">Gambia</option>
                    <option value="Georgia">Georgia</option>
                    <option value="Germany">Germany</option>
                    <option value="Ghana">Ghana</option>
                    <option value="Gibraltar">Gibraltar</option>
                    <option value="Greece">Greece</option>
                    <option value="Greenland">Greenland</option>
                    <option value="Grenada">Grenada</option>
                    <option value="Guadeloupe">Guadeloupe</option>
                    <option value="Guam">Guam</option>
                    <option value="Guatemala">Guatemala</option>
                    <option value="Guinea">Guinea</option>
                    <option value="Guyana">Guyana</option>
                    <option value="Haiti">Haiti</option>
                    <option value="Hawaii">Hawaii</option>
                    <option value="Honduras">Honduras</option>
                    <option value="Hongkong">Hongkong</option>
                    <option value="Hungary">Hungary</option>
                    <option value="Iceland">Iceland</option>
                    <option value="Indonesia">Indonesia</option>
                    <option value="India">India</option>
                    <option value="Iran">Iran</option>
                    <option value="Iraq">Iraq</option>
                    <option value="Ireland">Ireland</option>
                    <option value="Israel">Israel</option>
                    <option value="Italy">Italy</option>
                    <option value="Jamaica">Jamaica</option>
                    <option value="Japan">Japan</option>
                    <option value="Jordan">Jordan</option>
                    <option value="Kazakhstan">Kazakhstan</option>
                    <option value="Kenya">Kenya</option>
                    <option value="Kiribati">Kiribati</option>
                    <option value="Korea North">Korea North</option>
                    <option value="Korea South">Korea South</option>
                    <option value="Kuwait">Kuwait</option>
                    <option value="Kyrgyzstan">Kyrgyzstan</option>
                    <option value="Laos">Laos</option>
                    <option value="Latvia">Latvia</option>
                    <option value="Lebanon">Lebanon</option>
                    <option value="Lesotho">Lesotho</option>
                    <option value="Liberia">Liberia</option>
                    <option value="Libya">Libya</option>
                    <option value="Liechtenstein">Liechtenstein</option>
                    <option value="Lithuania">Lithuania</option>
                    <option value="Luxembourg">Luxembourg</option>
                    <option value="Macau">Macau</option>
                    <option value="Macedonia">Macedonia</option>
                    <option value="Madagascar">Madagascar</option>
                    <option value="Malaysia">Malaysia</option>
                    <option value="Malawi">Malawi</option>
                    <option value="Maldives">Maldives</option>
                    <option value="Mali">Mali</option>
                    <option value="Malta">Malta</option>
                    <option value="Martinique">Martinique</option>
                    <option value="Mauritania">Mauritania</option>
                    <option value="Mauritius">Mauritius</option>
                    <option value="Mayotte">Mayotte</option>
                    <option value="Mexico">Mexico</option>
                    <option value="Moldova">Moldova</option>
                    <option value="Monaco">Monaco</option>
                    <option value="Mongolia">Mongolia</option>
                    <option value="Montserrat">Montserrat</option>
                    <option value="Morocco">Morocco</option>
                    <option value="Mozambique">Mozambique</option>
                    <option value="Myanmar">Myanmar</option>
                    <option value="Namibia">Namibia</option>
                    <option value="Nauru">Nauru</option>
                    <option value="Nepal">Nepal</option>
                    <option value="Netherlands">Netherlands</option>
                    <option value="Nevis">Nevis</option>
                    <option value="New Caledonia">New Caledonia</option>
                    <option value="New York">New York</option>
                    <option value="New Zealand">New Zealand</option>
                    <option value="Nicaragua">Nicaragua</option>
                    <option value="Niger">Niger</option>
                    <option value="Nigeria">Nigeria</option>
                    <option value="Norway">Norway</option>
                    <option value="Oman">Oman</option>
                    <option value="Pakistan">Pakistan</option>
                    <option value="Palestine">Palestine</option>
                    <option value="Panama">Panama</option>
                    <option value="Papua New Guinea">Papua New Guinea</option>
                    <option value="Paraguay">Paraguay</option>
                    <option value="Peru">Peru</option>
                    <option value="Philippines">Philippines</option>
                    <option value="Poland">Poland</option>
                    <option value="Portugal">Portugal</option>
                    <option value="Puerto Rico">Puerto Rico</option>
                    <option value="Qatar">Qatar</option>
                    <option value="Montenegro">Montenegro</option>
                    <option value="Serbia">Serbia</option>
                    <option value="Reunion">Reunion</option>
                    <option value="Romania">Romania</option>
                    <option value="Russia">Russia</option>
                    <option value="Rwanda">Rwanda</option>
                    <option value="Saipan">Saipan</option>
                    <option value="Samoa">Samoa</option>
                    <option value="Saudi Arabia">Saudi Arabia</option>
                    <option value="Senegal">Senegal</option>
                    <option value="Seychelles">Seychelles</option>
                    <option value="Sierra Leone">Sierra Leone</option>
                    <option value="Singapore">Singapore</option>
                    <option value="Slovakia">Slovakia</option>
                    <option value="Slovenia">Slovenia</option>
                    <option value="Solomon">Solomon</option>
                    <option value="Somalia">Somalia</option>
                    <option value="South Africa">South Africa</option>
                    <option value="Spain">Spain</option>
                    <option value="Sri Lanka">Sri Lanka</option>
                    <option value="Sudan">Sudan</option>
                    <option value="Suriname">Suriname</option>
                    <option value="Swaziland">Swaziland</option>
                    <option value="Sweden">Sweden</option>
                    <option value="Switzerland">Switzerland</option>
                    <option value="Syria">Syria</option>
                    <option value="Tahiti">Tahiti</option>
                    <option value="Taiwan">Taiwan</option>
                    <option value="Tajikistan">Tajikistan</option>
                    <option value="Tanzania">Tanzania</option>
                    <option value="Thailand">Thailand</option>
                    <option value="Togo">Togo</option>
                    <option value="Tonga">Tonga</option>
                    <option value="Tunisia">Tunisia</option>
                    <option value="Turkey">Turkey</option>
                    <option value="Turkmenistan">Turkmenistan</option>
                    <option value="Tuvalu">Tuvalu</option>
                    <option value="Uganda">Uganda</option>
                    <option value="United Kingdom">United Kingdom</option>
                    <option value="Ukraine">Ukraine</option>
                    <option value="United Arab Emirates">
                      United Arab Emirates
                    </option>
                    <option value="United States America">
                      United States America
                    </option>
                    <option value="Uruguay">Uruguay</option>
                    <option value="Uzbekistan">Uzbekistan</option>
                    <option value="Vanuatu">Vanuatu</option>
                    <option value="Vatican">Vatican</option>
                    <option value="Venezuela">Venezuela</option>
                    <option value="Vietnam">Vietnam</option>
                    <option value="Yemen">Yemen</option>
                    <option value="Zaire">Zaire</option>
                    <option value="Zambia">Zambia</option>
                    <option value="Zimbabwe">Zimbabwe</option>
                  </select>
                  <div className="row">
                    <div className="col-lg-6 col-md-6 col-sm-12">
                      <input
                        type="text"
                        placeholder="First name (optional)"
                        name="text"
                        className="input-text"
                        required=""
                      />
                    </div>
                    <div className="col-lg-6 col-md-6 col-sm-12">
                      <input
                        type="text"
                        placeholder="Last name (optional)"
                        name="text"
                        className="input-text"
                        required=""
                      />
                    </div>
                  </div>
                  <input
                    type="text"
                    placeholder="Address"
                    name="Address"
                    className="input-text"
                    required=""
                  />
                </div>
                <div className="add-apartment-details checkout-row">
                  <div className="add-apartment-title">
                    <h3>Add apartment, suite ,ete</h3>
                  </div>
                  <div className="row">
                    <div className="col-lg-4 col-md-4 col-sm-4 col-12">
                      <input
                        type="text"
                        placeholder="City"
                        name="city"
                        className="input-text"
                        required=""
                      />
                    </div>
                    <div className="col-lg-4 col-md-4 col-sm-4 col-12">
                      <select
                        name="country"
                        className="input-text selectpicker"
                        data-show-subtext="false"
                        data-live-search="true"
                      >
                        <option value={6} disabled="">
                          State
                        </option>
                        <option value={3}>Australia</option>
                        <option value={4}>England</option>
                        <option value={6}>New Zealand</option>
                        <option value={5}>Switzerland</option>
                        <option value={1}>United Kindom (UK)</option>
                        <option value={2}>United States (USA)</option>
                      </select>
                    </div>
                    <div className="col-lg-4 col-md-4 col-sm-4 col-12">
                      <input
                        type="text"
                        placeholder="ZIP code"
                        name="ZIP-code"
                        className="input-text"
                        required=""
                      />
                    </div>
                  </div>
                  <input
                    type="checkbox"
                    className="contact-checkbox"
                    id="checkbox-456"
                    required=""
                  />
                  <label
                    htmlFor="checkbox-456"
                    className="contact-checkbox-label"
                  >
                    Save this information for next time
                  </label>
                </div>
                <div className="shipping-method checkout-row">
                  <div className="shipping-method-title">
                    <h3>Shipping method</h3>
                  </div>
                  <div className="shipping-method-text">
                    <p>
                      Sed ut perspiciatis unde omnis iste natus error sit
                      voluptatem accusantium doloremque laudantium, totam rem
                      aperiam, eaque ipsa quae ab illo inventore veritatis
                    </p>
                  </div>
                </div>
                <div className="payment-detailes">
                  <div className="payment-title">
                    <h3>Payment</h3>
                  </div>
                  <div className="payment-text">
                    <p>
                      Natus error sit voluptatem accusantium doloremque
                      laudantium totam rem aperiam
                    </p>
                  </div>
                </div>
                <div className="credit-card-box">
                  <div className="credit-card">
                    <h6>Credit card</h6>
                  </div>
                  <div className="credit-card-detaile">
                    <div className="credit-card-inner checkout-row">
                      <input
                        type="text"
                        placeholder="Card number"
                        name="card-number"
                        className="input-card-text"
                        required=""
                      />
                      <div className="row">
                        <div className="col-lg-6 col-md-12 col-sm-12">
                          <input
                            type="text"
                            placeholder="Expiration date (MM/YY)"
                            name="expiration-date"
                            className="input-card-text"
                            required=""
                          />
                        </div>
                        <div className="col-lg-6 col-md-12 col-sm-12">
                          <input
                            type="text"
                            placeholder="Security code"
                            name="security-code"
                            className="input-card-text"
                            required=""
                          />
                        </div>
                      </div>
                      <input
                        type="text"
                        placeholder="Name or card"
                        name="Name-card"
                        className="input-card-text"
                        required=""
                      />
                      <input
                        type="checkbox"
                        className="contact-checkbox"
                        id="checkbox-card"
                        required=""
                      />
                      <label
                        htmlFor="checkbox-card"
                        className="contact-checkbox-label"
                      >
                        Use shipping address as billing address
                      </label>
                    </div>
                    <div className="delivery-details checkout-row">
                      <div className="delivery-title">
                        <h3>Delivery</h3>
                      </div>
                      <select
                        name="country"
                        className="input-card-text selectpicker"
                        data-show-subtext="false"
                        data-live-search="true"
                      >
                        <option value="Afghanistan">Afghanistan</option>
                        <option value="Albania">Albania</option>
                        <option value="Algeria">Algeria</option>
                        <option value="American Samoa">American Samoa</option>
                        <option value="Andorra">Andorra</option>
                        <option value="Angola">Angola</option>
                        <option value="Anguilla">Anguilla</option>
                        <option value="Antigua Barbuda">Antigua Barbuda</option>
                        <option value="Argentina">Argentina</option>
                        <option value="Armenia">Armenia</option>
                        <option value="Aruba">Aruba</option>
                        <option value="Australia">Australia</option>
                        <option value="Austria">Austria</option>
                        <option value="Azerbaijan">Azerbaijan</option>
                        <option value="Bahamas">Bahamas</option>
                        <option value="Bahrain">Bahrain</option>
                        <option value="Bangladesh">Bangladesh</option>
                        <option value="Barbados">Barbados</option>
                        <option value="Belarus">Belarus</option>
                        <option value="Belgium">Belgium</option>
                        <option value="Belize">Belize</option>
                        <option value="Benin">Benin</option>
                        <option value="Bermuda">Bermuda</option>
                        <option value="Bhutan">Bhutan</option>
                        <option value="Bolivia">Bolivia</option>
                        <option value="Bonaire">Bonaire</option>
                        <option value="Bosnia Herzegovina">
                          Bosnia Herzegovina
                        </option>
                        <option value="Botswana">Botswana</option>
                        <option value="Brazil">Brazil</option>
                        <option value="Brunei">Brunei</option>
                        <option value="Bulgaria">Bulgaria</option>
                        <option value="Burundi">Burundi</option>
                        <option value="Cambodia">Cambodia</option>
                        <option value="Cameroon">Cameroon</option>
                        <option value="Canada">Canada</option>
                        <option value="Central African">Central African</option>
                        <option value="Chad">Chad</option>
                        <option value="Chile">Chile</option>
                        <option value="China">China</option>
                        <option value="Colombia">Colombia</option>
                        <option value="Comoros">Comoros</option>
                        <option value="Congo">Congo</option>
                        <option value="Croatia">Croatia</option>
                        <option value="Cuba">Cuba</option>
                        <option value="Curacao">Curacao</option>
                        <option value="Cyprus">Cyprus</option>
                        <option value="Czech">Czech</option>
                        <option value="Denmark">Denmark</option>
                        <option value="Djibouti">Djibouti</option>
                        <option value="Dominica">Dominica</option>
                        <option value="East Timor">East Timor</option>
                        <option value="Ecuador">Ecuador</option>
                        <option value="Egypt">Egypt</option>
                        <option value="Eritrea">Eritrea</option>
                        <option value="Estonia">Estonia</option>
                        <option value="Ethiopia">Ethiopia</option>
                        <option value="Finland">Finland</option>
                        <option value="France">France</option>
                        <option value="Gabon">Gabon</option>
                        <option value="Gambia">Gambia</option>
                        <option value="Georgia">Georgia</option>
                        <option value="Germany">Germany</option>
                        <option value="Ghana">Ghana</option>
                        <option value="Gibraltar">Gibraltar</option>
                        <option value="Greece">Greece</option>
                        <option value="Greenland">Greenland</option>
                        <option value="Grenada">Grenada</option>
                        <option value="Guadeloupe">Guadeloupe</option>
                        <option value="Guam">Guam</option>
                        <option value="Guatemala">Guatemala</option>
                        <option value="Guinea">Guinea</option>
                        <option value="Guyana">Guyana</option>
                        <option value="Haiti">Haiti</option>
                        <option value="Hawaii">Hawaii</option>
                        <option value="Honduras">Honduras</option>
                        <option value="Hongkong">Hongkong</option>
                        <option value="Hungary">Hungary</option>
                        <option value="Iceland">Iceland</option>
                        <option value="Indonesia">Indonesia</option>
                        <option value="India">India</option>
                        <option value="Iran">Iran</option>
                        <option value="Iraq">Iraq</option>
                        <option value="Ireland">Ireland</option>
                        <option value="Israel">Israel</option>
                        <option value="Italy">Italy</option>
                        <option value="Jamaica">Jamaica</option>
                        <option value="Japan">Japan</option>
                        <option value="Jordan">Jordan</option>
                        <option value="Kazakhstan">Kazakhstan</option>
                        <option value="Kenya">Kenya</option>
                        <option value="Kiribati">Kiribati</option>
                        <option value="Korea North">Korea North</option>
                        <option value="Korea South">Korea South</option>
                        <option value="Kuwait">Kuwait</option>
                        <option value="Kyrgyzstan">Kyrgyzstan</option>
                        <option value="Laos">Laos</option>
                        <option value="Latvia">Latvia</option>
                        <option value="Lebanon">Lebanon</option>
                        <option value="Lesotho">Lesotho</option>
                        <option value="Liberia">Liberia</option>
                        <option value="Libya">Libya</option>
                        <option value="Liechtenstein">Liechtenstein</option>
                        <option value="Lithuania">Lithuania</option>
                        <option value="Luxembourg">Luxembourg</option>
                        <option value="Macau">Macau</option>
                        <option value="Macedonia">Macedonia</option>
                        <option value="Madagascar">Madagascar</option>
                        <option value="Malaysia">Malaysia</option>
                        <option value="Malawi">Malawi</option>
                        <option value="Maldives">Maldives</option>
                        <option value="Mali">Mali</option>
                        <option value="Malta">Malta</option>
                        <option value="Martinique">Martinique</option>
                        <option value="Mauritania">Mauritania</option>
                        <option value="Mauritius">Mauritius</option>
                        <option value="Mayotte">Mayotte</option>
                        <option value="Mexico">Mexico</option>
                        <option value="Moldova">Moldova</option>
                        <option value="Monaco">Monaco</option>
                        <option value="Mongolia">Mongolia</option>
                        <option value="Montserrat">Montserrat</option>
                        <option value="Morocco">Morocco</option>
                        <option value="Mozambique">Mozambique</option>
                        <option value="Myanmar">Myanmar</option>
                        <option value="Namibia">Namibia</option>
                        <option value="Nauru">Nauru</option>
                        <option value="Nepal">Nepal</option>
                        <option value="Netherlands">Netherlands</option>
                        <option value="Nevis">Nevis</option>
                        <option value="New Caledonia">New Caledonia</option>
                        <option value="New York">New York</option>
                        <option value="New Zealand">New Zealand</option>
                        <option value="Nicaragua">Nicaragua</option>
                        <option value="Niger">Niger</option>
                        <option value="Nigeria">Nigeria</option>
                        <option value="Norway">Norway</option>
                        <option value="Oman">Oman</option>
                        <option value="Pakistan">Pakistan</option>
                        <option value="Palestine">Palestine</option>
                        <option value="Panama">Panama</option>
                        <option value="Papua New Guinea">
                          Papua New Guinea
                        </option>
                        <option value="Paraguay">Paraguay</option>
                        <option value="Peru">Peru</option>
                        <option value="Philippines">Philippines</option>
                        <option value="Poland">Poland</option>
                        <option value="Portugal">Portugal</option>
                        <option value="Puerto Rico">Puerto Rico</option>
                        <option value="Qatar">Qatar</option>
                        <option value="Montenegro">Montenegro</option>
                        <option value="Serbia">Serbia</option>
                        <option value="Reunion">Reunion</option>
                        <option value="Romania">Romania</option>
                        <option value="Russia">Russia</option>
                        <option value="Rwanda">Rwanda</option>
                        <option value="Saipan">Saipan</option>
                        <option value="Samoa">Samoa</option>
                        <option value="Saudi Arabia">Saudi Arabia</option>
                        <option value="Senegal">Senegal</option>
                        <option value="Seychelles">Seychelles</option>
                        <option value="Sierra Leone">Sierra Leone</option>
                        <option value="Singapore">Singapore</option>
                        <option value="Slovakia">Slovakia</option>
                        <option value="Slovenia">Slovenia</option>
                        <option value="Solomon">Solomon</option>
                        <option value="Somalia">Somalia</option>
                        <option value="South Africa">South Africa</option>
                        <option value="Spain">Spain</option>
                        <option value="Sri Lanka">Sri Lanka</option>
                        <option value="Sudan">Sudan</option>
                        <option value="Suriname">Suriname</option>
                        <option value="Swaziland">Swaziland</option>
                        <option value="Sweden">Sweden</option>
                        <option value="Switzerland">Switzerland</option>
                        <option value="Syria">Syria</option>
                        <option value="Tahiti">Tahiti</option>
                        <option value="Taiwan">Taiwan</option>
                        <option value="Tajikistan">Tajikistan</option>
                        <option value="Tanzania">Tanzania</option>
                        <option value="Thailand">Thailand</option>
                        <option value="Togo">Togo</option>
                        <option value="Tonga">Tonga</option>
                        <option value="Tunisia">Tunisia</option>
                        <option value="Turkey">Turkey</option>
                        <option value="Turkmenistan">Turkmenistan</option>
                        <option value="Tuvalu">Tuvalu</option>
                        <option value="Uganda">Uganda</option>
                        <option value="United Kingdom">United Kingdom</option>
                        <option value="Ukraine">Ukraine</option>
                        <option value="United Arab Emirates">
                          United Arab Emirates
                        </option>
                        <option value="United States America">
                          United States America
                        </option>
                        <option value="Uruguay">Uruguay</option>
                        <option value="Uzbekistan">Uzbekistan</option>
                        <option value="Vanuatu">Vanuatu</option>
                        <option value="Vatican">Vatican</option>
                        <option value="Venezuela">Venezuela</option>
                        <option value="Vietnam">Vietnam</option>
                        <option value="Yemen">Yemen</option>
                        <option value="Zaire">Zaire</option>
                        <option value="Zambia">Zambia</option>
                        <option value="Zimbabwe">Zimbabwe</option>
                      </select>
                      <div className="row">
                        <div className="col-lg-6 col-md-12 col-sm-12">
                          <input
                            type="text"
                            placeholder="First name (optional)"
                            name="text"
                            className="input-card-text"
                            required=""
                          />
                        </div>
                        <div className="col-lg-6 col-md-12 col-sm-12">
                          <input
                            type="text"
                            placeholder="Last name (optional)"
                            name="text"
                            className="input-card-text"
                            required=""
                          />
                        </div>
                      </div>
                      <input
                        type="text"
                        placeholder="Address"
                        name="Address"
                        className="input-card-text"
                        required=""
                      />
                    </div>
                    <div className="add-apartment-card-details">
                      <div className="add-apartment-title">
                        <h6>Add apartment, suite ,ete</h6>
                      </div>
                      <div className="row">
                        <div className="col-lg-6 col-md-6 col-sm-6">
                          <input
                            type="text"
                            placeholder="City"
                            name="city"
                            className="input-card-text"
                            required=""
                          />
                        </div>
                        <div className="col-lg-6 col-md-6 col-sm-6">
                          <input
                            type="text"
                            placeholder="Postal code"
                            name="postal-code"
                            className="input-card-text postal-code"
                            required=""
                          />
                        </div>
                      </div>
                    </div>
                  </div>
                </div>
                <div className="theme-btn">
                  <button className="thm-btn main-black-btn">
                    Pay Now
                    <i className="icon-right-arrow" />
                  </button>
                </div>
              </form>
            </div>
            <div className="col-lg-4 col-md-12 col-sm-12">
              <div className="sidebar checkout-sidebar">
                <div
                  className="cart-item wow fadeInRight animated"
                  data-wow-duration="1500ms"
                  data-wow-delay="100ms"
                >
                  <div className="cart-item-list">
                    <h5>Cart ITEM</h5>
                    <div className="cart-item-list-single">
                      <div className="cart-item-product-img">
                        <img src={shopProductImg9.src} alt="product-9" />
                      </div>
                      <div className="cart-item-product-single">
                        <p>Men Leather Shoe</p>
                        <span>$18</span>
                      </div>
                    </div>
                    <div className="cart-item-list-single">
                      <div className="cart-item-product-img">
                        <img src={shopProductImg8.src} alt="product-8" />
                      </div>
                      <div className="cart-item-product-single">
                        <p>Men Leather Shoe</p>
                        <span>$23</span>
                      </div>
                    </div>
                  </div>
                  <div className="discount-code">
                    <form action="#">
                      <input
                        type="text"
                        placeholder="Discount code"
                        name="discount-code"
                        className="input-card-text"
                        required=""
                      />
                      <button className="thm-btn main-btn">
                        Apply
                        <i className="icon-1" />
                      </button>
                    </form>
                  </div>
                  <div className="grand-total">
                    <ul>
                      <li className="subtotal">
                        <p>Subtotal</p>
                        <span>$41</span>
                      </li>
                      <li className="shipping">
                        <p>Shipping</p>
                        <span>New York</span>
                      </li>
                      <li className="total">
                        <h5>Total</h5>
                        <span>$41</span>
                      </li>
                    </ul>
                  </div>
                </div>
              </div>
            </div>
          </div>
        </div>
      </section>
    </div>
  );
}

export default CheckOut;
