@import url("https://fonts.googleapis.com/css2?family=Nunito+Sans:ital,opsz,wght@0,6..12,200..1000;1,6..12,200..1000&display=swap");
@import url("/packages/kalla/css/base/typography.css");
@import url("/packages/kalla/css/base/colors.css");
@import url("/packages/kalla/css/blocks/cause.css");
@import url("/packages/kalla/css/blocks/location.css");
@import url("/packages/kalla/css/base/sections.css");

/*
"Canela-Light" light
canela regular
canela trial medium italic
*/
.nav-item a {
     color: #fff;
}

.account-mission-title {
     display: flex;
     gap: 24px;
     align-items: center;
}

.account-mission-title:after {
     content: "";
     flex-grow: 1;
     height: 1px;
     background-color: var(--horizon100);
     margin-top: 8px;
     opacity: 0.6;
}

.add-more a {
     font-size: 40px;
     line-height: 46px;
     max-width: 245px;
     text-align: center;
     text-transform: capitalize;
     color: var(--horizon);
     letter-spacing: 0;
}

.add-more a:hover {
     color: #fff;
}

.add-more a:hover i {
     color: var(--horizon);
}

.arrows {
     margin-top: 50px;

     i {
          padding: 14px 28px;
          cursor: pointer;
          transition: 0.2s all;
          font-size: 35.5px;
     }
}

#causeListHigh {
     .causeCTA {
          max-width: 380px;
     }

     .causeDescription {
          background: rgba(1, 5, 18, 0.66);
          padding: 10px 30px 20px;
          position: relative;
          text-align: left;
          z-index: 2;
          display: flex;
          flex-flow: column;
          justify-content: space-between;
          min-height: 160px;
     }

     .display {
          color: var(--harvest);
          margin-bottom: 4px;
     }

     .causeDescription .bodyXSmall {
          line-height: 21.6px;
          -webkit-line-clamp: 4;
          margin-bottom: 22px;
     }

     .bodySmall {
          text-transform: capitalize;
          letter-spacing: 0;
     }
}

#causeListGive {
     .causeCTA {
          max-width: 486px;
     }

     .causeDescription {
          background: rgba(1, 5, 18, 0.66);
          position: relative;
          text-align: left;
          z-index: 2;
          display: flex;
          flex-flow: column;
          min-height: 264px;
          justify-content: flex-start;
          padding: 36px 30px 19px;
          gap: 0;
     }

     .causeDescription h4 {
          margin-bottom: 22px;
     }

     .bodyXSmall {
          margin-bottom: 38px;
     }

     a.bodySmall {
          color: var(--harvest);
          margin-bottom: 19px;
     }
}
