news-date@font-face {
  font-family: "Segoe UI", sans-serif;
  src: url("/assets/font/Segoe_UI.ttf") format("truetype");
}

:root {
  --lora-fonts: "Lora", serif;
  --source-sans3-fonts: "Source Sans 3", sans-serif;
  --segoe-ui-fonts: "Segoe UI", sans-serif;
  --font-size-50px: 50px;
  --font-size-40px: 40px;
  --font-size-35px: 35px;
  --font-size-32px: 32px;
  --font-size-28px: 28px;
  --font-size-24px: 24px;
  --font-size-20px: 20px;
  --font-size-16px: 16px;
  --font-weight-400: 400;
  --font-weight-300: 300;
  --line-height-1-56: 1.56;
  --line-height-1-25: 1.25;
  --line-height-1-13: 1.13;
  --line-height-0-75: 0.75;
  --nav-color: #000000;
}

.mission-container .donate-only-overlay {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: linear-gradient(
    to bottom,
    rgb(0 0 0.43/ 32%),
    rgba(0, 0, 0, 0.65)
  );
  z-index: 0;
}

.sec_01pt-donateonly {
  padding-top: 8.5rem;
}

.donate-container-text {
  position: relative;
  margin-top: -54rem;
  color: white;
}

.donate-container-text p {
  color: white;
}

.donate-form-container {
  padding: 60px;
  position: relative;
  border: 1px solid #f2f0ed;
  margin-top: 5rem;
  background-color: #fefefd;
}

.donate-form-container .nav-tabs .nav-link.active {
  color: var(--bs-nav-tabs-link-active-color);
  background-color: transparent;
  border-color: transparent;
  font-size: 35px !important;
  font-family: var(--lora-fonts);
  border-bottom-color: black;
}

.donate-form-container .nav-tabs {
  border-bottom: 1px solid rgb(243 241 241);
}

.donate-form-container .nav-tabs a {
  text-decoration: none;
  color: #727272;
  font-size: 35px !important;
  font-family: var(--lora-fonts);
}

.donate-form-container .nav-tabs .nav-link:hover {
  isolation: isolate;
  border-color: transparent;
}

.donate-form-container .sub-text {
  font-family: var(--lora-fonts) !important;
  font-size: 24px !important;
  font-weight: 400 !important;
  line-height: normal !important;
  letter-spacing: normal !important;
}

.donate-form-container .form-label,
.donate-form-container .form-check-label,
.donate-form-container .form-check-label-sub {
  font-size: 16px;
  font-weight: 300;
  font-family: var(--segoe-ui-fonts);
  color: black !important;
}

.donate-form-container .form-check-label-sub {
  font-size: 14px !important;
  padding-top: 12px;
}

.donate-form-container .giftaid-img {
  object-fit: cover;
  max-width: 180px;
  padding-bottom: 30px;
  padding-top: 15px;
}

.donate-form-container .btn-other {
  width: 158px;
  height: 50px;
  background: #fff;
  border-radius: 3rem;
  padding: 0.55rem 1.25rem;
  font-size: 18px !important;
  font-family: var(--source-sans3-fonts) !important;
  font-weight: 700;
  border: 2px solid #6b1a31;
  color: #6b1a31;
  letter-spacing: 0.5px;
}

.donate-form-container form input,
.donate-form-container .form-select {
  max-width: 100% !important;
}

.donate-form-container .input-group-text,
.donate-form-container .form-control-amount {
  border: 0 !important;
  border-bottom: 1px solid #767676 !important;
  border-radius: 0 !important;
  padding-left: 0px !important;
  padding-bottom: 11px !important;
  font-size: 18px !important;
  color: #6b1a31 !important;
  font-weight: 700 !important;
  font-family: var(--segoe-ui-fonts) !important;
  background-color: #fefefd !important;
  letter-spacing: 0.5px !important;
}

.donate-form-container .form-control {
  border: 0;
  border-bottom: 1px solid #767676;
  border-radius: 0;
  padding-left: 0px;
  font-size: 16px;
  font-weight: 300;
  font-family: var(--segoe-ui-fonts);
  color: black;
  background-color: #fefefd;
  letter-spacing: 0.5px;
}

.donate-form-container .form-control:focus {
  box-shadow: none;
  border-color: var(--grey-color);
  outline: 0;
}

.donate-form-container .pay-btn {
  width: 158px;
  height: 50px;
  background: #6b1a31;
  border-radius: 3rem;
  padding: 0.55rem 1.25rem;
  font-size: 18px !important;
  font-family: var(--source-sans3-fonts) !important;
  font-weight: 700;
  border: 2px solid #6b1a31;
  color: white;
  letter-spacing: 0.5px;
}

.donate-form-container .btn-check:checked + .btn,
.donate-form-container .btn.active,
.donate-form-container .btn.show,
.donate-form-container .btn:first-child:active,
.donate-form-container :not(.btn-check) + .btn:active {
  color: white;
  background-color: #6b1a31;
  border-color: #6b1a31;
}



.wpcf7-form-control-wrap {
  width: 100%;
}

.tribute-radio .wpcf7-form-control {
  display: grid;
  gap: 6px;
}




@media (max-width: 575px) {
  .mobile-donateform-img {
    height: 874px !important;
  }

  .donate-form-container {
    padding: 15px;
    padding-top: 50px;
  }

  .donate-form-container .nav-tabs .nav-link.active,
  .donate-form-container .nav-tabs a {
    font-size: 20px !important;
  }

  .donate-form-container .sub-text {
    font-size: 18px !important;
  }
}




.amount-btn {
  display: grid;
  gap: 50px;
}

.amount-btn input[type="radio"] {
  display: none;
}

.amount-btn .wpcf7-list-item {
  margin-left: 0px;
}

.amount-btn .wpcf7-list-item label,
#donationForm .amount-btn {
  cursor: pointer;
  transition: all 0.3s ease;
  text-align: center;
  width: 158px;
  height: 50px;
  background: #fff;
  border-radius: 3rem;
  padding: 0.55rem 1.25rem;
  font-size: 18px !important;
  font-family: var(--source-sans3-fonts) !important;
  font-weight: 700;
  border: 2px solid #6b1a31;
  color: #6b1a31;
  letter-spacing: 0.5px;
}

.amount-btn .wpcf7-list-item label:has(input[type="radio"]:checked),
#donationForm input[type="radio"]:checked + label.amount-btn {
  background-color: #6b1a31 !important;
  color: #fff !important;
  border-color: #6b1a31 !important;
}



#card-element {
    border: 1px solid #ced4da;      /* Light gray border */
    padding: 12px;
    border-radius: 6px;
    background-color: #fff;
    box-shadow: inset 0 1px 3px rgba(0,0,0,0.1);
    transition: border-color 0.3s, box-shadow 0.3s;
    font-size: 16px;
    font-weight: 300;
    font-family: var(--segoe-ui-fonts);
    color: black;
}

#card-element.focused {
    border-color: #5b9bd5;
    box-shadow: 0 0 0 2px rgba(91, 155, 213, 0.25);
}

#card-element.error {
    border-color: #dc3545;
}

.ElementsApp input {
    background-color: transparent;
    border: none;
    display: block;
    font-size: 16px !important;
    font-weight: 300 !important;
    font-family: var(--segoe-ui-fonts) !important;
    height: 1.2em;
    line-height: 1.2em;
    margin: 0;
    padding: 0;
    width: 100%;
}