form.form.ui {
	--font:font:var(--p1);
	--font2:font:var(--p1);
	--btn-font:var(--nav);
	--fieldh:var(--41px);
	--cols-gap:var(--25px) var(--15px);
	--cols-flex:calc(50% - var(--8px));
	--fmb:var(--30px);
	--checkbox-size:var(--23px);
	--checkbox-spacing: calc( var(--checkbox-size) + var(--12px) );
	--border:var(--2px) solid;
	--border-color:var(--cream);
	--color:var(--cream);	
	--highlight:var(--pgreen);
	--bg:var(--dbrown);
	--highlight-bg:var(--cream);
	--select-bg:var(--dbrown);
	--select-maxheight:var(--250px);
	--select-width:calc(100% + var(--3px));
	--transition:background-color 0.6s ease, color 0.6s ease;
	--select-padding:var(--7px) var(--16px);
	--select-icon:url('../images/shared/down-arrow-cream.svg') var(--contain);
	--select-top:calc(var(--fieldh) - var(--3px));
	--select-left:var(--n1px);
	--transy-50:translateY(-50%);
	--textarea-height:var(--113px);
	--textarea-padding:var(--12px) var(--21px);
	--input-padding:0 var(--21px) 0;
	--padding:var(--72px) var(--127px) var(--72px) var(--145px);
	--ls:0.010em;
	--radio-buttons-padding:var(--10px) var(--2px);
	--radio-buttons-gap:var(--15px);
	--input-gap-vertical:var(--18px);
	--input-gap-horizontal:var(--17px);
	--input-gap:var(--input-gap-vertical) var(--input-gap-horizontal);
	--button-font:var(--h2);
	--button-color:var(--fc2);
	--button-bg:transparent;
	--button-padding:0 calc(var(--arroww) + 1em) 0 0;
	--terms-checkbox-lh:2;
	--terms-width:calc(100% - var(--checkbox-spacing));
	--select-border: var(--cream) var(--border);
}

@media (max-width: 768px) {
	form.form.ui {
		--padding:var(--hpad) var(--vpad);
		--cols-gap:0;
		--cols__margin-bottom:var(--20px);
		--checkbox-mb:var(--22px);
		--button-margin: 0 auto;
		--radio-buttons-gap:0;
		--radio-buttons-margin:var(--3px);
		--font:normal 400 calc(var(--css)*15vw) / calc(var(--css)*20vw) var(--ff);
		--font-2:var(--font);
	}
}

form div[data-vtype="button"] {
	text-transform:var(--text-transform);
}

#terms {
	display:flex;
	justify-content: var(--terms-jc, space-between);
}

#terms > div:first-child {width:var(--terms-width);}

#register-sm > div {padding:var(--padding);margin:0 auto;gap:var(--92px);}
#register-sm a {display:inline;}
#register-sm .img-wrap {width: 52%;align-self: start;}
#register-sm .img-wrap > img {width:var(--406px);height: var(--548px);object-fit: cover;}

@media (max-width: 768px) {
	form.form .fields > .field:not(.a) {
		flex-basis: 48%;
  	}
	form.ui.form p.testimonial.left {font-weight:bold;}
	.terms {margin-bottom:0;}
}

form div:not(.checkbox) > label {display:none;}
form.ui.form p {font:var(--font); letter-spacing: var(--ls);}
form.ui.form div > input, form.ui.form #cols_1 > div input {padding: var(--input-padding);}
form.ui.form textarea {padding: var(--textarea-padding); }
form div > textarea {height:var(--textarea-height);}
#cols_1, .budget, .beds, .newsletter {margin-bottom:var(--fmb)}
.terms {margin-top:var(--fmb);margin-bottom:calc(var(--fmb)/2)}
.mainfield {line-height:1;}
form.ui.form .required {font:var(--font2);}

/*
PLACEHOLDERS :-(
========================================================== */
.ui.form input[type="text"]::-webkit-input-placeholder { opacity: 1; color:var(--color) !important; font-weight: normal;line-height:var(--15px);}
.ui.form input[type="text"]::-moz-placeholder { opacity: 1; color:var(--color) !important; font-weight: normal;padding:inherit;border-radius: inherit;line-height:var(--15px);}
.ui.form input[type="text"]:-ms-input-placeholder { opacity: 1; color:var(--color) !important; font-weight: normal;padding:inherit;border-radius: inherit;line-height:var(--15px);}
.ui.form input[type="text"]:-moz-placeholder { opacity: 1; color:var(--color) !important; font-weight: normal;padding:inherit;border-radius: inherit;line-height:var(--15px);}
.ui.form textarea::-webkit-input-placeholder { opacity: 1; font-family: var(--font) !important; font-weight: normal; color:var(--color);padding:inherit;line-height:var(--15px);}
.ui.form textarea::-moz-placeholder { opacity: 1; font-family: var(--font) !important; font-weight: normal; color:var(--color);padding:inherit;border-radius: inherit;line-height:var(--15px);}
.ui.form textarea:-ms-input-placeholder { opacity: 1; font-family: var(--font) !important; font-weight: normal; color:var(--color);padding:inherit;border-radius: inherit;line-height:var(--15px);}
.ui.form textarea:-moz-placeholder { opacity: 1; font-family: var(--font) !important; font-weight: normal; color:var(--color);padding:inherit;border-radius: inherit;line-height:var(--15px);}


/*
SELECT DROPDOWN OVERRIDES 
========================================================== */
form div > .selection.dropdown, 
form div > .ui.selection.dropdown {position: relative;color:var(--highlight);height:var(--fieldh); padding:var(--select-padding);}
form div > .selection.dropdown:hover,
form div > .ui.selection.dropdown:hover {border-color:var(--border-color);}
.ui.selection.dropdown:not(.button) > .default.text {color:var(--color);}
.ui.selection.dropdown > .dropdown.icon {display:none;}
.default.dropdown:not(.button) > .text, 
.dropdown:not(.button) > .default.text:not(.a) {color:var(--color);}
.dropdown > input:not(.search):first-child, 
.dropdown > select {display: none !important;}
.selection .menu {display: none;}
.selection.dropdown:not(.ui) .menu {overflow-x:hidden;overflow-y:auto;position:absolute;width:var(--select-width);max-width:calc(100% + var(--2px));background:var(--select-bg);padding:0;border:0;max-height:var(--select-maxheight);top:var(--select-top); left:var(--select-left);border:var(--select-border);}
.dropdown:not(.ui) .menu > .item {position: relative;cursor: pointer;display: block;border: none;height: auto;padding:.33em .5em;color:var(--color);transition:.3s ease;}
.selection.dropdown::before {content:'' !important;display:block;width:2.2em;height:1.2em;position:absolute;right:3%;background:var(--select-icon);-webkit-transform:var(--transy-50);-ms-transform:var(--transy-50);transform:var(--transy-50);z-index:999;top:50%;}

/*
COL 1 SPECIFICS
========================================================== */
form.ui.form #cols_1 {display: flex;flex-wrap: wrap;gap:var(--cols-gap);justify-content: space-between;}
form.ui.form #cols_1 > div {flex-basis: var(--cols-flex); font:var(--p1); letter-spacing: var(--ls); margin-bottom:var(--cols__margin-bottom, 0);}
form.ui.form #cols_1 label {display:none;}
form.ui.form #cols_1 > div input, 
form.ui.form textarea,
form.ui.form textarea:focus,
form.ui.form div > .selection.dropdown {width:100%;min-height: var(--fieldh) !important; background: var(--highlight) !important;border: var(--border) var(--border-color) !important;color: var(--color) !important;border-radius:0 !important; font:var(--font) !important; letter-spacing: var(--ls) !important;}
form.ui.form div > .selection.dropdown * {background: var(--highlight) !important; color: var(--color) !important; font:var(--font) !important; letter-spacing: var(--ls) !important;border:0 !important;}

#area_container_40 + .mainfield.field {display: flex;align-items: center;justify-content: center;margin-top: 3em;}
form.form #cols_1 > div[data-uid="55"],
form.form #cols_1 > div[data-uid="56"],
form.form #cols_1 > div[data-uid="57"]{flex-basis: 100%;}

/*
RADIO/CHECKBOXES - BEDS & BUDGET
========================================================== */
/*form.ui.form .beds,form.ui.form .budget {margin-bottom:var(--fmb)}*/
form.ui.form .beds .inline,
form.ui.form .budget .inline {display:flex; flex-direction:row; gap:var(--radio-buttons-gap);}
form.ui.form .beds .inline .field,
form.ui.form .budget .inline .field {flex-grow: 1;padding:0; margin-bottom:calc(var(--radio-buttons-margin, 0)*2);}
form.ui.form .beds .inline .field:nth-child(odd),
form.ui.form .budget .inline .field:nth-child(odd) {margin-left:var(--radio-buttons-margin,0);}
form.ui.form .beds .inline .field:nth-child(even),
form.ui.form .budget .inline .field:nth-child(even) {margin-right:var(--radio-buttons-margin);}
form.ui.form .beds .inline .checkbox.radio label,
form.ui.form .budget .inline .checkbox.radio label {border: var(--border) var(--border-color); font:var(--btn-font); letter-spacing: var(--ls); width:100%;height:var(--fieldh);display: block;text-align: center; padding:var(--radio-buttons-padding); background-color:var(--bg); transition:var(--transition);color:var(--color);font-weight:400;}
form.ui.form .beds .inline .checkbox.radio.checked label,
form.ui.form .budget .inline .checkbox.radio.checked label {background-color:var(--highlight-bg);color:var(--highlight);}

.checkbox label {cursor: pointer;}
.checkbox label a {position:relative;}
.checkbox label a::before {transition:.2s ease;content:'';width:100%;height:1.5px;background:var(--highlight-bg);bottom:-0.33em;position:absolute;opacity:1;}
.checkbox label a:hover::before {opacity: 1;}

.terms div[data-vtype="checkbox"] label + input,
.newsletter div[data-vtype="checkbox"] label + input {opacity: 0;position: absolute;width:0px;height:0;}

.terms div[data-vtype="checkbox"] label,.terms div[data-vtype="checkbox"] label:hover,
.newsletter div[data-vtype="checkbox"] label,.newsletter div[data-vtype="checkbox"] label:hover,
form.ui.form .field.error .checkbox:not(.toggle):not(.slider) label,
form.ui.form .ui.checkbox:not(.radio) input:focus ~ label {position:relative; font:var(--font); letter-spacing: var(--ls); left:var(--checkbox-spacing); line-height:1.4em;color:var(--color) !important;padding-left: 0;}

.terms div[data-vtype="checkbox"] label::before, 
.terms div[data-vtype="checkbox"] label:hover::before,
.newsletter div[data-vtype="checkbox"] label::before, 
.newsletter div[data-vtype="checkbox"] label:hover::before{position: absolute;top: 0; left:calc(0px - var(--checkbox-spacing)); width:var(--checkbox-size); height: var(--checkbox-size);content: '';background: transparent;border: var(--border) var(--border-color);transition:var(--transition);border-radius:0;}

.terms div[data-vtype="checkbox"] input[type="checkbox"]:checked + label::before,
.newsletter div[data-vtype="checkbox"] input[type="checkbox"]:checked + label::before{background-color:var(--highlight-bg);}
.terms div.checkbox,
.newsletter div.checkbox {line-height:var(--terms-checkbox-lh);margin-bottom:var(--checkbox-mb,0);}

form.ui.form .ui.radio.checkbox label::before,
form.ui.form .ui.radio.checkbox label::after,
form.ui.form .required.field > .checkbox::after,
form.ui.form .ui.checkbox input:checked ~ label::after,
form.ui.form .beds .inline.fields > label,
form.ui.form .mainfield > label{ display:none;}
form.ui.form .ui.radio.checkbox {width:100%;}

form.ui.form .beds .inline.fields > label,
form.ui.form .budget .inline.fields > label {display:none}
.ui.form, .ui.form .field .dropdown, .ui.form .field .dropdown .menu > .item {
	font-size: var(--p1) !important;
}

/*
BUTTON
========================================================== */
form div[data-vtype="button"] {text-align: center;}
form div[data-vtype="button"] button,
form div[data-vtype="button"] button:hover {background-color:var(--button-bg);color:var(--button-color);border-radius: 0}
form div[data-vtype="button"] button {position: relative;line-height:1;width:var(--178px);height:var(--52px)}
#register_submit {
	font:var(--button-font);padding:var(--button-padding);display: flex;
  justify-content: center;
  align-items: center;
}

.ui.message.visible.G3-message.success * {
	list-style: none !important
}

.moduletable #contact-form-contact h1.center, .moduletable #contact-form-contact h1.center + div.center {display:none !important;}

/* Dont display other elements when showing the thankyou */
.chronoforms > section:first-of-type,
.chronoforms > section > div > div > h2 { display: none !important; }

form.ui.form .required.field > .checkbox::after, form.ui.form .required.fields:not(.grouped) > .field > .checkbox::after {
 display:none;
}

