:root {
  --ufc-s-15: 15px;
  --ufc-s-17: 17px;
  --ufc-s-23: 23px;
  --ufc-s-25: 25px;
  --ufc-s-85: 85px;
  --ufc-s-180: 180px;
  --ufc-s-300: 300px;
  --contact-us-container-gap: var(--ufc-s-20);
  --contact-us-form-color: var(--gray-light);
  --contact-us-form-button-bg-color: #fc3937;
  --contact-us-content-gap: var(--ufc-gap-10);
  --contact-us-faq-qa-font-size: var(--ufc-font-size-xxs);
  --contact-us-regular-font-size: var(--ufc-font-size-xs);
  --contact-us-font-size-heading: var(--ufc-font-size-xl);
  --contact-us-faq-mb: var(--ufc-s-100);
  --contact-us-form-input-paddiing: var(--ufc-s-20);
  --contact-us-wp-form-button-pl: var(--ufc-s-12);
  --contact-us-wp-form-button-pr: var(--ufc-s-32);
  --contact-us-form-heading-gap: var(--ufc-s-6);
  --contact-us-faq-left-container-gap: var(--ufc-s-17);
  --contact-us-faq-left-border-radius: var(--ufc-s-10);
  --contact-us-faq-right-border-radius: var(--ufc-s-20);
  --contact-us-faq-container-mt: var(--ufc-s-100);
  --contact-us-faq-wrapper-mt: var(--ufc-s-20);
  --contact-us-faq-item-tb: var(--ufc-s-15);
  --contact-us-faq-item-lr: var(--ufc-s-25);
  --contact-us-faq-item-mb: var(--ufc-s-20);
  --contact-us-container-form-container-mb: var(--ufc-s-300);

  --contact-us-info-title-size: var(--ufc-card-age-font-size);
  --contact-us-info-title-family: var(--ufc-primary-font-family);
  --contact-us-info-title-color: var(--gray-light);
  --contact-us-info-title-weight: var(--ufc-font-weight-medium);

  --contact-us-info-description-size: 15px;
  --contact-us-info-description-family: var(--ufc-primary-font-family);
  --contact-us-info-description-color: var(--dark);
  --contact-us-info-description-weight: var(--ufc-font-weight-regular);

  --contact-us-info-container-h-gap: 35px;
  --contact-us-info-container-gap: 35px;

  --contact-us-form-fields-padding-y: 15px;
  --contact-us-faq-answer-mt: 10px;
}


.contact-resource-hero-section .right-black-section {
  right: 1%;
}

.contact-resource-hero-section .right-black-section img {
  right: -33%;
}

/*---------------- Section 2 -----------------*/

.wp-form-contact-us-container2 .contact-content-heading {
  font-weight: var(--ufc-font-weight-semibold);
}

.wp-form-contact-us-container2.reveal {
  opacity: 1;
  transform: translateY(10px);
}

.page-template-contact .ufc-container div.wpforms-container-full input[type="text"],
.page-template-contact .ufc-container div.wpforms-container-full input[type="email"],
.page-template-contact .ufc-container div.wpforms-container-full input[type="number"],
.page-template-contact .ufc-container div.wpforms-container-full textarea {
  background-color: transparent;
  border-color: var(--contact-us-form-color);
  height: 50px;
  padding-left: var(--contact-us-form-input-paddiing);
  padding-right: var(--contact-us-form-input-paddiing);
  font-size: var(--ufc-base-text-font-size);
  font-weight: var(--ufc-font-weight-medium);
}

.page-template-contact .ufc-container div.wpforms-container-full input[type="text"]:focus,
.page-template-contact .ufc-container div.wpforms-container-full input[type="email"]:focus,
.page-template-contact .ufc-container div.wpforms-container-full input[type="number"]:focus,
.page-template-contact .ufc-container div.wpforms-container-full textarea:focus {
  border-style: solid;
  border-color: red !important;
  box-shadow: 0 0 0 1px red, 0px 1px 2px rgba(0, 0, 0, 0.15) !important;
  outline: none;
}

.page-template-contact .ufc-container div.wpforms-container-full input[type="text"]::placeholder,
.page-template-contact .ufc-container div.wpforms-container-full input[type="email"]::placeholder,
.page-template-contact .ufc-container div.wpforms-container-full input[type="number"]::placeholder,
.page-template-contact .ufc-container div.wpforms-container-full textarea::placeholder {
  color: var(--contact-us-form-color);
  opacity: 1;
}

.contact-us-gmap {
  border: 0px;
  border-radius: 8px;
}

.contact-us-wp-form {
  top: -15px;
  position: relative !important;
}

.wp-form-contact-us-container-right p.has-text-align-left.ufc-description {
  line-height: 150%;
}

.contact-us-section div.wpforms-container-full .wpforms-form .wpforms-submit-container {
  margin-top: 20px;
}


.contact-us-section .wpforms-container input.wpforms-field-medium,
.wp-core-ui {
  max-width: 100%;
}

.wp-form-contact-us-container2 .custom-social-icons div {
  gap: var(--contact-us-content-gap) !important;
  justify-content: start !important;
}

.wp-form-contact-us-container2 .custom-social-icons div a {
  width: unset !important;
}

.wp-form-contact-us-container-left .contact-icon {
  width: 30px;
  height: 30px;
}

.wp-form-contact-us-container-left .contact-icon img {
  vertical-align: top;
  /* margin: 2px 0 0 6.18px; */
}

.contact-info-container-heading {
  gap: var(--contact-us-info-container-h-gap);
}

.contact-info-container {
  gap: var(--contact-us-info-container-gap);
}

.contact-info-address {
  width: 100%;
}

.contact-info-title {
  font-size: var(--contact-us-info-title-size);
  font-weight: var(--contact-us-info-title-weight);
  font-family: var(--contact-us-info-title-family);
  color: var(--contact-us-info-title-color);
}

.contact-info-description {
  font-size: var(--contact-us-info-description-size);
  font-weight: var(--contact-us-info-description-weight);
  font-family: var(--contact-us-info-description-family);
  color: var(--contact-us-info-description-color);
}

.contact-info-description a {
  color: inherit;
}

.contact-us-section .wpforms-container .wpforms-field {
  padding: var(--contact-us-form-fields-padding-y) 0;
}

/* ========== FAQ SECTION ========== */

.contact-us-faq-container2.reveal {
  opacity: 1;
  transform: translateY(10px);
}

.contact-us-faq-container-right img.wp-image-444 {
  object-fit: cover !important;
  width: 48px !important;
  height: 29px !important;
}

.contact-us-faq-container-right p.ufc-description {
  width: 100%;
  line-height: 150%;
  letter-spacing: 0.5px;
  margin-top: 10px;
}

.contact-us-faq-container2 .faq-wrapper {
  margin-top: var(--contact-us-faq-wrapper-mt);
  height: auto;
}

.contact-us-faq-container2 .faq-answer {
  width: 95%;
}

.contact-us-faq-container2 .faq-answer p {
  margin-top: var(--contact-us-faq-answer-mt);
}

/* ========== MEDIA QUERIES ========== */


@media (max-width: 1439px) {
  .contact-resource-hero-section .right-black-section {
    width: 40%;
    position: absolute;
    overflow: visible;
    z-index: 9;
    display: flex;
    align-items: center;
    right: 5%;
    top: 175px !important;
  }

  .contact-resource-hero-section .overlay-text {
    left: 52%;
    top: 31%;
    line-height: 1.2;
  }
}

@media (max-width: 1260px) {
  .contact-resource-hero-section .right-black-section {
    right: 3%;
  }
}

@media (max-width: 1200px) {
  :root {
    --contact-us-faq-mb: var(--ufc-s-72);
    --contact-us-faq-item-tb: 7px;
    --contact-us-faq-item-lr: 20px;
    --contact-us-faq-container-mt: 166px;
    --contact-us-faq-container-left-spacing--contact-us-faq-container-left-spacing: 95px;
    --contact-us-info-description-size: 13px;
    --contact-us-info-container-h-gap: 25px;
    --contact-us-info-container-gap: var(--ufc-gap-20);
    --contact-us-form-fields-padding-y: var(--ufc-s-10);
  }

  .contact-resource-hero-section .right-black-section {
    width: 40%;
    position: absolute;
    overflow: visible;
    z-index: 9;
    display: flex;
    align-items: center;
    right: -1%;
    top: 175px !important;
  }

  .contact-resource-hero-section .right-black-section img {
    width: 241px;
  }

  .wp-form-contact-us-container2 p.has-text-align-left.ufc-description {
    font-size: var(--ufc-base-text-font-size);
  }

  .contact-us-content-main-h-left {
    padding-bottom: 0px !important;
  }

  .contact-us-content-h-left {
    font-size: var(--contact-us-regular-font-size);
    font-weight: var(--ufc-font-weight-medium);
  }

  .wp-form-contact-us-container-left iframe {
    height: 300px;
  }

  .wp-form-contact-us-container2 .contact-content-heading {
    font-weight: var(--ufc-font-weight-semibold);
    font-size: var(--contact-us-font-size-heading) !important;
  }

  .contact-us-section .contact-us-faq-container2 {
    left: var(--contact-us-faq-container-left-spacing);
    line-height: 1.1;
  }

  .contact-us-faq-container-right {
    top: 10px;
    left: 0;
  }

  .contact-us-faq-container2 .contact-us-faq-section-h {
    font-size: var(--contact-us-font-size-heading);
  }

  .page-template-contact .ufc-container div.wpforms-container-full input[type="text"],
  .page-template-contact .ufc-container div.wpforms-container-full input[type="email"],
  .page-template-contact .ufc-container div.wpforms-container-full input[type="number"],
  .page-template-contact .ufc-container div.wpforms-container-full textarea {
    height: 40px;
    font-size: var(--contact-us-regular-font-size);
  }
}

@media (max-width: 1100px) {
  .contact-resource-hero-section .right-black-section {
    right: -3%;
  }
}

@media (max-width: 1075px) {
  .contact-resource-hero-section .right-black-section {
    right: -4%;
  }
}


@media (max-width: 992px) {
  :root {
    --contact-us-container-form-container-mt: var(--ufc-s-170);
    --contact-us-faq-que-ptb: 6px;
    --contact-us-faq-que-plr: 0;
    --contact-us-faq-item-tb: 2px;
    --contact-us-faq-item-lr: 20px;
    --contact-us-faq-wrapper-mt: var(--ufc-s-12);
    --contact-us-faq-item-mb: 11px;
    --contact-us-faq-container-left-spacing: 120px;
    --contact-us-info-container-h-gap: var(--ufc-gap-20);
  }

  .page-template-contact .ufc-container div.wpforms-container-full input[type="text"],
  .page-template-contact .ufc-container div.wpforms-container-full input[type="email"],
  .page-template-contact .ufc-container div.wpforms-container-full input[type="number"],
  .page-template-contact .ufc-container div.wpforms-container-full textarea {
    height: 35px;
  }

  .contact-us-faq-container-right p.ufc-description {
    line-height: 20px;
  }

  .contact-us-faq-container2 .faq-answer p {
    width: 107%;
  }

  .contact-us-section .contact-us-faq-container2 {
    flex-wrap: nowrap !important;
  }
}

@media (max-width: 991px) {
  .contact-resource-hero-section .overlay-text {
    left: 49%;
  }

  .contact-resource-hero-section .right-black-section img {
    width: 181px;
  }

  .contact-resource-hero-section .right-black-section img {
    left: 10%;
    top: -11px;
  }
}

@media (max-width: 900px) {
  .contact-resource-hero-section .right-black-section img {
    left: 14%;
  }
}

@media (max-width: 835px) {
  .contact-resource-hero-section .right-black-section img {
    left: 17%;
  }
}


@media (max-width: 768px) {
  :root {
    --contact-us-container-form-container-mb: 180px;
    --contact-us-form-fields-ptb: 12px;
    --contact-us-form-fields-plr: 0px;
    --contact-us-faq-container-left-spacing: 5px;
    --contact-us-faq-item-pd: 10px;

  }

  .wp-form-contact-us-container-left,
  div#wp-form-contact-us-container-right {
    flex-basis: 350px !important;
  }

  .wp-form-contact-us-container2 p.has-text-align-left.ufc-description {
    font-size: var(--contact-us-regular-font-size);
  }

  .page-template-contact .ufc-container div.wpforms-container-full input[type="text"],
  .page-template-contact .ufc-container div.wpforms-container-full input[type="email"],
  .page-template-contact .ufc-container div.wpforms-container-full input[type="number"],
  .page-template-contact .ufc-container div.wpforms-container-full textarea {
    font-size: var(--contact-us-regular-font-size);
  }

  .contact-us-wp-form div.wpforms-container-full {
    margin-bottom: -2px !important;
  }

  .contact-us-wp-form .wpforms-container .wpforms-field,
  .wp-core-ui div.wpforms-container .wpforms-field {
    padding: var(--contact-us-form-fields-ptb) var(--contact-us-form-fields-plr);
    position: relative;
  }

  /* Resources Page Hero Section Right black img */
  .resource-hero.contact-resource-hero-section .right-black-section img {
    top: 56px;
  }

}

@media (max-width: 769px) {
  .contact-resource-hero-section .overlay-text {
    /* left: 63.2%; */
    top: 29% !important;
  }

  .contact-resource-hero-section .right-black-section img {
    width: 181px;
  }

  .contact-resource-hero-section .right-black-section img {
    left: 6%;
    top: 36px;
  }
}

@media (max-width: 767px) {
  .contact-resource-hero-section .overlay-text {
    left: 63.2%;
  }
}

@media (max-width: 576px) {
  :root {
    --contact-us-faq-mb: 450px;
    --contact-us-faq-answer-ptb: 0;
    --contact-us-faq-answer-plr: 15px;
    --contact-us-faq-answer-pb: 20px;
    --contact-us-container-gap: 70px;
  }

  .wp-form-contact-us-container2 .ufc-heading {
    font-size: var(--contact-us-font-size-heading);
  }

  .wp-form-contact-us-container2 p.has-text-align-left.ufc-description {
    font-size: var(--contact-us-regular-font-size);
    width: 100%;
  }

  .wp-form-contact-us-container2 button#wpforms-submit-365 {
    font-size: var(--ufc-base-text-font-size);
    font-weight: var(--ufc-font-weight-regular);
    height: 37px !important;
  }

  .page-template-contact .contact-us-wp-form div.wpforms-container-full,
  .page-template-contact div.wpforms-container-full * {
    width: 100% !important;
    margin-bottom: -2px !important;
  }

  .contact-us-section .contact-us-faq-container2 {
    flex-direction: column;
  }

  .contact-us-faq-container-right p.ufc-description {
    font-size: var(--contact-us-regular-font-size);
  }

  .contact-us-faq-container2 .faq-answer {
    width: 98%;
  }

  .ufc-container .wpform-contact-uscontainer {
    flex-wrap: wrap !important;
  }
}

@media (max-width: 560px) {
  .contact-resource-hero-section .right-black-section {
    right: -5%;
  }

  .contact-resource-hero-section .right-black-section img {
    width: 171px;
  }
}

@media (max-width: 510px) {

  .contact-resource-hero-section .overlay-text {
    top: 47% !important;
    left: 47.2% !important;
  }

  .contact-resource-hero-section .right-black-section {
    top: 430px !important;
    right: 12%;
  }

  .contact-resource-hero-section .right-black-section img {
    min-width: 200px;
  }
}

@media (max-width: 450px) {
  .contact-resource-hero-section .right-black-section {
    right: 20%;
  }
}

@media (max-width: 380px) {
  .contact-resource-hero-section .right-black-section {
    right: 24%;
  }
}

@media (max-width: 360px) {
  :root {
    --contact-us-container-gap: var(--ufc-s-85);
    --contact-us-form-side-mt: 45px;
    --contact-us-form-side-left: 0px;
  }

  .wp-form-contact-us-container-left,
  .wp-form-contact-us-container-right {
    width: 100% !important;
  }

  .contact-us-faq-container-right p.ufc-description {
    width: 340px;
  }

  .contact-side {
    margin-top: var(--contact-us-form-side-mt) !important;
    left: var(--contact-us-form-side-left);
    position: relative;
  }
}