.botBox {
    background-color: #f5f6f7;
    padding: 20px;
    border-radius: 1.5rem;
    align-items: center;
    display: flex;

}

.testimonials {
    padding: 3rem;
    padding-top: 1rem;
    width: 100%;
    display: flex;
    gap: 30px;
}


@media  screen and (max-width: 500px) {
    .botBox {
        background-color: #f5f6f7;
        padding: 20px;
        border-radius: 1.5rem;
        align-items: center;
        display: flex;
        justify-content: center;
    
    }
    
    .testimonials {
        padding: 2rem;
        padding-top: 0.7rem;
        width: 100%;
        display: flex;
        gap: 30px;
        flex-direction: column;
    }

    .titlee {
        
        font-size: 24px !important;
        text-transform: capitalize;
        padding: 0px !important;
        margin: -14px !important;
    }

  
}

.tithol {
    display: flex;
    flex-direction: column;

}
.introo {
display: flex;
gap: 12px;
}

.steps p {
    width: 70%;
    color: #00000079;
    
}

.learner {
    display: flex;
    gap: 15px;
    align-items: flex-end;
}

.steps h3 {
    font-size: 1.1rem;
    padding-top: 9px;
    font-weight: 600;
}

.biblee{
  width: 95%;
  background-color: #000;
  padding: 10px;
  margin: 10px auto;
  border-radius: 18px;
  display: flex;
  align-items: center;
  gap: 10px;
}

.steps h2 {
    font-weight: 600;
    padding-bottom: 13px;
}

.new {
    padding: 10px; 
    background-color: #3475E0;
    width: 70px;
    border-radius: 3rem;
    height: 35px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    font-weight: 700;

}


::-webkit-scrollbar {
    display: none;
}


      @font-face {
        font-family: "BR Firma Regular";
        src: url(_nuxt/fonts/BR-Firma-Regular.6b91ac1.otf);
      }
      @font-face {
        font-family: "Duplicate Sans Bold";
        src: url(_nuxt/fonts/DuplicateSans-Medium.181b857.ttf);
      }
      :root {
        --bs-dark: #000;
        --dark: #000;
        --light-dark: #f5f5f5;
        --white: #fff;
        --muted: #b5b5b5;
        --light: #eff1f7;
        --success-light: #d3ede3;
        --warning: #ffaf00;
        --light-warning: #f8f7eb;
        --light-info: #ebf5f8;
        --milky: #faf9f5;
        --success: #00a856;
        --light-success: #f1f8eb;
        --success-dark: #4d826e;
        --border-color: #303030;
        --border-soft: #ebf0f5;
        --soft-danger: #fff4f2;
        --soft-dark: #e4e7ee;
      }
      html {
        overflow-x: hidden;
        scroll-behavior: smooth;
      }
      body {
        -webkit-font-smoothing: antialiased;
        color: #000 !important;
        color: var(--dark) !important;
        font-family: ClashDisplay-Regular, sans-serif;
        overflow-x: hidden;
        
      }
      a {
        line-height: 28px;
        -webkit-text-decoration: none !important;
        text-decoration: none !important;
      }
      .overflow-h {
        overflow: hidden;
      }
      .clash-display-semibold,
      .dus-b,
      .fw-bold,
      .fw-bolder {
        font-family: ClashDisplay-Semibold, sans-serif !important;
      }
      .clash-display-medium {
        font-family: ClashDisplay-Medium, sans-serif !important;
      }
      .post h2 {
        font-family: "Duplicate Sans Bold", sans-serif !important;
        font-size: 24px;
      }
      .post img {
        height: auto !important;
        margin: 20px 0;
        width: 100% !important;
      }
      #banner {
        background: #000;
        background: var(--bs-dark);
      }
      figcaption {
        font-size: 12px;
        text-align: center;
      }
      .navbar-dark .navbar-nav .nav-link,
      .navbar-light .navbar-nav .nav-link {
        letter-spacing: 0.1em;
        text-transform: uppercase;
      }
      .navbar-light .navbar-nav .nav-link {
        color: #000 !important;
        color: var(--dark) !important;
      }
      .navbar-dark .navbar-nav .nav-link {
        color: #fff !important;
        color: var(--white) !important;
      }
      .bg-dark {
        background: #000 !important;
        background: var(--dark) !important;
      }
      .bg-soft-dark {
        background: #e4e7ee !important;
        background: var(--soft-dark) !important;
      }
      .bg-soft-danger {
        background: #fff4f2 !important;
        background: var(--soft-danger) !important;
      }
      .bg-success {
        background: #00a856 !important;
        background: var(--success) !important;
      }
      .bg-success-light {
        background: #d3ede3 !important;
        background: var(--success-light) !important;
      }
      .bg-warning-light {
        background: #ffaf00 !important;
        background: var(--warning) !important;
      }
      .bg-light-danger {
        background: var(--light-danger) !important;
      }
      .bg-light-success {
        background: #f1f8eb !important;
        background: var(--light-success) !important;
      }
      .bg-light-warning {
        background: #f8f7eb !important;
        background: var(--light-warning) !important;
      }
      .bg-light-dark {
        background: #f5f5f5 !important;
        background: var(--light-dark) !important;
      }
      .bg-light-info {
        background: #ebf5f8 !important;
        background: var(--light-info) !important;
      }
      .bg-light {
        background: #eff1f7 !important;
        background: var(--light) !important;
      }
      .bg-milky {
        background-color: #faf9f5;
        background-color: var(--milky);
      }
      .invert {
        filter: invert();
      }
      .text-success,
      .text-success-dark {
        color: #00a856 !important;
        color: var(--success) !important;
      }
      .text-success-light {
        color: #d3ede3 !important;
        color: var(--success-light) !important;
      }
      .text-warning {
        color: #ffaf00 !important;
        color: var(--warning) !important;
      }
      .text-base {
        height: 3rem;
        line-height: 1.5rem;
        padding-left: 2rem;
        padding-right: 2rem;
      }
      .card.megamenu,
      .dropdown-menu {
        border-radius: 0.625rem !important;
      }
      .r-t-l {
        border-top-left-radius: 24px !important;
      }
      .btn-dark {
        background: #000 !important;
        background: var(--dark) !important;
        color: #fff !important;
        color: var(--white) !important;
      }
      .btn-dark,
      .btn-outline-dark {
        border-color: #000 !important;
        border-color: var(--dark) !important;
      }
      .btn-outline-dark {
        background: #faf9f5 !important;
        background: var(--milky) !important;
        color: #000 !important;
        color: var(--dark) !important;
      }
      .btn-outline-dark:hover {
        background: #000 !important;
        background: var(--dark) !important;
        border-color: #000 !important;
        border-color: var(--dark) !important;
        color: #fff !important;
        color: var(--white) !important;
        transition: 0.6s;
      }
      .btn-success {
        background: #00a856 !important;
        background: var(--success) !important;
      }
      .btn-outline-success,
      .btn-success {
        border-color: #00a856 !important;
        border-color: var(--success) !important;
      }
      .btn-outline-success {
        background: #faf9f5 !important;
        background: var(--milky) !important;
        color: #00a856 !important;
        color: var(--success) !important;
      }
      .btn-outline-success:hover {
        background: #00a856 !important;
        background: var(--success) !important;
        border-color: #00a856 !important;
        border-color: var(--success) !important;
        color: #fff !important;
        color: var(--white) !important;
        transition: 0.6s;
      }
      .btn-hover:hover {
        box-shadow: 0 6px 2px -6px rgba(42, 134, 68, 0.6);
        transform: translateY(-1px);
      }
      .border-light {
        border-color: #eff1f7 !important;
        border-color: var(--light) !important;
      }
      .border-soft-light {
        border-color: #ebf0f5 !important;
        border-color: var(--border-soft) !important;
      }
      .border-success {
        border-color: #00a856 !important;
        border-color: var(--success) !important;
      }
      .border-bottom {
        border-bottom: 1px solid #303030 !important;
        border-bottom: 1px solid var(--border-color) !important;
      }
      .border-top {
        border-top: 1px solid #303030 !important;
        border-top: 1px solid var(--border-color) !important;
      }
      .fs-64 {
        font-size: 3.5rem;
      }
      .fw-500 {
        font-weight: 500;
      }
      .fw-600 {
        font-weight: 600;
      }
      .fw-700 {
        font-weight: 700;
      }
      .fw-bolder {
        font-weight: 900 !important;
      }
      .lh-md {
        line-height: 30px;
      }
      .ic-holder {
        height: 30px;
        width: 30px;
      }
      .ic-holder-lg {
        height: 60px;
        width: 60px;
      }
      .rounded {
        border-radius: 8px !important;
      }
      .rounded-lg {
        border-radius: 30px;
      }
      .form-control,
      .form-select {
        border-radius: 8px !important;
      }
      .input-group-start .input-group-text {
        border-bottom-left-radius: 8px !important;
        border-top-left-radius: 8px !important;
      }
      .group-end,
      .input-group-start .form-control,
      .input-group-start .form-select {
        border-bottom-left-radius: 0 !important;
        border-top-left-radius: 0 !important;
      }
      .group-end,
      .input-group-end .input-group-text,
      .input-group-start .form-control,
      .input-group-start .form-select {
        border-bottom-right-radius: 8px !important;
        border-top-right-radius: 8px !important;
      }
      .group-start,
      .input-group-end .form-control,
      .input-group-end .form-select {
        border-bottom-left-radius: 8px !important;
        border-bottom-right-radius: 0 !important;
        border-top-left-radius: 8px !important;
        border-top-right-radius: 0 !important;
      }
      input:focus,
      select:focus,
      textarea:focus {
        outline: 0 !important;
      }
      @media (min-width: 1400px) {
        .container {
          max-width: 1280px;
        }
      }
      .dropdown-menu.megamenu {
        border: 0;
        border-radius: 0.75rem;
        top: calc(100% - 2px);
        transition: visibility 0s 0.2s, opacity 0.2s ease-in-out;
        width: 42rem;
      }
      .dropdown-toggle:after {
        display: none !important;
      }
      .dropdown-toggle__icon {
        bottom: 0;
        display: block;
        height: 0.375rem;
        position: absolute;
        top: 52%;
        transform: translateY(-50%);
        transition: transform 0.2s ease-in-out;
        width: 0.675rem;
      }
      @media (max-width: 991px) {
        .navbar.fixed-top .navbar-collapse,
        .navbar.sticky-top .navbar-collapse {
          max-height: 90vh;
          overflow-y: auto;
        }
      }
      @media (min-width: 992px) {
        .navbar .has-megamenu {
          position: static !important;
        }
        .navbar .megamenu {
          margin-top: 0;
        }
      }
      .post-info-dot {
        border: 1px solid #909090;
        border-radius: 5px;
        display: inline-block;
        height: 6px;
        margin-left: 7px;
        margin-right: 7px;
        position: relative;
        top: -1px;
        width: 6px;
      }
      .bg-card {
        background: #000;
        background: var(--bs-dark);
      }
      figure img {
        border-radius: 0.3rem !important;
        height: 100% !important;
        margin: 16px 0;
        -o-object-fit: cover;
        object-fit: cover;
        transition: 1.2s cubic-bezier(0.16, 1, 0.3, 1);
        width: 100% !important;
      }
      figure img:hover {
        transform: scale(1.02);
      }
      .page-link {
        background: 0 0 !important;
        box-shadow: none !important;
        color: #000 !important;
        color: var(--bs-dark) !important;
        font-weight: 600 !important;
      }
      .page-item.active .page-link {
        border-color: var(--bs-success) !important;
        color: var(--bs-success) !important;
      }
      .page-item {
        border: 0 !important;
      }
      .pagination,
      pagination {
        display: flex !important;
        justify-content: center;
        list-style: none !important;
        padding-left: 0 !important;
      }
      @media (max-width: 576px) {
        .bg-phone {
          background: var(--success) !important;
        }
        #banner,
        .bg-card {
          background: var(--dark) !important;
        }
      }
      @media (max-width: 768px) {
        .container-fluid {
          padding: 0 20px !important;
        }
      }
      @media (max-width: 1440px) {
        .fs-12 {
          font-size: 0.75rem;
        }
        .fs-14 {
          font-size: 0.875rem;
        }
        .fs-15 {
          font-size: 15px;
        }
        .fs-16 {
          font-size: 1rem;
        }
        .fs-17 {
          font-size: 1.063rem;
        }
        .fs-18 {
          font-size: 1.125rem;
        }
        .fs-20 {
          font-size: 1.25rem;
        }
        .fs-22 {
          font-size: 1.375rem;
        }
        .fs-24 {
          font-size: 1.5rem;
        }
        .fs-26 {
          font-size: 1.375rem;
        }
        .fs-28 {
          font-size: 1.75rem;
        }
        .fs-30 {
          font-size: 1.875rem;
        }
        .fs-32 {
          font-size: 2rem;
        }
        .fs-40 {
          font-size: 2.5rem;
        }
        .fs-42 {
          font-size: 2.625rem;
        }
        .fs-48 {
          font-size: 3rem;
        }
        .fs-62 {
          font-size: 3.775rem;
        }
        #banner {
          background: url(_nuxt/img/spaceman.4b1a270.png), var(--bs-dark);
        }
      }
      @font-face {
        font-display: swap;
        font-family: ClashDisplay-Variable;
        font-style: normal;
        font-weight: 200 700;
        src: url(_nuxt/fonts/ClashDisplay-Variable.09fd55f.woff2)
            format("woff2"),
          url(_nuxt/fonts/ClashDisplay-Variable.303c833.woff) format("woff"),
          url(_nuxt/fonts/ClashDisplay-Variable.2fcd723.ttf) format("truetype");
      }
      @font-face {
        font-display: swap;
        font-family: ClashDisplay-Extralight;
        font-style: normal;
        font-weight: 200;
        src: url(_nuxt/fonts/ClashDisplay-Extralight.ed532c7.woff2)
            format("woff2"),
          url(_nuxt/fonts/ClashDisplay-Extralight.0bc337f.woff) format("woff"),
          url(_nuxt/fonts/ClashDisplay-Extralight.dd3e06a.ttf)
            format("truetype");
      }
      @font-face {
        font-display: swap;
        font-family: ClashDisplay-Light;
        font-style: normal;
        font-weight: 300;
        src: url(_nuxt/fonts/ClashDisplay-Light.d14ff0a.woff2) format("woff2"),
          url(_nuxt/fonts/ClashDisplay-Light.800f679.woff) format("woff"),
          url(_nuxt/fonts/ClashDisplay-Light.85908d1.ttf) format("truetype");
      }
      @font-face {
        font-display: swap;
        font-family: ClashDisplay-Regular;
        font-style: normal;
        font-weight: 400;
        src: url(_nuxt/fonts/ClashDisplay-Regular.cf87d6e.woff2) format("woff2"),
          url(_nuxt/fonts/ClashDisplay-Regular.845fd93.woff) format("woff"),
          url(_nuxt/fonts/ClashDisplay-Regular.8281d40.ttf) format("truetype");
      }
      @font-face {
        font-display: swap;
        font-family: ClashDisplay-Medium;
        font-style: normal;
        font-weight: 500;
        src: url(_nuxt/fonts/ClashDisplay-Medium.b94bd65.woff2) format("woff2"),
          url(_nuxt/fonts/ClashDisplay-Medium.8c687c3.woff) format("woff"),
          url(_nuxt/fonts/ClashDisplay-Medium.f801579.ttf) format("truetype");
      }
      @font-face {
        font-display: swap;
        font-family: ClashDisplay-Semibold;
        font-style: normal;
        font-weight: 600;
        src: url(_nuxt/fonts/ClashDisplay-Semibold.3ac7488.woff2)
            format("woff2"),
          url(_nuxt/fonts/ClashDisplay-Semibold.631d8bf.woff) format("woff"),
          url(_nuxt/fonts/ClashDisplay-Semibold.5c7aded.ttf) format("truetype");
      }
      @font-face {
        font-display: swap;
        font-family: ClashDisplay-Bold;
        font-style: normal;
        font-weight: 700;
        src: url(_nuxt/fonts/ClashDisplay-Bold.ea80c23.woff2) format("woff2"),
          url(_nuxt/fonts/ClashDisplay-Bold.5d034e5.woff) format("woff"),
          url(_nuxt/fonts/ClashDisplay-Bold.845b81e.ttf) format("truetype");
      }
      .nuxt-progress {
        background-color: #000;
        height: 2px;
        left: 0;
        opacity: 1;
        position: fixed;
        right: 0;
        top: 0;
        transition: width 0.1s, opacity 0.4s;
        width: 0;
        z-index: 999999;
      }
      .nuxt-progress.nuxt-progress-notransition {
        transition: none;
      }
      .nuxt-progress-failed {
        background-color: red;
      }
      .loader[data-v-449e4482] {
        z-index: 9999;
      }
      .label[data-v-7e266fd0] {
        font-size: 19px;
      }
      .bg-city[data-v-7e266fd0] {
        background: url(_nuxt/img/city.4ada6e0.png), var(--light);
        background-attachment: scroll;
        background-position: 50%;
        background-repeat: no-repeat;
        background-size: contain;
      }
      .bg-paid[data-v-7e266fd0] {
        background: url(_nuxt/img/paid.176f0f6.png), var(--light);
        background-attachment: scroll;
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: contain;
      }
      .bg-cta[data-v-7e266fd0] {
        background: url(_nuxt/img/cta.0ee8a47.png), var(--dark);
        background-attachment: scroll;
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: cover;
      }
      .bg-phone[data-v-7e266fd0] {
        background: url(_nuxt/img/phones.bf46e74.png), var(--success);
        background-attachment: scroll;
        background-position: 98%;
        background-repeat: no-repeat;
        background-size: 40%;
      }
      .bg-card[data-v-7e266fd0] {
        background: url(_nuxt/img/pioolo.png), var(--dark);
        background-attachment: scroll;
        background-position: 90%;
        background-repeat: no-repeat;
        background-size: 35%;
        background-position-y: -70%;
      }
      .hero-scroll[data-v-7e266fd0] {
        animation: scroll-7e266fd0 12.5s linear infinite;
        height: 100%;
        position: absolute;
        right: 0;
        top: 0;
        width: 100%;
      }
      #features .img[data-v-7e266fd0] {
        filter: saturate(0);
      }
      #features .img[data-v-7e266fd0]:hover {
        filter: saturate(1);
        transition: 0.2s;
      }
      @keyframes scroll-7e266fd0 {
        0% {
          transform: translateY(0);
        }
        to {
          transform: translateY(0);
        }
      }
      #appHeader[data-v-00c9c982] {
        position: sticky;
        transform: translateZ(0) scaleX(1) rotateX(0) rotateY(0) rotate(0)
          skew(0deg, 0deg);
        transform-style: preserve-3d;
        z-index: 99999999;
      }
      .btn[data-v-00c9c982] {
        border-radius: 8px;
      }
      .placer[data-v-bd2aaf9a] {
        height: 35px;
        width: 35px;
      }
      #banner[data-v-e7e15b7a] {
        background: url(_nuxt/img/spaceman.4b1a270.png), var(--bs-dark);
        background-attachment: scroll;
        background-position: 100% 100%;
        background-repeat: no-repeat;
        background-size: 32%;
        height: 100vh;
      }
      .star[data-v-aa552b74] {
        max-height: 24px;
        max-width: 24px;
      }
      .star[data-v-55045f0f] {
        height: 21px;
        max-width: 21px;
      }
      #how-it-works .img[data-v-57a3071c] {
        height: 181px;
        width: 181px;
      }
      .btn[data-v-44c3920f] {
        border-radius: 8px;
        line-height: 30px;
        z-index: 1 !important;
      }
      .title[data-v-763f3e6a] {
        color: var(--white);
        letter-spacing: 0.06em;
      }
      .flag[data-v-763f3e6a] {
        height: 20px;
        width: 20px;
      }
      .socials[data-v-763f3e6a] {
        font-size: 20px;
      }
      .socials[data-v-763f3e6a]:hover,
      a.list-group-item px-0 px-lg-3[data-v-763f3e6a]:hover {
        color: var(--muted) !important;
      }
      hr[data-v-763f3e6a] {
        border-bottom: 1px solid var(--muted) !important;
      }
      .border-light[data-v-763f3e6a] {
        border-color: var(--muted) !important;
      }
      .text[data-v-763f3e6a] {
        font-size: 14px;
      }
    
      .savings {
        padding: 60px 16px 100px;
        display: flex;
        background-color: #f5f6f7;
        border-radius: 50px;
        margin-bottom: 50px;
    }

    .milk {
        display: flex !important;
        background-color: #000;
    }
    
    .savings .content {
        color: #122231;
        text-align: center
    }
    
    .savings .content h3 {
        font-size: 48px;
        line-height: 66px;
        margin: auto
    }
    
    .savings .content .text {
        margin: 18px auto 53px;
        font-size: 24px;
        line-height: 35px
    }
    
    @media only screen and (min-width: 1192px) {
        .savings {
            margin-left:25.891px;
            margin-right: 15px
        }
    }
    
    .savings .box {
        margin: 0 auto;
        border-radius: 20px;
        padding: 30px 10px 30px 30px;
        -webkit-box-shadow: 0 0 1px 0 #ced3da;
        box-shadow: 0 0 1px 0 #ced3da
    }
    
    .savings .box .title {
        margin-top: 25px!important;
        font-size: 36px;
        line-height: 42px;
        font-weight: 700;
    }
    
    .savings .box .text {
        margin: 18px 0 10px;
        max-width: 290px;
        min-height: 80px;
        color: #3d4f60
    }
    
    .savings .box .sub-title {
        font-weight: 500;
        color: #3d4f60;
        -webkit-transition: margin-left .2s ease-out;
        -moz-transition: margin-left .2s ease-out;
        transition: margin-left .2s ease-out
    }
    
    .savings .box-container .main-cards {
        grid-gap: 2rem;
        gap: 2rem;
        flex-wrap: wrap;
        -moz-box-pack: center;
        justify-content: center;
        width: 1600px;
        display: flex;
    }
    
    .savings .box.home {
        cursor: pointer;
        position: relative;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
        margin: unset;
        overflow: hidden;
        height: 440px;
        width: 485px;
        margin-bottom: 0!important
    }
    
    .savings .box.home .sub-title {
        position: absolute;
        top: 85%
    }
    
    .savings .box.home .sub-title span {
        position: relative
    }
    
    .savings .box.home .sub-title span:after {
        content: "";
        height: 0;
        height: 8px;
        position: absolute;
        left: 0;
        width: 50%;
        opacity: 0
    }
    
    .savings .box.home .sub-title:hover span:after {
        opacity: 1;
        width: 100%;
        bottom: -6px;
        background: hsla(0,0%,100%,.7);
        left: 0;
        -webkit-transition: all .2s linear;
        -moz-transition: all .2s linear;
        transition: all .2s linear
    }
    
    .savings .box.home .text {
        margin: 18px 0 40px!important;
        font-size: 19px;
        line-height: 28px;
        font-weight: 400
    }
    
    .savings .box.home .img-card img {
        width: 100px;
        position: absolute;
        visibility: hidden;
        -webkit-transition: all .5s ease;
        -moz-transition: all .5s ease;
        transition: all .5s ease;
        bottom: 0;
        right: -100px
    }
    
    .interact .left .content .savings .box.home.active .link,.interact .left .content .savings .box.home:hover .link,.savings .box.home.active .interact .left .content .link,.savings .box.home.active .sub-title,.savings .box.home.active h5,.savings .box.home.active p,.savings .box.home.active svg,.savings .box.home:hover .interact .left .content .link,.savings .box.home:hover .sub-title,.savings .box.home:hover h5,.savings .box.home:hover p,.savings .box.home:hover svg {
        color: #fff!important;
        -webkit-transition: color .3s ease;
        -moz-transition: color .3s ease;
        transition: color .3s ease
    }
    
    .savings .box.home.active .svg-path,.savings .box.home:hover .svg-path {
        stroke: #fff
    }
    
    .savings .box.home.active .img-card img,.savings .box.home:hover .img-card img {
        width: 240px;
        visibility: visible;
        bottom: 0;
        right: 20px
    }
    
    .savings .box.piggybank.active,.savings .box.piggybank:hover {
        background-color: #0f60d6!important
    }
    
    .savings .box.safelock.active,.savings .box.safelock:hover {
        background-color: #2295f2!important
    }
    
    .savings .box.flexnaira.active,.savings .box.flexnaira:hover {
        background-color: #e5489b!important
    }
    
    .savings .box.flexdollar.active,.savings .box.flexdollar:hover {
        background-color: #0c1825!important
    }
    
    .savings .box.targetsavings.active,.savings .box.targetsavings:hover {
        background-color: #39c277!important
    }
    
    .savings .box.housemoney.active,.savings .box.housemoney:hover {
        background-color: #ff783c!important
    }
    
    .savings .box.reset {
        margin-bottom: 0!important;
        background: #fff!important
    }
    
    .savings .box.reset .sub-title {
        position: absolute;
        top: 85%
    }
    
    .savings .box.reset .text {
        margin: 18px 0 40px!important
    }
    
    .interact .left .content .savings .box.reset.piggybank .link,.savings .box.reset.piggybank .interact .left .content .link,.savings .box.reset.piggybank .sub-title,.savings .box.reset.piggybank h5,.savings .box.reset.piggybank svg {
        color: #0f60d6!important;
        -webkit-transition: color .3s ease;
        -moz-transition: color .3s ease;
        transition: color .3s ease
    }
    
    .savings .box.reset.piggybank p {
        color: #3d4f60!important
    }
    
    .savings .box.reset.piggybank .svg-path {
        stroke: #0f60d6
    }
    
    .interact .left .content .savings .box.reset.flex .link,.savings .box.reset.flex .interact .left .content .link,.savings .box.reset.flex .sub-title,.savings .box.reset.flex h5,.savings .box.reset.flex svg {
        color: #10b259!important;
        -webkit-transition: color .3s ease;
        -moz-transition: color .3s ease;
        transition: color .3s ease
    }
    
    .savings .box.reset.flex p {
        color: #3d4f60!important
    }
    
    .savings .box.reset.flex .svg-path {
        stroke: #10b259
    }
    
    .savings .box.reset .img-card img {
        width: 100px;
        position: absolute;
        visibility: hidden;
        -webkit-transition: all .3s ease;
        -moz-transition: all .3s ease;
        transition: all .3s ease;
        bottom: 0;
        right: -100px
    }

    @media only screen and (max-width: 1600px) {
        .savings .box-container .main-cards {
            width:unset
        }
    }

    .savings .box h5 {
        font-size: 19px
    }

    .savings .box.home {
        width: 90vw;
        max-width: 370px;
        margin-bottom: 0!important
    }

    .savings .box.reset {
        width: 80vw;
        margin-bottom: 0;
        background: #fff
    }

    .savings .box.home.active .img-card img,.savings .box.home:hover .img-card img {
        width: 170px!important;
        visibility: visible;
        bottom: 0;
        right: 16px
    }

    .savings .box.home .title {
        margin-top: 25px!important;
        font-size: 30px;
        line-height: 42px
    }