@import url("https://fonts.googleapis.com/css2?family=Barlow:wght@400;500;600;700&display=swap");
* {
  margin: 0;
  padding: 0;
  box-sizing: inherit;
}

html {
  font-size: 62.5%;
  scroll-behavior: smooth;
}
@media (max-width: 29.9875em) {
  html {
    font-size: 58%;
  }
}

body {
  margin: 0 auto;
  font-family: "Barlow", sans-serif;
  font-size: 1.6rem;
  font-weight: 400;
  color: #555;
  box-sizing: border-box;
  line-height: 1.7;
}

a {
  display: inline-block;
  text-decoration: none;
  transition: all 0.2s ease-in-out;
}
a:link,
a:visited {
  color: #e97195;
}
a:hover,
a:active,
a.active {
  color: #555;
}
a.active {
  font-weight: 600;
}

img {
  display: block;
  border-radius: 0.3rem;
}

ul {
  list-style: none;
}

ol {
  margin-top: -0.8rem;
  margin-left: 2rem;
}
ol li {
  padding-left: 1.6rem;
}

.take-action {
  position: fixed;
  top: 50%;
  right: 0;
  transform: translate(0%, -50%);
  display: flex;
  justify-content: space-around;
  align-items: center;
  gap: 0.4rem;
  width: auto;
  padding: 0.8rem 1.6rem;
  color: #fff;
  text-transform: uppercase;
  border-radius: 5rem 0 0 5rem;
  border-top: 0.2rem solid #00b1cf;
  border-bottom: 0.2rem solid #00b1cf;
  border-left: 0.2rem solid #00b1cf;
  background-color: #00c7e9;
  transition: all 0.2s ease-in-out;
  z-index: 1;
}
.take-action:hover {
  color: #00c7e9;
  background-color: #fff;
}

h1,
h2,
h3 {
  margin-bottom: 3.2rem;
  line-height: 1.25;
}
h1.heading,
h2.heading,
h3.heading {
  font-weight: 500;
  color: #e97195;
}
h1.heading--white,
h2.heading--white,
h3.heading--white {
  color: #fff;
}
h1.heading--tertiary,
h2.heading--tertiary,
h3.heading--tertiary {
  color: #36e2ff;
}

h1 {
  font-size: 4.8rem;
}

h2 {
  font-size: 3.2rem;
  font-weight: 400;
}

h3 {
  font-size: 2.4rem;
}

p {
  margin: 1.6rem 0;
  font-size: 2rem;
}
@media (max-width: 29.9875em) {
  p {
    font-size: 2.4rem;
  }
}
p.lead {
  margin-bottom: 3.2rem;
  font-size: 2.4rem;
  font-weight: 600;
}

ol {
  font-size: 1.8rem;
}

.hero--page h1 {
  margin-bottom: 0.8rem;
  font-size: 2.8rem;
  font-weight: 600;
  color: #fff;
  text-transform: uppercase;
}
.hero__title h1 {
  color: #fff;
  text-shadow: 0.2rem 0.2rem #555555;
}
.hero__title li {
  text-transform: capitalize;
}
.hero__subtitle h2 {
  color: #000;
}

.sticky {
  position: sticky;
  overflow: hidden;
  top: 14.4rem;
  display: flex;
  flex-direction: column;
  padding-left: 0.2rem;
}

.centered {
  text-align: center;
}

.normal {
  text-transform: none !important;
}

.capitalize {
  text-transform: capitalize !important;
}

.color-1 {
  color: #555 !important;
}
.color-2 {
  color: #e97195 !important;
}
.color-3 {
  color: #00b1cf !important;
}

.story .col-60 p {
  padding: 0 !important;
  text-align: left !important;
}
.story__text {
  font-size: 2rem;
  text-align: center;
  line-height: 1.3;
}

.testimonials {
  font-size: 1.8rem;
}
.testimonials .testimonial .name {
  font-size: 1.8rem;
  font-weight: 600;
}
.testimonials .testimonial .location {
  font-size: 1.6rem;
}

.cards .card__body--title {
  font-size: 2rem;
  font-weight: 600;
}
.cards .card__body--excerpt p {
  font-size: 1.8rem;
}
.cards .card__tag {
  font-size: 1.2rem;
  font-weight: 700;
}
.cards .card__footer {
  font-size: 1.6rem;
  font-weight: 500;
}

.form__label {
  font-size: 1.8rem;
}

.about-feature h1 {
  margin-bottom: 0;
  font-size: 4.8rem;
  text-align: center;
  text-shadow: 0.2rem 0.2rem #555555;
}

.team .card__body {
  font-weight: 600;
  text-align: center;
}

.donate p.lead {
  margin: 0;
}

.alert__title {
  font-size: 2rem;
  font-weight: 500;
}
.alert__body {
  font-size: 1.8rem;
}

footer {
  color: #fff;
}
footer .footer p {
  font-size: 1.6rem !important;
}
footer .footer a {
  font-size: 1.6rem;
  font-weight: 500;
}
footer .footer__copyright {
  font-size: 1.6rem;
}

nav {
  position: fixed;
  top: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  font-size: 1.6rem;
  transition: 0.2s all ease-in-out;
  z-index: 10;
}
nav .navbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  width: 115.2rem;
  height: 10rem;
  margin: 3.2rem auto 0;
  padding: 1.3rem 1.6rem;
  border-top: 1px solid rgba(0, 0, 0, 0.16);
  border-radius: 1rem;
  background-color: #ffffff;
  box-shadow: 0 3px 6px rgba(0, 0, 0, 0.16);
}
@media (max-width: 29.9875em) {
  nav .navbar {
    max-width: 60rem;
  }
}
nav .navbar__left {
  flex: 0 0 20rem;
  display: flex;
  align-items: center;
}
@media (max-width: 29.9875em) {
  nav .navbar__left {
    flex: 0 0 12rem;
  }
}
nav .navbar__left img {
  width: 25rem;
  max-width: 100%;
}
@media (max-width: 29.9875em) {
  nav .navbar__left img {
    width: 15rem;
  }
}
nav .navbar__right {
  flex: 1;
  display: flex;
  justify-content: flex-end;
}
nav .navbar__right ul {
  display: flex;
  align-items: center;
  gap: 0.4rem;
  font-size: 1.6rem;
}
nav .navbar__right ul.mobile-menu {
  display: none;
}
nav .navbar__right ul li {
  list-style: none;
  padding: 0.8rem;
  text-transform: uppercase;
}
nav .navbar__right ul li a {
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: -0.1rem;
  padding: 1rem 0;
  font-weight: 600;
  border-top: 0.2rem solid transparent;
  transition: all 0.2s ease-in-out;
}
nav .navbar__right ul li a:hover,
nav .navbar__right ul li a.nav__link.active {
  margin-top: -0.1rem;
  border-top: 0.2rem solid #e97195;
}
nav .navbar__right ul li a.btn {
  padding: 0.8rem 2.4rem;
}

#page {
  font-size: 2rem;
}
#page .parenthood {
  background: url("../images/parenthood-bg-2x.png") no-repeat scroll 1rem 75%/65%;
}
#page .story {
  background-color: rgba(244, 227, 243, 0.5);
}
#page .story__content {
  border-radius: 3rem;
}
#page .story__content .row {
  background-color: #fff;
}
#page .story__content .row .col-4 {
  overflow: hidden;
}
#page .story__content .row .col-4 img {
  width: 60rem;
  border-top-left-radius: 1rem;
  border-bottom-left-radius: 1rem;
}
#page .story__content .row .col-8 {
  padding: 3.2rem;
}
@media (max-width: 29.9875em) {
  #page .story__content {
    padding: 1.6rem 1.6rem 6.4rem;
    background-image: none;
  }
}
#page .story__container {
  display: flex;
  gap: 6.4rem;
}
@media (max-width: 29.9875em) {
  #page .story__container {
    flex-direction: column;
    gap: 6.4rem;
  }
}
#page .story__box {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: center;
  gap: 1.6rem;
  width: 100%;
  padding: 3.2rem;
  border-radius: 0.5rem;
  background: linear-gradient(
    -240deg,
    rgba(233, 113, 149, 0.15) 25%,
    rgba(54, 226, 255, 0.15) 75%
  );
  box-shadow: 0 0.3rem 0.6rem rgba(224, 224, 224, 0.85);
  cursor: default;
}
#page .story__box:hover {
  background: linear-gradient(
    -240deg,
    rgba(54, 226, 255, 0.15) 25%,
    rgba(233, 113, 149, 0.15) 75%
  );
}
#page .story__icon img {
  width: 9.6rem;
}
#page .story .action {
  margin-top: 8rem;
}
#page .goals {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: url("../images/our-goals-bg.jpg") no-repeat scroll left top/cover;
}
#page .goals .container {
  padding: 4.8rem;
  border-radius: 0.5rem;
  border: 0.1rem solid rgb(234, 233, 233);
  background-color: rgba(255, 255, 255, 0.95);
}
@media (max-width: 29.9875em) {
  #page .goals .col-70 {
    margin-top: -6.4rem !important;
  }
}
#page.contact .feature-image {
  height: 34rem;
  margin-top: 3.2rem;
  overflow: hidden;
}
.contact .card,
.donate .card {
  padding: 2.4rem 3.2rem 3.2rem;
  border: 0.1rem solid rgb(234, 233, 233);
  border-radius: 0.3rem;
  background-color: rgba(243, 243, 243, 0.5);
}
#page.contact .lab,
#page.donate .lab {
  margin-right: 1.2rem;
}
#page.team .card {
  justify-content: flex-start;
}
#page.team .card__image {
  position: relative;
  width: 100%;
  max-width: 55rem;
  height: 47rem;
  overflow: hidden;
  cursor: default;
}
#page.team .card__image-name {
  position: absolute;
  top: 136%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1.6rem;
  width: 32rem;
  height: calc(100% - 3.2rem);
  padding: 1.2rem 3.2rem;
  color: #fff;
  border-radius: 0.3rem;
  background-color: rgba(0, 155, 182, 0.95);
  opacity: 1;
  transition: all 0.2s ease-in-out;
}
#page.team .card__image-name span {
  font-weight: 600;
}
#page.team .card__image-name p {
  font-size: 1.8rem;
  text-align: center;
}
#page.team .card:hover .card__image-name {
  top: 50%;
  justify-content: center;
  background-color: rgba(0, 155, 182, 0.75);
}
#page .partners {
  min-height: 25rem;
}
#page .testimonials {
  display: flex;
  justify-content: center;
  align-items: center;
  background: rgb(61, 186, 232) url("../images/testimonials-bg-2x.png")
    no-repeat scroll left top/cover;
}
#page .testimonials .col-100 {
  display: flex;
  justify-content: center;
  gap: 1.6rem;
}
@media (max-width: 29.9875em) {
  #page .testimonials .col-100 {
    width: 100%;
    flex-direction: column;
    gap: 4.8rem;
  }
}
#page .testimonials .testimonial {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.6rem;
  width: 50%;
  padding: 3.2rem;
  border-radius: 0.5rem;
  background-color: #fdeffc;
}
@media (max-width: 29.9875em) {
  #page .testimonials .testimonial {
    width: 100%;
  }
}
#page .testimonials .testimonial__footer {
  display: flex;
  align-items: center;
  gap: 1.6rem;
}
#page .testimonials .testimonial__avatar {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 11.2rem;
  height: 11.2rem;
  border-radius: 50%;
  border: 0.5rem solid #fff;
  box-shadow: 0 0.3rem 0.6rem rgba(224, 224, 224, 0.85);
  overflow: hidden;
}
#page .testimonials .testimonial__avatar img {
  width: 17rem;
}
#page .testimonials .testimonial__info {
  display: flex;
  flex-direction: column;
  line-height: 1.3;
}
#page .testimonials .testimonial__slider {
  display: none;
  justify-content: center;
  align-items: center;
  gap: 0.8rem;
}
#page .posts {
  background-color: rgba(253, 239, 252, 0.5);
}
#page .about-feature {
  display: flex;
  justify-content: center;
  align-items: center;
  height: 40rem;
  margin: 1.6rem 0;
  background:
    linear-gradient(
      -240deg,
      rgba(54, 226, 255, 0.35) 40%,
      rgba(233, 113, 149, 0.35) 60%
    ),
    url("../images/about-us-feat-img-2.webp") no-repeat fixed 0 90% / cover;
}
#page .about-feature h1 {
  color: #fff;
}
@media (max-width: 29.9875em) {
  #page .about-feature {
    height: 60vh;
    background-position: 50% 50%;
  }
}

.alert {
  display: flex;
  flex-direction: column;
  gap: 0.8rem;
  margin: 0.8rem auto 3.2rem;
  border: 0.1rem solid #e5e7eb;
  border-radius: 0.3rem;
  box-shadow: 0 0.3rem 0.6rem rgba(224, 224, 224, 0.5);
  z-index: 1;
}
.alert--danger {
  color: rgb(207, 71, 71);
  background-color: rgb(254, 242, 242);
}
.alert--info {
  color: rgb(41, 72, 159);
  background-color: rgb(239, 246, 255);
}
.alert--success {
  color: rgb(36, 144, 75);
  background-color: rgb(240, 253, 244);
}
.alert--warning {
  color: rgb(203, 139, 49);
  background-color: rgb(255, 249, 241);
}
.alert .icon {
  width: 3.2rem;
  height: 3.2rem;
}
.alert__header {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 1.6rem;
  padding: 0.8rem 1.6rem;
  border-bottom: 0.1rem solid rgba(224, 224, 224, 0.5);
}
.alert__header.header--danger {
  background-color: #fde4e4;
}
.alert__header.header--info {
  background-color: #e0edff;
}
.alert__header.header--success {
  background-color: #e3fbea;
}
.alert__header.header--warning {
  background-color: #fff2e2;
}
.alert__icon {
  flex: 0 0 3.2rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.alert__title {
  display: flex;
  align-items: center;
  width: 100%;
}
.alert__dismiss {
  flex: 0 0 1.6rem;
  display: flex;
  justify-content: center;
  align-items: center;
}
.alert__dismiss .icon {
  stroke-width: 1.5;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
.alert__dismiss .icon:hover {
  transform: rotate(90deg);
}
.alert__body {
  display: flex;
  align-items: center;
  padding: 0 1.6rem 0.8rem;
}

.form-error {
  width: 100%;
  color: rgb(207, 71, 71);
}

.btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  max-width: 18rem;
  padding: 1rem 2.4rem;
  font-family: "Barlow", sans-serif;
  font-size: 1.6rem;
  font-weight: 600;
  color: #555;
  border: 0.2rem solid #e0e0e0;
  border-radius: 5rem;
  background-color: #fff;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}
@media (max-width: 29.9875em) {
  .btn {
    padding: 0.8rem 2.4rem !important;
    font-size: 1.4rem;
  }
}
.btn .icon-back {
  margin-left: 0 !important;
  margin-right: 0.8rem !important;
}
.btn:hover .icon,
.btn:active .icon {
  transform: translateX(0.4rem);
}
.btn:hover .icon-back,
.btn:active .icon-back {
  transform: translateX(-0.4rem);
}
.btn .icon {
  width: 1.6rem;
  margin: 0 0.4rem;
  stroke-width: 0.3rem;
  transition: all 0.2s ease-in-out;
}
.btn--primary {
  color: #fff !important;
  text-transform: uppercase;
  border: 0.2rem solid #df2f64;
  background-color: #e97195;
}
.btn--primary:hover {
  background-color: #e4527e;
}
.btn--primary:active {
  background-color: #e24574;
}
.btn--primary:hover,
.btn--primary:active {
  border: 0.2rem solid #bd1d4d;
}
.btn--secondary {
  color: #e97195 !important;
  text-transform: capitalize;
  border: 0.2rem solid #e97195;
  background-color: #fff;
}
.btn--secondary:hover {
  color: #fff;
  background-color: #e4527e;
}
.btn--secondary:hover .icon {
  stroke: #fff;
}
.btn--secondary:active {
  background-color: #e24574;
}
.btn--secondary:hover,
.btn--secondary:active {
  color: #fff !important;
}
.btn--secondary:hover .icon,
.btn--secondary:active .icon {
  transform: translateX(0.4rem);
  stroke: #fff;
}
.btn--tertiary {
  color: #555555;
  text-transform: capitalize;
  border: 0.2rem solid #00c7e9;
  background-color: #36e2ff;
}
.btn--tertiary:hover {
  color: #555555;
  background-color: #03dbff;
}
.btn--tertiary:active {
  background-color: #00d0f3;
}
.btn--tertiary .icon {
  stroke: #555555;
  stroke-width: 0.2rem;
}
.btn--form {
  color: #fff;
  text-transform: capitalize;
  border: 0.2rem solid #e24574;
  background-color: #e97195;
}
.btn--form:hover {
  background-color: #e8688e;
}
.btn--form:active {
  background-color: #e65b85;
}
.btn--form:hover,
.btn--form:active {
  border: 0.2rem solid #d32156;
}
.btn--form .icon {
  stroke: #fff;
}
.btn--link {
  font-weight: 600;
  box-shadow: none;
}
@media (max-width: 29.9875em) {
  .btn--link {
    width: 18rem !important;
    font-size: 1.8rem;
  }
}
.btn--link:hover .icon {
  stroke: #555555;
}
.btn--slider {
  position: relative;
  padding: 0.8rem;
  border-radius: 50%;
  background-color: #e97195;
}
.btn--slider.active {
  padding: 0.6rem;
  border-radius: 50%;
  border: 0.3rem solid #fff;
}

.cards {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  column-gap: 2.4rem;
  row-gap: 4.8rem;
  max-width: 115.2rem;
  margin: 0 auto;
}
.cards .card {
  display: flex;
  flex-direction: column;
  justify-content: space-between;
  width: 36rem;
  border: 0.1rem solid rgba(224, 224, 224, 0.5);
  border-radius: 0 0 0.5rem 0.5rem;
  background-color: #fff;
  box-shadow: 0 0.3rem 0.6rem rgba(224, 224, 224, 0.5);
  line-height: 1.5;
}
@media (max-width: 29.9875em) {
  .cards .card {
    width: 38rem;
  }
}
.cards .card:hover img {
  transform: scale(1.05);
}
.cards .card:not(:nth-child(3n + 3)) {
  margin-right: 1.2rem;
}
.cards .card__image {
  position: relative;
  width: 100%;
  height: 24rem;
  overflow: hidden;
}
.cards .card__image img {
  width: 100%;
  background-color: transparent;
  transition: all 0.2s ease-in-out;
}
.cards .card__tag {
  position: absolute;
  bottom: 1.6rem;
  right: 2rem;
  padding: 0.4rem 0.8rem;
  color: #fff;
  text-transform: capitalize;
  border-radius: 0.3rem;
  background-color: rgba(0, 155, 182, 0.75);
  transition: all 0.2s ease-in-out;
}
.cards .card__tag:hover {
  background-color: rgba(0, 133, 156, 0.75);
}
.cards .card__body {
  display: flex;
  flex-direction: column !important;
  justify-content: space-between;
  align-content: center;
  padding: 1.6rem;
}
.cards .card__body--title {
  margin-bottom: 1.6rem;
}
.cards .card__footer {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.6rem;
  border-top: 0.1rem solid rgba(224, 224, 224, 0.75);
}
.cards .card__footer .icon {
  margin-top: -0.2rem;
  margin-right: 0.8rem;
}

.form {
  margin: 0;
  font-size: 1.6rem;
}
.form__horizontal {
  display: grid;
  align-items: start;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 1.6rem;
  width: 100%;
}
.form__horizontal button {
  margin-top: 0.8rem;
  padding: 1.6rem 1.6rem 1.4rem;
  border: 0.1rem solid #555555;
}
.form__group {
  display: grid;
  align-items: start;
  grid-auto-flow: column;
  grid-auto-columns: 1fr;
  gap: 1.6rem;
}
.form__group:not(:last-of-type) {
  margin-bottom: 2.4rem;
}
.form__input-group {
  display: flex;
  flex-direction: column;
  gap: 0.4rem;
}
.form__label {
  display: flex;
  width: 100%;
  font-weight: 500;
  text-transform: capitalize;
}
.form__input {
  display: flex;
  flex-direction: column;
  position: relative;
}
.form__input input[type="text"],
.form__input input[type="email"],
.form__input input[type="password"],
.form__input input[type="number"],
.form__input input[type="tel"],
.form__input input[type="file"],
.form__input input[type="checkbox"],
.form__input input[type="radio"],
.form__input select,
.form__input textarea {
  position: relative;
  width: 100%;
  font-family: "Barlow", sans-serif;
  font-size: inherit;
  font-weight: inherit;
  padding: 1.6rem 1.6rem 1.6rem 4.8rem;
  color: #555555;
  background-color: #fff;
  border: 0.1rem solid #e0e0e0;
  border-radius: 0.3rem;
  outline: none;
  transition: all 0.2s ease-in-out;
}

.form__input input[type="text"]:hover,
.form__input input[type="text"]:focus,
.form__input input[type="email"]:hover,
.form__input input[type="email"]:focus,
.form__input input[type="password"]:hover,
.form__input input[type="password"]:focus,
.form__input input[type="number"]:hover,
.form__input input[type="number"]:focus,
.form__input input[type="tel"]:hover,
.form__input input[type="tel"]:focus,
.form__input input[type="file"]:hover,
.form__input input[type="file"]:focus,
.form__input input[type="checkbox"]:hover,
.form__input input[type="checkbox"]:focus,
.form__input input[type="radio"]:hover,
.form__input input[type="radio"]:focus,
.form__input select:hover,
.form__input select:focus,
.form__input textarea:hover,
.form__input textarea:focus {
  background-color: rgba(255, 255, 255, 0.95) !important;
}
.form__input input[type="text"]:focus,
.form__input input[type="email"]:focus,
.form__input input[type="password"]:focus,
.form__input input[type="number"]:focus,
.form__input input[type="tel"]:focus,
.form__input input[type="file"]:focus,
.form__input input[type="checkbox"]:focus,
.form__input input[type="radio"]:focus,
.form__input select:focus,
.form__input textarea:focus {
  border: 0.1rem solid #36e2ff;
}
.form__input input[type="text"]:disabled,
.form__input input[type="email"]:disabled,
.form__input input[type="password"]:disabled,
.form__input input[type="number"]:disabled,
.form__input input[type="tel"]:disabled,
.form__input input[type="file"]:disabled,
.form__input input[type="checkbox"]:disabled,
.form__input input[type="radio"]:disabled,
.form__input select:disabled,
.form__input textarea:disabled {
  cursor: not-allowed;
}
.form__input input[type="text"].border,
.form__input input[type="email"].border,
.form__input input[type="password"].border,
.form__input input[type="number"].border,
.form__input input[type="tel"].border,
.form__input input[type="file"].border,
.form__input input[type="checkbox"].border,
.form__input input[type="radio"].border,
.form__input select.border,
.form__input textarea.border {
  border: 0.1rem solid rgb(207, 71, 71);
}
.form__input input[type="file"] {
  padding: 1.6rem;
  cursor: pointer;
}
.form__input select {
  background-color: #fff !important;
  appearance: none;
  background: rgba(217, 217, 217, 0.15) url("../images/chevron-down.svg")
    no-repeat calc(100% - 0.8rem) center;
  background-size: 3.6rem;
  cursor: pointer;
}
.form__input option:not(:first-of-type) {
  color: #555555;
}
.form__input textarea {
  height: 15rem;
  resize: none;
}
.form__input ::placeholder {
  color: #999;
}
.form button {
  padding: 1.2rem;
}
.form .checkbox,
.form .radio {
  display: flex;
  align-items: center;
  gap: 1.6rem;
  margin: 0.4rem 0;
}
.form .checkbox label,
.form .radio label {
  display: flex;
  margin-top: -0.2rem;
  cursor: pointer;
}
.form .checkbox label a,
.form .radio label a {
  display: flex;
  margin-left: 0.3rem;
}
.form .checkbox input[type="checkbox"] {
  width: 4rem;
  height: 4rem;
  accent-color: #36e2ff;
  border-radius: 0.5rem;
  border: 0.1rem solid #e0e0e0;
  cursor: pointer;
}
.form .radio input[type="radio"] {
  width: 2rem;
  height: 2rem;
  accent-color: #36e2ff;
  border-radius: 0.5rem;
  border: 0.1rem solid #e0e0e0;
  cursor: pointer;
}
.form fieldset {
  border: none;
}
.form fieldset:not(:last-of-type) {
  margin-bottom: 2.4rem;
  padding-bottom: 2.4rem;
  border-bottom: 0.1rem solid rgba(223, 113, 149, 0.5);
}
.form fieldset legend {
  margin-bottom: 1.6rem;
  font-size: 2.4rem;
  font-weight: 600;
  text-transform: capitalize;
}

#hero {
  display: flex;
}
#hero.hero--home {
  display: flex;
  flex-direction: column;
  min-height: 80rem;
  background:
    linear-gradient(
      -240deg,
      rgba(54, 226, 255, 0.5) 15%,
      rgba(233, 113, 149, 0.5) 100%
    ),
    url("../images/home-hero-bg-2x.png") no-repeat fixed 50% 30% / cover;
}
@media (max-width: 29.9875em) {
  #hero.hero--home {
    height: 100vh;
  }
}
#hero.hero--home .hero__content {
  display: flex;
  flex-direction: column;
  padding: 20rem 0 0;
}
#hero.hero--home .hero a:link {
  margin-top: 0 !important;
}
#hero.hero--page {
  padding-bottom: 3.2rem;
  background-color: rgba(54, 226, 255, 0.25);
}
#hero.hero--page img {
  width: 100%;
}
#hero.hero--page.about,
#hero.hero--page.contact,
#hero.hero--page.donate {
  width: 100%;
}
#hero.hero--page.donate {
  background:
    linear-gradient(
      85deg,
      rgba(233, 113, 149, 0.75) 10%,
      rgba(54, 226, 255, 0.5) 100%
    ),
    url("../images/donate-bg.jpg") no-repeat fixed 0 100%/100%;
}
#hero.hero--page.contact {
  background:
    linear-gradient(
      85deg,
      rgba(233, 113, 149, 0.75) 10%,
      rgba(54, 226, 255, 0.5) 100%
    ),
    url("../images/contact-bg.jpg") no-repeat fixed 0 90% / cover;
}
#hero.hero--page.about {
  background:
    linear-gradient(
      85deg,
      rgba(233, 113, 149, 0.75) 10%,
      rgba(54, 226, 255, 0.5) 100%
    ),
    url("../images/about-bg.jpg") no-repeat fixed 0 25% / cover;
}
#hero.hero--page.team {
  background:
    linear-gradient(
      85deg,
      rgba(233, 113, 149, 0.75) 10%,
      rgba(54, 226, 255, 0.5) 100%
    ),
    url("../images/team-bg.jpg") no-repeat fixed 0 145% / cover;
}
#hero.hero--page.posts {
  background:
    linear-gradient(
      85deg,
      rgba(233, 113, 149, 0.75) 10%,
      rgba(54, 226, 255, 0.5) 100%
    ),
    url("../images/posts-bg.jpg") no-repeat fixed 0 60% / cover;
}
#hero.hero--page.partnership {
  background:
    linear-gradient(
      85deg,
      rgba(233, 113, 149, 0.75) 10%,
      rgba(54, 226, 255, 0.5) 100%
    ),
    url("../images/partnership-bg.jpg") no-repeat fixed 0 45% / cover;
}
#hero.hero--page.action {
  background:
    linear-gradient(
      85deg,
      rgba(233, 113, 149, 0.75) 10%,
      rgba(54, 226, 255, 0.5) 100%
    ),
    url("../images/feature-img-3.jpg") no-repeat fixed 0 115% / cover;
}
#hero.hero--page .hero__content {
  padding: 13rem 0 0;
}
#hero.hero--page ul {
  display: flex;
}
#hero.hero--page ul li:not(:first-of-type)::before {
  content: "/";
  margin: 0 0.8rem;
  font-weight: 400;
  color: #000;
}
#hero.hero--page ul li.active {
  color: #fff;
}
#hero.hero--page ul li a:link,
#hero.hero--page ul li a:visited {
  color: #000;
}
#hero.hero--page ul li a:hover,
#hero.hero--page ul li a:active {
  color: #fff;
}
#hero .hero {
  width: 115.2rem;
  margin: 0 auto;
}
#hero .hero .contact {
  position: sticky;
  top: 0;
  left: 0;
  display: flex;
  align-items: center;
  gap: 1.6rem;
  max-width: 53rem;
  margin-bottom: 1.6rem;
  padding: 0.2rem 0;
  font-size: 1.4rem;
  font-weight: 500;
  color: #000000;
  text-transform: capitalize;
  border-radius: 0.5rem;
}
#hero .hero__content {
  max-width: 81rem;
  padding: 26rem 0;
}

.icon {
  width: 2.4rem;
  margin-top: 0.3rem;
  stroke: #e97195;
}
.icon.icon-2 {
  stroke: #00b1cf;
}
.icon--secure {
  width: 9.6rem;
  margin-top: 0;
  stroke: rgb(36, 144, 75);
}

.lab {
  font-size: 2.8rem;
  color: #e97195;
}

.take-action .icon {
  width: 2.4rem;
  stroke: #fff;
  transition: all 0.2s ease-in-out;
}
.take-action:hover .icon {
  stroke: #00c7e9;
}

.form__input {
  display: flex;
  flex-direction: column;
  position: relative;
}
.form__input .input-icon {
  position: absolute;
  top: 51%;
  left: 2.4rem;
  transform: translate(-50%, -50%);
  width: 2.4rem;
  height: 2.4rem;
  color: #999;
}
.form__input .input-icon.textarea {
  top: 2.8rem;
}

.container,
.container-100 {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.container-100 {
  padding: 8rem 0;
}
.container-100.map {
  width: 100%;
  padding: 0;
}

.container {
  justify-content: space-between;
  gap: 1.6rem;
  position: relative;
  max-width: 115.2rem;
  margin: 0 auto;
}
@media (max-width: 63.9875em) {
  .container {
    max-width: 99.2rem;
    padding: 0 3.2rem;
  }
}
@media (max-width: 47.9875em) {
  .container {
    max-width: 72rem;
  }
}
@media (max-width: 29.9875em) {
  .container {
    max-width: 44.8rem;
  }
}

.row {
  display: flex;
  gap: 3.2rem;
  width: 100%;
}
@media (max-width: 47.9875em) {
  .row {
    flex-direction: column;
  }
}
@media (max-width: 29.9875em) {
  .row {
    flex-direction: column;
  }
}
.row .col-1 {
  width: 8.33333% !important;
}
.row .col-2 {
  width: 16.66667% !important;
}
.row .col-3 {
  width: 25% !important;
}
.row .col-4 {
  width: 33.33333% !important;
}
.row .col-5 {
  width: 41.66667% !important;
}
.row .col-6 {
  width: 50% !important;
}
.row .col-7 {
  width: 58.33333% !important;
}
.row .col-8 {
  width: 66.66667% !important;
}
.row .col-9 {
  width: 75% !important;
}
.row .col-10 {
  width: 83.33333% !important;
}
.row .col-11 {
  width: 91.66667% !important;
}
.row .col-12 {
  width: 100% !important;
}
@media (max-width: 63.9875em) {
  .row [class^="col-"] {
  }
}
@media (max-width: 47.9875em) {
  .row [class^="col-"] {
    width: 100% !important;
  }
}
@media (max-width: 29.9875em) {
  .row [class^="col-"] {
    width: 100% !important;
  }
}
.row [class^="col-"] img {
  width: 100%;
}

footer .footer {
  padding-bottom: 0;
  background:
    linear-gradient(-240deg, rgba(0, 0, 0, 0.65) 25%, rgba(0, 0, 0, 0.65) 75%),
    url("../images/footer-bg.jpg") no-repeat fixed center center/cover;
}
footer .footer .row:last-of-type {
  margin-top: 4rem;
}
footer .footer__logo {
  width: 20rem !important;
  margin-bottom: 1.6rem;
  filter: grayscale(100%);
}
@media (max-width: 29.9875em) {
  footer .footer__logo {
    width: 20rem !important;
  }
}
footer .footer__right {
  display: flex;
  justify-content: flex-end;
  column-gap: 4.8rem;
}
@media (max-width: 29.9875em) {
  footer .footer__right {
    flex-direction: column;
    justify-content: space-between;
    gap: 1.6rem !important;
  }
}
footer .footer__right ul {
  margin-left: -0.8rem;
}
footer .footer__right ul li a {
  display: flex;
  align-items: center;
}
footer .footer__right ul li a:link,
footer .footer__right ul li a:visited {
  color: #fff;
}
footer .footer__right ul li a:hover,
footer .footer__right ul li a.active {
  color: #e97195;
}
@media (max-width: 29.9875em) {
  footer .footer__subscribe {
    margin-top: 3.2rem;
  }
}
footer .footer__social {
  margin-top: -0.8rem;
  margin-left: -0.8rem;
}
footer .footer__social ul {
  display: flex;
}
footer .footer__social ul li .lab {
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 2rem;
  padding: 0.8rem;
  color: #fff;
  border-radius: 5rem;
  border: 0.1rem solid transparent;
  background-color: #e97195;
  transition: all 0.2s ease-in-out;
}
footer .footer__social ul li a:hover .lab,
footer .footer__social ul li a:focus .lab {
  color: #e97195;
  background-color: #fff;
  border: 0.1rem solid #e97195;
}
footer .footer__copyright {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 1.6rem 0;
  background-color: transparent;
  color: #fff;
}
@media (max-width: 29.9875em) {
  footer .footer__copyright .container {
    display: flex;
    flex-direction: column !important;
    gap: 1.6rem;
  }
}
footer .footer__copyright--left,
footer .footer__copyright--right {
  display: flex;
  gap: 1.6rem;
}
@media (max-width: 29.9875em) {
  footer .footer__copyright--left,
  footer .footer__copyright--right {
    flex-direction: column;
    justify-content: center;
    align-items: center;
    text-align: center;
  }
}
footer .footer__copyright a:link,
footer .footer__copyright a:visited {
  color: #fff;
}
footer .footer__copyright a:hover,
footer .footer__copyright a:active {
  color: #e97195;
}
footer .footer ul li {
  list-style: none;
  padding: 0 0.8rem 0.8rem;
}

.font-0 {
  font-size: 1.6rem !important;
}
.font-1 {
  font-size: 1.8rem !important;
}

.bold {
  font-weight: bold !important;
}

.no-bold {
  font-weight: normal !important;
}

.divider {
  margin: 4.8rem auto;
  height: 0.1rem;
  border-width: 0;
  background-color: #e97195;
}

.round-img {
  width: 52rem;
  height: 100%;
  border-radius: 50%;
  overflow: hidden;
}

.flex {
  display: flex !important;
}
.flex.flex-column {
  flex-direction: column !important;
}
.flex.flex-row {
  flex-direction: row !important;
}
.flex.justify-start {
  justify-content: flex-start !important;
}
.flex.justify-center {
  justify-content: center !important;
}
.flex.justify-around {
  justify-content: space-around !important;
}
.flex.justify-evenly {
  justify-content: space-evenly !important;
}
.flex.justify-between {
  justify-content: space-between !important;
}
.flex.justify-end {
  justify-content: flex-end !important;
}
.flex.align-start {
  align-items: flex-start !important;
}
.flex.align-center {
  align-items: center !important;
}
.flex.align-end {
  align-items: flex-end !important;
}
.flex.align-end {
  align-items: flex-end !important;
}
.flex.gap-1 {
  gap: 1.6rem !important;
}
.flex.gap-2 {
  gap: 3.2rem !important;
}
.flex.gap-3 {
  gap: 4.8rem !important;
}
.flex.gap-4 {
  gap: 6.4rem !important;
}
.flex.gap-5 {
  gap: 8rem !important;
}

.w-25 {
  width: 25% !important;
}
.w-45 {
  width: 45% !important;
}
.w-50 {
  width: 50% !important;
}
.w-75 {
  width: 75% !important;
}
.w-100 {
  width: 100% !important;
}

.m-0 {
  margin: 0 !important;
}
.m-1 {
  margin: 1.6rem !important;
}
.m-2 {
  margin: 3.2rem !important;
}
.m-3 {
  margin: 4.8rem !important;
}
.m-4 {
  margin: 6.4rem !important;
}
.m-5 {
  margin: 8rem !important;
}
.m-6 {
  margin: 9.6rem !important;
}

.mt-0 {
  margin-top: 0;
}
.mt-1 {
  margin-top: 1.6rem !important;
}
.mt-2 {
  margin-top: 3.2rem !important;
}
.mt-3 {
  margin-top: 4.8rem !important;
}
.mt-4 {
  margin-top: 6.4rem !important;
}
.mt-5 {
  margin-top: 8rem !important;
}
.mt-6 {
  margin-top: 9.6rem !important;
}
.mt-n1 {
  margin-top: -1.6rem !important;
}
.mt-n2 {
  margin-top: -3.2rem !important;
}
.mt-n3 {
  margin-top: -4.8rem !important;
}
.mt-n4 {
  margin-top: -6.4rem !important;
}
.mt-n5 {
  margin-top: -8rem !important;
}
.mt-n6 {
  margin-top: -9.6rem !important;
}

.mb-0 {
  margin-bottom: 0;
}
.mb-1 {
  margin-bottom: 1.6rem !important;
}
.mb-2 {
  margin-bottom: 3.2rem !important;
}
.mb-3 {
  margin-bottom: 4.8rem !important;
}
.mb-4 {
  margin-bottom: 6.4rem !important;
}
.mb-5 {
  margin-bottom: 8rem !important;
}
.mb-6 {
  margin-bottom: 9.6rem !important;
}
.mb-7 {
  margin-bottom: 11.2rem !important;
}
.mb-8 {
  margin-bottom: 12.8rem !important;
}
.mb-n1 {
  margin-bottom: -1.6rem !important;
}
.mb-n2 {
  margin-bottom: -3.2rem !important;
}
.mb-n3 {
  margin-bottom: -4.8rem !important;
}
.mb-n4 {
  margin-bottom: -6.4rem !important;
}
.mb-n5 {
  margin-bottom: -8rem !important;
}
.mb-n6 {
  margin-bottom: -9.6rem !important;
}

.ml-0 {
  margin-left: 0;
}
.ml-1 {
  margin-left: 1.6rem !important;
}
.ml-2 {
  margin-left: 3.2rem !important;
}
.ml-3 {
  margin-left: 4.8rem !important;
}
.ml-4 {
  margin-left: 6.4rem !important;
}
.ml-5 {
  margin-left: 8rem !important;
}
.ml-6 {
  margin-left: 9.6rem !important;
}
.ml-n1 {
  margin-bottom: -1.6rem !important;
}
.ml-n2 {
  margin-bottom: -3.2rem !important;
}
.ml-n3 {
  margin-bottom: -4.8rem !important;
}
.ml-n4 {
  margin-bottom: -6.4rem !important;
}
.ml-n5 {
  margin-bottom: -8rem !important;
}
.ml-n6 {
  margin-bottom: -9.6rem !important;
}

.mr-0 {
  margin-left: 0;
}
.mr-1 {
  margin-left: 1.6rem !important;
}
.mr-2 {
  margin-left: 3.2rem !important;
}
.mr-3 {
  margin-left: 4.8rem !important;
}
.mr-4 {
  margin-left: 6.4rem !important;
}
.mr-5 {
  margin-left: 8rem !important;
}
.mr-6 {
  margin-left: 9.6rem !important;
}
.mr-n1 {
  margin-bottom: -1.6rem !important;
}
.mr-n2 {
  margin-bottom: -3.2rem !important;
}
.mr-n3 {
  margin-bottom: -4.8rem !important;
}
.mr-n4 {
  margin-bottom: -6.4rem !important;
}
.mr-n5 {
  margin-bottom: -8rem !important;
}
.mr-n6 {
  margin-bottom: -9.6rem !important;
}

.mx-0 {
  margin-left: 0;
  margin-right: 0;
}
.mx-1 {
  margin-left: 1.6rem !important;
  margin-right: 1.6rem !important;
}
.mx-2 {
  margin-left: 3.2rem !important;
  margin-right: 3.2rem !important;
}
.mx-3 {
  margin-left: 4.8rem !important;
  margin-right: 4.8rem !important;
}
.mx-4 {
  margin-left: 6.4rem !important;
  margin-right: 6.4rem !important;
}
.mx-5 {
  margin-left: 8rem !important;
  margin-right: 8rem !important;
}
.mx-6 {
  margin-left: 9.6rem !important;
  margin-right: 9.6rem !important;
}

.my-0 {
  margin-top: 0;
  margin-bottom: 0;
}
.my-1 {
  margin-top: 1.6rem !important;
  margin-bottom: 1.6rem !important;
}
.my-2 {
  margin-top: 3.2rem !important;
  margin-bottom: 3.2rem !important;
}
.my-3 {
  margin-top: 4.8rem !important;
  margin-bottom: 4.8rem !important;
}
.my-4 {
  margin-top: 6.4rem !important;
  margin-bottom: 6.4rem !important;
}
.my-5 {
  margin-top: 8rem !important;
  margin-bottom: 8rem !important;
}
.my-6 {
  margin-top: 9.6rem !important;
  margin-bottom: 9.6rem !important;
}

.p-0 {
  padding: 0;
}
.p-1 {
  padding: 1.6rem !important;
}
.p-2 {
  padding: 3.2rem !important;
}
.p-3 {
  padding: 4.8rem !important;
}
.p-4 {
  padding: 6.4rem !important;
}
.p-5 {
  padding: 8rem !important;
}
.p-6 {
  padding: 9.6rem !important;
}

.pt-0 {
  padding-top: 0;
}
.pt-1 {
  padding-top: 1.6rem !important;
}
.pt-2 {
  padding-top: 3.2rem !important;
}
.pt-3 {
  padding-top: 4.8rem !important;
}
.pt-4 {
  padding-top: 6.4rem !important;
}
.pt-5 {
  padding-top: 8rem !important;
}
.pt-6 {
  padding-top: 9.6rem !important;
}

.pb-0 {
  padding-bottom: 0;
}
.pb-1 {
  padding-bottom: 1.6rem !important;
}
.pb-2 {
  padding-bottom: 3.2rem !important;
}
.pb-3 {
  padding-bottom: 4.8rem !important;
}
.pb-4 {
  padding-bottom: 6.4rem !important;
}
.pb-5 {
  padding-bottom: 8rem !important;
}
.pb-6 {
  padding-bottom: 9.6rem !important;
}

.pl-0 {
  padding-left: 0;
}
.pl-1 {
  padding-left: 1.6rem !important;
}
.pl-2 {
  padding-left: 3.2rem !important;
}
.pl-3 {
  padding-left: 4.8rem !important;
}
.pl-4 {
  padding-left: 6.4rem !important;
}
.pl-5 {
  padding-left: 8rem !important;
}
.pl-6 {
  padding-left: 9.6rem !important;
}

.pr-0 {
  padding-right: 0;
}
.pr-1 {
  padding-right: 1.6rem !important;
}
.pr-2 {
  padding-right: 3.2rem !important;
}
.pr-3 {
  padding-right: 4.8rem !important;
}
.pr-4 {
  padding-right: 6.4rem !important;
}
.pr-5 {
  padding-right: 8rem !important;
}
.pr-6 {
  padding-right: 9.6rem !important;
}

.px-0 {
  padding-left: 0;
  padding-right: 0;
}
.px-1 {
  padding-left: 1.6rem !important;
  padding-right: 1.6rem !important;
}
.px-2 {
  padding-left: 3.2rem !important;
  padding-right: 3.2rem !important;
}
.px-3 {
  padding-left: 4.8rem !important;
  padding-right: 4.8rem !important;
}
.px-4 {
  padding-left: 6.4rem !important;
  padding-right: 6.4rem !important;
}
.px-5 {
  padding-left: 8rem !important;
  padding-right: 8rem !important;
}
.px-6 {
  padding-left: 9.6rem !important;
  padding-right: 9.6rem !important;
}

.py-0 {
  padding-top: 0;
  padding-bottom: 0;
}
.py-1 {
  padding-top: 1.6rem !important;
  padding-bottom: 1.6rem !important;
}
.py-2 {
  padding-top: 3.2rem !important;
  padding-bottom: 3.2rem !important;
}
.py-3 {
  padding-top: 4.8rem !important;
  padding-bottom: 4.8rem !important;
}
.py-4 {
  padding-top: 6.4rem !important;
  padding-bottom: 6.4rem !important;
}
.py-5 {
  padding-top: 8rem !important;
  padding-bottom: 8rem !important;
}
.py-6 {
  padding-top: 9.6rem !important;
  padding-bottom: 9.6rem !important;
}

/*# sourceMappingURL=style.css.map */