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 : styles-and-accessories.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>
	.information-b p {
	font-size: 18px;
	line-height: 24px;
	margin: 0;
	}
	.wizard {
	margin: 20px auto;
	background: #fff;
	}
	.wizard .nav-tabs {
	position: relative;
	margin: 40px auto;
	margin-bottom: 0;
	border-bottom-color: #e10174;
	background: #e10174;
	padding: 10px;
	}
	.wizard>div.wizard-inner {
	position: relative;
	}
	.connecting-line {
	height: 2px;
	background: #e0e0e0;
	position: absolute;
	width: 100%;
	margin: 0 auto;
	left: 0;
	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: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 50%;
	background: #fff;
	display: block;
	border: 2px solid #e0e0e0;
	z-index: 2;
	position: absolute;
	text-align: center;
	font-size: 25px;
	position: relative;
	top: -3px;
	left: -3px;
	}
	span.round-tab i {
	color: #555555;
	}
	.wizard li.active span.round-tab {
	background: #fff;
	border: 2px solid #fff;
	left: 0;
	top: -2px;
	}
	.wizard li p {
	font-weight: 600;
	color: #fff;
	font-size: 18px;
	margin-bottom: 0;
	background: #fff;
	color: #000;
	z-index: 1;
	padding: 4px 10px;
	}
	.wizard li.active span.round-tab i {
	color: #5bc0de;
	}
	span.round-tab:hover {
	color: #333;
	/* border: 2px solid red;*/
	}
	.wizard .nav-tabs>li {
	width: 33.33%;
	display: flex;
	justify-content: space-around;
	align-items: center;
	}
	.wizard li:after {
	content: " ";
	position: absolute;
	left: 46%;
	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 {
	content: " ";
	position: absolute;
	left: 46%;
	opacity: 1;
	margin: 0 auto;
	bottom: 0px;
	border: 10px solid transparent;
	border-bottom-color: #000;
	}
	.wizard .nav-tabs>li a {
	width: 50px;
	height: 50px;
	margin: 0;
	border-radius: 100%;
	padding: 0;
	}
	.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;
	}
	.img-child-style {
	max-width: 170px;
	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;
	}
	.each-style-p img {
	max-width: 170px;
	width: 100%;
	height: 170px;
	object-fit: cover;
	}
	.each-style-p .input-hidden {
	position: absolute;
	left: -9999px;
	}
	.each-style-p input[type="radio"]:checked+label>img {
	border: 1px solid #fff;
	box-shadow: 0 0 3px 3px #e10174;
	}
	.each-style-p input[type="radio"]+label>img {
	border: 1px dashed #e10174;
	width: 170px;
	height: 170px;
	transition: 500ms all;
	padding: 3px;
	cursor: pointer;
	}
	.each-style-p input[type="radio"]:checked+label>img {
	transform: rotateZ(-8deg) rotateX(8deg);
	}
	.B-title {
	text-align: center;
	font-weight: 500;
	margin-top: 10px;
	font-size: 18px;
	color: #e10174;
	}
	.mb-30 {
	margin-bottom: 30px;
	}
	.lable-div p {
	font-size: 18px;
	font-weight: 600;
	}
	.text-area {
	width: 100%;
	}
	@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;
	}
	.img-child-style img,
	.each-style-p input[type="radio"]+label>img {
	width: 150px;
	height: 150px;
	}
	.B-title {
	font-size: 14px;
	line-height: 18px;
	}
	.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;
	}
	.wizard li.active:after {
	content: " ";
	position: absolute;
	left: 93%;
	}
	}
</style>
<section class="sizes-map signup-step-container">
	<div class="container">
		<div class="information-b text-center">
			<p>It is important that you check with the federation about the style of the bikini that you can and can't wear before sending us the information. If you are not sure which style best suits you, read more information about our available cut and style.</p>
		</div>
		<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>Choose 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>Choose 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 Information</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-3 col-xs-12 mb-30">
								<div class="flex-dx">
									<div class="img-child-style">
										<img src="img/top-p-500.png" class="image-Top">
									</div>
									<div class="image-child-style-2">
										<p>
											TOP STYLE
										</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="top-style" name="top-style"  class="input-hidden" />
										<label for="top-style"><img src="img/Push-Up-Underwire.jpg" alt="I'm happy"/></label>
										<p class="B-title">Molded Cups</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="top-style"  id="top-style-second"  class="input-hidden" />
										<label for="top-style-second"><img src="img/Regular-Moulded-Cup.jpg" alt="I'm happy"/></label>
										<p class="B-title">Adjustable Triangle Drawstring</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">Underwire</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/bottom-p.png" class="image-bottom">
									</div>
									<div class="image-child-style-2">
										<p>
											BOTTOM STYLE
										</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="Scoop-Front" name="bottom-style"  class="input-hidden" />
										<label for="Scoop-Front"><img src="img/bottom-1.jpg" alt="I'm happy"/></label>
										<p class="B-title">Regular Cut (Scoop Front)</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="bottom-style"  id="Straight-Front"  class="input-hidden" />
										<label for="Straight-Front"><img src="img/bottom-2.jpg" alt="I'm happy"/></label>
										<p class="B-title">Regular Cut (Straight Front)</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Scoop-Only" name="bottom-style"  class="input-hidden" />
										<label for="Scoop-Only"><img src="img/bottom-3.jpg" alt="I'm happy"/></label>
										<p class="B-title">High Cut (Available in Scoop Only)</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Regular" name="bottom-style"  class="input-hidden" />
										<label for="Regular"><img src="img/bottom-4.jpg" alt="I'm happy"/></label>
										<p class="B-title">Russian / Euro (Regular)</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="High-Waist" name="bottom-style"  class="input-hidden" />
										<label for="High-Waist"><img src="img/bottom-5.jpg" alt="I'm happy"/></label>
										<p class="B-title">Russian / Euro (High Waist)</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/COVERAGE.png" class="image-bottom">
									</div>
									<div class="image-child-style-2">
										<p>
											COVERAGE LEVEL
										</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="Pro" name="coverage-level"  class="input-hidden" />
										<label for="Pro"><img src="img/bottom-1.jpg" alt="I'm happy"/></label>
										<p class="B-title">Pro (20% Coverage)</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" name="coverage-level"  id="Brazilian"  class="input-hidden" />
										<label for="Brazilian"><img src="img/bottom-2.jpg" alt="I'm happy"/></label>
										<p class="B-title">Brazilian (25% Coverage)</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Cheeky" name="coverage-level"  class="input-hidden" />
										<label for="Cheeky"><img src="img/bottom-3.jpg" alt="I'm happy"/></label>
										<p class="B-title">Cheeky (30% Coverage)</p>
									</div>
									<div class="col-md-3 col-xs-6 each-style-p">
										<input type="radio" id="Moderate" name="coverage-level"  class="input-hidden" />
										<label for="Moderate"><img src="img/bottom-4.jpg" alt="I'm happy"/></label>
										<p class="B-title">Moderate (50% Coverage)</p>
									</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-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>
											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-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>
											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-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>
						<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>This is the information that will help us in calculating your bikini sizing. If you aren't sure about where you will be at in terms of body weight, it is best to speak to your coach first.</p>
							</div>
							<div class="col-md-10 col-md-offset-1 col-xs-12">
								<div class="row mb-30">
									<div class="col-md-12 col-xs-12 lable-div">
										<p>How tall are you?</p>
									</div>
									<div class="col-md-4 col-xs-6">
										<input type="number" class="form-control" name="" placeholder="Feet" value="" id="">
									</div>
									<div class="col-md-4 col-xs-6">
										<input type="number" class="form-control" name="" placeholder="Inches" value="" id="">
									</div>
									<div class="col-md-4 col-xs-6">
										<input type="number" class="form-control" name="" placeholder="CM" value="" id="">
									</div>
								</div>
								<div class="row mb-30">
									<div class="col-md-12 col-xs-12 lable-div">
										<p>How much do you weigh now?</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-12 col-xs-12 lable-div">
										<p>What is your expected stage weight?</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 off-season bra size?</p>
										</div>
										<div class="normal-div">
											<input type="number" class="form-control" name="" placeholder="Bra Size" value="" id="">
										</div>
									</div>
									<div class="col-md-6 col-md-12">
										<div class="normal-div lable-div">
											<p>Your anticipated bra size?</p>
										</div>
										<div class="normal-div">
											<input type="number" class="form-control" name="" placeholder="Bra Size" value="" id="">
										</div>
									</div>
								</div>
								<div class="row mb-30">
									<div class="col-md-12 col-xs-12 lable-div">
										<p>Anything else?</p>
									</div>
									<div class="col-md-4 col-xs-6">
										<textarea class="form-control text-area" rows="5"  placeholder="If there's any note/comment or special requirement, please enter it below."></textarea>
									</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">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>
<script>
	var e=[];
	jQuery(".B-title").each(function(){
	    e.push(jQuery(this).height())
	});
	var t=Math.max.apply(null,e);
	jQuery(".B-title").height(t);
</script>
<?php include("includes/footer.php");?>

${this.title}

Code Editor : styles-and-accessories.php