@ -457,7 +457,12 @@
background: #fff;
border: 1px solid #d1d1d1
}
.trip_date_length { clear: both; padding-top: 5px;}
.trip_date_length {
clear: both;
padding-top: 5px;
}
#inquiryBox label {
font-weight: normal
}
@ -523,7 +528,8 @@
height: 130px;
}
.checkboxLabel input[type="checkbox"]+label, .checkboxLabel input[type="radio"]+label {
.checkboxLabel input[type="checkbox"]+label,
.checkboxLabel input[type="radio"]+label {
font-size: 21px;
padding: 5px 0;
border: 1px solid #d1d1d1;
@ -539,7 +545,8 @@
font-family: Calibri;
}
.checkboxLabel input[type="checkbox"]:checked+label, .checkboxLabel input[type="radio"]:checked+label {
.checkboxLabel input[type="checkbox"]:checked+label,
.checkboxLabel input[type="radio"]:checked+label {
border: 1px solid #ad1818;
color: #fff;
width: 100%;
@ -556,7 +563,11 @@
.checkboxLabel input {
display: none
}
.destination { width: 23.6%;}
.destination {
width: 23.6%;
}
#name_error_msg,
#email_error_msg,
#nation_error_msg,
@ -608,7 +619,8 @@
background: #ad1818;
}
.checkboxLabel input[type="checkbox"]+label:hover, .checkboxLabel input[type="radio"]+label:hover {
.checkboxLabel input[type="checkbox"]+label:hover,
.checkboxLabel input[type="radio"]+label:hover {
border: 1px solid #ad1818;
cursor: pointer;
color: #fff;
@ -782,7 +794,8 @@
.formNote {
color: #777;
font-size: 18px
font-size: 18px;
display: block;
}
.minaddBtn:hover {
@ -842,7 +855,8 @@
top: -3px;
}
#Date_Start, #expectedMonth {
#Date_Start,
#expectedMonth {
float: left;
margin-right: 20px;
font-size: 19px;
@ -1114,7 +1128,10 @@ margin-top: 5px;
background-size: 70px !important;
}
label.hotelText { font-size:18px !important;}
label.hotelText {
font-size: 18px !important;
}
#destination_error_msg,
#hotel_error_msg,
#number_error_msg,
@ -1124,7 +1141,8 @@ margin-top: 5px;
#date_error_msg,
#contact_error_msg,
#email_verify_msg,
#requirement_error_msg, #group_error_msg {
#requirement_error_msg,
#group_error_msg {
color: #ad1818;
font-size: 19px;
border-bottom: 2px dashed #ad1818;
@ -1132,7 +1150,9 @@ margin-top: 5px;
font-weight: 600;
padding-bottom: 3px;
}
.destination_category { font-size: 20px;
.destination_category {
font-size: 20px;
width: fit-content;
clear: both;
padding-top: 20px;
@ -1140,7 +1160,9 @@ margin-top: 5px;
font-weight: 600;
color: #ad1818;
text-align: center;
margin: 0 auto;}
margin: 0 auto;
}
.budget {font-size: 19px; margin-bottom: 10px;}
< / style >
< / head >
@ -1171,7 +1193,8 @@ margin: 80px auto 10px auto;
font-style: italic;
">* means required.< / p >
< div id = "inquiryBox" style = "position: relative;" >
< img alt = "Asia Highlights' Trust Pilot rating" src = "https://data.asiahighlights.com/image/forms/ah-tm-form-tp-rating.png" style = "position: absolute ;
< img alt = "Asia Highlights' Trust Pilot rating"
src="https://data.asiahighlights.com/image/forms/ah-tm-form-tp-rating.png" style="position: absolute;
width: 150px;
top: 0px;
right: 5px;">
@ -1179,7 +1202,9 @@ right: 5px;">
< h3 id = "destination_select" style = " margin-top: 30px;" >
< em > *< / em > Where would you go?
< / h3 >
< p style = "padding-right: 80px;" > A vast majority of our esteemed clients opt to explore 2– 3 captivating Asian destinations in a single, awe-inspiring trip. The most popular duos and trios are:< / p >
< p style = "padding-right: 80px;" > A vast majority of our esteemed clients opt to explore 2– 3
captivating Asian destinations in a single, awe-inspiring trip. The most popular duos and trios
are:< / p >
< ul class = "InfoList" >
< li > Japan, China (15– 25 days)< / li >
< li > Thailand, Vietnam, Cambodia (12– 20 days)< / li >
@ -1267,7 +1292,8 @@ right: 5px;">
< / div >
< div class = "selectionBlock" >
< p style = "margin-bottom: 5px; margin-top: 30px;" > Let us know here if you'd like to visit any other places not listed above, e.g. South Korea, Myanmar…< / p >
< p style = "margin-bottom: 5px; margin-top: 30px;" > Let us know here if you'd like to visit any other
places not listed above, e.g. South Korea, Myanmar…< / p >
< input name = "other_destinations" style = "height: 35px ;
width: 92%;
@ -1278,35 +1304,84 @@ right: 5px;">
font-family: Calibri;">
< / div >
< / div >
< div id = "inquiryBox" >
< div class = "selectionBlock" >
< h3 > Do you have a general idea of the budget for your tour?< / h3 >
< p > Asia Highlights is dedicated to providing a premium private guided tour service, including
hand-picked hotels, the must-sees and unique local experiences, a local English-speaking guide,
and a comfortable private vehicle with a driver. < br >
Our prices below are for a group of 2– 6 people excluding pre- and post-tour flights:< / p >
< div class = "budget" >
< label for = "Mid-range" >
< input type = "checkbox" value = "Mid-range: about US$250 per person per day (about US$500 in Japan)" name = "budget_range" id = "Mid-range"
class="checkBorder" style="margin-right: 10px;">< strong > Mid-range:< / strong > about US$250 per person per day (about US$500 in Japan)< / label >
< / div >
< div class = "budget" >
< label for = "Comfort" >
< input type = "checkbox" value = "Comfort: about US$300 per person per day (about US$700 in Japan)" name = "budget_range" id = "Comfort"
class="checkBorder" style="margin-right: 10px;">< strong > Comfort:< / strong > about US$300 per person per day (about US$700 in Japan)< / label >
< / div >
< div class = "budget" >
< label for = "Standard" >
< input type = "checkbox" value = "Standard: about US$200 per person per day (about US$400 in Japan)" name = "budget_range" id = "Standard"
class="checkBorder" style="margin-right: 10px;">< strong > Standard:< / strong > about US$200 per person per day (about US$400 in Japan)< / label >
< / div >
< div class = "budget" >
< label for = "higher" >
< input type = "checkbox" value = "pay more for a higher level of travel service" name = "budget_range" id = "higher"
class="checkBorder" style="margin-right: 10px;">I'm willing to pay more for a higher level of travel service.< / label >
< div id = "budgetTipsBlock" style = "display: none;" >
< span class = "formNote" > Please let us know your expectations, for example: I usually stay in hotels costing from US$xxx per room per night; I want to take business/first class flights...< / span >
< div class = "inputTerm" >
< input type = "text" name = "name" required = "" >
< / div >
< / div >
< / div >
< div class = "budget" >
< label for = "specific" >
< input type = "checkbox" value = "I don't have a specific budget in mind." name = "contact_via_WhatsApp" id = "specific"
class="checkBorder" style="margin-right: 10px;">I don't have a specific budget in mind.< / label >
< / div >
< h4 > Any additional information you'd like to share about your budget?< / h4 >
< textarea id = "budget_requirements" name = "budget_requirements" style = "resize:none;" > < / textarea >
< / div >
< / div >
< div id = "inquiryBox" >
< div class = "selectionBlock" >
< h3 id = "dateselect" >
< em > *< / em > When would you travel?
< / h3 > < div id = "date_error_msg" class = "hidden" > (select at least one option.)< / div >
< em > *< / em > What's your arrival date?
< / h3 >
< div id = "date_error_msg" class = "hidden" > (select at least one option.)< / div >
< div class = "checkboxLabel" >
< input type = "radio" value = "exact travel dates" id = "exact" name = "trip_date" >
< input type = "radio" value = "exact arrival date " id = "exact" name = "trip_date" >
< label for = "exact" class = "updatedestination" style = "font-size: 20px;" >
Exact travel dates
Exact arrival date
< / label >
< / div >
< div class = "checkboxLabel" >
< input type = "radio" value = "approximate travel dates" id = "approximate" name = "trip_date" >
< input type = "radio" value = "approximate arriva l dates" id = "approximate" name = "trip_date" >
< label for = "approximate" class = "updatedestination" style = "font-size: 20px;" >
Approximate travel dates
Approximate arriva l dates
< / label >
< / div >
< div class = "checkboxLabel" >
< input type = "radio" value = "Undecided travel dates" id = "yet" name = "trip_date" >
< input type = "radio" value = " undecided arriva l dates" id = "yet" name = "trip_date" >
< label for = "yet" class = "updatedestination" style = "font-size: 20px;" >
Undecided travel dates
Undecided arriva l dates
< / label >
< / div >
< div class = "trip_date_length" id = "tripDateBlock" style = "display: none" >
< h4 > Select your travel date and trip length (days).< / h4 >
< div id = "dateSelectionBlock" >
< input type = "text" class = "arrivalDate datepicker" id = "Date_Start" name = "date_start" value = "" placeholder = "mm/dd/yyyy" autocomplete = "off" >
< input type = "month" id = "expectedMonth" name = "expected_month" placeholder = "Select your expected travel date." >
< input type = "text" class = "arrivalDate datepicker" id = "Date_Start" name = "date_start" value = ""
placeholder="mm/dd/yyyy" autocomplete="off">
< input type = "month" id = "expectedMonth" name = "expected_month"
placeholder="Select your expected travel date.">
< / div >
< div class = "peopleSelect" >
< div class = "numberBtn" >
@ -1316,9 +1391,11 @@ right: 5px;">
< / div >
< / div >
< div id = "expectedTravelDateBlock" style = "display: none" >
< p style = "margin-bottom:5px;" > Any additional information about your anticipated travel dates?< / p >
< p style = "margin-bottom:5px;" > Any additional information about your anticipated travel
dates?< / p >
< span class = "formNote" >
E.g.: I want to start my trip when the weather at its best/during the local festival/during the off season/on the first week of the November…
E.g.: I want to start my trip when the weather at its best/during the local
festival/during the off season/on the first week of the November…
< / span >
< textarea id = "date_requirements" name = "date_requirements" style = "resize:none;" > < / textarea >
< / div >
@ -1333,7 +1410,9 @@ right: 5px;">
< h3 id = "travelGroupHeader" >
< em > *< / em > How would you travel?
< / h3 >
< span class = "formNote" > Please select 'Family' / 'Couple' even if you are traveling with other families/couples, as this will help us tailor your itinerary to your specific family/couple requirements.< / span >
< span class = "formNote" > Please select 'Family' / 'Couple' even if you are traveling with other
families/couples, as this will help us tailor your itinerary to your specific family/couple
requirements.< / span >
< div id = "group_error_msg" class = "hidden" > (Please
select at least one option.)< / div >
< div class = "genderSelection" >
@ -1390,27 +1469,32 @@ right: 5px;">
< / p >
< div class = "checkYes" >
< label for = "65+" >
< input type = "checkbox" value = "yes" name = "age_65_plus" id = "65+" class = "checkBorder" > 65+
< input type = "checkbox" value = "yes" name = "age_65_plus" id = "65+"
class="checkBorder">65+
< / label >
< / div >
< div class = "checkYes" >
< label for = "51-64" >
< input type = "checkbox" value = "yes" name = "age_51_64" id = "51-64" class = "checkBorder" > 51-64
< input type = "checkbox" value = "yes" name = "age_51_64" id = "51-64"
class="checkBorder">51-64
< / label >
< / div >
< div class = "checkYes" >
< label for = "41-50" >
< input type = "checkbox" value = "yes" name = "age_41_50" id = "41-50" class = "checkBorder" > 41-50
< input type = "checkbox" value = "yes" name = "age_41_50" id = "41-50"
class="checkBorder">41-50
< / label >
< / div >
< div class = "checkYes" >
< label for = "31-40" >
< input type = "checkbox" value = "yes" name = "age_31_40" id = "31-40" class = "checkBorder" > 31-40
< input type = "checkbox" value = "yes" name = "age_31_40" id = "31-40"
class="checkBorder">31-40
< / label >
< / div >
< div class = "checkYes" >
< label for = "18-30" >
< input type = "checkbox" value = "yes" name = "age_18_30" id = "18-30" class = "checkBorder" > 18-30
< input type = "checkbox" value = "yes" name = "age_18_30" id = "18-30"
class="checkBorder">18-30
< / label >
< / div >
< / div >
@ -1425,7 +1509,8 @@ right: 5px;">
< / span >
< div class = "numberBtn" >
< input class = "minaddBtn reducechild" id = "minusTeenager" type = "button" value = "-" >
< input class = "kidNum" type = "text" id = "teenagerNumber" value = "0" name = "teenager_10_17_yrs" >
< input class = "kidNum" type = "text" id = "teenagerNumber" value = "0"
name="teenager_10_17_yrs">
< input class = "minaddBtn addchild" id = "plusTeenager" type = "button" value = "+" >
< / div >
< / div >
@ -1460,7 +1545,8 @@ right: 5px;">
< / h3 >
< span class = "formNote" >
Japan and Singapore are renowned for relatively higher hotel costs compared to other Asian destinations.
Japan and Singapore are renowned for relatively higher hotel costs compared to other Asian
destinations.
< / span >
< div id = "hotel_error_msg" class = "hidden" > (Please select
one option. It can be changed later.)< / div >
@ -1505,7 +1591,8 @@ right: 5px;">
< h4 > Any specific preferences or requests for your hotel stay?< / h4 >
< span class = "formNote" > E.g.:
1. Family room for 2 adults and 2 children< br >
2. Interested in spending a few nights in local boutique hotels, like floating houses in Southeast
2. Interested in spending a few nights in local boutique hotels, like floating houses in
Southeast
3. Asia, ryokans in Japan, small villa with private pool…< br >
4. Adult-only hotels< br >
5. Hotel location: near city center/at the seaside/convenient for exploring the nearby area…< br >
@ -1516,14 +1603,7 @@ right: 5px;">
< div id = "inquiryBox" >
< div class = "selectionBlock" >
< h3 > This is a big trip for:< / h3 >
< div class = "travelStyle" id = "trip4Bucket" >
< input type = "checkbox" value = "Bucket list trip" id = "Bucket" name = "interests[]" >
< label for = "Bucket" data-clickable = "" >
< div class = "smallTag" >
< div class = "styleText" > Bucket list trip< / div >
< / div >
< / label >
< / div >
< div class = "travelStyle" id = "trip4Retirement" >
< input type = "checkbox" value = "Enjoying retirement" id = "enjoying retirement" name = "interests[]" >
< label for = "enjoying retirement" data-clickable = "" >
@ -1547,14 +1627,6 @@ right: 5px;">
< div class = "styleText" > Retirement gift< / div >
< / div >
< / label >
< / div >
< div class = "travelStyle" id = "trip4Work" >
< input type = "checkbox" value = "Career break" id = "break" name = "interests[]" >
< label for = "break" data-clickable = "" >
< div class = "smallTag" >
< div class = "styleText" > Career break< / div >
< / div >
< / label >
< / div >
< div class = "travelStyle" id = "trip4Birthday" >
< input type = "checkbox" value = "Birthday" id = "Birthday" name = "interests[]" >
@ -1610,13 +1682,17 @@ right: 5px;">
< / div >
< / label >
< / div >
< / div > < / div >
< / div >
< / div >
< div id = "inquiryBox" >
< h3 id = "TellUsaboutYou" >
< em > *< / em > Your contact information
< / h3 >
< span class = "formNote" > By using WhatsApp, we can provide a more interactive and personalized experience, allowing us to cater to your needs and address any concerns in real-time.< br > We will keep your phone number and other data secure. See our < a href = "/privacy" target = "_blank" style = "color: #000; text-decoration:none;" > < em > Privacy Policy< / em > < / a > .< / span >
< span class = "formNote" > By using WhatsApp, we can provide a more interactive and personalized experience,
allowing us to cater to your needs and address any concerns in real-time.< br > We will keep your
phone number and other data secure. See our < a href = "/privacy" target = "_blank"
style="color: #000; text-decoration:none;">< em > Privacy Policy< / em > < / a > .< / span >
< span id = "name_error_msg" class = "hidden" > (Please fill out this
field.)< / span >
@ -1640,7 +1716,8 @@ right: 5px;">
< div class = "inputTerm" style = "margin-bottom: -10px;" >
< select class = "country_code" name = "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 >
< option style = "font-weight: 600;" value = "United Kingdom +44" > United Kingdom +44
< / option >
< option style = "font-weight: 600;" value = "Australia +61" > Australia +61< / option >
< option style = "font-weight: 600;" value = "Canada +1" > Canada +1< / option >
< option style = "font-weight: 600;" value = "France +33" > France +33< / option >
@ -1678,7 +1755,8 @@ right: 5px;">
< option value = "Bosnia and Herzegovina +387" > Bosnia and Herzegovina +387< / option >
< option value = "Botswana +267" > Botswana +267< / option >
< option value = "Brazil +55" > Brazil +55< / option >
< option value = "British Indian Ocean Territory +246" > British Indian Ocean Territory +246< / option >
< option value = "British Indian Ocean Territory +246" > British Indian Ocean Territory
+246< / option >
< option value = "British Virgin Islands +1" > British Virgin Islands +1284< / option >
< option value = "Brunei +673" > Brunei +673< / option >
< option value = "Bulgaria +359" > Bulgaria +359< / option >
@ -1832,8 +1910,10 @@ right: 5px;">
< option value = "Saint Kitts and Nevis +1" > Saint Kitts and Nevis +1869< / option >
< option value = "Saint Lucia +1" > Saint Lucia +1758< / option >
< option value = "Saint Martin +590" > Saint Martin +590< / option >
< option value = "Saint Pierre and Miquelon +508" > Saint Pierre and Miquelon +508< / option >
< option value = "Saint Vincent and the Grenadines +1" > Saint Vincent and the Grenadines +1784< / option >
< option value = "Saint Pierre and Miquelon +508" > Saint Pierre and Miquelon +508
< / option >
< option value = "Saint Vincent and the Grenadines +1" > Saint Vincent and the Grenadines
+1784< / option >
< option value = "Samoa +685" > Samoa +685< / option >
< option value = "San Marino +378" > San Marino +378< / option >
< option value = "São Tomé and Príncipe +239" > São Tomé and Príncipe +239< / option >
@ -1903,14 +1983,16 @@ right: 5px;">
">I prefer to be contacted via:< / p >
< div class = "checkYes" >
< label for = "whatsapp" >
< input type = "checkbox" value = "yes" name = "contact_via_WhatsApp" id = "whatsapp" class = "checkBorder" style = "
< input type = "checkbox" value = "yes" name = "contact_via_WhatsApp" id = "whatsapp" class = "checkBorder"
style="
margin-right: 10px;
">WhatsApp
< / label >
< / div >
< div class = "checkYes" >
< label for = "iMessage" >
< input type = "checkbox" value = "yes" name = "contact_via_iMessage" id = "iMessage" class = "checkBorder" style = "
< input type = "checkbox" value = "yes" name = "contact_via_iMessage" id = "iMessage" class = "checkBorder"
style="
margin-right: 5px;
margin-right: 10px;
">iMessage
@ -1918,14 +2000,16 @@ margin-right: 10px;
< / div >
< div class = "checkYes" >
< label for = "Phone call" >
< input type = "checkbox" value = "yes" name = "contact_via_phone_call" id = "Phone call" class = "checkBorder" style = "
< input type = "checkbox" value = "yes" name = "contact_via_phone_call" id = "Phone call"
class="checkBorder" style="
margin-right: 10px;
">Phone call
< / label >
< / div >
< div class = "checkYes" >
< label for = "Video appointment" >
< input type = "checkbox" value = "yes" name = "contact_via_video_appointment" id = "Video appointment" class = "checkBorder" style = "
< input type = "checkbox" value = "yes" name = "contact_via_video_appointment" id = "Video appointment"
class="checkBorder" style="
margin-right: 10px;
">Video appointment
< / label >
@ -1939,14 +2023,16 @@ margin-right: 10px;
< / h3 >
< span class = "formNote" > E.g.: 1. My budget range for this big trip is around…
< br > 2. This is a big trip for my husband's birthday, our 20-year anniversary, honeymoon, retirement, kid's graduation, bucket list…
< br > 2. This is a big trip for my husband's birthday, our 20-year anniversary, honeymoon,
retirement, kid's graduation, bucket list…
< br > 3. Our must-dos/must-sees for this big trip are…
< br > 4. This will be my first/second/… visit to…
< / span >
< div id = "requirement_error_msg" class = "hidden" > (Please
specify your requests.)< / div >
< textarea id = "additionalrequirements" name = "additional_requirements" style = "resize:none;" > < / textarea >
< textarea id = "additionalrequirements" name = "additional_requirements"
style="resize:none;">< / textarea >
< / div >
@ -2127,6 +2213,17 @@ margin-right: 10px;
var childrenNumber = $childrenNumberInput.val();
var $infantNumberInput = $('#infantNumber');
var infantNumber = $infantNumberInput.val();
var budgetTipsBlock = $('#budgetTipsBlock');
$('input[name="budget_range"]').each((i, budgetEle) => {
$(budgetEle).click(function (e) {
var currentTarget = e.currentTarget;
if (currentTarget.id === 'higher') {
const noMatter = currentTarget.checked ? budgetTipsBlock.show() : budgetTipsBlock.hide();
}
})
});
$('input[name="travel_group"]').each((i, groupEle) => {
$(groupEle).click(function (e) {