.contact-form {display:flex; width:90%; margin:0 auto; flex-wrap:wrap; align-items:center; align-content:flex-start; justify-content:center; gap:45px;}
.contact-form > div {display:inline-block; width:40%; padding:0 5px;}
.nofield {display:none !important;}
label {display:block; padding-bottom:5px; text-align:left; font-size:15px; color:var(--dark-grey);}
input[type=text],
input[type=email], 
input[type=number] {width:100%; padding:12px 10px; text-align:left; font-size:16px; color:var(--mid-grey); background-color:var(--light-grey); box-sizing:border-box; border:1px solid var(--mid-grey); outline:none;}
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}
input[type=number] {-moz-appearance: textfield;}
input[type=text]:focus,
input[type=email]:focus,
input[type=number]:focus {color:var(--dark-grey); padding:10px 8px; background-color:#fff; border:3px solid var(--dark-orange);}

textarea {width:100%; height:150px; padding:12px 10px; text-align:left; font-size:16px; font-family:'Montserrat', sans-serif; color:var(--mid-grey); box-sizing:border-box; background-color:var(--light-grey); border:1px solid var(--mid-grey); outline:none;}
textarea:focus {color:var(--dark-grey); padding:10px 8px; border:3px solid var(--dark-orange);}


label.chkb, label.rad {
	display: block; margin-bottom:15px; padding-left:50px;
	cursor: pointer;
	position: relative; text-align:left;
	color:var(--mid-grey); font-size: 16px; font-family:'Montserrat', sans-serif;;	
}
label.chkb:hover, label.rad:hover {color:var(--orange);}

input[type=checkbox] {display:none;}
input[type=radio] {display:none;}

input[type=checkbox]:checked + label.chkb:before {
	content: "\2713";
	font-size: 18px; font-weight:600;
	color:var(--mid-orange);
	text-align: center;
	line-height:24px;
	border-color:var(--dark-grey);
}

label.chkb:before {
	content: "";
	display: inline-block; text-align:left;
	width: 21px;
	height: 21px;
	position: absolute;
	left: 15px;
	background-color:var(--light-grey);
	border:solid 2px var(--mid-grey);
	border-radius:5px;
}

input[type=radio]:checked + label.rad:before {
	content: "\25CF";
	font-size: 24px; font-weight:600;
	color:var(--mid-orange);
	text-align: center;
	line-height:18px;
	border-color:var(--dark-grey);
}

label.rad:before {
	content: "";
	display: inline-block; text-align:left;
	width: 21px;
	height: 21px;
	position: absolute;
	left: 15px;
	background-color:var(--light-grey);
	border:solid 2px var(--mid-grey);
	border-radius:50%;
}

.sub-btn {display:flex; align-items:flex-start; padding-top:30px;}

.btn {display:block; align-self:flex-start; width:200px; padding:15px 0;text-align:center;color:var(--dark-orange); font-size:18px; background-color:#fff; border:1px solid var(--dark-orange);}
.btn:hover{cursor:pointer; color:#fff; background-color:var(--dark-orange);}

.content-thanks {display:block; padding:40px 0; text-align:center; background-color:var(--mid-orange);}
.thanks {display:block; margin:0 auto; max-width:640px; text-align:left;}
.thanks p {text-align:left; color:#fff; font-size:21px; line-height:1.6;}

.tip {display:inline-block; float:right; position:relative; width:12px; height:12px; margin-right:5px; margin-bottom:5px; padding:5px; background-color:var(--light-grey); border:1px solid var(--mid-grey); border-radius:50%;}
.tip p {text-align:center; color:var(--dark-grey); font-size:12px; line-height:1;}
.tip .tiptext {
  visibility:hidden; display:none;
  width:220px; background-color:var(--mid-grey);
  color: #fff; text-align:left; font-size:12px; line-height:1.25;
  border-radius:6px; margin-bottom:5px; padding:10px;
  bottom:100%; left:50%; margin-left:-110px;
  position:absolute; z-index:1;}

.tip:hover .tiptext {visibility:visible; display:inline-block;}


@media screen and (max-width:1210px) {
.contact-form {width:100%;}
.tip .tiptext {top:-50% !important; bottom:50%; right:110% !important; left:unset; height:fit-content;}
@media screen and (max-width:768px) {
.contact-form > div {display:block; width:90%;}
.thanks {max-width:90%;}
}