<link href="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//maxcdn.bootstrapcdn.com/bootstrap/4.1.1/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<div class="container">
<div class="row">
<div class="col-md-12">
<!-- ======= Property Search Section ======= -->
<div class="click-closed">closed</div>
<!--/ Form Search Star /-->
<div class="box-collapse">
<div class="title-box-d">
<h3 class="title-d">CASA Channel Partner</h3>
</div>
<span class="close-box-collapse right-boxed ion-ios-close"></span>
<div class="box-collapse-wrap form">
<form class="form-a">
<div class="row">
<div class="col-md-6 mb-2">
<div class="form-group">
<label for="Type">First Name <sup class="text-danger font-weight-bold">*</sup></label>
<input type="text" class="form-control form-control-lg form-control-a" required placeholder="First Name">
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label for="Type">Last Name <sup class="text-danger font-weight-bold">*</sup></label>
<input type="text" class="form-control form-control-lg form-control-a" required placeholder="Last Name">
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label for="Type">Email <sup class="text-danger font-weight-bold">*</sup></label>
<input type="email" class="form-control form-control-lg form-control-a" required placeholder="Email">
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label for="Type">Phone <sup class="text-danger font-weight-bold">*</sup></label>
<input type="text" class="form-control form-control-lg form-control-a" required placeholder="Phone">
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label for="Country">Country <sup class="text-danger font-weight-bold">*</sup></label>
<select class="form-control form-control-lg form-control-a" required id="country">
<option>All Country</option>
<option>Alabama</option>
<option>Arizona</option>
<option>California</option>
<option>Colorado</option>
</select>
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label for="city">City <sup class="text-danger font-weight-bold">*</sup></label>
<select class="form-control form-control-lg form-control-a" id="city">
<option>All City</option>
<option>Alabama</option>
<option>Arizona</option>
<option>California</option>
<option>Colorado</option>
</select>
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label for="Type">Pincode <sup class="text-danger font-weight-bold">*</sup></label>
<input type="text" required class="form-control form-control-lg form-control-a" placeholder="Pincode">
</div>
</div>
<div class="col-md-6 mb-2">
<div class="form-group">
<label for="Type">Landmark </label>
<input type="text" class="form-control form-control-lg form-control-a" placeholder="Landmark">
</div>
</div>
<div class="col-md-12 mb-2">
<div class="form-group">
<label for="Type">Full Address <sup class="text-danger font-weight-bold">*</sup></label>
<textarea required class="form-control form-control-lg form-control-a"></textarea>
</div>
</div>
<div class="col-md-12 mb-2">
<div class="termsx mb-2">
<p><strong><span style="font-size: x-large;">TERMS OF USE</span></strong></p>
<p><span style="font-size: medium;"><strong>In consideration of the service provided by the Channel Partner, the company shall pay the commission to the
channel partner in the following manner:</strong> </span></p>
<p>a)<span style="font-size: small;"> 2% in respect of all the projects present as well as future upcoming projects of the company of the flat cost after
the payment of 50% of the consideration value or on the execution and registration of the agreement of sale
whichever is earlier by the customer of the company. If the agreement has not been executed, the commission
may be released immediately, provided at least 50% of the consideration value has been paid.</span></p>
<p>b)<span style="font-size: small;"> All payment to channel partner shall be made in Indian currency after deduction of applicable taxes. The
payments at all the times be subject to being permitted and valid under applicable policies, laws, orders, and
regulations. </span></p>
<p>c)<span style="font-size: small;"> The channel Partner shall raise an invoice for the amounts payable by the company. Each invoice shall be
delivered to the address of the company, as specified by the company, by courier or by hand delivery and the
company agree to acknowledge the same. </span></p>
<p>d)<span style="font-size: small;"> In the event that the customer cancels or terminates the agreement of sale/allotment letter to purchase the
residence/s the company, will attempt to refund the sale consideration received under the agreement of sale, and
that channel partner shall forthwith within 15 days refund the commission received from the company for the sale
of the residence/s. In the event that the channel partner does not refund the commission to the company, the
company shall be entitled to adjust/deduct the refundable commission from any other commission payable to the
channel partner by the company or from the customer payments received. </span></p>
<p>e)<span style="font-size: small;"> Channel Partner/Brokers should come with the customer for his/her first site visit.</span></p>
</div>
</div>
<div class="col-md-12 my-4">
<div class="form-group">
<div class="check-box-sec">
<label class="container-box"> I agree to the terms and agreement.
<input type="checkbox" name="term" required class="form-control form-control-lg form-control-a">
<span class="checkmark"></span>
</label>
</div>
</div>
</div>
<div class="col-md-12">
<button type="submit" class="btn btn-b btn-block">Submit</button>
</div>
</div>
</form>
</div>
</div>
</div>
<button type="button" class="btn btn-b-n navbar-toggle-box-collapse d-none d-md-block" data-toggle="collapse" data-target="#navbarTogglerDemo01" aria-expanded="false">
open
</button>
</div>
</div>
/*======================================
//--//--> BOX COLAPSE
======================================*/
.box-collapse {
position: fixed;
top: 0;
bottom: 0;
right: 0;
width: 100%;
z-index: 1040;
background-color: #ffffff;
transform: translateX(100%);
transition: all 0.6s ease;
}
@media (min-width: 768px) {
.box-collapse {
width: 50%;
}
}
.box-collapse .title-box-d {
top: 30px;
left: 60px;
opacity: 0;
transition: all 1s ease;
transition-delay: .3s;
}
@media (max-width: 575px) {
.box-collapse .title-box-d {
left: 35px;
}
}
@media (max-width: 575px) {
.box-collapse .title-box-d .title-d {
font-size: 1.3rem;
}
}
.box-collapse-wrap {
opacity: 0;
position: absolute;
left: 0;
top: 6.5rem;
bottom: 5rem;
padding-left: 10%;
padding-right: 10%;
overflow-x: hidden;
overflow-y: auto;
margin: 0;
transform: translateY(3rem);
transition: transform 0.5s 0.5s ease, opacity 0.5s 0.5s ease;
}
.box-collapse-open .click-closed {
visibility: visible;
}
.box-collapse-open .box-collapse {
transform: translateX(0);
box-shadow: 0 0 65px rgba(0, 0, 0, 0.07);
opacity: 1;
}
.box-collapse-open .box-collapse .title-box-d {
transform: translate(0);
opacity: 1;
}
.box-collapse-open .box-collapse-wrap {
transform: translate(0);
opacity: 1;
}
.box-collapse-closed .box-collapse {
opacity: .7;
transition-delay: 0s;
}
.box-collapse-closed .box-collapse .title-box-d {
opacity: 0;
transition-delay: 0s;
}
.box-collapse-closed .box-collapse .form-a {
opacity: 0;
transition-delay: 0s;
}
.click-closed {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
visibility: hidden;
z-index: 1035;
background-color: #000000;
opacity: .4;
}
.close-box-collapse {
position: absolute;
z-index: 1050;
top: 2rem;
font-size: 3.5rem;
line-height: 1;
color: #000000;
cursor: pointer;
transition: all 0.3s ease;
}
.right-boxed {
right: 4.2857rem;
}
(function($) {
"use strict";
/*--/ Navbar Collapse /--*/
$('.navbar-toggle-box-collapse').on('click', function() {
$('body').removeClass('box-collapse-closed').addClass('box-collapse-open');
});
$('.close-box-collapse, .click-closed').on('click', function() {
$('body').removeClass('box-collapse-open').addClass('box-collapse-closed');
$('.menu-list ul').slideUp(700);
});
})(jQuery);
