Gecko [ dp-client.com ]

Name	Size	Permission
css	[ DIR ]	drwxr-xr-x
fonts	[ DIR ]	drwxr-xr-x
img	[ DIR ]	drwxr-xr-x
includes	[ DIR ]	drwxr-xr-x
js	[ DIR ]	drwxr-xr-x
custom-style-single.php	31.5 KB	-rw-r--r--
index-old.html	42.78 KB	-rw-r--r--
index.php	16.68 KB	-rw-r--r--

Code Editor : custom-style-single.php

<?php include('includes/header.php');?>
<section class="Users-Sldata padding-50">
  <div class="max-container">
    <div class="doc3">
      
      <div class="userstyle wizard">
      <div class="wizard-inner">
        <ul class="nav nav-tabs csmt-tabs" role="tablist">
          <li  role="presentation" class="active">
            <a class="nav-link" href="#step1" data-toggle="tab" aria-controls="step1" role="tab" aria-expanded="true" >STYLE</a>
          </li>
          <li class="nav-item text-center disabled" role="presentation">
            <a class="nav-link" href="#step2" data-toggle="tab" aria-controls="step2" role="tab" aria-expanded="false">DESIGN</a>
          </li>
          <li class="nav-item text-right disabled">
            <a class="nav-link" href="#step3" data-toggle="tab" aria-controls="step3" role="tab">MEASUREMENTS</a>
          </li>
        </ul>
      </div>
        
        <form action="" method="post">
          <div class="tab-content" id="main_form">
              
            <div class="tab-pane  active" role="tabpanel" id="step1">
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2>Choose the Top Style <span>*</span></h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-1" name="top-style" class="input-hidden">
                      <label for="top-fabric-1"><img src="img/images1.png" alt="I'm happy"></label>
                      <p>Adjustable Slider</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-2" name="top-style" class="input-hidden">
                      <label for="top-fabric-2"><img src="img/images1.png" alt="I'm happy"></label>
                      <p>Triangle Molded Cup</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-3" name="top-style" class="input-hidden">
                      <label for="top-fabric-3"><img src="img/images1.png" alt="I'm happy"></label>
                      <p>Underwire Cup</p>
                    </li>
                  </ul>
                  <p class="font-13m">*All tops come with free polyfibre filling</p>
                </div>
              </div>
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2>Choose the Front Bottom Style <span>*</span></h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f" name="top-style" class="input-hidden">
                      <label for="top-fabric-f"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Modest Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f1" name="top-style" class="input-hidden">
                      <label for="top-fabric-f1"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Scoop Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f2" name="top-style" class="input-hidden">
                      <label for="top-fabric-f2"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>High Rise Front</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2>Choose the Back Bottom Coverage <span>*</span> </h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-bottom" name="top-style"
                        class="input-hidden">
                      <label for="top-fabric-bottom"><img src="img/Full-Coverage-Back.png"
                        alt="I'm happy"></label>
                      <p>Modest Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-bottom1" name="top-style"
                        class="input-hidden">
                      <label for="top-fabric-bottom1"><img src="img/Full-Coverage-Back.png"
                        alt="I'm happy"></label>
                      <p>Full Coverage Back (50% Glute Coverage)</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-bottom2" name="top-style"
                        class="input-hidden">
                      <label for="top-fabric-bottom2"><img src="img/Full-Coverage-Back.png"
                        alt="I'm happy"></label>
                      <p> Cheeky Back (30% Bottom Coverage)</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-bottom5" name="top-style"
                        class="input-hidden">
                      <label for="top-fabric-bottom5"><img src="img/Full-Coverage-Back.png"
                        alt="I'm happy"></label>
                      <p> Brazilian Back (25% Bottom Coverage)</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-bottom6" name="top-style"
                        class="input-hidden">
                      <label for="top-fabric-bottom6"><img src="img/Full-Coverage-Back.png"
                        alt="I'm happy"></label>
                      <p> Pro Back (20% Bottom Coverage)</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2>Choose the shoulder connectors for your top <span>*</span></h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f" name="top-style" class="input-hidden">
                      <label for="top-fabric-f"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Modest Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f1" name="top-style" class="input-hidden">
                      <label for="top-fabric-f1"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Scoop Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f2" name="top-style" class="input-hidden">
                      <label for="top-fabric-f2"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>High Rise Front</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2>Choose the middle connectors for your top (connects the cups between your bust)
                    <span>*</span>
                  </h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f" name="top-style" class="input-hidden">
                      <label for="top-fabric-f"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Modest Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f1" name="top-style" class="input-hidden">
                      <label for="top-fabric-f1"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Scoop Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f2" name="top-style" class="input-hidden">
                      <label for="top-fabric-f2"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>High Rise Front</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2>Choose the hip connectors for your bottom(connectors for the bottom part of your
                    suit) <span>*</span>
                  </h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f" name="top-style" class="input-hidden">
                      <label for="top-fabric-f"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Modest Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f1" name="top-style" class="input-hidden">
                      <label for="top-fabric-f1"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Scoop Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f2" name="top-style" class="input-hidden">
                      <label for="top-fabric-f2"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>High Rise Front</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2> Choose the slider for your back strap <span>*</span></h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric1" name="top-style" class="input-hidden">
                      <label for="top-fabric1"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Modest Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric2" name="top-style" class="input-hidden">
                      <label for="top-fabric2"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>Scoop Front</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="top-fabric-f3" name="top-style" class="input-hidden">
                      <label for="top-fabric3"><img src="img/Modest-Front.png"
                        alt="I'm happy"></label>
                      <p>High Rise Front</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="d-flex font-13">
                <small>
                * DISCLAIMER:We do our best to ensure that our photos are as true to color as possible. However, due to inconsistencies of various monitors, lighting sources and digital photography we can not guarantee that the colors you see on your screen accurately portrays the true color of the product.
                </small>
              </div>

</div>
            <div class="tab-pane" role="tabpanel" id="step2">
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2> Choose your fabric color <span>*</span></h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="colors-1" name="top-style" class="input-hidden">
                      <label for="colors-1"><img src="img/userscolors.png" alt="I'm happy"></label>
                      <p>Lightly Decorated</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="colors-2" name="top-style" class="input-hidden">
                      <label for="colors-2"><img src="img/colo-2.png" alt="I'm happy"></label>
                      <p>Lightly Decorated</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="colors-3" name="top-style" class="input-hidden">
                      <label for="colors-3"><img src="img/userscolors.png" alt="I'm happy"></label>
                      <p>Lightly Decorated</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2> Choose your fabric color <span>*</span></h2>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="radio" id="den-1" name="top-style" class="input-hidden">
                      <label for="den-1"><img src="img/den.png" alt="I'm happy"></label>
                      <p>Lightly Decorated</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="den-2" name="top-style" class="input-hidden">
                      <label for="den-2"><img src="img/den.png" alt="I'm happy"></label>
                      <p>Medium Decorated</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="radio" id="den-3" name="top-style" class="input-hidden">
                      <label for="den-3"><img src="img/den.png" alt="I'm happy"></label>
                      <p>Fully Decorated</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="cst-select-el">
                <div class="cst-el1">
                  <h2> Bedazzle your suit! <span>*</span></h2>
                  <div class="d-flex font-13">
                    Choose the crystal colors: (USD $5 per color you select, Lightly decorated: up to 1 crystal color : No extra charge for 1 crystal color option, Medium decorated :up to 3 crystal colors, Fully decorated: up to 6 crystal colors)
                  </div>
                  <ul class="cst-grids">
                    <li class="text-center each-style-div">
                      <input type="checkbox" id="den-11" name="top-style" class="input-hidden">
                      <label for="den-11"><img src="img/den.png" alt="I'm happy"></label>
                      <p>Lightly Decorated</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="checkbox" id="den-22" name="top-style" class="input-hidden">
                      <label for="den-22"><img src="img/den.png" alt="I'm happy"></label>
                      <p>Medium Decorated</p>
                    </li>
                    <li class="text-center each-style-div">
                      <input type="checkbox" id="den-33" name="top-style" class="input-hidden">
                      <label for="den-33"><img src="img/den.png" alt="I'm happy"></label>
                      <p>Fully Decorated</p>
                    </li>
                  </ul>
                </div>
              </div>
              <div class="d-flex font-13">
                <small>
                * DISCLAIMER:We do our best to ensure that our photos are as true to color as possible. However, due to inconsistencies of various monitors, lighting sources and digital photography we can not guarantee that the colors you see on your screen accurately portrays the true color of the product.
                </small>
              </div>
               
              <div class="Ny-xt">
              
              <button type="button" class="prev-step"> Previous </button>
              <button type="button" class="next-step"> Next </button>
            </div>

</div>
            <div class="tab-pane" role="tabpanel" id="step3">
              <div class="form-Txt">
                <div class="Hlf-Inupt cst-mb30">
                  <div class="Hlf-Inupt-2">
                    <input type="type" class="order-input" id="" placeholder="Your height">
                  </div>
                  <div class="Hlf-Inupt-1">
                    <div class="Full-Inupt-3rd">
                      <select class="order-input">
                        <option> Select Height </option>
                        <option>feet and inches</option>
                        <option>cms</option>
                      </select>
                    </div>
                  </div>
                </div>
                <div class="Hlf-Inupt cst-mb30">
                  <div class="Hlf-Inupt-2">
                    <input type="type" class="order-input" id="" placeholder="Your current weight">
                  </div>
                  <div class="Hlf-Inupt-1">
                    <div class="Full-Inupt-3rd">
                      <select class="order-input">
                        <option> Select Weight </option>
                        <option>lbs</option>
                        <option>kg</option>
                      </select>
                    </div>
                  </div>
                </div>

<div class="Hlf-Inupt cst-mb30">
                  <div class="Hlf-Inupt-2">
                    <input type="type" class="order-input" id="" placeholder="Your anticipated Weight for competition day">
                  </div>
                  <div class="Hlf-Inupt-1">
                    <div class="Full-Inupt-3rd">
                      <select class="order-input">
                        <option> Select Weight </option>
                        <option>lbs</option>
                        <option>kg</option>
                      </select>
                    </div>
                  </div>
                </div>

<div class="Full-Inupt-3rd cst-mb30">
                  <select class="order-input">
                    <option> Do you have breast implants </option>
                    <option>Yes</option>
                    <option>No</option>
                  </select>
                </div>
                <div class="Full-Inupt-3rd cst-mb30">
                  <select class="order-input">
                    <option>Is this your first competition?</option>
                    <option>Yes</option>
                    <option>No</option>
                  </select>
                  <small>If not, please email us pictures from your previous show as well. This will give
                  us a better idea of
                  your stage body shape.</small>
                </div>

<div class="Full-Inupt-3rd cst-mb30">
                  <select class="order-input">
                    <option>Where did you hear about us?</option>
                    <option>Friends</option>
                    <option>Google</option>
                    <option>Facebook</option>
                    <option>Instagram</option>
                    <option>Other</option>
                  </select>
                </div>
                <div class="d-flex font-13 mb-2">
                  Almost Done! This is the last and most important step of your order form. We need you to
                  take your photos holding the measuring tape per our guidelines.
                </div>
                <div class="d-flex font-13 mb-2">
                  What you should wear when taking photos for measurement.
                </div>
                <div class="cst-select-el">
                  <div class="cst-el1">
                    <h2>Recommended Top style</h2>
                    <ul class="cst-grids">
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                    </ul>
                  </div>
                </div>
                
                <div class="cst-select-el">
                  <div class="cst-el1">
                    <div class="d-flex font-13 mb-2">
                      Please DO NOT wear tops as seen in the images below.
                    </div>
                    <ul class="cst-grids">
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                    </ul>
                  </div>
                </div>
                
                <div class="cst-select-el">
                  <div class="cst-el1">
                    <h2>Recommended Bottom Style</h2>
                    <ul class="cst-grids">
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                    </ul>
                  </div>
                </div>
                
                <div class="cst-select-el">
                  <div class="cst-el1">
                    <div class="d-flex font-13 mb-2">
                      measurement Please DO NOT wear top
                    </div>
                    <ul class="cst-grids">
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                    </ul>
                  </div>
                </div>
                
                <div class="cst-select-el">
                  <div class="cst-el1">
                    <h2>Measurements Needed:</h2>
                    <div class="d-flex font-13 mb-2">
                      Please view the measurements that are needed to complete your
                      order.
                    </div>
                    <ul class="cst-grids">
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Bust Width</p>
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p> Bust Length</p>
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                      </li>
                    </ul>
                  </div>
                </div>
                
                <div class="cst-select-el">
                  <div class="cst-el1">
                    <div class="d-flex font-13 mb-2">
                      *Turn forward towards your camera. Angle yourself slightly towards the side.
                      Clearly show the measurements on the measuring tape.
                    </div>
                    <ul class="cst-grids">
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Front waistline</p>
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p> Side Waistline</p>
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Back Waistline</p>
                      </li>
                    </ul>
                  </div>
                </div>
                
                
                <div class="cst-select-el">
                  <div class="cst-el1">
                    <div class="d-flex font-13 mb-2">
                      * Keep the measurement tape in place at your waistline. Rotate your body to
                      clearly capture your waistline from three angles; Front, Side and Back.
                    </div>
                    <ul class="cst-grids">
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Bottom Coverage Level</p>
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Front to Back Crotch (Front)</p>
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Front to Back Crotch (Back)</p>
                      </li>
                    </ul>
                  </div>
                </div>
                
                <div class="cst-select-el">
                  <div class="cst-el1">
                    <div class="d-flex font-13 mb-2">
                      *Capture Front and Back crotch measurements by keeping your tape in place per
                      images above. Take a frontal image and a Back image.
                    </div>
                    <h2>Progress Images</h2>
                    <ul class="cst-grids">
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Front</p>
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Side</p>
                      </li>
                      <li class="text-center each-style-div">
                        <img src="img/images1.png" alt="I'm happy">
                        <p>Back</p>
                      </li>
                    </ul>
                    <div class="d-flex font-13 mb-2">
                      *Capture 3 Body Profile Pictures from three angles; Front, Back and Side.
                    </div>
                  </div>
                </div>
                
                <div class="d-flex font-13 mb-2">
                  After taking the pictures, please email your videos and photos, along with your name and
                  order number, to us at info@competitionsuitshop.com
                </div>
                
                
                <div class="d-flex font-13">
                  <small>
                  * DISCLAIMER:We do our best to ensure that our photos are as true to color as possible. However, due to inconsistencies of various monitors, lighting sources and digital photography we can not guarantee that the colors you see on your screen accurately portrays the true color of the product.
                  </small>
                </div>

<div class="Ny-xt">
              
              <button type="button" class="prev-step"> Previous <i class="fa fa-angle-right"></i></button>
              <button type="button" class="next-done"> Submit  <i class="fa fa-angle-right"></i></button>
            </div>

</div>
        </form>
        </div>
        </div>
        
      </div>
      
      
      <div class="userCanvas">
        <div class="canvasmid-img text-center">
          <img src="img/first-img.png" alt="logo">
        </div>
      </div>
      
      
      <div class="userCanvasinfo">
        <div class="divcol">
          <div class="divcol-1">
            <h2 class="">Custom Bikni</h2>
            <p class="p-price">$329.00</p>
            <div class="some-txt">
              Lorem ipsum dolor sit amet, consectetur adipiscing elit. Amet vitae.
            </div>
            <div class="Ny-xt">
              <a href="#">Next</a>
            </div>
            <div class="flex-imgsl">
              <span><a href="#"><img src="img/heart.png" alt="logo"></a></span>
              <span><img src="img/share.png" alt="logo"></a></span>
            </div>
          </div>
          <div class="divcol-2">
            <ul class="ul-zoom">
              <li><img src="img/zoom.png" alt="logo"><span>Zoom</span></li>
              <li><img src="img/Frame.png" alt="logo"><span>Fabric</span></li>
            </ul>
          </div>
        </div>
      </div>
      
    </div>
  </div>
</section>

<?php include('includes/footer.php');?>

${this.title}

Code Editor : custom-style-single.php