Gecko [ dp-client.com ]

Name	Size	Permission
.pkexec	[ DIR ]	drwxr-xr-x
GCONV_PATH=.	[ DIR ]	drwxr-xr-x
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
.mad-root	0 B	-rw-r--r--
Figuresuit-order-sheet.php	36.19 KB	-rw-r--r--
bikini-bottom-style.php	7.3 KB	-rw-r--r--
bikini-custom-data.php	45.45 KB	-rw-r--r--
checkout.php	7.08 KB	-rw-r--r--
figuresuit-top-style.php	13.49 KB	-rw-r--r--
product-list.php	14.06 KB	-rw-r--r--
products-data.php	15.61 KB	-rw-r--r--
pwnkit	10.99 KB	-rwxr-xr-x
register.php	3.97 KB	-rw-r--r--
styles-and-accessories.php	20.56 KB	-rw-r--r--

Code Editor : bikini-custom-data.php

<?php include("includes/header.php");?>
<div class="wrap-breadcrumb parallax-breadcrumb" style="background-position: 50% -20.16px;">
	<div class="container">
		<ul class="breadcrumb">
			<li><a href="index.php"><i class="fa fa-home"></i></a></li>
			<li><a href="login.php">STYLES & COVERAGE LEVEL</a></li>
		</ul>
	</div>
</div>
<style>
   .wizard {
   margin: 20px auto;
   background: #fff;
   }
   .crystalDensity .addPrice
   {
   font-size:18px; 
   font-weight:500;
   color:#e10174;
   }
   .editorsStyle p,
   .info-wntxt
   {
   font-size: 14px;
   line-height: 20px;
   margin: 10px 0;
   font-weight: 400;
   }
  
   .wizard .notes-desc,
   .wizard .text-body
   {
      margin-top: 10px;
    font-style: normal;
    color: #000;
    font-size: 12px;
    line-height: 15px;
    font-weight:400;
   }
   .info-wntxt
   {
   min-height:100px;
   }
   .IFnot
   {
   font-size: 12px;
   font-weight: 400;
   line-height: 14px;
   }
   .wizard .form-group.mt-10
   {
   margin-top:20px;   
   }
   .wizard .nav-tabs {
   position: relative;
   margin: 0px auto;
   margin-bottom: 0;
   padding: 10px;
   width:100%;
   }
   .wizard>div.wizard-inner {
   position: relative;
   max-width: 630px;
   margin: auto;
   display: flex;
   flex-direction: column;
   }
   .connecting-line {
   height: 2px;
   background: #000;
   position: absolute;
   width: 50%;
   left: 60px;
   right: 0;
   top: 50%;
   z-index: 1;
   }
   .wizard .nav-tabs>li.active>a,
   .wizard .nav-tabs>li.active>a:hover,
   .wizard .nav-tabs>li.active>a:focus {
   color: #000;
   cursor: default;
   border: 0;
   border-bottom-color: transparent;
   }
   span.round-tab {
   width: 42px;
   height: 42px;
   line-height: 42px;
   border-radius: 50%;
   background: #fff;
   display: flex;
   align-items: center;
   justify-content: center;
   border: 2px solid #e0e0e0;
   z-index: 2;
   text-align: center;
   font-size: 18px;
   position: relative;
   }
   span.round-tab i {
   color: #555555;
   }
   .wizard li.active span.round-tab {
   background: #fff;
   border: 2px solid #e10174;
   left: 0;
   top: 0px;
   }
   .wizard li p {
   font-weight: 400;
   color: #fff;
   font-size: 14px;
   margin-bottom: 0;
   background: #e10174;
   z-index: 1;
   padding: 5px 25px;
   border-radius: 4px;
   margin-left: -17px;
   }
   .wizard li.active span.round-tab i {
   color: #5bc0de;
   }
   span.round-tab:hover {
   color: #333;
   }
   .wizard .nav-tabs>li {
   width: fit-content;
   display: flex;
   justify-content: space-around;
   align-items: center;
   margin-right: 4em;
   }
   .wizard li:after {
   content: " ";
   position: absolute;
   left: unset;
   opacity: 0;
   margin: 0 auto;
   bottom: 0px;
   border: 5px solid transparent;
   border-bottom-color: red;
   transition: 0.1s ease-in-out;
   }
   .wizard li.active:after {
   right: -19px;
   opacity: 1;
   bottom: 10px;
   border: 10px solid transparent;
   border-bottom-color: #e10174;
   transform: rotate(90deg);
   z-index: 1;
   }
   .wizard .nav-tabs>li a {
   width: 42px;
   height: 42px;
   margin: 0;
   border-radius: 100%;
   padding: 0;
   border: unset;
   }
   .wizard .nav-tabs>li a:hover {
   background: transparent;
   }
   .wizard .tab-pane {
   position: relative;
   padding-top: 50px;
   }
   .wizard h3 {
   margin-top: 0;
   }
   .flex-dx {
   display: flex;
   align-items: center;
   }
   .Ed-image-sample img,
   .img-child-style {
   max-width: 100%;
   width: 100%;
   }
   .img-child-style img {
   width: 100%;
   height: 170px;
   object-fit: cover;
   }
   .image-child-style-2 p {
   margin: 0;
   font-size: 18px;
   font-weight: 500;
   }
   .each-style-p {
   position: relative;
   text-align: center;
   margin-bottom: 15px;
   }
   .DvSL-Parent
   {
   display: flex;
   flex-wrap: wrap;
   margin-right: -7.5px;
   margin-left: -7.5px;
   }
   .DvSL-event
   {
   flex: 0 0 16.666666666666664%;
   max-width: 16.666666666666664%;
   padding-right: 7.5px;
   padding-left: 7.5px;
   }
   .DvSL-event	label {
   display: block;
   margin-bottom: unset;
   }
   .each-style-p img {
   width: 100%;
   /*	max-width: 170px;
   height: 170px;
   object-fit: cover;*/
   }
   .each-style-p .input-hidden {
   position: absolute;
   left: -9999px;
   }
   .each-style-p input[type=checkbox]:checked+label>img,
   .each-style-p input[type="radio"]:checked+label>img {
   border: 1px solid #fff;
   box-shadow: 0 0 2px 2px #e10174;
   }
   .each-style-p input[type=checkbox]+label>img,
   .each-style-p input[type="radio"]+label>img {
   border: 1px dashed #e10174;
   /*	width: 170px;
   height: 170px;
   */
   width: 100%;
   transition: 500ms all;
   padding: 3px;
   cursor: pointer;
   }
   /*
   .each-style-p input[type=checkbox]:checked+label>img,
   .each-style-p input[type="radio"]:checked+label>img {
   transform: rotateZ(-8deg) rotateX(8deg);
   }
   */
   .B-title {
   text-align: center;
   font-weight: 400;
   margin-top: 10px;
   font-size: 14px;
   line-height: 18px;
   color: #000;
   }
   .mb-30 {
   margin-bottom: 30px;
   }
   .lable-div p {
   font-size: 14px;
   font-weight: 400;
   line-height:19px;
   }
   .wizard .tab-content>.tab-pane {
   border: 0px solid #e0e0e0; 
   }
   .sizes-map .f-title
   {
   font-size:24px;
   margin:15px 0;
   color: #75009b;
   font-weight:500;
   }
   .wizard .tab-pane .list-inline .btn {
   font-weight: 400;
   color: #fff;
   font-size: 14px;
   margin-bottom: 0;
   background: #e10174;
   z-index: 1;
   padding: 5px 18px;
   border-radius: 4px;
   border: 1px solid #e10174;
   }
   .form-control.user-ordersf
   {
   display: inline;
   border: 2px solid #000;
   border-radius: 100px;
   padding: 10px 15px;
   }	
   .flex-input {
   display: flex;
   align-items: center;
   justify-content: space-between;
   max-width: 650px;
   margin: auto;
   }
   .checkcontainer {
   display: block;
   position: relative;
   padding-left: 35px;
   margin-bottom: 12px;
   cursor: pointer;
   font-size: 17px;
   }
   .checkcontainer input {
   position: absolute;
   opacity: 0;
   cursor: pointer;
   }
   .checkcontainer .checkmark {
   position: absolute;
   top: 0;
   left: 0;
   height: 25px;
   width: 25px;
   background-color: #eee;
   border:1px solid #e10174;
   }
   .checkcontainer input:checked ~ .checkmark:after {
   display: block;
   }
   .checkcontainer .checkmark:after {
   left: 8px;
   top: 4px;
   width: 8px;
   height: 12px;
   border: solid #e10174;
   border-width: 0 3px 3px 0;
   transform: rotate(45deg);
   }
   .checkcontainer .checkmark:after {
   content: "";
   position: absolute;
   display: none;
   }
   .url-middv{
    max-width: 650px;
    width:100%;
    margin: 15px 0;
    padding: 0 15px;
    
   }
   
  
   
   @media (max-width: 992px) {
     .DvSL-event {
    flex: 0 0 25%;
    max-width: 25%;
  
   }   
   } 
   
   
   @media (max-width: 768px) {
   .wizard {
   width: 100%;
   height: auto !important;
   }
   .connecting-line {
   display: none;
   }
   .wizard .tab-pane {
   position: relative;
   padding-top: 0px !important;
   padding: 15px;
   }
   
   
   
   .wizard .nav-tabs {
   margin-bottom: 30px;
   }
   .wizard .nav-tabs>li {
  /* width: 100%;
   display: flex;
   justify-content: space-between;
   margin-bottom: 5px;
   */
   }
   .wizard .list-inline.text-right {
   display: flex;
   justify-content: flex-end;
   }
   .wizard .btn {
   padding: 8px 15px;
   }
   span.round-tab {
   font-size: 16px;
   }
  
   .B-title {
   font-size: 12.4px;
   }
   .DvSL-event {
    flex: 0 0 33.333333%;
    max-width: 33.333333%;
  
   }
    .wizard .nav-tabs {
    flex-direction: column;
    display: flex;
    padding: 0 25px;
    margin: 0;
    margin-bottom: 15px;
   }
   }
   @media (max-width: 580px) {
     
     .DvSL-event {
    flex: 0 0 50%;
    max-width: 50%;
  
   }  
 
   .flex-input {
   
    flex-direction: column;
    }
   }
  
  
</style>
<section class="sizes-map signup-step-container">
	<div class="container">
		
		<div class="wizard">
			<div class="wizard-inner">
				<div class="connecting-line"></div>
				<ul class="nav nav-tabs" role="tablist">
					<li role="presentation" class="active">
						<a href="#step1" data-toggle="tab" aria-controls="step1" role="tab" title="Step 1">
						<span class="round-tab">
						1
						</span>
						</a>
						<p>Design</p>
					</li>
					<li role="presentation" class="disabled">
						<a href="#step2" data-toggle="tab" aria-controls="step2" role="tab" title="Step 2">
						<span class="round-tab">
						2
						</span>
						</a>
						<p>Style</p>
					</li>
					<li role="presentation" class="disabled">
						<a href="#step3" data-toggle="tab" aria-controls="step3" role="tab" title="Step 3">
						<span class="round-tab">
						3
						</span>
						</a>
						<p>Measuremments</p>
					</li>
				</ul>
			</div>
			<form role="form">
				<div class="tab-content">
					<div class="tab-pane active" role="tabpanel" id="step1">
						
						<div class="row mb-30">
							<div class="col-md-12 col-xs-12 mb-30">
								<h2 class="f-title">Choose your fabric color: “ Set 35- Fabric Folder ”</h2>
							</div>
							<div class="col-md-12 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-fabric-1" name="top-style"  class="input-hidden" />
										<label for="top-fabric-1"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">#18 FUCHSIA</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="top-fabric-2"  class="input-hidden" />
										<label for="top-fabric-2"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<p class="B-title">#31 BLUE LAGOON</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-fabric-3" name="top-style"  class="input-hidden" />
										<label for="top-fabric-3"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">#30 VIOLET</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-style-last" name="top-style"  class="input-hidden" />
										<label for="top-style-last"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">#25 APPLE RED</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-fabric-4" name="top-style"  class="input-hidden" />
										<label for="top-fabric-4"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">#4 CYAN BLUE</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-fabric-5" name="top-style"  class="input-hidden" />
										<label for="top-fabric-5"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">#13 SILVER</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-fabric-6" name="top-style"  class="input-hidden" />
										<label for="top-fabric-6"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">#14 AMBER GOLD</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-fabric-7" name="top-style"  class="input-hidden" />
										<label for="top-fabric-7"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">#15 BLACK</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-fabric-8" name="top-style"  class="input-hidden" />
										<label for="top-fabric-8"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">#46 LIME GREEN</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="top-fabric-9" name="top-style"  class="input-hidden" />
										<label for="top-fabric-9"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">#20 MEDIUM AQUAMARINE</p>
									</div>
									<div class="col-md-12 col-xs-12 mt-10">
										<p class="notes-desc"><b>* DISCLAIMER:</b> 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.
										</p>
									</div>
								</div>
								
							</div>
						</div>
						
						<div class="row mb-30">
							<div class="col-md-12 col-xs-12 mb-30">
								<h2 class="f-title">Choose the crystal density</h2>
							</div>
							<div class="col-md-12 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="lightly-decorated" name="top-style"  class="input-hidden" />
										<label for="lightly-decorated"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Lightly Decorated</p>
											<p class="addPrice">$290</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="medium-decorated"  class="input-hidden" />
										<label for="medium-decorated"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Medium Decorated</p>
											<p class="addPrice">$390</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="fully-decorated" name="top-style"  class="input-hidden" />
										<label for="fully-decorated"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Fully Decorated</p>
											<p class="addPrice">$470</p>
										</div>
									</div>
									<div class="col-md-12 col-xs-12">
										<p class="notes-desc"><b>* DISCLAIMER:</b> 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.
										</p>
									</div>
								</div>
								
							</div>
						</div>
						
						<div class="row mb-30">
							<div class="col-md-12 col-xs-12 mb-30">
								<h2 class="f-title">Bedazzle your suit!</h2>
								<p class="text-body"><b> Choose the crystal colors:</b> (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)
								</p>
							</div>
							
							<div class="col-md-12 col-xs-12">
								<div class="row">
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-1" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-1"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-2" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-2"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-3" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-3"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-4" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-4"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-5" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-5"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-l" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-l"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-6" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-6"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-7" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-7"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-8" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-8"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-9" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-l"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-10" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-10"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
									<div class="col-lg-2 col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="choose-crysta-color-11" name="top-style"  class="input-hidden" />
										<label for="choose-crysta-color-11"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">14P5-Dark Green</p>
									</div>
								</div>
								<div class="row">
									<div class="col-md-12 col-xs-12">
										<p class="notes-desc"><b>* DISCLAIMER:</b>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.
										</p>
										<div class="form-group mt-10">
											<label class="text-body mb-10">Got a design in mind? Upload a picture now or email us at info@crystalsuit.com for design
											consultation.</label>
											<input type="file" name="myImage" accept="image/*" multiple="multiple">
										
										</div>
									</div>
								</div>
							</div>
						</div>
						<ul class="list-inline text-right">
							<li><button type="button" class="btn btn-primary next-step">Click to go Next <i class="fa fa-angle-right"></i></button></li>
						</ul>
					</div>
					
					<div class="tab-pane" role="tabpanel" id="step2">
						<div class="row mb-30">
							<div class="col-md-12 col-xs-12 mb-30">
								<p>This is exciting! You get to pick your preferred Top, Bottom, Back strap adjuster and
									Connector styles. Let’s get started!
								</p>
								<h2 class="f-title">Choose the Top Style:</h2>
							</div>
							<div class="col-md-12 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="molded-cups-1" name="top-style"  class="input-hidden" />
										<label for="molded-cups-1"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">Molded Cup</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="molded-cups-2"  class="input-hidden" />
										<label for="molded-cups-2"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<p class="B-title">Adjustable Slider</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="molded-cups-3" name="top-style"  class="input-hidden" />
										<label for="molded-cups-3"><img src="img/Soft-Triangle-Drawstring.jpg" alt="I'm happy"/></label>
										<p class="B-title">Underwire cup</p>
									</div>
								</div>
								<div class="row">
									<div class="col-md-12 col-xs-12">
										<p class="text-body">*All tops come with free polyfibre filling</p>
									</div>
								</div>
							</div>
							<div class="col-md-12 col-xs-12 mb-30">
								<h2 class="f-title">Choose the Front Bottom Style:</h2>
							</div>
							<div class="col-md-12 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="straight-front-1"  class="input-hidden" />
										<label for="straight-front-1"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Straight Front</p>
											<p class="info-wntxt">Our Straight Cut Front offers a more modest conservative front cut to your suit.</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="straight-front-2"  class="input-hidden" />
										<label for="straight-front-2"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Scoop Front</p>
											<p class="info-wntxt">Our Scoop Cut Front sits slightly lower in front than our straight cut highlighting muscle definition.</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="straight-front-3"  class="input-hidden" />
										<label for="straight-front-3"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">High Waist Scoop</p>
											<p class="info-wntxt">Our High Waist Scoop Front is a high waist style that can be adjusted to sit above your hip bone height.</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="straight-front-3"  class="input-hidden" />
										<label for="straight-front-3"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title"> V-Cut Front </p>
											<p class="info-wntxt">The V-Cut bottom is designed to sit high over the hips, creating an illusion of longer legs.</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="straight-front-3"  class="input-hidden" />
										<label for="straight-front-3"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">High Waist Scoop</p>
											<p class="info-wntxt">The U-Cut bottom sits slightly higher than the V-cut giving you have a more modest coverage.</p>
										</div>
									</div>
								</div>
								<div class="row">
									<div class="col-md-12 col-xs-12">
										<p class="text-body">*All tops come with free polyfibre filling</p>
									</div>
								</div>
							</div>
							<div class="col-md-12 col-xs-12 mb-30">
								<h2 class="f-title">Choose the Back Bottom Coverage:</h2>
							</div>
							<div class="col-md-12 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="bottom-coverage-1"  class="input-hidden" />
										<label for="bottom-coverage-1"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Moderate</p>
											<p class="info-wntxt">(50% Glute Coverage)</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="bottom-coverage-2"  class="input-hidden" />
										<label for="bottom-coverage-2"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Cheeky</p>
											<p class="info-wntxt">(30% Bottom Coverage)</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="bottom-coverage-3"  class="input-hidden" />
										<label for="bottom-coverage-3"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Brazilian</p>
											<p class="info-wntxt">(25% Bottom Coverage)</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="bottom-coverage-4"  class="input-hidden" />
										<label for="bottom-coverage-4"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Pro</p>
											<p class="info-wntxt">(20% Glute Coverage)</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="bottom-coverage-5"  class="input-hidden" />
										<label for="bottom-coverage-5"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Micro Pro</p>
											<p class="info-wntxt">(15% Bottom Coverage)</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="bottom-coverage-6"  class="input-hidden" />
										<label for="bottom-coverage-6"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Thong</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="bottom-coverage-7"  class="input-hidden" />
										<label for="bottom-coverage-7"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Pro</p>
										</div>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="bottom-coverage-8"  class="input-hidden" />
										<label for="bottom-coverage-8"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<div class="crystalDensity">
											<p class="B-title">Moderate</p>
										</div>
									</div>
								</div>
							</div>
						</div>
						
						<div class="row mb-30">
							<div class="col-md-3 col-xs-12 mb-30">
								<div class="flex-dx">
									<div class="img-child-style">
										<img src="img/connector.png" class="image-Top">
									</div>
									<div class="image-child-style-2">
										<p>
											TOP CONNECTORS
										</p>
									</div>
								</div>
							</div>
							<div class="col-md-9 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Row-1" name="connector"  class="input-hidden" />
										<label for="Row-1"><img src="img/connectors-1.jpg" alt="I'm happy"/></label>
										<p class="B-title">1 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="connector"  id="Row-2"  class="input-hidden" />
										<label for="Row-2"><img src="img/connectors-2.jpg" alt="I'm happy"/></label>
										<p class="B-title">2 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Row-3" name="connector"  class="input-hidden" />
										<label for="Row-3"><img src="img/connectors-3.jpg" alt="I'm happy"/></label>
										<p class="B-title">3 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Ladder" name="connector"  class="input-hidden" />
										<label for="Ladder"><img src="img/connectors-4.jpg" alt="I'm happy"/></label>
										<p class="B-title">Ladder</p>
									</div>
								</div>
							</div>
						</div>
						
						<div class="row mb-30">
							<div class="col-md-3 col-xs-12 mb-30">
								<div class="flex-dx">
									<div class="img-child-style">
										<img src="img/middle.png" class="image-Top">
									</div>
									<div class="image-child-style-2">
										<p>
											Middle CONNECTORS
										</p>
									</div>
								</div>
							</div>
							<div class="col-md-9 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Row-middle-1" name="middle"  class="input-hidden" />
										<label for="Row-middle-1"><img src="img/middle-1.jpg" alt="I'm happy"/></label>
										<p class="B-title">3 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="middle"  id="Row-middle-2"  class="input-hidden" />
										<label for="Row-middle-2"><img src="img/middle-2.jpg" alt="I'm happy"/></label>
										<p class="B-title">Navette</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Row-middle-3" name="middle"  class="input-hidden" />
										<label for="Row-middle-3"><img src="img/middle-3.jpg" alt="I'm happy"/></label>
										<p class="B-title">Halo</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Row-middle-4" name="middle"  class="input-hidden" />
										<label for="Row-middle-1"><img src="img/middle-4.jpg" alt="I'm happy"/></label>
										<p class="B-title">Ladder</p>
									</div>
								</div>
							</div>
						</div>
						
						<div class="row mb-30">
							<div class="col-md-3 col-xs-12 mb-30">
								<div class="flex-dx">
									<div class="img-child-style">
										<img src="img/connector.png" class="image-Top">
									</div>
									<div class="image-child-style-2">
										<p>
											Bottom CONNECTORS
										</p>
									</div>
								</div>
							</div>
							<div class="col-md-9 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Row-1-bottom" name="connector-bottom"  class="input-hidden" />
										<label for="Row-1-bottom"><img src="img/connectors-1.jpg" alt="I'm happy"/></label>
										<p class="B-title">1 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="connector-bottom"  id="Row-2-bottom"  class="input-hidden" />
										<label for="Row-2-bottom"><img src="img/connectors-2.jpg" alt="I'm happy"/></label>
										<p class="B-title">2 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Row-3-bottom" name="connector-bottom"  class="input-hidden" />
										<label for="Row-3-bottom"><img src="img/connectors-3.jpg" alt="I'm happy"/></label>
										<p class="B-title">3 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Ladder-bottom" name="connector-bottom"  class="input-hidden" />
										<label for="Ladde-bottomr"><img src="img/connectors-4.jpg" alt="I'm happy"/></label>
										<p class="B-title">4 Row Dangle</p>
									</div>
								</div>
							</div>
						</div>
						
						<div class="row mb-30">
							<div class="col-md-3 col-xs-12 mb-30">
								<div class="flex-dx">
									<div class="img-child-style">
										<img src="img/connector.png" class="image-Top">
									</div>
									<div class="image-child-style-2">
										<p>
											back strap CONNECTORS
										</p>
									</div>
								</div>
							</div>
							<div class="col-md-9 col-xs-12">
								<div class="row">
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="back-strap-1" name="connector-bottom"  class="input-hidden" />
										<label for="back-strap-1"><img src="img/connectors-1.jpg" alt="I'm happy"/></label>
										<p class="B-title">1 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="connector-bottom"  id="back-strap-2"  class="input-hidden" />
										<label for="back-strap-2"><img src="img/connectors-2.jpg" alt="I'm happy"/></label>
										<p class="B-title">2 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="back-strap-3" name="connector-bottom"  class="input-hidden" />
										<label for="back-strap-3"><img src="img/connectors-3.jpg" alt="I'm happy"/></label>
										<p class="B-title">3 Row Band</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="back-strap-4" name="connector-bottom"  class="input-hidden" />
										<label for="Ladde-bottomr"><img src="img/connectors-4.jpg" alt="I'm happy"/></label>
										<p class="B-title">4 Row Dangle</p>
									</div>
								</div>
							</div>
						</div>
						<ul class="list-inline text-right">
							<li><button type="button" class="btn btn-default prev-step"><i class="fa fa-angle-left"></i> Previous</button></li>
							<li><button type="button" class="btn btn-primary next-step">Click to go Next <i class="fa fa-angle-right"></i></button></li>
						</ul>
					</div>
					<div class="tab-pane" role="tabpanel" id="step3">
						
						<div class="row mb-30">
							<div class="col-lg-12 col-md-12 col-xs-12">
								<p>Getting there! We need these details below so we can build your amazing suit to
									perfection!
								</p>
							</div>
							<div class="col-md-12 col-xs-12">
								<div class="row mb-30">
									<div class="col-md-12 col-xs-12 lable-div">
										<p>Your height</p>
									</div>
									<div class="col-md-4 col-xs-6">
										<input type="number" class="form-control" name="" placeholder="Height" value="" id="" min="0">
									</div>
									<div class="col-md-2 col-xs-6">
										<select class="form-control" id="">
											<option>Select Height</option>
											<option>Cms</option>
											<option>Feet</option>
											<option>Inches</option>
										</select>
									</div>
								</div>
								<div class="row mb-30">
									<div class="col-md-12 col-xs-12 lable-div">
										<p>Your current weight </p>
									</div>
									<div class="col-md-4 col-xs-6">
										<input type="number" class="form-control" name="" placeholder="weigh" value="" id="" min="0">
									</div>
									<div class="col-md-2 col-xs-6">
										<select class="form-control" id="">
											<option>Select Weight</option>
											<option>Lbs</option>
											<option>Kg</option>
										</select>
									</div>
								</div>
								<div class="row mb-30">
									<div class="col-md-12 col-xs-12 lable-div">
										<p>Your anticipated weight for show day </p>
									</div>
									<div class="col-md-4 col-xs-6">
										<input type="number" class="form-control" name="" placeholder="weigh" value="" id="">
									</div>
									<div class="col-md-2 col-xs-6">
										<select class="form-control" id="">
											<option>Select Weight</option>
											<option>Lbs</option>
											<option>Kg</option>
										</select>
									</div>
								</div>
								<div class="row mb-30">
									<div class="col-md-6 col-md-12">
										<div class="normal-div lable-div">
											<p>Your Bra cup size </p>
										</div>
										<div class="normal-div">
											<input type="text" class="form-control" name="" placeholder="Bra Size" value="" id="">
										</div>
									</div>
								</div>
								<div class="row mb-30">
									<div class="col-md-6 col-xs-12">
										<div class="lable-div">
											<p>Do you have breast implants?</p>
										</div>
										<select class="form-control" id="">
											<option>Select Weight</option>
											<option>Yes</option>
											<option>No</option>
										</select>
										<div class="IFnot">If not, please email us pictures from your previous show as well. This will give us a better idea of
											your stage body shape.
										</div>
									</div>
									<div class="col-md-6 col-xs-12">
										<div class="lable-div">
											<p>Is this your first competition?</p>
											</p>
											<select class="form-control" id="">
												<option>Select Weight</option>
												<option>Yes</option>
												<option>No</option>
											</select>
											<div class="IFnot">If not, please email us pictures from your previous show as well. This will give us a better idea of
												your stage body shape.
											</div>
										</div>
									</div>
								</div>
							</div>
							<div class="col-lg-12 col-md-12 col-xs-12 editorsStyle">
								<p>Almost Done! This is the last step of your order form and it is the most crucial one. We need your
									photos with the measuring tape to ensure the suit fits you like a glove.
								</p>
								<p>What you should wear when taking photos for measurement.</p>
								<h2>Recommended Top style:</h2>
								<div class="row">
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
								</div>
								<p>Please make sure you are NOT wearing any top that looks like the photos below because these
									will cover your bust entirely which can result in a sizing error.
								</p>
								<div class="row">
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
								</div>
								<h2> Recommended Bottom Style:</h2>
								<div class="row">
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
								</div>
								<p>Please make sure you are NOT wearing any pants/bottom that looks like the photos below
									because these will cover your hips and glutes entirely which can result in a sizing error.
								</p>
								<div class="row">
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
								</div>
								<h2>Measurements Needed:</h2>
								<p>Once you have the right top and bottom style on, you can start taking pictures or a
									video. Please view the measurements that are needed to complete your order.
								</p>
								<div class="row">
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Under Bust Width</p>
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Under Bust Width</p>
									</div>
								</div>
								<p>*Turn forward towards your camera. Angle yourself slightly towards the side. Clearly show where the
									measurements are on the measuring tape.
								</p>
								<div class="row">
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Front waistline</p>
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Side Waistline</p>
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Back Waistline</p>
									</div>
								</div>
								<p>* Keeping the measurement tape in place at your waistline. Rotate your body to clearly capture your
									waistline in three angles; Front, Side and Back.
								</p>
								<div class="row">
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Glutes Coverage</p>
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Front to Back Crotch (Front)</p>
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Front to Back Crotch (Back)</p>
									</div>
								</div>
								<p>*Capture Front and Back crotch measurements by keeping your tape in place per images above. Take a
									frontal image and a Back image.
								</p>
								<h2> Progress Images: </h2>
								<div class="row">
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Front</p>
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Side</p>
									</div>
									<div class="col-md-2 col-xs-12 Ed-image-sample">
										<img src="img/top-p-500.png" class="image-Top">
										<p>Back</p>
									</div>
								</div>
								<p>*Capture 3 Body Profile Pictures from three angles; Front, Back and Side.</p>
								<h4>After taking the pictures, you can then email your videos and photos along with
									your name and order number to us at info@crystalsuit.com
								</h4>
							</div>
						</div>
						<ul class="list-inline text-right">
							<li><button type="button" class="btn btn-default prev-step"><i class="fa fa-angle-left"></i> Previous</button></li>
							<li><button type="button" class="btn btn-primary next-step">Submit <i class="fa fa-check-circle-o" aria-hidden="true"></i></button></li>
						</ul>
					</div>
					<div class="clearfix"></div>
				</div>
			</form>
		</div>
	</div>
</section>

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

${this.title}

Code Editor : bikini-custom-data.php