.webform-submission-form.webform-submission-add-form.webform-submission-contact-form.webform-submission-contact-add-form{
  position:relative;
  border-radius: var(--border-radius-md, 4px);
  border: var(--border-width-sm, 1px) solid var(--border-primary, #F2F2F3);
  background: var(--surface-modal, #FAFAFA);
  padding:24px;
  display: flex;
  flex-direction: column;
  gap: 18px;
  /* max-width:551px; */
}
.webform-submission-contact-form #edit-processed-text h2{
  line-height: 0;
}
.webform-submission-contact-form #edit-processed-text p{
  padding-bottom: 14px;
}
.js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name,
.js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name{
  width: 48.6%;
}

.js-form-item label.option{
  position: relative;
  /* top:3px; */
}

/* input#edit-name.form-text.required::-webkit-validation-bubble-message{
  background: red!important;
} */

input  required="required"::-webkit-validation-bubble-message{
  background: red!important;
}

.placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name,
.placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name{
 width:47.3%;
}

#edit-actions-submit.webform-button--submit.button.button--primary.js-form-submit.form-submit,
#edit-actions-submit--2.webform-button--submit.button.button--primary.js-form-submit.form-submit,
#edit-actions-submit--3.webform-button--submit.button.button--primary.js-form-submit.form-submit,
#edit-actions-submit--4.webform-button--submit.button.button--primary.js-form-submit.form-submit{
  display: flex;
  padding: 12px 24px;
  gap: 12px;
  border-radius: var(--border-radius-md, 4px);
  transition: all 0.3s ease-in-out;
  cursor: pointer;
  width: 138px;
  text-align: left;
  background-repeat: no-repeat!important;
  background-position: right 24px center!important;
}

input#edit-marketing.form-checkbox,
input#edit-marketing--2.form-checkbox,
input#edit-marketing--3.form-checkbox,
input#edit-marketing--4.form-checkbox{
  width: 24px;
  height: 24px;
  cursor: pointer;
}

.js-form-required.form-required::after {
  content: "*";
  display: inline !important;
  color: #c00;
  background: unset;
  vertical-align: unset !important;
  padding-left: 4px;
}
.captcha.captcha-type-challenge--recaptcha{
  border:none!important;
  padding:0;
}
.captcha__title.js-form-required.form-required,
.captcha__description.description{
  display: none!important;
}
.form-item--error .form-text,
.form-item--error .form-textarea,
.form-item--error .form-select {
  border-color: #cc6666; /* Red border for the input field */
  box-shadow: 0 0 5px rgba(204, 102, 102, 0.5);
}

.js-form-item.form-item{
  gap: 8px;
  display: flex;
  flex-direction: column;
}
input#edit-email.form-email,
input#edit-email--2.form-email,
input#edit-email--3.form-email,
input#edit-email--4.form-email{
  background-image: url("/sites/schroonlakechamber.org/themes/custom/schroonlake/i/form-mail.svg")!important;
  background-repeat: no-repeat!important;
  background-position: left 12px center!important;
  text-indent: 32px;
}
input#edit-phone-number.form-tel,
input#edit-phone-number--2.form-tel,
input#edit-phone-number--3.form-tel,
input#edit-phone-number--4.form-tel{
  background-image: url("/sites/schroonlakechamber.org/themes/custom/schroonlake/i/form-call.svg")!important;
  background-repeat: no-repeat!important;
  background-position: left 12px center!important;
  text-indent: 32px;
}
input#edit-name.form-text,
input#edit-your-name.form-text,
input#edit-email.form-email,
input#edit-phone-number.form-tel,
input#edit-name--2.form-text,
input#edit-your-name--2.form-text,
input#edit-email--2.form-email,
input#edit-phone-number--2.form-tel,
input#edit-name--3.form-text,
input#edit-your-name--3.form-text,
input#edit-email--3.form-email,
input#edit-phone-number--3.form-tel,
input#edit-name--4.form-text,
input#edit-your-name--4.form-text,
input#edit-email--4.form-email,
input#edit-phone-number--4.form-tel{
  display: flex;
  padding: 8px 12px;
  gap: 8px;
  border-radius: var(--border-radius-md, 4px);
  border: var(--border-width-sm, 1px) solid var(--border-primary, #F2F2F3);
  background: var(--surface-primary, #F2F2F3);
  width:100%;
  color:#616161;
  transition: all 0.3s ease-in-out;
}

input#edit-name.form-text:hover,
input#edit-your-name.form-text:hover,
input#edit-email.form-email:hover,
input#edit-phone-number.form-tel:hover,
input#edit-name--2.form-text:hover,
input#edit-your-name--2.form-text:hover,
input#edit-email--2.form-email:hover,
input#edit-phone-number--2.form-tel:hover,
input#edit-name--3.form-text:hover,
input#edit-your-name--3.form-text:hover,
input#edit-email--3.form-email:hover,
input#edit-phone-number--3.form-tel:hover,
input#edit-name--4.form-text:hover,
input#edit-your-name--4.form-text:hover,
input#edit-email--4.form-email:hover,
input#edit-phone-number--4.form-tel:hover{
border: var(--border-width-sm, 1px) solid var(--border-action1-hover, #97DBD9);
background: var(--surface-action2-hover, #EBF2EF);
}
.js-form-item.form-item.form-type-checkbox.js-form-type-checkbox.form-item-marketing.js-form-item-marketing{
  /* padding-bottom: 14px; */
  display: flex;
  gap:12px;
  flex-direction: row;
}
form.webform-submission-form .js-form-type-checkbox input[type="checkbox"].form-checkbox:checked {
  content: "";
  width:14px;
  height:14px;
  /* background-image: url("/sites/schroonlakechamber.org/themes/custom/schroonlake/i/done-check.svg")!important; */
  background-position: right center;
  --bs-form-switch-bg: url("/sites/schroonlakechamber.org/themes/custom/schroonlake/i/done-check.svg");
}
@media only screen and (max-width: 1320px) {
.placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name, .placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name {
    width: 46.5%;
  }
}


@media only screen and (max-width: 1200px) {
  .placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name,
  .placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name{
    width: 46%;
  }
  .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name, .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name {
    width: 47.6%;
  }
}

@media only screen and (max-width: 1000px) {
  .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name, .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name,
  .placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name, .placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name {
    width: 47.6%;
  }
}

@media only screen and (max-width: 743px) {
  .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name,
  .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name{
    width:100%;
  }
  .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name{
    position: relative!important;
    right: 0!important;
    bottom: auto!important;
  }
  .placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-name.js-form-item-name, .placeholder-inner.placeholder-two-col.placeholder-primary .js-form-item.form-item.form-type-textfield.js-form-type-textfield.form-item-your-name.js-form-item-your-name {
    width:100%;
  }
}
