/* Style for the banner section */
.subPage-Banner {
  /* background-image: url("../images/main-banner.jpg"); Replace with your banner image URL */
  background-color: var(--dark-purple);
  background-size: cover; /* Adjust the background image size */
  background-position: center center; /* Center the background image */
  min-height: 300px; /* Adjust the minimum height to control the banner's height */
  color: #fff; /* Text color for breadcrumbs */
  display: flex;
  align-items: center;
}

/* Style for the breadcrumb navigation */
.breadcrumb {
  background-color: transparent; /* Make the breadcrumbs background transparent */
  font-size: 18px; /* Adjust the font size */
}

.breadcrumb-item a {
  color: var(--white-color);
  text-decoration: none;
}

.breadcrumb-item + .breadcrumb-item::before {
  content: "›"; /* Breadcrumb separator character */
  padding: 0 8px; /* Adjust the spacing between breadcrumbs */
}

/* Style for the active (last) breadcrumb item */
.breadcrumb-item.active {
  color: #fff; /* Text color for the active breadcrumb */
}

/* Contact Us Section Started */
.contact-us-section {
  padding: 80px 0px 80px 0px;
}

.contact-us-section .contact-us-top-content p {
  color: var(--dark-text);
  line-height: 1.7;
}

.contact-us-section .customer-support-content h2.sub-heading {
  color: var(--purple);
  /* font-family: "Cinzel"; */
  font-size: 24px;
  font-weight: 600;
  line-height: 1.7;
}

.contact-us-section .contactInformation-Details .contactInformation-Card {
  border-radius: 15px;
  text-align: center;
}

.contact-us-section .contactInformation-Details .chat-card {
  background-color: var(--purple);
}

.contact-us-section .contactInformation-Card {
  margin-bottom: 20px;
}

.contact-us-section .contactInformation-Details .call-us-card {
  background-color: var(--purple);
}

.contact-us-section .contactInformation-Details .send-email-card {
  background-color: var(--purple);
}

.contact-us-section .contactInformation-Details .contactInformation-Card h4,
.contact-us-section .contactInformation-Details .contactInformation-Card i {
  color: var(--white-color);
}

.contact-us-section .contactForm-Details h4.contactForm-Heading {
  color: var(--purple);
}

/* Phone Input and Flags */
.phoneField .iti {
  width: 100%;
}

.iti__flag {
  background-image: url(../images/flags.png);
}

textarea[type="text"] {
  border-radius: 7px;
}

.contact-us-section .contactForm-Details .contactForm-Card {
  border-radius: 15px;
}

.contact-us-section .submitMessage-Button button.messageSubmit-Button {
  background-color: var(--purple);
  border: none;
  border-radius: 7px;
  color: var(--white-color);
  font-weight: 300;
  padding: 8px 15px 8px 15px;
  width: 100%;
}

.contact-us-section .submitMessage-Button button.messageSubmit-Button:hover {
  background-color: var(--gold);
}

.contact-us-section .contactForm-Details .contactForm-Card p {
  color: var(--dark-text);
  line-height: 1.7;
}

.contact-us-section .contactForm-Details .contactForm-Card iframe {
  border-radius: 15px;
}

.validation-message {
  color: red;
  font-size: 14px;
}

.contact-us-section .contactMap-Column {
  padding-top: 40px;
}

/* Contact Us Modal */
.contact-modal .modal-content {
  border-radius: 15px;
  border: none;
}

.contact-modal .modal-content .modal-header {
  border-bottom: unset;
}

.contact-modal .modal-content .modal-header h5 {
  color: var(--black-color);
  font-size: 22px;
  font-weight: 600;
}

.contact-modal .modal-content .modal-body p {
  line-height: 2;
}

button.close {
  background: transparent;
  border: none;
  /* border: 1px dashed var(--dark-text); */
  border-radius: 50%;
}

button.close span {
  font-size: 30px;
}
/* Contact Us Section Ended */

@media (min-width: 768px) {
}

@media (min-width: 992px) {
  .contact-us-section .contactForm-Column,
  .contact-us-section .contactMap-Column {
    width: 100%;
  }

  .contact-us-section .contact-Details-Card {
    width: 100%;
  }

  .contact-modal {
    --bs-modal-width: 650px;
  }
}

@media (min-width: 1200px) {
  /* .contact-us-section .contactForm-Seperator {
    border-left: 1px solid #ccc;
  } */

  .contact-us-section .contactInformation-Details,
  .contact-us-section .contactForm-Details {
    display: flex;
    justify-content: space-between;
  }

  .contact-us-section .contact-Details-Card {
    width: 33.33333333%;
  }

  .contact-us-section .contactForm-Column {
    width: 58.33333333%;
  }

  .contact-us-section .contactMap-Column {
    padding-top: unset;
    width: 41.66666667%;
  }

  .contact-us-section .contactInformation-Card {
    margin-bottom: unset;
  }

  .contact-us-section .contactInformation-Details .chat-card,
  .contact-us-section .contactInformation-Details .call-us-card {
    margin-right: 20px;
  }
}
