|
|
|
@ -44,113 +44,157 @@
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div id="adultBlock" style="display: none">
|
|
|
|
|
<p style="margin-bottom: 10px;"><strong>Adults number (age ≥ 18 years old)</strong></p>
|
|
|
|
|
<p style="margin-top: 0;margin-bottom: 0;"><strong>Adults number (age ≥ 18 years old)</strong></p>
|
|
|
|
|
<div class="kids_age">
|
|
|
|
|
|
|
|
|
|
<select class="kids_number" id="adultNumber_65_plus" name="adult_18_plus" >
|
|
|
|
|
<option value="0">0</option>
|
|
|
|
|
<option value="1">1</option>
|
|
|
|
|
<option value="2">2</option>
|
|
|
|
|
<option value="3">3</option>
|
|
|
|
|
<option value="4">4</option>
|
|
|
|
|
<option value="5">5</option>
|
|
|
|
|
<option value="6">6</option>
|
|
|
|
|
<option value="7">7</option>
|
|
|
|
|
<option value="8">8</option>
|
|
|
|
|
<option value="9">9</option>
|
|
|
|
|
<option value="10">10</option>
|
|
|
|
|
<option value="11">11</option>
|
|
|
|
|
<option value="12">12</option>
|
|
|
|
|
<option value="13">13</option>
|
|
|
|
|
<option value="14">14</option>
|
|
|
|
|
<option value="15">15</option>
|
|
|
|
|
<option value="16">16</option>
|
|
|
|
|
<option value="17">17</option>
|
|
|
|
|
<option value="18">18</option>
|
|
|
|
|
<option value="19">19</option>
|
|
|
|
|
<option value="20">20</option>
|
|
|
|
|
<option value="21">21</option>
|
|
|
|
|
<option value="22">22</option>
|
|
|
|
|
<option value="23">23</option>
|
|
|
|
|
<option value="24">24</option>
|
|
|
|
|
<option value="25">25</option>
|
|
|
|
|
<option value="26">26</option>
|
|
|
|
|
<option value="27">27</option>
|
|
|
|
|
<option value="28">28</option>
|
|
|
|
|
<option value="29">29</option>
|
|
|
|
|
<option value="30">30</option>
|
|
|
|
|
|
|
|
|
|
<option value="1">1 person</option>
|
|
|
|
|
<option value="2">2 people</option>
|
|
|
|
|
<option value="3">3 people</option>
|
|
|
|
|
<option value="4">4 people</option>
|
|
|
|
|
<option value="5">5 people</option>
|
|
|
|
|
<option value="6">6 people</option>
|
|
|
|
|
<option value="7">7 people</option>
|
|
|
|
|
<option value="8">8 people</option>
|
|
|
|
|
<option value="9">9 people</option>
|
|
|
|
|
<option value="10">10 people</option>
|
|
|
|
|
<option value="11">11 people</option>
|
|
|
|
|
<option value="12">12 people</option>
|
|
|
|
|
<option value="13">13 people</option>
|
|
|
|
|
<option value="14">14 people</option>
|
|
|
|
|
<option value="15">15 people</option>
|
|
|
|
|
<option value="16">16 people</option>
|
|
|
|
|
<option value="17">17 people</option>
|
|
|
|
|
<option value="18">18 people</option>
|
|
|
|
|
<option value="19">19 people</option>
|
|
|
|
|
<option value="20">20 people</option>
|
|
|
|
|
<option value="21">21 people</option>
|
|
|
|
|
<option value="22">22 people</option>
|
|
|
|
|
<option value="23">23 people</option>
|
|
|
|
|
<option value="24">24 people</option>
|
|
|
|
|
<option value="25">25 people</option>
|
|
|
|
|
<option value="26">26 people</option>
|
|
|
|
|
<option value="27">27 people</option>
|
|
|
|
|
<option value="28">28 people</option>
|
|
|
|
|
<option value="29">29 people</option>
|
|
|
|
|
<option value="30">30 people</option>
|
|
|
|
|
<option value="31">31 or more people</option>
|
|
|
|
|
</select>
|
|
|
|
|
<p style="
|
|
|
|
|
margin-top: 5px;font-size: 18px;
|
|
|
|
|
">people</p>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
<div class="clear"></div>
|
|
|
|
|
<div id="childrenBlock" style="display: none">
|
|
|
|
|
<p style="margin-bottom: 10px;"><strong>Children number</strong></p>
|
|
|
|
|
<p style="margin-top: 0;margin-bottom: 0;"><strong>Children number</strong></p>
|
|
|
|
|
<div class="kids_age">
|
|
|
|
|
<p style="margin-bottom: 5px;">10-17 yrs old</p>
|
|
|
|
|
<select class="kids_number" id="teenagerNumber" name="teenager_10_17">
|
|
|
|
|
<select class="kids_number" id="teenagerNumber" name="teenager_10_17_yrs">
|
|
|
|
|
<option value="0">0</option>
|
|
|
|
|
<option value="1">1</option>
|
|
|
|
|
<option value="2">2</option>
|
|
|
|
|
<option value="3">3</option>
|
|
|
|
|
<option value="4">4</option>
|
|
|
|
|
<option value="5">5</option>
|
|
|
|
|
<option value="1">1 person</option>
|
|
|
|
|
<option value="2">2 people</option>
|
|
|
|
|
<option value="3">3 people</option>
|
|
|
|
|
<option value="4">4 people</option>
|
|
|
|
|
<option value="5">5 or more people</option>
|
|
|
|
|
</select>
|
|
|
|
|
<p style="
|
|
|
|
|
margin-top: 10px;font-size: 18px;
|
|
|
|
|
">people</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="kids_age">
|
|
|
|
|
<p style="margin-bottom: 5px;">3-9 yrs old</p>
|
|
|
|
|
<select class="kids_number" id="childrenNumber" name="children_3_9">
|
|
|
|
|
<select class="kids_number" id="childrenNumber" name="children_3_9_yrs">
|
|
|
|
|
<option value="0">0</option>
|
|
|
|
|
<option value="1">1</option>
|
|
|
|
|
<option value="2">2</option>
|
|
|
|
|
<option value="3">3</option>
|
|
|
|
|
<option value="4">4</option>
|
|
|
|
|
<option value="5">5</option>
|
|
|
|
|
<option value="1">1 person</option>
|
|
|
|
|
<option value="2">2 people</option>
|
|
|
|
|
<option value="3">3 people</option>
|
|
|
|
|
<option value="4">4 people</option>
|
|
|
|
|
<option value="5">5 or more people</option>
|
|
|
|
|
</select>
|
|
|
|
|
<p style="
|
|
|
|
|
margin-top: 10px;font-size: 18px;
|
|
|
|
|
">people</p>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="kids_age">
|
|
|
|
|
<p style="margin-bottom: 5px;">0-2 yrs old</p>
|
|
|
|
|
<select class="kids_number" id="infantNumber" name="infant_0_2">
|
|
|
|
|
<select class="kids_number" id="infantNumber" name="infant_0_2_yrs">
|
|
|
|
|
<option value="0">0</option>
|
|
|
|
|
<option value="1">1</option>
|
|
|
|
|
<option value="2">2</option>
|
|
|
|
|
<option value="3">3</option>
|
|
|
|
|
<option value="4">4</option>
|
|
|
|
|
<option value="5">5</option>
|
|
|
|
|
<option value="1">1 person</option>
|
|
|
|
|
<option value="2">2 people</option>
|
|
|
|
|
<option value="3">3 people</option>
|
|
|
|
|
<option value="4">4 people</option>
|
|
|
|
|
<option value="5">5 or more people</option>
|
|
|
|
|
</select>
|
|
|
|
|
<p style="
|
|
|
|
|
margin-top: 10px;font-size: 18px;
|
|
|
|
|
">people</p>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<input class="InquiryCalendar" data-min-date="7" id="starting_date"
|
|
|
|
|
name="date_start" placeholder="Starting date" readonly="readonly"
|
|
|
|
|
type="text"/><span id="starting_date_errmsg" style="display: none"><span
|
|
|
|
|
class="requiredArea">Please enter your starting date.</span></span>
|
|
|
|
|
|
|
|
|
|
<div class="selectionBlock" style="margin-bottom: 10px;">
|
|
|
|
|
<p style="text-align: left; font-weight: 400; padding-bottom: 0;">
|
|
|
|
|
When would you travel?
|
|
|
|
|
</p>
|
|
|
|
|
<div id="date_error_msg" style="display: none">
|
|
|
|
|
<div class="requiredArea" style="margin-top:-10px;">Select your travel data.</div>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="travel_group date_select" >
|
|
|
|
|
<input type="radio" value="exact travel dates" id="exact" name="trip_date">
|
|
|
|
|
<label for="exact" class="updatedestination" style="font-size: 18px;">
|
|
|
|
|
Exact travel dates
|
|
|
|
|
</label>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="travel_group date_select" >
|
|
|
|
|
<input type="radio" value="approximate travel dates" id="approximate" name="trip_date">
|
|
|
|
|
<label for="approximate" class="updatedestination" style="font-size: 18px;">
|
|
|
|
|
Approximate travel dates
|
|
|
|
|
</label>
|
|
|
|
|
</div>
|
|
|
|
|
<div class="travel_group date_select" >
|
|
|
|
|
<input type="radio" value="haven't decided travel dates" id="yet" name="trip_date">
|
|
|
|
|
<label for="yet" class="updatedestination" style="font-size: 18px;">
|
|
|
|
|
Not decided travel dates
|
|
|
|
|
</label>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<div class="trip_date_length" id="tripDateBlock" style="display: none">
|
|
|
|
|
<p style="text-align: left; font-weight: 400; font-size: 19px;">Select your travel date and trip length (days).</p>
|
|
|
|
|
<div id='dateSelectionBlock'>
|
|
|
|
|
<div id='flatpickrBlock'>
|
|
|
|
|
<input type="text" class="arrivalDate datepicker" id="starting_date" name="date_start" value="" placeholder="mm/dd/yyyy" autocomplete="off" style="width: auto;
|
|
|
|
|
float: left;
|
|
|
|
|
margin-right: 15px;
|
|
|
|
|
border-radius: 6px;
|
|
|
|
|
padding: 0 15px;">
|
|
|
|
|
</div>
|
|
|
|
|
<input type="month" id="expectedMonth" name="expected_month" placeholder="Select your expected travel date." style="width: auto;
|
|
|
|
|
float: left;
|
|
|
|
|
margin-right: 15px;
|
|
|
|
|
border-radius: 6px;
|
|
|
|
|
padding: 0 15px;
|
|
|
|
|
margin-bottom:15px;">
|
|
|
|
|
</div>
|
|
|
|
|
<div class="peopleSelect">
|
|
|
|
|
<div class="numberBtn">
|
|
|
|
|
<input class="minaddBtn" id="tripLengthMinus" type="button" value="-">
|
|
|
|
|
<input class="number" type="text" value="14" id="tripLengthNumber" name="trip_length" style="margin-right: 5px;">
|
|
|
|
|
<input class="minaddBtn" id="tripLengthPlus" type="button" value="+">
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
</div>
|
|
|
|
|
|
|
|
|
|
<p>
|
|
|
|
|
<span class="inquiry_form_tag"><img src="https://data.chinahighlights.com/pic/input-name.png">
|
|
|
|
|
<span class="form_required">*</span>
|
|
|
|
|
</span>
|
|
|
|
|
<input class="FullName" id="realname" name="name" placeholder="Your name" type="text"/>
|
|
|
|
|
<span id="realname_errmsg" style="display: none"><span class="requiredArea">Please enter your name.</span></span>
|
|
|
|
|
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<p>
|
|
|
|
|
<span class="inquiry_form_tag"><img src="https://data.chinahighlights.com/pic/input-email.png">
|
|
|
|
|
<span class="form_required">*</span></span>
|
|
|
|
|
<input class="EmailAddress" id="email" name="email" placeholder="Email" type="text"/>
|
|
|
|
|
<span id="email_errmsg" style="display: none"><span class="requiredArea">Please enter your email.</span></span>
|
|
|
|
|
<span id="email_verify_errmsg" style="display: none"><span class="requiredArea">Please verify your email.</span></span>
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
|
</p>
|
|
|
|
|
|
|
|
|
|
<p>
|
|
|
|
|
<select name="country_code" class="country_code">
|
|
|
|
|
<option style="font-weight: 600;" value="United States +1">United States +1</option>
|
|
|
|
|
<option style="font-weight: 600;" value="United Kingdom +44">United Kingdom +44</option>
|
|
|
|
@ -405,10 +449,10 @@
|
|
|
|
|
<option value="Åland Islands +385">Åland Islands +35818</option>
|
|
|
|
|
</select>
|
|
|
|
|
<input class="Inquiryphone" id="PhoneNo" name="PhoneNo"
|
|
|
|
|
placeholder="Phone number *" type="tel"/>
|
|
|
|
|
placeholder="Phone number *" type="tel"/></p>
|
|
|
|
|
<span id="phone_errmsg" style="display: none"><span class="requiredArea">Please enter your phone number.</span></span>
|
|
|
|
|
|
|
|
|
|
<p style="margin-top: 10px;margin-bottom: 10px;padding: 0;text-align: left;font-size: 20px;font-weight: 300;">I prefer to be contacted via:</p>
|
|
|
|
|
<p style="margin-top: 0;margin-bottom: 10px;padding: 0;text-align: left;font-size: 20px;font-weight: 300;">I prefer to be contacted via:</p>
|
|
|
|
|
<div class="checkYes"><label for="WeChat"><input class="checkBorder" id="WeChat" name="contact_via_WeChat" type="checkbox" value="yes">WeChat</label></div>
|
|
|
|
|
<div class="checkYes"><label for="WhatsApp"><input class="checkBorder" id="WhatsApp" name="contact_via_WhatsApp" type="checkbox" value="yes">WhatsApp </label></div>
|
|
|
|
|
<div class="checkYes"><label for="Phone"><input class="checkBorder" id="Phone" name="contact_via_phone_call" type="checkbox" value="yes">Phone call</label></div>
|
|
|
|
|