.contact-form { margin: 0 auto 20px;  }
.contact-form .default-intro-text, .content-feature-136 .content-feature p.default-intro-text { margin: 0 0 20px; }
.contact-form .contact-msg { display:none; }
.contact-form .flexbox.flex-justify { margin-webkit-justify-content: space-between !important; justify-content:space-between !important; } /** overrides mobile core.ss **/

.contact-form .order-completed { display:none; }
.contact-form.completed .order-completed, .content.content-feature-136.form-completed .order-completed { display:block; }
.contact-form.completed form, .content.content-feature-136.form-completed form { display:none; }
.contact-form.completed .review, .content.content-feature-136.form-completed .review { display:none; }
.content.content-feature-136.form-completed .content-title:not(.tab-title),
.content.content-feature-136.form-completed .content-gallery,
.content.content-feature-136.form-completed .content-image,
.content.content-feature-136.form-completed .content-text,
.content.content-feature-136.form-completed .content-embed-code,
.content.content-feature-136.form-completed .content-external
{ display:none; }

/** save and exit **/
.contact-form .form-saved { display:none; } 
.content.content-feature-136.form-saved .form-saved { display:block; }
.content.content-feature-136.form-saved form { display:none; }

.contact-form .row.section-payment, .contact-form .row.submit { /*border-top: 1px solid #ccc; padding: 25px 0 0;*/ }
.contact-form .row.submit .buttons { column-gap: 10px; row-gap: 10px; }
.contact-form .row > .inner {  }
.contact-form .column {}

.contact-form .column .content-title { margin: 25px 0 15px; }
.contact-form .column .content-title:first-child { margin-top:0px; }

/** form builder **/
.contact-form .formbuilder { margin: 0 0 20px; }
.contact-form .formbuilder .flexbox.horizontal { column-gap: 15px;  flex-direction: row; } /** for radio/checkboxes **/
.contact-form .formbuilder .flexbox.vertical { 
	row-gap: 10px;  flex-direction: column; 
	-ms-flex-align: flex-start; -webkit-align-items: flex-start; -webkit-box-align: flex-start; align-items: flex-start;
} /** for radio/checkboxes **/
.contact-form .formbuilder .label {
	position:relative;
    margin: 0 0 5px;
    font-size: 1.2em;
}
.contact-form .formbuilder .value-item { /*margin-bottom:5px;*/ } /** replaced with flexbox.vertical **/
.contact-form .formbuilder .value-item.flexbox { column-gap: 10px; }
.contact-form .formbuilder .value-label { /*margin-left:5px;*/ } /** replaced with flexbox **/
.contact-form .formbuilder .value-label.selected { color: red; }
.contact-form .formbuilder .value-extra { margin-top:10px;  } 
.contact-form .terms.flexbox { column-gap: 10px; }

/** phone number fields **/
.contact-form .fieldset.phone { width:500px; } /** set to same width as text fields **/
.contact-form .fieldset.phone > .flexbox { column-gap: 10px; }
.contact-form .fieldset.phone > .flexbox > select { flex: 0 0 140px; width: 140px;  }
.contact-form .fieldset.phone > .flexbox > div { flex: 1; }
.contact-form .fieldset.phone .field-text { width:350px !important; }

/** fields **/
.contact-form .fieldset .label { font-weight:bold; }
.contact-form .section-payment .fieldset .label { flex:0 0 180px; width:180px; }

.contact-form .fieldset.sub-options .option { margin: 0 0 5px; }
.contact-form .fieldset.sub-options .option div:first-child { margin-right: 5px; }

.contact-form .fieldset.coupon .field-text { width:200px; font-size: 14px; margin: 0 5px 0 0; padding:10px; }
.contact-form .fieldset.coupon .buttonize { width:100px; min-width:100px; margin: 0 0 0 5px; }
.contact-form .fieldset.coupon [name=coupon_remove] { display:none; }
.contact-form .fieldset.coupon .coupon-error { color: var(--red); margin: 5px 0 0 200px; }

.contact-form .amount, .contact-form .total, .contact-form .setup, .contact-form .coupon > .flexbox { column-gap: 20px; row-gap: 10px; }
#payment-total-amount-saved { font-weight:bold; color: var(--red); }
#payment-total-recur {  }

.contact-form .fieldset.stripe { margin-top: 40px; flex:0 0 650px; width:650px; }
.contact-form .fieldset.stripe-error { font-weight:bold; color: var(--red); font-size: 17px; }

.contact-form .payment-options {  }
.contact-form .payment-options .options { column-gap: 20px; row-gap: 20px; align-items: stretch !important; }
.contact-form .payment-options .option { 
	border: 1px solid #dedede; border-radius: 5px;padding: 20px; text-align:center;
	flex-direction: column; -webkit-justify-content: space-between; justify-content:space-between;
	max-width:360px;
}
.contact-form .payment-options .option .top p { margin: 0 0 15px; }
.contact-form .payment-options .option h3 { margin: 0 0 15px; }
.contact-form .payment-options .option p { /*margin: 0 0 20px;*/ }
.contact-form .payment-options .option .pricing { column-gap: 10px; }
.contact-form .payment-options .option .price-item .price { font-weight:bold; font-size: 16px; margin: 0 0 5px; }
.contact-form .payment-options .option .price-item .desc { height:30px; overflow:hidden; color: #666; font-size: 11px; font-family:verdana, arial, sans-serif; } /** to keep same height **/
.contact-form .payment-options .option .price-item .selector { margin: 10px 0 0 0; width:150px; text-align:center; }
.contact-form .payment-options .option .price-item svg { display:none; margin: 0 auto; width:39px; height:39px; }
.contact-form .payment-options .option.selected { border: 1px solid #be0e26; border-width: 2px; }
.contact-form .payment-options .option.selected .price-item.selected .site-button { display:none; background-color: #be0e26; border-color: #be0e26;  color: #fff; }
.contact-form .payment-options .option.selected .price-item.selected svg { display:block; fill:#be0e26  }

.contact-form .contact-error, .contact-form #payment-errors { color: var(--red); font-weight:bold; }
.contact-form #payment-errors { margin-top:10px; }

.contact-form .order-completed h1, .contact-form .form-saved h1 { font-size:27px; margin: 0 0 20px; color: var(--red); }
.contact-form .order-completed p, .contact-form .form-saved p { margin: 0 0 7px; }

.contact-form .row.section-payment .column { /*flex:0 0 650px; width:650px;*/ } /** to keep stripe fields from fluctuating when updating total **/

.contact-form .review { padding-bottom: 20px; }
.contact-form .review .row .inner { -webkit-justify-content: flex-start; justify-content:flex-start; }
.contact-form .review .column { flex:0 0 40%; width:40%; }

.contact-form input[name=contact_edit] { display:none; margin-left: 15px; }

.contact-form .sub-options { display:flex; }
.contact-form .coupon { display:block; }
.contact-form .continue { display:none; }
.contact-form .reviewable { display:block; }
.contact-form .review { display:none; }

.contact-form.pageable .group.page { display:none; }
.contact-form.pageable .group.page.current { display:block; }
.contact-form.pageable .continue { display:block; }
.contact-form.pageable .submit { /*display:none;*/ }

.contact-form.stripe .continue { display:block; }
.contact-form.stripe .submit { display:none; }
.contact-form.stripe.striping .continue { display:none; }
.contact-form.stripe.striping .submit { display:block; }
.contact-form.stripe.striping .reviewable { display:none; }
.contact-form.stripe.striping .review { display:block; }
.contact-form.stripe.striping input[name=contact_edit] { display:block;  }
.contact-form.stripe.striping .coupon { display:none; }
.contact-form.stripe.striping .sub-options { display:none; }
.contact-form.stripe.striping .payment-options { display:none; }
.contact-form.stripe.striping .setup { display:none; }

/** ------- CERT FORM --------- **/
.form-type-4 .certs .column { flex: 0 0 100%; width:100%; }
.form-type-4 .fl-form textarea.fl-textarea { width:100%; }

/** required fields **/
.form-type-4 .fieldset { width:100%; }

/** primary fields **/
.form-type-4 .fieldset.primary .label { /*font-size: 1.3em;*/ }
.form-type-4 .fieldset:not(.primary) .label { /*color: #333;*/ }

/** cert group title **/
.form-type-4 .group.certs .content-title { margin: 50px 0 0; }
.form-type-4 .group.certs .row .column > .content-title:first-child { margin: 20px 0 0; }

/** cert title **/
.form-type-4 .group.certs .feature-title { border-top: 1px solid #dedede; padding-top: 25px; margin-top:25px; margin-bottom:20px; }

/** submits **/
.form-type-4 .row.submit { margin-top: 30px; }

/** so that when fields are 100% on mobile, there's still some room to the right for the astrisk **/
.form-type-4 .fieldset.radio.required .label,
.form-type-4 .fieldset.checkbox.required .label,
.form-type-4 .fieldset .fl-wrap-input,
.form-type-4 .fieldset .fl-wrap-textarea,
.form-type-4 .fieldset .fl-wrap-select
{ /*max-width: fit-content;*/ padding-right:30px; }

/** 
radio/checkbox fields only, so the astrisk shows right after the text, since it may or not be full width
we can't apply this to text, select fields because they are 100% on mobile and it won't work
**/
.form-type-4 .fieldset.radio.required .label,
.form-type-4 .fieldset.checkbox.required .label
{ max-width: fit-content; }

.form-type-4 .fieldset.required > div > .fl-wrap-input:before, /** specify direct descendants only so it doesn't apply to nested fieldsets (inputs in contact method field type) **/
.form-type-4 .fieldset.phone.required .fl-wrap-input:before, /** exception for the above rule **/
.form-type-4 .fieldset.required .fl-wrap-textarea:before,
.form-type-4 .fieldset.country.required:before,
.form-type-4 .fieldset.state.required:before,
.form-type-4 .fieldset.radio.required .label:before,
.form-type-4 .fieldset.checkbox.required .label:before
{
    opacity: 1;
    content: "*";
    display: block;
    position: absolute;
    right: 10px;
	top: 50%;
    transform: translateY(-50%);
    font-size: 16px;
    line-height: 1.75;
    color: #d32f2f;
    padding: 6px 0 0;
    z-index: 1
}

/** contact method field type **/
.form-type-4 .fieldset[data-type=17] {}


@media (max-width: 900px) {

	.contact-form .row > .inner { display:block;  }	

	.contact-form .content-title { margin: 30px 0 15px !important; }
	.contact-form form { margin-top: -20px; } /** can't match just the first headline **/

	.contact-form .sub-options .label { display:none; }
	.contact-form .coupon .label { display:none; }
	.contact-form .total .label { flex:0 0 130px; width:130px; }

	.contact-form .review .column { flex:0 0 100%; width:100%; }	
	.contact-form .fieldset.stripe { flex:0 0 100%; width:100%; }

}

/** mobile portrait **/
@media (max-width: 480px) {

	.contact-form .payment-options .options { display:block; }
	.contact-form .payment-options .option { margin: 0 0 20px; max-width:100%; }

	.contact-form .fieldset.coupon .coupon-error { margin: 5px 0 0 0; }

	

}