@charset "utf-8";
/* CSS Document */

:root{
	--theme-color: #3aabdc;
}

:after, :before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

body{font-family: sans-serif;}

.custom-form {margin:0 auto; border:1px solid var(--theme-color); padding:20px; background: #eeeeee54;}
.custom-form .select{width: 65%; border: 1px solid #cbc6c6;margin-bottom: 20px; font-size: 16px; position:relative; display: inline-block;}
.custom-form input[type="text"], .custom-form input[type="email"], .custom-form input[type="tel"]{width: 65%; border: 1px solid #cbc6c6;margin-bottom: 20px; font-size: 16px; position:relative; display: inline-block;}
.sel{ width:100%;background-color: #ededed; border:none; padding: 5px;}
.custom-form input[type="email"], .custom-form input[type="text"], .custom-form input[type="tel"] {background-color: #ededed; padding:5px}
.frm-grp > label {width: 20%; text-align: right; margin-right: 20px;font-size: 16px;font-weight: 500;color: #000; display: inline-block}
.select.sel-half, .custom-form input[type="text"].sel-half {width: 20%}
.select.sel-half.second {margin-left: 20px;}
.select:after {
   content: ">";
    display: block;
    position: absolute;
    top: 1px;
    right: -1px;
    width: 30px;
    height: 26px;
    background: var(--theme-color);
    bottom: 0;
    font-size: 23px;
    font-family: monospace;
    font-weight: 300;
    padding: 0px 2px 8px 8px;
    color: #fff;
    transform: rotate(90deg);
    pointer-events: none;
}

.custom-form textarea{width: 65%; height: 100px; resize: auto; background-color: #ededed; border: 1px solid #cbc6c6; resize: none}

.custom-form .frm-title {margin-top: 15px;}

.custom-form h3{margin-bottom: 15px}

.custom-form .tour-price {margin: 20px auto;width: 185px;height: auto; font-size:15px; border: 1px solid #f0b780; font-weight:600}

.custom-form .prc-title {padding: 8px; display: inline-block; background-color: #f0b780; color: #fff; margin-right: 8px; font-weight:300}

.query-btn {display: inline-block;margin-top: 15px;width: 65%; text-align:center}

.query-btn input[type="submit"] {padding: 7px 15px; background:#ed3e31; color: #fff;border-radius: 4px;border: none; cursor:pointer}

.divider {width: 100%;height: 1px;background: #cac6c7}

@media only screen and (max-width: 993px) and (min-width: 768px){
.frm-grp > label {width:20%}
.custom-form .select, .custom-form input[type="text"], .custom-form input[type="email"], .custom-form input[type="tel"], .custom-form textarea,.query-btn{width: 65%}
.select.sel-half{width: 31%;}
.custom-form{width: calc(100% - 30px)}
}

@media (max-width: 767px){
.custom-form{width: 100%}
.custom-form .select, .custom-form input[type="text"], .custom-form input[type="email"], .custom-form input[type="tel"], .frm-grp > label, .select.sel-half, .custom-form textarea, .query-btn, .custom-form input[type="text"].sel-half{width:100%}
.select.sel-half.second{ margin-left:0}
.frm-grp > label{ text-align:left}
.custom-form h3 {text-align:left; font-size:20px}
}

@-moz-document url-prefix(){
.select::after {top: -2px;
right: 3px;
width: 32px;
height: 35px;padding: 0px 5px 5px 8px;}	
}