:root {
    --mf-blue: #2781B5;
    --mf-pink: #E21567;
    --mf-yellow: #F7D40F;
    --mf-mint: #EDF3F4;
    --mf-muted: #626262;
    --mf-muted-2: #9aa3a9;
}

.fs-12 { font-size: 12px; }
.fs-13 { font-size: 13px; }
.fs-14 { font-size: 14px; }
.fs-15 { font-size: 15px; }

.text-mf-blue { color: var(--mf-blue); }
.text-mf-pink { color: var(--mf-pink); }
.text-mf-muted { color: var(--mf-muted); }
.text-mf-muted-2 { color: var(--mf-muted-2); }
.bg-mf-blue { background-color: var(--mf-blue); }
.bg-mf-pink { background-color: var(--mf-pink); }
.bg-mf-yellow { background-color: var(--mf-yellow); }
.bg-mf-mint { background-color: var(--mf-mint); }

#myfuture-psychotest h2 {
    color: var(--blue);
}

.mf-assessment {
    padding: 80px 0;
}

.mf-plan-featured {
    border-color: var(--mf-pink) !important;
}

.mf-lang-switch {
    background: #f9f3f4;
    border-color: #f0e7e8 !important;
}

.mf-lang-switch button {
    background: transparent;
    border-color: transparent !important;
    color: var(--mf-muted-2);
    transition: all .15s ease;
}

.mf-lang-switch button.active {
    background: #fff;
    border-color: #ece2e3 !important;
    color: #111;
    box-shadow: 0 1px 2px rgba(0, 0, 0, .06);
}

.mf-btn-blue {
    background: var(--mf-blue);
    color: #fff;
}

.mf-btn-blue:hover {
    background: #fff;
    color: var(--mf-blue);
    border-color: var(--mf-blue);
}

.mf-btn-pink {
    background: var(--mf-pink);
    color: #fff;
}

.mf-btn-pink:hover {
    background: #fff;
    color: var(--mf-pink);
    border-color: var(--mf-pink);
}

.mf-btn-yellow {
    background: var(--mf-yellow);
    color: var(--blue);
}

.mf-btn-yellow:hover {
    background: #fff;
    color: var(--blue);
    border-color: var(--mf-yellow);
}

.mf-benefit-icon {
    flex: 0 0 56px;
    width: 56px;
    height: 56px;
}

.mf-benefit-img {
    width: 32px;
    height: 32px;
}

.mf-plan-logo {
    width: 84px;
    height: 64px;
}

.mf-cta {
    padding: 72px 0;
    background-color: #032336;
}

.mf-cta-row {
    --bs-gutter-x: 0;
    --bs-gutter-y: 32px;
}

@media only screen and (min-width: 992px) {
    .mf-cta-row {
        --bs-gutter-x: 32px;
    }


}

.mf-cta-img {
    width: 100%;
    height: auto;
}

@media only screen and (max-width: 991px) {
    .mf-cta .container{
        padding: 0;
    }

    .mf-cta .container .col-lg-6:first-of-type{
        padding: 0 16px;
    }

    .mf-plan-logo {
        width: 52px;
        height: 39px;
    }
}

@media only screen and (max-width: 768px) {
    .mf-assessment {
        padding: 48px 0;
    }

    .mf-cta {
        padding: 48px 0;
    }

    .mf-btn-yellow {
        width: 100%;
    }
}

#main-footer {
    color: #fff;
    background-color: #00598C;
    overflow: hidden;
}

#main-footer a {
    color: inherit;
    text-decoration: none;
    font-weight: 500;
}

/* #main-footer .hr {
    background-color: white;
    height: 1px;
} */

#main-footer #copyright {
    font-size: 14px;
    font-weight: 500;
}

.fs-7{
    font-size: 14px;
}

.fw-medium{
    font-weight:500;
}

.footer-tagline span{
    color: #F7C325;
}

.footer-link-container, #copyright p{
    color:#d1e5ff;
}

.footer-product-container{
    background-color:#972628;
}

 .footer-container{
    display: grid;
    grid-template-columns: minmax(calc(50%-20px), 1fr) minmax(0, 500px);
    grid-template-rows: auto auto;
    grid-template-areas:
        "motto links"
        "copyright links";
    gap: 40px;
    margin: 0 auto;
 }

 .motto{
    grid-area: motto;
 }

 .links{
    grid-area: links;
 }

 .copyright{
 grid-area: copyright;
 }

 @media only screen and (max-width: 768px) {
    .footer-container{
        grid-template-columns: 1fr;
        grid-template-rows: auto auto auto;
        grid-template-areas:
            "motto"
            "links"
            "copyright";
  }
}