:root {
  --accent-primary: #00a9e0;
  --accent-second: #84bd00;
  --accent-tertiary: #14377d;
  --blue-dark: #0c214b;
  --blue-medium: #203a8b;
  --green-dark: #0b4b26;
  --accent-purple: #4f2984;
  --accent-orange: #faa41a;
  --spacing-base: 16px;
  --grey: #e6e7e7;
  --light-blue-600: #00a9e0;
  --dark-blue-900: #0e3075;
  --dark-blue-950: #0b0c2d;
  --container: 79.375rem;
  --theme-green: #85bd1e;
  --theme-green-dark: #0e4b27;
}

.btn {
  background-color: #00a9e0;
}

.btn-white {
  background-color: #ffffff;
  color: #000000;
}

.btn-orange {
  background-color: #f8a32d;
  color: var(--dark-blue-900);
}

.btn-orange:hover {
  background-color: #d86107;
  color: var(--dark-blue-900);
}

.btn-blue-900 {
  background-color: var(--dark-blue-900);
  color: #ffffff;
}

.btn-blue-900:hover {
  background-color: var(--dark-blue-950);
  color: #ffffff;
}

.text-dark-blue-900 {
  color: var(--dark-blue-900);
}

.text-dark-blue-950 {
  color: var(--dark-blue-950);
}

.bg-dark-blue-900 {
  background-color: var(--dark-blue-900);
}

.text-black {
  color: #000000;
}

.text-primary {
  color: var(--accent-primary);
}

.text-second {
  color: var(--accent-second);
}

.text-blue-medium {
  color: var(--blue-medium);
}

.user-login-form,
.user-pass,
#user-register-form {
  max-width: 640px;
  margin: 50px auto;
}

.theme-white {
  background-color: #fff;
}

.theme-lime {
  background-color: var(--accent-second);
  color: #0b4b26;
}

.theme-cyan {
  background-color: var(--accent-primary);
  color: var(--accent-tertiary);
}

.theme-blue_navy {
  background-color: var(--accent-tertiary);
  color: #fff;
}

.theme-purple {
  background-color: var(--accent-purple);
  color: #fff;
}

.theme-orange {
  background-color: var(--accent-orange);
  color: #000;
}

.background-white {
  background-color: #ffffff;
}

.background-primary {
  background-color: var(--accent-primary);
}

.background-second {
  background-color: var(--accent-second);
}

.background-grey {
  background-color: #e6e7e7;
}

.bg-light-blue-600 {
  background-color: var(--light-blue-600);
}

.background-dark-grey {
  background-color: #cfd1d2;
}

.background-gunmetal-gray {
  background-color: #63666a;
}

.node--type-campaign #header > #navbar-main {
  position: static;
}

.no-gutters {
  margin-inline: 0;
}

.section-donation {
  margin-bottom: 4.5rem;
}

.no-gutters > .col,
.no-gutters > [class*="col-"] {
  padding-inline: 0;
}

.donation-row-wrap {
  display: flex;
  flex-direction: column;
  column-gap: clamp(3rem, 10.75vw, 8rem);
}

.donation-content__column,
.donation-form__column {
  width: 100%;
}

.donation-form--wrap {
  margin-block: 0;
  background-color: #f7f7f7;
  border-radius: 40px;
  padding: clamp(1.875rem, 2.8125vw, 4.5rem) clamp(1.25rem, 2.8125vw, 4.5rem);
  width: 100%;
  max-width: 562px;
}

.donation-content__image {
  width: 100%;
  max-width: 25rem;
}

.donation-content__header {
  padding-block-start: clamp(2rem, 5.5vw, 4rem);
  padding-block-end: 10px;
  max-width: 31.25rem;
}

.donation-title {
  font-size: clamp(1.75rem, 4vw, 3rem);
  line-height: 1.2857;
}

.mt60 {
  margin-top:60px;
}

.mt100 {
  margin-top:100px;
}

.mt120 {
  margin-top:120px;
}

.pt60 {
  padding-top:60px;
}

.pt100 {
  padding-top:100px;
}

.pt120 {
  padding-top:120px;
}

@media screen and (min-width: 62rem) {
  .section-donation {
    background-size: calc(60vw - ((100vw - 1250px) / 2));
    background-repeat: no-repeat;
    background-position-x: calc((100vw - 1250px) / 2 - 5vw);
    background-position-y: bottom;
  }

  .donation-row-wrap {
    flex-direction: row;
  }

  .donation-content__column {
    width: 46%;
  }

  .donation-content__image {
    max-width: unset;
  }

  .donation-form__column {
    width: 54%;
  }

  .donation-form--wrap {
    margin-block: clamp(3rem, 6.667vw, 5rem);
  }

  .donation-content__header {
    padding-block: clamp(2rem, 5.5vw, 4rem);
  }

  .donation-title {
    line-height: 1.04;
  }
}

@media (max-width: 61.9375rem) {
  .section-donation {
    background-image: none !important;
  }
}

@media (max-width: 47.9375rem) {
  .navbar-brand {
    margin-inline-start: 0;
  }
}

body.campaign-green .paragraph--type--campaign-banner,
body.campaign-green .donation-cta-banner,
body.campaign-green .paragraph--type--donation-tracking .tracking-bar {
  background-color: var(--theme-green-dark);
}

body.campaign-green .paragraph--type--campaign-banner .text-dark-blue-900 {
  color: #ffffff;
}
body.campaign-green .paragraph--type--campaign-banner h1  {
  line-height: 1!important;
}
body.campaign-green .paragraph--type--campaign-banner .field--name-field-headline {
  -webkit-box-decoration-break: clone;
  background-color: var(--theme-green);
  box-decoration-break: clone;
  color: var(--theme-green-dark);
  display: inline;
  font-size: 28px;
  line-height: 1.3!important;
  padding: 0.15em 0.4em;
}
body.campaign-green .paragraph--type--campaign-banner .btn,
body.campaign-green .donation-cta-banner .btn,
body.campaign-green .paragraph--type--donation-tracking .btn {
  background-color: var(--theme-green);
  color: var(--theme-green-dark);
}
body.campaign-green .paragraph--type--campaign-banner .btn:hover,
body.campaign-green .donation-cta-banner .btn:hover,
body.campaign-green .paragraph--type--donation-tracking .btn:hover {
  background-color: #6a9c00;
}
body.campaign-green .btn:not([class*="btn-"]),
body.campaign-green .media-content .btn.btn-orange,
body.campaign-green .donation-banner-sticky .btn.btn-orange {
  background-color: var(--theme-green-dark);
  color: #ffffff;
}
body.campaign-green .btn:not([class*="btn-"]):hover,
body.campaign-green .media-content .btn.btn-orange:hover,
body.campaign-green .donation-banner-sticky .btn.btn-orange:hover {
  background-color: var(--theme-green);
  color: var(--theme-green-dark);
}
body.campaign-green .paragraph--type--donation-tracking,
body.campaign-green.new-theme-page #canteen_donation_multistep_form .form-header-wrap .header-content > div {
  color: var(--theme-green-dark);
}

body.campaign-green .paragraph--type--donation-tracking .tracking-bar .tracking-bar-value,
body.campaign-green.new-theme-page #canteen_donation_multistep_form .form-header-wrap {
  background-color: var(--theme-green);
}