/********************************************************************************
--- ETMONEY Font Icons Packcage ---
*********************************************************************************/
@font-face {
    font-family: 'etm-project-icons';
    src: url(https://static.smartspends.com/static/fonts/etmoneyicon/etm-project-icon.woff2) format('woff2'), url('https://static.smartspends.com/static/fonts/etmoneyicon/etm-project-icon.woff?ypwox5') format('woff');
    font-weight: normal;
    font-style: normal;
    font-display: block;
}

[class^="icon-"],
[class*=" icon-"] {
    /* use !important to prevent issues with browser extensions that change fonts */
    font-family: 'etm-project-icons' !important;
    speak: never;
    font-size: inherit;
    color: inherit;
    font-style: normal;
    font-weight: normal;
    font-variant: normal;
    text-transform: none;
    line-height: 1;
    /* Better Font Rendering =========== */
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.icon-thumbsup:before {
    content: "\e994";
}

.icon-account-fill:before {
    content: "\e900";
}

.icon-account:before {
    content: "\e901";
}

.icon-add-circle:before {
    content: "\e902";
}

.icon-add-document:before {
    content: "\e903";
}

.icon-add:before {
    content: "\e904";
}

.icon-android:before {
    content: "\e905";
    color: #d89627;
}

.icon-announce:before {
    content: "\e906";
}

.icon-annual-benefit:before {
    content: "\e907";
}

.icon-arrow-back:before {
    content: "\e908";
}

.icon-arrow-forward:before {
    content: "\e909";
}

.icon-arrow-right-circle:before {
    content: "\e90a";
}

.icon-average:before {
    content: "\e90b";
}

.icon-bad:before {
    content: "\e90c";
}

.icon-bank:before {
    content: "\e90d";
}

.icon-best-fill:before {
    content: "\e90e";
}

.icon-best:before {
    content: "\e90f";
}

.icon-birthday:before {
    content: "\e910";
}

.icon-bookmark:before {
    content: "\e911";
}

.icon-calendar-date:before {
    content: "\e912";
}

.icon-calendar:before {
    content: "\e913";
}

.icon-call:before {
    content: "\e914";
}

.icon-camera:before {
    content: "\e915";
}

.icon-caret-back:before {
    content: "\e916";
}

.icon-caret-dropdown:before {
    content: "\e917";
}

.icon-caret-filled:before {
    content: "\e918";
}

.icon-caret-forward:before {
    content: "\e919";
}

.icon-caret-upward:before {
    content: "\e91a";
}

.icon-cashback:before {
    content: "\e91b";
}

.icon-category:before {
    content: "\e91c";
}

.icon-certified-experts:before {
    content: "\e91d";
}

.icon-chat:before {
    content: "\e91e";
}

.icon-clock:before {
    content: "\e91f";
}

.icon-close:before {
    content: "\e920";
}

.icon-comment-chat:before {
    content: "\e921";
}

.icon-compare:before {
    content: "\e922";
}

.icon-compass:before {
    content: "\e923";
}

.icon-copy:before {
    content: "\e924";
}

.icon-credit-card:before {
    content: "\e925";
}

.icon-crown:before {
    content: "\e926";
}

.icon-customer-support:before {
    content: "\e927";
}

.icon-diamond:before {
    content: "\e928";
}

.icon-dining:before {
    content: "\e929";
}

.icon-down-arrow:before {
    content: "\e92a";
}

.icon-download:before {
    content: "\e92b";
}

.icon-easy-pay:before {
    content: "\e92c";
}

.icon-edit:before {
    content: "\e92d";
}

.icon-equal:before {
    content: "\e92e";
}

.icon-error-warning-fill:before {
    content: "\e92f";
}

.icon-error-warning:before {
    content: "\e930";
}

.icon-excellent:before {
    content: "\e931";
}

.icon-expenses:before {
    content: "\e932";
}

.icon-explore-2:before {
    content: "\e933";
}

.icon-facebook-circle:before {
    content: "\e934";
    color: #3477ea;
}

.icon-faq:before {
    content: "\e935";
}

.icon-featured:before {
    content: "\e936";
}

.icon-filter:before {
    content: "\e937";
}

.icon-fixed-deposite:before {
    content: "\e938";
}

.icon-folder:before {
    content: "\e939";
}

.icon-forward:before {
    content: "\e93a";
}

.icon-fuel-surcharge-waiver:before {
    content: "\e93b";
}

.icon-gallery:before {
    content: "\e93c";
}

.icon-gmail:before {
    content: "\e93d";
}

.icon-good:before {
    content: "\e93e";
}

.icon-hand-point:before {
    content: "\e93f";
}

.icon-hashtag:before {
    content: "\e940";
}

.icon-health-policy:before {
    content: "\e941";
}

.icon-height:before {
    content: "\e942";
}

.icon-home:before {
    content: "\e943";
}

.icon-hospital:before {
    content: "\e944";
}

.icon-idea:before {
    content: "\e945";
}

.icon-info-fill:before {
    content: "\e946";
}

.icon-info:before {
    content: "\e947";
}

.icon-inprocess-fill:before {
    content: "\e948";
}

.icon-inprocess:before {
    content: "\e949";
}

.icon-instagram:before {
    content: "\e94a";
}

.icon-insurance:before {
    content: "\e94b";
}

.icon-investment:before {
    content: "\e94c";
}

.icon-ios:before {
    content: "\e94d";
    color: #d89627;
}

.icon-key:before {
    content: "\e94e";
}

.icon-like-checked:before {
    content: "\e94f";
}

.icon-like-heart:before {
    content: "\e950";
}

.icon-linkedin-circle:before {
    content: "\e951";
    color: #2a66bc;
}

.icon-linkedin:before {
    content: "\e952";
    color: #2a66bc;
}

.icon-list:before {
    content: "\e953";
}

.icon-loading-bar:before {
    content: "\e954";
}

.icon-loading-rotation:before {
    content: "\e955";
}

.icon-loan:before {
    content: "\e956";
}

.icon-location:before {
    content: "\e957";
}

.icon-lock:before {
    content: "\e958";
}

.icon-lounge-access:before {
    content: "\e959";
}

.icon-manage-expenses:before {
    content: "\e95a";
}

.icon-menu:before {
    content: "\e95b";
}

.icon-milestone-benefits:before {
    content: "\e95c";
}

.icon-minus-circle:before {
    content: "\e95d";
}

.icon-minus:before {
    content: "\e95e";
}

.icon-more:before {
    content: "\e95f";
}

.icon-movies:before {
    content: "\e960";
}

.icon-notification:before {
    content: "\e961";
}

.icon-nps:before {
    content: "\e962";
}

.icon-offer-fill:before {
    content: "\e963";
}

.icon-offer:before {
    content: "\e964";
}

.icon-on-hold:before {
    content: "\e965";
}

.icon-other-benefits:before {
    content: "\e966";
}

.icon-payment-failed:before {
    content: "\e967";
}

.icon-pdf-rejected:before {
    content: "\e968";
}

.icon-pdf:before {
    content: "\e969";
}

.icon-pending:before {
    content: "\e96a";
}

.icon-play:before {
    content: "\e96b";
}

.icon-policy-add-ons:before {
    content: "\e96c";
}

.icon-policy-brochure:before {
    content: "\e96d";
}

.icon-policy-holder:before {
    content: "\e96e";
}

.icon-profile:before {
    content: "\e96f";
}

.icon-question-mark:before {
    content: "\e970";
}

.icon-rebalancing:before {
    content: "\e971";
}

.icon-refer-fill:before {
    content: "\e972";
}

.icon-refer:before {
    content: "\e973";
}

.icon-refund:before {
    content: "\e974";
}

.icon-reload:before {
    content: "\e975";
}

.icon-remove-fill:before {
    content: "\e976";
}

.icon-remove:before {
    content: "\e977";
}

.icon-reward-points:before {
    content: "\e978";
}

.icon-right-tick:before {
    content: "\e979";
}

.icon-rupee:before {
    content: "\e97a";
}

.icon-search:before {
    content: "\e97b";
}

.icon-settings:before {
    content: "\e97c";
}

.icon-share:before {
    content: "\e97d";
}

.icon-shield-fill:before {
    content: "\e97e";
}

.icon-shield:before {
    content: "\e97f";
}

.icon-shopping:before {
    content: "\e980";
}

.icon-sip:before {
    content: "\e981";
}

.icon-skip:before {
    content: "\e982";
}

.icon-sortby:before {
    content: "\e983";
}

.icon-star:before {
    content: "\e984";
}

.icon-step-1:before {
    content: "\e985";
}

.icon-step-2:before {
    content: "\e986";
}

.icon-Step-3:before {
    content: "\e987";
}

.icon-steps-number-1:before {
    content: "\e988";
}

.icon-steps-number-2:before {
    content: "\e989";
}

.icon-steps-number-3:before {
    content: "\e98a";
}

.icon-stocks:before {
    content: "\e98b";
}

.icon-subscriber:before {
    content: "\e98c";
}

.icon-sucess-fill:before {
    content: "\e98d";
}

.icon-sucess-outline:before {
    content: "\e98e";
}

.icon-superior-research:before {
    content: "\e98f";
}

.icon-tag:before {
    content: "\e990";
}

.icon-telegram-circle:before {
    content: "\e991";
    color: #1da1f2;
}

.icon-telegram:before {
    content: "\e992";
    color: #1da1f2;
}

.icon-thankyou:before {
    content: "\e993";
}

.icon-track-bills:before {
    content: "\e995";
}

.icon-transaction:before {
    content: "\e996";
}

.icon-travel:before {
    content: "\e997";
}

.icon-twitter-circle:before {
    content: "\e998";
    color: #489be9;
}

.icon-twitter:before {
    content: "\e999";
    color: #489be9;
}

.icon-up-arrow:before {
    content: "\e99a";
}

.icon-updated:before {
    content: "\e99b";
}

.icon-upload-file:before {
    content: "\e99c";
}

.icon-upload:before {
    content: "\e99d";
}

.icon-very-bad:before {
    content: "\e99e";
}

.icon-video:before {
    content: "\e99f";
}

.icon-warning-fill:before {
    content: "\e9a0";
}

.icon-warning:before {
    content: "\e9a1";
}

.icon-watchlist:before {
    content: "\e9a2";
}

.icon-weight:before {
    content: "\e9a3";
}

.icon-whatsapp-circle:before {
    content: "\e9a4";
    color: #58bd54;
}

.icon-whatsapp:before {
    content: "\e9a5";
}

.icon-youtube-circle:before {
    content: "\e9a6";
    color: #ea3223;
}

.icon-youtube:before {
    content: "\e9a7";
}

/* -------------------------------------------------------------------------- */

/*******Commen style Start***********/
body {
    margin: 0;
    padding: 0;
}

* {
    -webkit-box-sizing: border-box;
    box-sizing: border-box;
    text-rendering: optimizeLegibility !important;
    -webkit-font-smoothing: antialiased !important;
}

/*******Commen Section Start******/
ul {
    padding: 0;
    margin: 0;
    list-style-type: none;
}

img {
    max-width: 100%;
}

p {
    font-size: 16px;
    line-height: 20px;
    color: var(--black60);
    margin-bottom: 10px
}

/* strong {
    font-weight: 700 !important;
} */
@media (max-width:991px) {
    p {
        font-size: 12px;
        line-height: 16px;
    }
}

a {
    text-decoration: none !important
}

/*-----------Misc Typography-----------*/
.uppercase {
    text-transform: uppercase;
}

.underline {
    text-decoration: underline;
}

.capitalize {
    text-transform: capitalize;
}

.bold {
    font-family: proxima-nova-bold;
}

.semibold {
    font-family: proxima-nova-semibold;
}

.light {
    font-weight: 400
}

/*-----------Aligning-----------*/
.left-align {
    text-align: left;
}

.center {
    text-align: center;
}

.right-align {
    text-align: right;
}

.left {
    float: left;
}

.right {
    float: right;
}

.light {
    font-weight: 300;
}

.regular {
    font-weight: 400;
}

.bold {
    font-family: 'cabinet-grotesk-bold';
}

.visible-large {
    display: block !important;
}

.visible-small {
    display: none !important;
}

.slider-cta-hide {
    display: none;
}

@media (max-width:991px) {
    .visible-large {
        display: none !important;
    }

    .visible-small {
        display: block !important;
    }
}

.calci-hide {
    display: none !important;
}

.calci-show {
    display: block !important;
}

/*-----------Branding Backgrond Colors-----------*/
.primary {
    background: var(--white-color);
}

.bg-apricot {
    background: #F9F8F3;
}

.bg-light-blue {
    background: #F4F7FF
}

.bg-alice-blue {
    background: #F4F7FF
}

.bg-dark-purple {
    background: #50037F;
}

/*@media (max-width:991px) {
    .bg-apricot {
        background: #fff;
    }
}*/

/*-----------Branding Colors-----------*/

.white {
    color: var(--white-color);
}

.light-green {
    color: #03D000 !important
}

.dark-green,
.dark-green:hover,
.dark-green:focus,
.dark-green:active {
    color: var(--primary-green) !important;
}

.light-grey {
    color: var(--black40);
}

/*-----------Branding Shadow-----------*/
.showdow-top {
    -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
}

/*-----------Title CSS-----------*/
.section-title-lg {
    font-size: 32px;
    line-height: 36px;
    font-family: 'cabinet-grotesk-extrabold';
    color: var(--black90);
}

.section-title-md {
    font-family: 'cabinet-grotesk-bold';
    font-size: 28px;
    line-height: 32px;
    color: var(--black90);
    margin: 10px 0px 15px;
    font-family: 'cabinet-grotesk-extrabold';
}

.section-title-sm {
    font-size: 22px;
    line-height: 26px;
    margin: 8px 0px 15px;
    color: var(--black90);
    font-family: 'cabinet-grotesk-bold';
}

.section-subtitle {
    font-size: 16px;
    line-height: 20px;
    color: var(--black60);
    margin: 10px 0px 25px
}

/*----------- Button CSS -----------*/
.cta {
    font-family: proxima-nova-semibold;
    text-align: center;
    border-radius: 30px;
    font-size: 14px;
    line-height: 24px;
    padding: 6px 12px;
    display: inline-block;
    border: 1px solid transparent;
    -webkit-transition: all 200ms ease !important;
    -o-transition: all 200ms ease !important;
    transition: all 200ms ease !important;
    width: 100%;
    min-width: 100px
}

.cta-hollow {
    border-color: var(--primary-green);
    background: transparent;
    color: var(--primary-green);
    cursor: pointer;
}

.cta-hollow:hover {
    background: var(--primary-green);
    color: var(--white-color);
    text-decoration: none;
}

.cta-primary {
    background: var(--primary-green);
    color: var(--white-color);
    border-color: var(--primary-green);
}

.cta-primary:hover,
.cta-primary:focus,
.cta-primary:active {
    color: var(--white-color);
    text-decoration: none;
    background: var(--hover-primary-green) !important;
    border-color: var(--hover-primary-green) !important;
}

.cta-large {
    padding: 12px;
    min-width: auto;
    width: auto;
    font-family: 'cabinet-grotesk-bold';
    font-size: 16px;
    line-height: 24px;
}

.cta-small {
    max-width: 142px
}

.cta-golden {
    background: #D0B250;
    color: var(--black90);
    border-color: #D0B250;
}

.cta-golden:hover,
.cta-golden:focus,
.cta-golden:active {
    background: #e7be3a;
    color: var(--black90);
    text-decoration: none;
}

@media (max-width:991px) {
    .top-heading {
        padding-top: 10px;
    }

    .section-title-lg {
        font-size: 22px;
        line-height: 26px;
        margin-bottom: 10px
    }

    .section-title-md {
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 10px
    }

    .section-title-sm {
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 10px
    }

    .section-subtitle {
        font-weight: normal;
        font-size: 14px;
        line-height: 18px;
        text-align: left;
        margin-bottom: 20px
    }
}

/*----------- Divider CSS -----------*/
.section-devider .border-solid {
    max-width: 1100px;
    border-top: 1px solid #DDDDDD;
    margin: 0px auto
}

/*----------- Grid CSS -----------*/
.row-inner {
    max-width: 1100px;
    padding-left: 20px;
    padding-right: 20px;
    margin: 0px auto;
}

.row-flex {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
}

.justify-content-start {
    -webkit-box-pack: start !important;
    -ms-flex-pack: start !important;
    justify-content: flex-start !important;
}

.justify-content-end {
    -webkit-box-pack: end !important;
    -ms-flex-pack: end !important;
    justify-content: flex-end !important;
}

.justify-content-center {
    -webkit-box-pack: center !important;
    -ms-flex-pack: center !important;
    justify-content: center !important;
}

.justify-content-between {
    -webkit-box-pack: justify !important;
    -ms-flex-pack: justify !important;
    justify-content: space-between !important;
}

.row-flex-centered {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center
}

.flex-vertical-center {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

@media (min-width:992px) {
    .section .row-three-col {
        width: calc(100% + 50px) !important;
        margin-right: -25px;
        margin-left: -25px;
    }

    .section .row-three-col [class*='col-'] {
        max-width: 100% !important;
        margin: 0px;
        padding-left: 25px;
        padding-right: 25px
    }

    .column-left {
        width: 40%;
        padding-right: 10px
    }

    .column-right {
        width: 60%;
        margin-left: auto;
        padding-left: 10px
    }

    .col {
        -ms-flex-preferred-size: 0;
        flex-basis: 0;
        -webkit-box-flex: 1;
        -ms-flex-positive: 1;
        flex-grow: 1;
        max-width: 100%;
    }

    .col-auto {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 auto;
        flex: 0 0 auto;
        width: auto;
        max-width: none;
    }

    .col-1 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 8.333333%;
        flex: 0 0 8.333333%;
        max-width: 8.333333%;
    }

    .col-2 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 16.666667%;
        flex: 0 0 16.666667%;
        max-width: 16.666667%;
    }

    .col-3 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 25%;
        flex: 0 0 25%;
        max-width: 25%;
    }

    .col-4 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 33.333333%;
        flex: 0 0 33.333333%;
        max-width: 33.333333%;
    }

    .col-5 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 41.666667%;
        flex: 0 0 41.666667%;
        max-width: 41.666667%;
    }

    .col-6 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 50%;
        flex: 0 0 50%;
        max-width: 50%;
    }

    .col-7 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 58.333333%;
        flex: 0 0 58.333333%;
        max-width: 58.333333%;
    }

    .col-8 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 66.666667%;
        flex: 0 0 66.666667%;
        max-width: 66.666667%;
    }

    .col-9 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 75%;
        flex: 0 0 75%;
        max-width: 75%;
    }

    .col-10 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 83.333333%;
        flex: 0 0 83.333333%;
        max-width: 83.333333%;
    }

    .col-11 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 91.666667%;
        flex: 0 0 91.666667%;
        max-width: 91.666667%;
    }

    .col-12 {
        -webkit-box-flex: 0;
        -ms-flex: 0 0 100%;
        flex: 0 0 100%;
        max-width: 100%;
    }
}

@media (max-width:991px) {

    .column-left,
    .column-right,
    .col-xs {
        width: 100%
    }

    .flex-wrap-sm {
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .flex-column-reverse {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }
}

@media (max-width:991px) {
    .cta-large {
        max-width: 414px;
        margin: 0px auto
    }
}

/* .mweb-ctas { display: none; } */
.mweb-ctas .edit-cta {
    margin-right: 12px;
    width: 60%;
}

.mweb-ctas__text {
    border-top: 0.5px solid #DDDDDD;
    padding: 12px;
}

.mweb-ctas__text p {
    font-size: 12px;
    line-height: 16px;
    margin-bottom: 0px;
}

.mweb-ctas .row-flex {
    display: flex !important;
    flex-direction: row !important;
    padding-bottom: 4px;
}

@media (max-width:991px) {
    .mweb-ctas {
        display: block;
    }
}

/*----------- Image Loading Effect CSS -----------*/
.img-loader {
    position: relative;
    overflow: hidden;
}

.img-loader:before {
    content: '';
    width: 100%;
    height: 100%;
    top: 0px;
    left: 0px;
    display: block;
    position: absolute;
    background: #f6f7f8;
    background-image: -o-linear-gradient(left, #f6f7f8 0, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
    background-image: -webkit-gradient(linear, left top, right top, color-stop(0, #f6f7f8), color-stop(20%, #edeef1), color-stop(40%, #f6f7f8), to(#f6f7f8));
    background-image: linear-gradient(to right, #f6f7f8 0, #edeef1 20%, #f6f7f8 40%, #f6f7f8 100%);
    background-repeat: no-repeat;
    background-size: 800px 100%;
    -webkit-animation-duration: 1s;
    -webkit-animation-fill-mode: forwards;
    -webkit-animation-iteration-count: infinite;
    -webkit-animation-name: placeHolderShimmer;
    -webkit-animation-timing-function: linear;
    z-index: 1;
}

@-webkit-keyframes placeHolderShimmer {
    0% {
        background-position: -468px 0;
    }

    100% {
        background-position: 468px 0;
    }
}

@keyframes placeHolderShimmer {
    0% {
        background-position: -468px 0;
    }

    100% {
        background-position: 468px 0;
    }
}

/*----------- Form CSS -----------*/

.form-ctrl,
.input-ctrl {
    caret-color: var(--primary-green);
}

.form-ctrl {
    font-family: proxima-nova-bold;
    padding: 0px;
    border: 0px;
    border-bottom: 1px solid #DDDDDD;
    display: block;
    width: 100%;
    font-size: 22px;
    line-height: 34px;
    color: var(--black90);
    background: #F9F8F3;
    width: 100%;
}

.calci-input-ctrl .form-ctrl {
    -webkit-appearance: none;
    border-radius: 0;
}

.calci-input-ctrl,
.calci-select-ctrl,
.calci-num-ctrl,
.calci-button-ctrl,
.calci-radio-ctrl {
    position: relative;
    margin-bottom: 8px;
}

.calci-input-ctrl:before {
    content: "\20B9";
    position: absolute;
    top: 0px;
    left: 0px;
    font-size: 16px;
    color: var(--black60);
    font-family: proxima-nova-regular;
    line-height: 36px;
}

.calci-select-ctrl:after {
    content: "";
    border: solid var(--primary-green);
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 1px;
    cursor: pointer;
    width: 8px;
    height: 8px;
    margin: 0px;
    display: block;
    position: absolute;
    top: 34%;
    right: 1px;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
}

.calci-select-ctrl.no-caret-icon:after {
    display: none;
}

.calci-select-ctrl .form-ctrl {
    padding-right: 25px;
    -moz-appearance: none;
    -webkit-appearance: none;
    appearance: none;
    z-index: 9;
    position: relative;
    background: transparent;
}

.calci-input-ctrl .form-ctrl {
    padding-left: 16px;
}

.calci-input-ctrl.no-rupee .form-ctrl {
    padding-left: 0px;
}

.calci-input-ctrl.no-rupee:before {
    display: none;
}

.calci-label {
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    color: var(--black60);
    position: relative;
}

.calci-label.tooltip-label {
    padding-right: 22px;
}

.calci-label.tooltip-label .label-tooltip:after {
    font-weight: 300;
    font-family: proxima-nova-regular;
    position: absolute;
    width: 16px;
    height: 16px;
    content: '';
    background: #DDDDDD;
    display: inline-block;
    border-radius: 100%;
    color: var(--black60);
    font-size: 13px;
    font-family: 'cabinet-grotesk-bold';
    line-height: 16px;
    text-align: center;
    right: 0px;
    top: 1px;
    padding: 3px;
    background-image: url(https://img.smartspends.com/static/images/question_mark.svg);
    background-position: center;
    background-repeat: no-repeat;
}

.calci-label.shake:after,
.property .label-tooltip.shake:after {
    -webkit-animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
    animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    perspective: 1000px;
}

@-webkit-keyframes shake {

    10%,
    90% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }

    20%,
    80% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }

    30%,
    50%,
    70% {
        -webkit-transform: translate3d(-2px, 0, 0);
        transform: translate3d(-2px, 0, 0);
    }

    40%,
    60% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }
}

@keyframes shake {

    10%,
    90% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }

    20%,
    80% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }

    30%,
    50%,
    70% {
        -webkit-transform: translate3d(-2px, 0, 0);
        transform: translate3d(-2px, 0, 0);
    }

    40%,
    60% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }
}

.calci-num-ctrl .num-ctrl {
    height: 34px;
    width: 30px;
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    right: 0px;
    top: 0px;
}

.calci-num-ctrl .num-ctrl span {
    cursor: pointer;
    position: relative;
    width: 30px;
    height: 17px;
    display: inline-block;
}

.calci-num-ctrl .num-ctrl span:after {
    right: 4px;
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
}

.calci-num-ctrl .num-ctrl .increase:after {
    border-bottom: 12px solid var(--black40);
    margin-top: 2px;
}

.calci-num-ctrl .num-ctrl .decrease:after {
    border-top: 12px solid var(--black40);
    margin-bottom: 2px;
}

/* lumpsum num-ctrl */
.calci-num-ctrl .lumpsum-num-ctrl,
.calci-num-ctrl .sip-num-ctrl {
    height: 34px;
    width: 30px;
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    right: 0px;
    top: 0px;
}

.calci-num-ctrl .lumpsum-num-ctrl span,
.calci-num-ctrl .sip-num-ctrl span {
    cursor: pointer;
    position: relative;
    width: 30px;
    height: 17px;
    display: inline-block;
}

.calci-num-ctrl .lumpsum-num-ctrl span:after,
.calci-num-ctrl .sip-num-ctrl span:after {
    right: 4px;
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
}

.calci-num-ctrl .lumpsum-num-ctrl .increase:after,
.calci-num-ctrl .sip-num-ctrl .increase:after {
    border-bottom: 12px solid var(--black40);
    margin-top: 2px;
}

.calci-num-ctrl .lumpsum-num-ctrl .decrease:after,
.calci-num-ctrl .sip-num-ctrl .decrease:after {
    border-top: 12px solid var(--black40);
    margin-bottom: 2px;
}

/* calender-ctrl */
.calculator-form .form-group .date {
    position: relative;
}

.calci-date-ctrl {
    position: relative;
}

.calci-date-ctrl .calender-ctrl {
    position: absolute;
    right: 2px;
    bottom: 8px;
    width: 20px;
    height: 20px;
    display: inline-block;
    background: url(https://static.smartspends.com/static/images/etmoney/genius/portfolios/solution-details/calendar.svg);
    background-position: center;
    background-repeat: no-repeat;
    background-size: 20px;
    cursor: pointer;
}

@media (max-width:991px) {

    .calci-input-ctrl,
    .calci-select-ctrl,
    .calci-num-ctrl,
    .calci-button-ctrl,
    .calci-date-ctrl {
        min-height: 35px;
    }
}

/* radio-ctrl */

/* The container */
.radio-ctrl:first-child {
    margin-top: 3px;
}

.radio-ctrl {
    font-size: 16px;
    font-family: proxima-nova-regular;
    font-weight: normal;
    line-height: 20px;
    color: var(--black90);
    display: block;
    position: relative;
    padding-left: 30px;
    margin-bottom: 10px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

/* Hide the browser's default radio button */
.radio-ctrl .radio-ctrl-input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}

/* Create a custom radio button */
.green-circle {
    position: absolute;
    top: 0;
    left: 0;
    height: 18px;
    width: 18px;
    background-color: var(--white-color);
    border: 1px solid var(--primary-green);
    border-radius: 50%;
}

/* On mouse-over, add a grey background color */
.container:hover .radio-ctrl-input~.green-circle {
    background-color: #ccc;
}

/* When the radio button is checked, add a blue background */
.radio-ctrl .radio-ctrl-input:checked~.green-circle:after,
.radio-ctrl .radio-ctrl-input.defaultchecked~.green-circle:after {
    width: 12px;
    height: 12px;
    background: var(--primary-green);
    top: 2px;
    left: 2px;
    content: "";
    position: absolute;
}

/* Create the indicator (the dot/circle - hidden when not checked) */
.radio-ctrl:after {
    content: "";
    position: absolute;
    display: none;
}

/* Show the indicator (dot/circle) when checked */
.radio-ctrl .radio-ctrl-input:checked~.green-circle:after {
    display: block;
}

/* Style the indicator (dot/circle) */
.radio-ctrl .green-circle:after {
    top: 9px;
    left: 9px;
    width: 8px;
    height: 8px;
    border-radius: 50%;
    background: white;
}

/* end */

/*Range Slider*/
.range-slider-label {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.range-slider-label .calci-input-ctrl,
.range-slider-label .calci-num-ctrl {
    min-height: auto;
    width: 115px;
    margin-bottom: 0px
}

.range-input-slider .slidecontainer {
    width: 100%;
    padding: 20px 0
}

.range-input-slider .input-slider {
    -webkit-appearance: none;
    width: 100%;
    height: 4px;
    border-radius: 10px;
    background: var(--black10);
    outline: 0;
    -webkit-transition: .2s;
    transition: opacity .2s
}

.range-input-slider .input-slider:hover {
    opacity: 1
}

.range-input-slider .input-slider::-webkit-slider-thumb {
    -webkit-appearance: none;
    appearance: none;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
    border: solid 2px var(--primary-green);
    background-color: var(--white-color);
    cursor: pointer
}

.range-input-slider .input-slider::-moz-range-thumb {
    width: 20px;
    height: 20px;
    border-radius: 50%;
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
    border: solid 2px var(--primary-green);
    background-color: var(--white-color);
    cursor: pointer
}

.interest-tenure {
    position: relative;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.interest-tenure li {
    cursor: pointer;
    margin-right: 9px;
    font-size: 12px;
    line-height: 16px;
    color: var(--black60);
    border: 1px solid #DDDDDD;
    border-radius: 2px;
    padding: 2px 6px;
    text-align: center;
}

.interest-tenure li:last-child {
    margin-right: 0px
}

.interest-tenure li:hover,
.interest-tenure li.active {
    border-color: var(--primary-green);
}

.calculator-form .input-prop {
    position: absolute;
    top: 0px;
    font-size: 22px;
    line-height: 34px;
    color: var(--black90);
    font-family: proxima-nova-bold;
}

.calculator-form .input-prop.percentage {
    left: 35px;
}

.calculator-form .input-prop #extraInterestProp {
    font-size: 16px;
    position: relative;
    left: 8px;
    font-family: proxima-nova-regular
}

.calculator-form .input-prop.year {
    left: 20px;
}

.alerts-msg {
    position: relative;
    font-size: 12px;
    line-height: 14px;
    color: var(--black60);
    padding-bottom: 5px;
}

.info-msg {
    padding-left: 20px;
}

.info-msg:before {
    content: '';
    background: url(../../images/calculator/info-grey.svg);
    position: absolute;
    left: 1px;
    top: 1px;
    height: 12px;
    width: 12px;
    background-size: 100%;
}

.calci-main__container .suffix-percent.senior-citizen-ctrl .form-ctrl {
    text-align: left;
}

@media (min-width:991px) {
    .calculator-form .form-group {
        max-width: 264px;
        margin-right: 15px
    }

    .calculator-form.large-col .form-group {
        max-width: 264px !important;
    }

    .calculator-form .form-group.xl-col {
        max-width: 347px !important;
    }

    .calculator-form.large-col .cta {
        max-width: 100%;
    }

    .calculator-form .form-group:last-child {
        margin-right: 0px
    }

    .calci-num-ctrl .form-ctrl {
        padding-right: 18px;
    }

    .calci-num-ctrl.prefix-year input.form-ctrl {
        padding-right: 48px;
    }
}

@media (max-width:991px) {

    .range-slider-label .calci-input-ctrl,
    .range-slider-label .calci-num-ctrl {
        width: 100px
    }

    .form-ctrl,
    .calculator-form .input-prop {
        font-size: 18px;
    }

    .calculator-form .input-prop.percentage {
        left: 30px
    }

    .calculator-form .input-prop.year {
        left: 16px;
    }

    .calci-num-ctrl .form-ctrl {
        padding-right: 16px;
    }

    .calci-num-ctrl.prefix-year input.form-ctrl {
        padding-right: 40px;
    }

    .calci-num-ctrl .num-ctrl {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        width: 68px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        right: -5px
    }

    .calci-num-ctrl .num-ctrl span {
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
        width: 30px;
        height: 34px
    }

    .calci-num-ctrl .num-ctrl span:after {
        bottom: 0px;
        right: 0px;
        left: 8px;
    }

    .calci-num-ctrl .num-ctrl .increase:after {
        top: 8px
    }

    .calci-num-ctrl .num-ctrl .decrease:after {
        bottom: 8px;
    }

    /* lumpsum-num-ctrl */
    .calci-num-ctrl .lumpsum-num-ctrl,
    .calci-num-ctrl .sip-num-ctrl {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: reverse;
        -ms-flex-direction: row-reverse;
        flex-direction: row-reverse;
        width: 68px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
        right: -5px
    }

    .calci-num-ctrl .lumpsum-num-ctrl span,
    .calci-num-ctrl .sip-num-ctrl span {
        -webkit-transform: rotate(90deg);
        -ms-transform: rotate(90deg);
        transform: rotate(90deg);
        width: 30px;
        height: 34px
    }

    .calci-num-ctrl .lumpsum-num-ctrl span:after,
    .calci-num-ctrl .sip-num-ctrl span:after {
        bottom: 0px;
        right: 0px;
        left: 8px;
    }

    .calci-num-ctrl .lumpsum-num-ctrl .increase:after,
    .calci-num-ctrl .sip-num-ctrl .increase:after {
        top: 8px
    }

    .calci-num-ctrl .lumpsum-num-ctrl .decrease:after,
    .calci-num-ctrl .sip-num-ctrl .decrease:after {
        bottom: 8px;
    }

    .calculation-content {
        box-shadow: none !important;
        border-radius: 0 !important;
    }
}

/*Custom DropDown*/
.dropdown-wrap {
    position: relative;
}

.dropdown-wrap .dropdown-select {
    z-index: 99;
    width: 100%;
    background: #fff;
    border-radius: 2px;
    position: absolute;
    top: 36px;
    -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    overflow-y: scroll;
    display: none;
}

.dropdown-wrap.selected .dropdown-select {
    display: block;
}

.dropdown-wrap .dropdown-select li {
    overflow: initial;
    margin: 0;
    color: var(--black90);
    padding: 10px 20px;
    width: 100%;
    cursor: pointer;
    font-size: 16px;
}

.dropdown-wrap .dropdown-select li:hover {
    background-color: #f9f8f1;
}

.dropdown-wrap .dropdown-arrow {
    position: absolute;
    right: 5px;
    top: 12px;
    width: 16px;
    height: 12px;
    display: inline-block;
}

.dropdown-wrap .dropdown-arrow:after {
    border: 1px solid var(--primary-green);
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 4px;
    content: '';
    position: absolute;
    right: 2px;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    top: 0px;
}

.dropdown-wrap.selected .dropdown-arrow:after {
    -ms-transform: rotate(-135deg) !important;
    transform: rotate(-135deg) !important;
    -webkit-transform: rotate(-135deg) !important;
}

.dropdown-wrap .form-ctrl {
    cursor: pointer;
}

.dropdown-wrap.selected .icon-caret-dropdown {
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
}

.dropdown-wrap.selected .icon-caret-dropdown {}

/*----------- List Styleing -----------*/
.grey-listing {
    padding-left: 20px;
    position: relative;
}

.grey-listing .list-title {
    font-size: 20px;
    line-height: 24px;
    font-family: proxima-nova-semibold;
    color: var(--black90);
    margin: 0px 0px 10px
}

.grey-listing li {
    font-size: 16px;
    line-height: 20px;
    position: relative;
    color: var(--black60);
    margin-bottom: 10px
}

.decimal-prop li {
    list-style: decimal;
}

.grey-listing.dashed-prop {
    padding-left: 0px
}

.dashed-prop li {
    list-style: none;
    padding-left: 15px;
}

.dashed-prop li:before {
    content: "\2014";
    position: absolute;
    left: 0px;
    font-size: 9px;
    color: var(--black60);
    line-height: 16px;
}

.decimal-prop.large-prop li {
    color: var(--black90);
    padding-left: 10px;
}

.counter-prop {
    counter-reset: list-number;
    padding-left: 0px
}

.counter-prop li {
    padding-left: 60px;
    margin-bottom: 28px
}

.counter-prop li:before {
    height: 28px;
    width: 28px;
    left: 0px;
    top: 0px;
    border-radius: 100%;
    background: #6880C8;
    position: absolute;
    counter-increment: list-number;
    content: counter(list-number);
    line-height: 28px;
    font-size: 15px;
    color: var(--white-color);
    text-align: center;
}

.counter-prop li:after {
    content: '';
    border-left: 1px dashed #6880C8;
    width: 2px;
    height: 100%;
    left: 14px;
    top: 28px;
    position: absolute;
}

.counter-prop li:last-child:after {
    display: none;
}

.counter-prop li:last-child {
    margin-bottom: 5px
}

.counter-prop-horizontal {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 20px 0px;
}

.counter-prop-horizontal .list-title {
    font-size: 14px !important;
    line-height: 18px;
    color: var(--black90);
}

.counter-prop-horizontal li {
    padding-left: 0px;
    margin-bottom: 0px;
    padding-top: 30px;
    padding-right: 40px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
}

.counter-prop-horizontal li:last-child {
    padding-right: 0px
}

.counter-prop-horizontal li:before {
    height: 20px;
    width: 20px;
    left: 0px;
    top: 0px;
    background: #fff;
    line-height: 17px;
    font-size: 12px;
    color: #6880C8;
    border: 1px solid #6880C8;
}

.counter-prop-horizontal li:after {
    content: '';
    border-top: 1px dashed #6880C8;
    width: 100%;
    height: 2px;
    left: 20px;
    top: 10px;
    position: absolute;
}

.counter-prop-horizontal li p {
    font-size: 14px;
    line-height: 18px
}

.icon-prop {
    padding-left: 0px
}

.icon-prop li {
    padding-left: 64px;
    margin-bottom: 25px
}

.icon-prop li .list-icon {
    position: absolute;
    width: 42px;
    height: 42px;
    min-width: 42px;
    left: 0px;
    top: 0px
}

.circle-prop {
    padding-left: 0px
}

.circle-prop li {
    list-style: none;
    padding-left: 18px;
}

.circle-prop li:before {
    width: 6px;
    height: 6px;
    content: "";
    background: #C4C4C4;
    position: absolute;
    left: 0px;
    border-radius: 100%;
    top: 7px;
    display: inline-block;
}

.icon-and-subtext li {
    display: flex;
    align-items: center;
    padding-left: 0px
}

.icon-and-subtext li .list-icon {
    position: relative;
    margin-right: 20px
}

.icon-and-subtext li p {
    margin-bottom: 0px;
    color: var(--black90);
    font-family: proxima-nova-semibold;
}

@media (min-width:991px) {
    .decimal-prop.large-prop li {
        font-size: 20px;
    }
}

@media (max-width:991px) {
    .grey-listing .list-title {
        font-size: 14px;
        line-height: 18px;
        margin: 0px 0px 6px;
    }

    .counter-prop li,
    .icon-prop li {
        padding-left: 52px;
        margin-bottom: 24px !important;
    }

    .icon-prop li .list-icon {
        height: 32px;
        width: 32px;
        min-width: 32px;
    }

    .counter-prop-horizontal {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        margin: 15px 0px 0px
    }

    .counter-prop-horizontal li {
        padding-left: 34px;
        margin-bottom: 15px !important;
        padding-top: 0px;
        padding-right: 0px;
    }

    .counter-prop-horizontal li:after {
        display: none;
    }

    .icon-and-subtext li {
        padding-left: 0px
    }
}

/*----------- White Theme Table -----------*/
.custom-table {
    width: 100%;
}

.white-theme-table {
    background: var(--white-color);
    -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
    border-radius: 8px;
    padding: 20px 18px 10px;
    max-width: 650px;
    position: relative;
    border-collapse: collapse;
}

.white-theme-table th {
    vertical-align: top;
    font-family: proxima-nova-semibold;
    background: #F9F8F3;
    color: var(--black90);
    font-size: 16px;
    line-height: 20px;
    padding: 12px 8px;
    font-weight: 400;
}

.white-theme-table th:first-child {
    border-radius: 4px 0px 0px 4px;
}

.white-theme-table th:last-child {
    border-radius: 0px 4px 4px 0px;
}

.white-theme-table td {
    color: var(--black90);
    font-size: 14px;
    line-height: 16px;
    padding: 15px 8px;
    vertical-align: middle;
}

.white-theme-table tr td:last-child,
.white-theme-table tr th:last-child {
    padding-right: 0px
}

.white-theme-table .caption {
    font-size: 14px;
    line-height: 18px;
    /* border-top: 1px solid #DDDDDD; */
    padding-top: 12px;
    color: var(--black60);
}

.icon-theme-table .col-icon {
    width: 40px;
    height: 40px;
    min-width: 40px
}

.icon-theme-table td {
    border-bottom: 1px solid #EAEAEA;
}

.icon-theme-table tr:last-child td {
    border-bottom: 0px;
    /* padding-bottom: 0px */
}

.clickable-row td {
    cursor: pointer;
}

@media (min-width:1024px) {
    .whitespace {
        white-space: nowrap;
    }

    /*Green Dots*/
    .green-prop .white-theme-table:after {
        z-index: -1;
        background: url(../../images/calculator/green-prop.svg);
        width: 98px;
        height: 98px;
        bottom: -50px;
        right: -50px;
        position: absolute;
        background-repeat: no-repeat;
        background-size: 100% auto;
        content: '';
    }
}

@media (min-width:992px) {

    .white-theme-table tr th:first-child,
    .white-theme-table tr td:first-child {
        padding-left: 16px
    }

    .icon-theme-table.white-theme-table tr th:first-child,
    .icon-theme-table.white-theme-table tr td:first-child {
        padding-left: 0px;
        padding-right: 0px
    }

    .icon-theme-table.white-theme-table tr th:first-child {
        padding-left: 14px;
    }
}

@media (max-width:968px) {
    .white-theme-table th {
        font-size: 14px;
        line-height: 18px;
    }
}

@media (max-width:991px) {
    .whitespace-sm {
        white-space: nowrap;
    }

    .white-theme-table {
        padding: 14px 15px 12px
    }

    .white-theme-table tr th {
        padding: 8px 7px
    }

    .white-theme-table tr td {
        padding: 15px 7px
    }

    .white-theme-table tr th,
    .white-theme-table tr td {
        vertical-align: top;
        font-size: 12px;
        line-height: 16px;
    }

    .white-theme-table tr td .cta {
        background: transparent;
        padding: 5px;
        line-height: 5px;
        border: 0px;
        overflow: hidden;
        text-indent: -99999px;
        min-width: 14px;
        position: relative;
    }

    .white-theme-table tr td .cta:hover {
        background: transparent;
    }

    .white-theme-table tr td .cta:after {
        border: 1px solid var(--primary-green);
        border-width: 0 1px 1px 0;
        display: inline-block;
        padding: 3px;
        content: '';
        position: absolute;
        right: 7px;
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        top: 40%
    }

    .white-theme-table .caption {
        margin: 0px 8px;
        font-size: 12px;
        line-height: 14px;
        padding-bottom: 10px;
    }
}

/*----------- Grey Theme Table -----------*/
.grey-theme-table .custom-table {
    width: 100%;
    border-collapse: collapse;
    text-align: left;
}

.grey-theme-table {
    width: 100%;
    border-radius: 8px;
    margin: 20px auto;
    border: 1px solid #DDDDDD;
}

.grey-theme-table thead {
    background: #DDDDDD;
}

.grey-theme-table th {
    font-family: proxima-nova-semibold;
    color: var(--black90);
    font-size: 16px;
    line-height: 20px;
    padding: 8px 22px;
    vertical-align: middle;
}

.grey-theme-table td {
    font-size: 16px;
    line-height: 20px;
    padding: 8px 22px;
    vertical-align: top;
    border-bottom: 1px solid #DDDDDD;
    border-right: 1px solid #DDDDDD
}

.grey-theme-table tr td:last-child {
    border-right: 0px
}

.grey-theme-table tr:last-child td {
    border-bottom: 0px;
}

.grey-theme-table .tfooter td {
    font-weight: 600
}

.grey-theme-table .center-table th,
.grey-theme-table .center-table td {
    text-align: center;
}

@media (max-width:991px) {

    .grey-theme-table th,
    .grey-theme-table td {
        font-size: 12px;
        line-height: 16px;
    }

    .grey-theme-table {
        overflow-x: auto;
    }
}

/*Calculator Output box*/
.calci-result__panel {
    padding-top: 38px
}

.calci-output__row {
    padding: 20px 0px;
    border-bottom: 1px dashed var(--black10);
    display: flex;
    justify-content: space-between;
    flex-direction: row;
}

.calci-output__row:last-child {
    border-bottom: 0px
}

.calci-output__row .output-property_name {
    font-size: 16px;
    line-height: 20px;
    color: var(--black40);
}

.calci-output__row .output-property_value {
    font-size: 18px;
    line-height: 22px;
    color: var(--black90);
    font-family: 'cabinet-grotesk-bold';
    text-align: right;
}

@media (max-width:991px) {
    .calci-result__panel {
        padding-top: 8px;
    }

    .calci-output__row {
        padding: 18px 20px 16px;
    }

    .calci-output__row .output-property_name {
        font-size: 14px;
        line-height: 18px;
    }

    .calci-output__row .output-property_value {
        font-size: 16px;
        line-height: 20px;
    }
}

/*----------- Main Sections -----------*/
.section {
    padding-top: 55px;
    padding-bottom: 55px;
}

.pro-calculator .section:nth-of-type(1) {
    padding-top: 80px;
}

.main-highlights {
    max-width: 355px;
    margin-bottom: 20px
}

.center-highlights {
    max-width: 640px;
    text-align: center;
    margin: 0px auto 40px
}

@media (max-width:968px) {
    .section {
        padding-top: 35px;
        padding-bottom: 35px;
    }
}

@media (max-width:991px) {
    .pro-calculator .section:nth-of-type(1) {
        padding-top: 56px
    }

    .section {
        padding-top: 22px;
        padding-bottom: 32px;
    }

    .main-highlights {
        max-width: 100%;
    }

    .center-highlights {
        margin-bottom: 20px
    }

    .main-highlights p:last-child {
        margin-bottom: 0px
    }
}

/*Offer Card*/
.onpage-offer-card {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    max-width: 562px;
    width: 100%;
    padding: 18px 20px;
    -webkit-box-align: flex-start;
    -ms-flex-align: flex-start;
    align-items: flex-start;
}

.onpage-offer-card .card-icon {
    /*background: #E2E7F3;*/
    min-width: 40px;
    max-width: 40px;
    height: 40px;
    border-radius: 4px;
}

.onpage-offer-card .card-body {
    position: relative;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    width: 100%;
}

.onpage-offer-card .card-titles {
    padding-left: 15px
}

.onpage-offer-card .card-body h3 {
    color: var(--black90);
    font-family: proxima-nova-bold;
    font-size: 20px;
    line-height: 24px;
    font-family: 'cabinet-grotesk-bold';
    margin: 0px 0px 5px
}

.onpage-offer-card .card-body p {
    margin-bottom: 0px;
    font-size: 16px;
    line-height: 20px;
}

.dark-offer-card .card-body h3,
.dark-offer-card .card-body p {
    color: var(--white-color);
}

@media (max-width:968px) {
    .onpage-offer-card .cta {
        font-size: 12px;
        line-height: 24px;
        padding: 4px 6px;
    }
}

@media (min-width:992px) {
    .mf-offer-card {
        bottom: 32px !important;
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
    }

    .mf-offer-card .card-body {
        padding-bottom: 38px;
    }

    .mf-offer-card .cta {
        width: 132px;
        top: 3px;
        position: relative;
    }

    .onpage-offer-card .seperator-grey {
        width: 97%;
        position: absolute;
        padding-top: 10px;
        border-top: 1px solid #DDDDDD;
        margin-top: 10px;
    }
}

@media (max-width:991px) {
    .onpage-offer-card {
        -webkit-box-align: start;
        -ms-flex-align: start;
        align-items: flex-start;
        padding: 12px 12px 18px;
    }

    .onpage-offer-card .card-titles {
        padding-left: 0px
    }

    .onpage-offer-card .card-body {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        padding: 0px 0px 0px 12px
    }

    .onpage-offer-card .card-body h3 {
        font-size: 16px;
        line-height: 20px;
    }

    .onpage-offer-card .card-body p {
        font-size: 12px;
        line-height: 16px;
        margin-bottom: 12px !important
    }

    .onpage-offer-card .card-body .cta {
        max-width: 150px;
        position: relative;
        font-size: 14px;
        line-height: 18px;
        padding: 8px 40px 8px 10px;
        text-align: left;
    }

    .onpage-offer-card .card-body .cta:after {
        border: 1px solid var(--white-color);
        border-width: 0 1px 1px 0;
        display: inline-block;
        padding: 4px;
        content: '';
        position: absolute;
        right: 16px;
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        top: 40%;
    }

    .onpage-offer-card .card-body .cta-xs {
        max-width: 125px
    }

    .mf-offer-card .green-ribbon {
        position: absolute;
        right: -12px;
        top: 1px;
    }
}

.shake-prop {
    -webkit-animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
    animation: shake 0.82s cubic-bezier(.36, .07, .19, .97) both;
    -webkit-transform: translate3d(0, 0, 0);
    transform: translate3d(0, 0, 0);
    -webkit-backface-visibility: hidden;
    backface-visibility: hidden;
    -webkit-perspective: 1000px;
    perspective: 1000px;
}

@keyframes shake {

    10%,
    90% {
        -webkit-transform: translate3d(-1px, 0, 0);
        transform: translate3d(-1px, 0, 0);
    }

    20%,
    80% {
        -webkit-transform: translate3d(2px, 0, 0);
        transform: translate3d(2px, 0, 0);
    }

    30%,
    50%,
    70% {
        -webkit-transform: translate3d(-4px, 0, 0);
        transform: translate3d(-4px, 0, 0);
    }

    40%,
    60% {
        -webkit-transform: translate3d(4px, 0, 0);
        transform: translate3d(4px, 0, 0);
    }
}

/*Helping Info card*/
.helping-info {
    border-top: 1px solid #DDDDDD;
    padding: 15px 0px;
    margin-top: 15px;
}

.helping-info .main {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

.helping-info .helping-icon {
    height: 20px;
    min-width: 20px;
    margin-right: 12px;
    position: relative;
}

.helping-info .helping-icon:before {
    content: '\e945';
    font-size: 20px;
    line-height: 20px;
    color: var(--primary-green);
    font-family: 'etm-project-icons';
}

.info-theme-grey .helping-body {
    color: var(--black60);
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 0px;
}

@media (max-width:968px) {
    .helping-info {
        padding: 10px 0px;
        width: 100%;
        margin-top: 6px;
    }

    .helping-info .helping-body {
        font-size: 12px;
        line-height: 16px;
    }
}

@media (max-width:991px) {
    .info-theme-grey .helping-body {
        color: var(--black60);
        font-size: 12px;
        line-height: 18px;
    }

    .info-theme-grey {
        border-bottom: 1px solid #DDDDDD;
    }
}

/*Green Ribbon*/
.green-ribbon {
    position: relative;
    background: #03D000;
    color: var(--white-color);
    font-family: proxima-nova-semibold;
    font-size: 14px;
    line-height: 14px;
    text-transform: uppercase;
    padding: 3px 5px 3px 4px;
    display: inline-block;
}

.green-ribbon.right-rib:after {
    content: "";
    position: absolute;
    display: block;
    border: 10px solid #04d002;
    right: -11px;
    top: 0px;
    border-left-width: 4px;
    border-right-color: transparent;
    border-radius: 3px;
}

.green-ribbon.left-rib:before,
.green-ribbon.xs-left-rib:before {
    content: "";
    position: absolute;
    display: block;
    border: 10px solid #04d002;
    left: -11px;
    top: 0px;
    border-right-width: 4px;
    border-left-color: transparent;
    border-radius: 3px;
}

.green-ribbon.xs-left-rib:before {
    display: none;
}

@media (max-width:991px) {
    .green-ribbon {
        font-size: 12px;
        line-height: 12px;
    }

    .green-ribbon.right-rib:after {
        border: 9px solid #04d002;
        border-right-color: transparent;
        right: -15px;
    }

    .green-ribbon.left-rib:before,
    .green-ribbon.xs-left-rib:before {
        display: block;
        border: 9px solid #04d002;
        border-left-color: transparent;
        left: -15px;
    }

    .green-ribbon.xs-left-rib:after {
        display: none;
    }
}

/*******Calculator style Start*********/

/*----------- Calculator Content & Form CSS -----------*/

.calculator-form .form-group {
    margin-bottom: 25px;
    width: 100%
}

.calci-amount {
    font-size: 12px;
    line-height: 14px;
    color: var(--black60);
    display: block;
    height: 22px
}

.calculator-form .row-flex {
    -webkit-box-align: start;
    -ms-flex-align: start;
    align-items: flex-start;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.sec-calculator .main-content {
    padding-bottom: 16px;
}

.cal-tax-exemption {
    padding: 24px 12px 25px;
    position: relative;
    z-index: 9;
}

.tax-form-heading {
    margin-bottom: 10px;
}

.tax-form-heading .switch-time {
    height: 29px;
    border: 1px solid #DDDDDD;
    border-radius: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 3px;
    margin: 0px;
    width: 205px
}

.tax-form-heading .switch-time li {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 16px;
    font-size: 15px;
    line-height: 19px;
    color: var(--black60);
    text-align: center;
    font-weight: 300;
    height: 23px;
    cursor: pointer;
    padding: 2px 10px;
}

.tax-form-heading .switch-time li.active {
    background: var(--primary-green);
    color: var(--white-color);
}

.error-msg {
    color: var(--red-color);
    position: relative;
    padding-left: 20px;
    font-size: 12px;
    line-height: 14px;
    display: block;
}

.error-msg:before {
    content: '\e947';
    font-family: 'etm-project-icons';
    position: absolute;
    left: 1px;
    top: 1px;
    height: 12px;
    width: 12px;
    background-size: 100%;
}

/*----------- New Calculator Content & Form CSS -----------*/
.cali-form__heading {
    padding-bottom: 15px
}

.calci-label__elements {
    display: flex;
    align-items: center;
    justify-content: space-between;
    position: relative;
}

.calci-label__elements .calci-input-ctrl,
.calci-label__elements .calci-num-ctrl {
    min-height: auto;
    width: 115px;
    margin-bottom: 0px
}

.calci-label__elements .form-ctrl {
    -webkit-appearance: none;
    border-radius: 0;
    font-size: 18px;
    line-height: 22px;
    padding-bottom: 4px;
    font-family: 'cabinet-grotesk-bold';
}

.calci-label__elements .small-dropdown .dropdown-select {
    top: 27px;
}

.calci-label__elements .small-dropdown .dropdown-arrow {
    top: 6px;
}

.calci-label__elements .small-dropdown .dropdown-select li {
    padding: 10px 12px;
}

.calci-label__elements .selected_input {
    padding-right: 20px
}

.calculator-form .calci-label__elements .input-prop {
    font-family: 'cabinet-grotesk-bold';
    font-size: 18px;
    line-height: 22px;
    color: var(--black90);
    display: inline-block;
}

.calculator-form .calci-label__elements .suffix-year .form-ctrl {
    padding-right: 40px
}

.calculator-form .calci-label__elements .input-prop.year {
    left: auto !important;
    right: 0px;
}

.calculator-form .calci-label__elements #extraInterestProp {
    right: 4px;
    left: auto;
}

.calci-input__elements {
    margin-bottom: 8px
}

.calci-input__elements .slidecontainer {
    padding: 20px 0px 12px 0px
}

.calci-input__elements .form-ctrl {
    font-family: 'cabinet-grotesk-bold';
    padding: 6px 0px;
    font-size: 18px;
    line-height: 22px;
}

.calci-main__container .calci-label {
    font-weight: normal;
    font-size: 16px;
    line-height: 20px;
}

.calci-main__container .large-field {
    width: 144px;
    margin-bottom: 0px;
}

.calci-main__container .medium-field {
    width: 70px;
    margin-bottom: 0px;
}

.calci-main__container .small-field {
    width: 52px;
    margin-bottom: 0px;
}

.calci-main__container .senior-citizen-ctrl {
    width: 95px;
}

.calci-main__container .calci-input-ctrl.prefix-rupee:before {
    content: "\20B9";
    font-family: 'cabinet-grotesk-bold';
    font-size: 18px;
    line-height: 22px;
    color: var(--black90);
    display: flex;
    align-items: center;
    padding-bottom: 4px;
    height: 27px;
}

.calci-main__container .calci-input-ctrl .form-ctrl {
    -webkit-appearance: none;
    border-radius: 0;
    font-size: 18px;
    line-height: 22px;
    padding-bottom: 4px;
    font-family: 'cabinet-grotesk-bold';
}

.calci-main__container .calci-input-ctrl.suffix-percent .form-ctrl {
    padding-right: 14px;
    padding-left: 0px;
}

.calci-main__container .calci-input-ctrl.suffix-percent:before {
    display: none;
}

.calci-main__container .calculator-form .input-prop.percentage {
    font-family: 'cabinet-grotesk-bold';
    font-size: 18px;
    line-height: 22px;
    left: auto !important;
    right: 0px;
}

.calci-main__container .form-group .focused-br {
    position: absolute;
    left: 50%;
    width: 0;
    height: 1px;
    background-color: var(--primary-green);
    transition: .4s;
    bottom: 0;
}

.calci-main__container .form-group .active-in .focused-br {
    width: 100%;
    transition: .4s;
    left: 0;
}

.calci-label.tooltip-label .label-tooltip__info {
    top: 1px;
    height: 20px;
    width: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.calci-label.tooltip-label .label-tooltip__info:after {
    background: transparent;
    content: '\e947';
    right: 0px;
    top: 0px;
    font-family: 'etm-project-icons';
    font-size: 14px;
    line-height: 20px;
    padding: 0px;
    position: relative;
    display: inline-block;
    width: auto;
    height: auto;
    color: var(--black40);
}

.calci-label__elements .cl-error_info {
    display: none;
    position: absolute;
    left: -22px;
    font-size: 16px;
    line-height: 20px;
    padding: 0px;
    height: 28px;
    width: 20px;
    top: 0px;
}

.calci-label__elements .error-in .cl-error_info {
    display: inline-block;
}

.calci-label__elements .cl-error_info+.tooltip>.tooltip-inner {
    background-color: var(--white-color);
    padding: 3px 8px;
    color: var(--red-color);
    max-width: 200px !important;
    min-width: 130px !important;
    border-radius: 4px;
    opacity: 1;
    box-shadow: 0 2px 8px #e3e3e3;
    text-align: left;
}

.calci-label__elements .cl-error_info+.tooltip>.tooltip-arrow {
    border-top-color: var(--white-color);
}

.calci-main__container .calci-label__elements .error-in .focused-br {
    background-color: var(--red-color) !important
}

.calci-main__container .calci-label__elements .error-in .form-ctrl {
    border-bottom-color: var(--red-color) !important
}

.calci-main__container .input-prop #extraInterestProp {
    font-size: 14px;
    line-height: 18px
}

.calci-main__container .calculation-content .light-label {
    font-size: 14px
}

.calci-main__container .post-tax-switch {
    display: flex;
    align-items: center;
}

.calci-main__container .input-helping__info {
    background: #F1FFF0;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 14px;
    line-height: 18px;
    margin-top: 9px;
}

.calci-main__container .calci-input-ctrl.no-prefix .form-ctrl {
    padding-left: 0px
}

.calci-main__container .calci-input-ctrl.no-prefix:before {
    display: none;
}

.calci-main__container .full-width__input .input-prop.percentage {
    top: 6px;
}

.calci-main__container .suffix-percent .form-ctrl,
.calci-main__container .prefix-year .form-ctrl {
    text-align: right;
}

@media (min-width:992px) {
    .calci-main__container .compound-interval-control.interest-tenure {
        margin-top: 14px
    }
}

@media (max-width:1024px) {
    .calci-main__container .calci-label {
        font-size: 14px;
        line-height: 18px
    }

    .calci-label.tooltip-label .label-tooltip__info {
        line-height: 18px;
        height: 18px;
    }

}

@media (min-width:991px) and (max-width:1024px) {
    .calci-main__container .cal-tax-exemption {
        padding: 20px 0px 25px
    }

    .calci-main__container .calculation-result .result-col__right {
        padding-left: 20px;
    }
}

@media (max-width:991px) {

    .calci-main__container .calci-input-ctrl.prefix-rupee:before,
    .calci-main__container .calci-label__elements .input-prop {
        font-size: 14px !important;
        line-height: 18px !important;
        height: 23px;
        padding-bottom: 3px
    }

    .calci-main__container .calci-input-ctrl .form-ctrl {
        padding-left: 9px;
    }

    .calci-main__container .calci-label__elements .form-ctrl,
    .sec-emi-calculator .form-group .form-ctrl {
        background: var(--white-color);
        font-size: 14px;
        line-height: 18px
    }

    .calci-main__container .small-field.no-rupee .form-ctrl {
        padding-left: 0px;
    }

    .calci-label__elements .small-dropdown .dropdown-select {
        top: 24px;
    }

    .calci-label__elements .small-dropdown .dropdown-select li {
        padding: 8px 12px;
        font-size: 14px;
        line-height: 18px;
    }

    .calci-label__elements .dropdown-wrap .dropdown-arrow:after {
        padding: 3px;
    }

    .calci-main__container .calci-input__elements {
        padding-top: 10px;
        padding-bottom: 8px;
        margin-bottom: 0px;
    }

    .calci-main__container .calci-input__elements.full-width__input {
        padding: 0px
    }

    .calci-main__container .calci-input__elements .slidecontainer {
        padding: 10px 0px 10px 0px;
    }

    .calci-main__container.compound-cal .calci-num-ctrl {
        margin-bottom: 8px !important
    }

    .calci-main__container .calculator-form .form-group {
        padding-top: 8px;
        padding-bottom: 8px;
        margin: 0px !important;
    }

    .calci-main__container .full-width__input .input-prop.percentage {
        top: 8px;
    }

    .fd-cal.calci-main__container .interest-tenure {
        margin-bottom: 5px
    }

    .calci-main__container .input-prop #extraInterestProp {
        right: 14px;
        position: absolute;
    }

    .calci-main__container .interest-tenure {
        margin-bottom: 8px
    }

    .calci-main__container .medium-field {
        width: 60px;
    }

    .calci-main__container .large-field {
        width: 100px;
    }
}




/*Calculation Result*/
.calculation-content {
    position: relative;
    -webkit-box-shadow: 0px 0px 2px #DDDDDD;
    box-shadow: 0px 0px 2px #DDDDDD;
    border-radius: 8px;
}

.calculation-result {
    padding: 25px 28px;
}

.calculation-result .graphic-content .graph-title {
    font-size: 18px;
    line-height: 17px;
    font-weight: 400;
    margin: 0px 0px 15px
}

.calculation-result .graphic-content .graphic-body {
    position: relative;
    margin-top: 22px;
}

.calculation-result .main-heading {
    margin-bottom: 30px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
}

.calculation-content .light-label {
    font-size: 16px;
    line-height: 16px;
    color: var(--black60);
    margin-right: 8px;
}

.calculation-result .main-body {
    max-width: 532px;
    margin-right: 0px;
    margin-left: auto;
}

.calculation-result .percent-values {
    width: 249px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin: 0px;
}

.calculation-result .percent-values li {
    font-size: 14px;
    line-height: 18px;
    color: var(--black60);
    padding: 3px 6px;
    border: 1px solid #DDDDDD;
    border-right-width: 0px;
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    text-align: center;
    cursor: pointer;
}

.calculation-result .percent-values li:first-child {
    border-radius: 15px 0px 0px 15px;
}

.calculation-result .percent-values li:last-child {
    border-radius: 0px 15px 15px 0px;
    border-right-width: 1px;
}

.calculation-result .percent-values li.active,
.calculation-result .percent-values li:hover {
    background: var(--primary-green);
    color: var(--white-color);
    border-color: var(--primary-green);
}

.no-bordered-table {
    width: 100%;
    table-layout: fixed;
}

.no-bordered-table th {
    color: var(--black60);
    font-size: 18px;
    line-height: 16px;
    font-weight: 400;
    padding: 8px
}

.no-bordered-table td {
    color: var(--black90);
    font-size: 22px;
    line-height: 18px;
    font-family: proxima-nova-semibold;
    padding: 8px
}

.calculation-content.overlay {
    position: relative;
}

.calculation-content.overlay:before {
    z-index: 999;
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(255, 255, 255, 0.6);
    left: 0px;
    right: 0px
}

.calculation-result .graphic-body span {
    font-size: 14px;
    line-height: 16px;
}

.calculation-result .about-chart {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    padding-top: 15px;
}

.calculation-result .about-chart .color-dot {
    position: relative;
    padding: 0px 20px;
    max-width: 145px
}

.calculation-result .about-chart .color-dot:before {
    width: 12px;
    height: 12px;
    content: '';
    display: inline-block;
    position: absolute;
    border-radius: 100%;
    left: 0px;
    top: 2px;
}

.calculation-result .about-chart .extempted:before {
    background: #D4DFF7
}

.calculation-result .about-chart .taxable:before {
    background: #6880C8
}

.calculation-result .about-chart .color-rect {
    position: relative;
    padding: 0px 20px 0px 37px
}

.calculation-result .about-chart .color-rect:before {
    width: 23px;
    height: 3px;
    content: '';
    display: inline-block;
    position: absolute;
    border-radius: 20px;
    left: 0px;
    bottom: 4px;
}

.calculation-result .about-chart .amt-invested:before {
    background: #6880C8;
}

.calculation-result .about-chart .amt-maturity:before {
    background: #FC8400;
}

.calculation-result .about-chart .amt-maturity {
    padding-right: 5px;
}

.calculation-result .graphic-body .left-up-arrow {
    position: absolute;
    left: 20px;
    display: inline-block;
}

.calculation-result .graphic-body .left-up-arrow:before {
    background: url(../../images/calculator/left-up-line.svg);
    background-size: 100%;
    width: 40px;
    height: 23px;
    content: '';
    display: inline-block;
    top: 30px;
    left: 50px;
    position: absolute
}

.calculation-result .chart-box {
    height: 222px;
    width: 100%
}

.calculation-result .graphic-body .right-up-arrow {
    position: absolute;
    right: 30px;
    display: inline-block;
}

.calculation-result .graphic-body .right-up-arrow:before {
    background: url(../../images/calculator/right-arrow-v2.svg);
    background-size: 100%;
    content: '';
    display: inline-block;
    top: 30px;
    right: 41px;
    position: absolute;
    width: 40px;
    height: 23px;
}

.calculation-result .graphic-body .grey-dot:after {
    width: 6px;
    height: 6px;
    content: '';
    display: inline-block;
    background: var(--black60);
    border-radius: 100%;
    position: absolute;
    top: 24px;
}

.calculation-result .graphic-body .left-up-arrow:after {
    left: 49px;
}

.calculation-result .graphic-body .right-up-arrow:after {
    left: 54px;
}

.label-tooltip {
    position: absolute;
    right: 0px;
    width: 16px;
    height: 16px;
    display: inline-block;
    z-index: 98;
    cursor: pointer;
    top: 0px;
}

.tooltip-inner {
    max-width: 300px !important;
    min-width: 200px !important;
}

.calculation-result .no-bordered-table tr td:first-child,
.calculation-result .no-bordered-table tr th:first-child {
    padding-left: 0px
}

.calculation-result .no-bordered-table tr td:last-child,
.calculation-result .no-bordered-table tr th:last-child {
    padding-right: 0px
}

@media (min-width:992px) {
    .calculator-form .calci-button-ctrl {
        margin-top: 20px;
    }

    .calculation-content .onpage-offer-card {
        position: absolute;
        right: 0px;
        bottom: 40px;
        border-radius: 8px 0px 0px 8px
    }

    .sec-calculator .main-content {
        border: 1px solid #DDDDDD;
        border-radius: 8px;
    }

    .calculator-form .row-flex:last-child .form-group {
        margin-bottom: 0px
    }

    .calculator-form .cta {
        max-width: 180px
    }

    .sec-other-calculator .calculator-form .calci-button-ctrl {
        text-align: right;
    }

    .sec-other-calculator .calculation-result .about-chart {
        margin-left: 9%;
        padding-top: 20px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }
}

@media (max-width:1200px) {
    .calculation-result .graphic-body .left-up-arrow {
        left: 20px;
    }

    .calculation-result .graphic-body .right-up-arrow {
        right: 20px
    }
}

.calci-switch {
    vertical-align: middle;
}

@media (max-width:991px) {
    .sec-calculator .main-content {
        margin: 0px 10px;
    }

    .calculation-content .light-label {
        font-size: 14px;
    }

    .calculation-result .main-heading {
        margin-bottom: 20px;
    }

    .calculation-content .onpage-offer-card {
        padding-bottom: 18px;
        max-width: 400px;
        bottom: 0px;
    }

    .calculation-content .onpage-offer-card .card-icon {
        min-width: 40px;
        max-width: 40px;
        height: 40px;
    }

    .calculation-content .onpage-offer-card .card-body h3 {
        font-size: 16px;
        line-height: 19px;
    }

    .calculation-content .onpage-offer-card .card-body p {
        font-size: 12px;
        line-height: 16px;
        margin-bottom: 0px;
    }

    .calculation-result .main-body {
        max-width: 350px;
    }

    .calculation-result .no-bordered-table th,
    .calculation-result .no-bordered-table td {
        padding: 5px 8px;
        font-size: 14px;
        line-height: 16px;
    }

    .calculation-result .chart-box {
        height: 140px;
        width: 280px;
        margin: 0px auto
    }

    .calculation-result .graphic-content .graphic-body {
        max-width: 300px;
        margin: 20px auto 0px
    }

    .calculation-result .graphic-body span {
        font-size: 12px
    }

    .calculation-result .graphic-body .right-up-arrow,
    .calculation-result .graphic-body .left-up-arrow {
        top: 0px !important;
    }

    .calculation-result .graphic-body .left-up-arrow:before {
        left: 30px;
        width: 30px;
        height: 18px;
        top: 22px;
    }

    .calculation-result .graphic-body .left-up-arrow:after {
        left: 28px;
    }

    .calculation-result .graphic-body .right-up-arrow:before {
        top: 22px;
        right: 30px;
        width: 30px;
        height: 18px;
    }

    .calculation-result .graphic-body .right-up-arrow:after {
        left: 49px;
    }

    .calculation-result .graphic-body .grey-dot:after {
        top: 18px
    }

    .sec-calculator {
        padding-bottom: 0px
    }
}

@media (max-width:991px) {
    .sec-calculator .main-content {
        margin: 0px;
    }

    .cal-tax-exemption {
        padding: 0px;
    }

    .calculation-result {
        padding: 15px 0px 28px 0 !important;
    }

    .sec-calculator .row-flex {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .calculation-result .row-flex {
        -webkit-box-orient: vertical;
        -webkit-box-direction: reverse;
        -ms-flex-direction: column-reverse;
        flex-direction: column-reverse;
    }

    .calculation-result .main-heading {
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
    }

    .calculation-result .light-label {
        font-size: 14px;
        line-height: 17px;
        margin-right: 0px;
        color: var(--black90);
        margin-bottom: 12px;
    }

    .no-bordered-table th {
        font-size: 12px;
        padding: 6px 3px
    }

    .no-bordered-table td {
        font-size: 13px;
        padding: 6px 3px
    }

    .tax-form-heading .switch-time {
        width: 197px;
        margin-top: 10px
    }

    .tax-form-heading .switch-time li {
        font-size: 14px;
        line-height: 18px;
    }

    .tax-form-heading {
        margin-bottom: 16px;
    }

    .calculation-result .chart-box {
        height: 140px;
    }

    .calculation-result .graphic-content .graphic-body {
        max-width: 300px;
    }

    .calculation-result .graphic-body span {
        font-size: 12px
    }

    .calculation-result .graphic-body .left-up-arrow:before {
        left: 30px;
        width: 30px;
        height: 18px;
        top: 22px;
    }

    .calculation-result .graphic-body .left-up-arrow:after {
        left: 28px;
    }

    .calculation-result .graphic-body .right-up-arrow:before {
        top: 22px;
        right: 30px
    }

    .calculation-result .graphic-body .right-up-arrow:after {
        left: 49px;
    }

    .calculation-result .graphic-body .grey-dot:after {
        top: 18px
    }

    .calculation-result .graphic-content h3 {
        font-size: 18px;
    }

    .calculation-content {
        box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
        -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
        overflow: hidden;
    }

    .calculation-content .onpage-offer-card {
        max-width: 100%;
    }

    .calculator-form .form-group {
        margin-bottom: 15px
    }

    .calculator-form .calci-button-ctrl .cta {
        max-width: 414px;
        display: block;
        margin: 0px auto
    }

    .calculation-result .main-body {
        margin-left: auto;
        margin-right: auto;
        max-width: 100%;
    }

    .calculator-form .city-group .calci-amount {
        display: none;
    }

    #exemptedHra {
        font-size: 14px
    }

    .calculation-result .no-bordered-table th {
        font-size: 12px;
        padding: 6px 3px
    }

    .calculation-result .no-bordered-table td {
        padding: 0px 3px 8px;
        font-size: 13px
    }

    .calculation-result .about-chart .color-rect:before {
        width: 14px
    }

    .calculation-result .about-chart .color-rect {
        padding-left: 23px
    }

    .calculation-result .percent-values {
        margin: 0px auto
    }

    .tooltip-inner {
        max-width: 200px !important;
        min-width: 160px !important;
    }
}

@media (max-width:359px) {
    .calculation-result .chart-box {
        height: 130px;
        width: 249px;
    }
}

/*-----------Calculator style End-----------*/

/*-----------Page Floating Navigation-----------*/

.floating-navigation {
    border: 0px !important;
    min-height: inherit !important;
    border-radius: 0px !important;
    display: block;
    position: relative !important;
    background: #F9F8F3;
    top: 0;
    left: 0;
    width: 100%;
    -webkit-box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
    box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
    margin-bottom: 0px !important
}

.floating-navigation.show-nav-header {
    top: 65px;
    z-index: 1;
    background: var(--white-color);
    position: fixed !important;
    -webkit-animation: smoothScrollF .6s forwards;
    animation: smoothScrollF .6s forwards;
}

@-webkit-keyframes smoothScrollF {
    0% {
        -webkit-transform: translateY(-40px);
        transform: translateY(-40px);
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}

@keyframes smoothScrollF {
    0% {
        -webkit-transform: translateY(-40px);
        transform: translateY(-40px);
    }

    100% {
        -webkit-transform: translateY(0px);
        transform: translateY(0px);
    }
}

.independence-nudge .floating-navigation.show-nav-header {
    top: 118px;
}

.floating-navigation .nav-list {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    margin: 0px;
    float: none !important;
}

.floating-navigation li a {
    outline: none !important;
    text-align: center;
    font-size: 16px;
    line-height: 20px;
    color: var(--black90);
    padding: 20px 14px !important;
    border-top: 0px;
    border-bottom: 3px solid transparent;
}

.floating-navigation .navbar-nav>li:hover a {
    color: var(--primary-green);
    background: #F9F8F3;
    border-bottom-color: #F9F8F3
}

.floating-navigation.show-nav-header .navbar-nav a.active,
.floating-navigation.show-nav-header .navbar-nav a:hover {
    color: var(--primary-green);
    background: var(--white-color);
    border-bottom-color: var(--primary-green);
}

.floating-navigation .nav>li>a:focus {
    background: inherit;
}

@media (max-width:1300px) {
    .floating-navigation li a {
        font-size: 13px;
        line-height: 17px !important;
        padding: 20px 8px !important;
    }
}

/*-----------Blue Highlights Section-----------*/
.sec-highlights {
    position: relative;
}

.sec-highlights:before {
    /* height: 250px; */
    min-height: 250px;
    max-height: 300px;
    background: #6880C8;
    content: '';
    width: 100%;
    display: block;
    left: 0px;
    top: 0px;
    position: absolute;
    z-index: -1;
}

.sec-highlights .white-theme-table .caption {
    margin-left: 15px
}

.sec-highlights .main-highlights h2,
.sec-highlights .main-highlights p {
    color: var(--white-color);
}

/*.sec-highlights .white-theme-table tr td:nth-child(2), .sec-highlights .white-theme-table tr td:nth-child(3) { text-align: center; }*/
@media (max-width:991px) {
    .sec-highlights {
        padding-top: 15px;
        padding-bottom: 15px;
    }

    .sec-highlights:before {
        height: 100%
    }

    .sec-highlights .row-inner {
        padding-left: 8px;
        padding-right: 8px;
    }

    .sec-highlights .main-highlights {
        text-align: center;
        padding: 0px;
        margin-left: auto;
        margin-right: auto
    }

    .sec-highlights .section-title-sm {
        margin-bottom: 12px
    }

    .sec-highlights .white-theme-table tr td:nth-child(2),
    .sec-highlights .white-theme-table tr td:nth-child(3) {
        text-align: left;
    }
}

/*----------- Benifits Section -----------*/
.sec-benefits .benefits-content ul {
    margin-bottom: 20px
}

.sec-benefits .calculator-graphic {
    height: 400px
}

.sec-benefits .calculator-graphic img {
    max-width: 375px;
}

@media (max-width:968px) {
    .sec-benefits .calculator-graphic img {
        max-width: 280px
    }
}

@media (max-width:991px) {
    .sec-benefits .section-title-md {
        text-align: center;
    }

    .sec-benefits .benefits-content li {
        font-size: 12px;
        line-height: 16px;
    }

    .sec-benefits .cta {
        margin: 0px auto;
        display: block;
        max-width: 414px;
    }

    .sec-benefits .calculator-graphic {
        height: 260px;
        text-align: center;
        padding: 10px 0px 30px
    }

    .sec-benefits .calculator-graphic img {
        max-width: 258px;
    }
}

/*----------- Qutesion Answere Section -----------*/
.sec-ques-ans .sidebar-navigation {
    position: sticky;
    position: -webkit-sticky;
    top: 80px
}

.sec-ques-ans .questions-menu {
    margin-bottom: 20px
}

.sec-ques-ans .questions-menu li {
    max-width: 340px;
    border-right: 1px solid #DDDDDD;
    position: relative;
    -webkit-transition: all 200ms ease !important;
    -o-transition: all 200ms ease !important;
    transition: all 200ms ease !important;
}

.sec-ques-ans .questions-menu li a {
    font-size: 18px;
    line-height: 22px;
    color: var(--black90);
    padding: 15px 10px 15px 0px;
    max-width: 320px;
    display: block;
    font-family: proxima-nova-semibold;
}

.sec-ques-ans .questions-menu li.active:after {
    width: 4px;
    height: 100%;
    content: '';
    background: var(--primary-green);
    right: -2px;
    position: absolute;
    top: 0px;
}

.sec-ques-ans .ans-card .acc-title {
    display: block;
    position: relative;
    font-size: 20px;
    line-height: 24px;
    color: var(--black90);
    font-family: 'cabinet-grotesk-bold';
    margin: 0px 0px 10px;
}

.sec-ques-ans .ans-card p,
.sec-ques-ans .ans-card li {
    font-size: 15px;
    line-height: 19px;
}

.sec-ques-ans .ans-card h2 {
    margin: 0px;
}

.misc-navigation {
    max-width: 320px;
}

.misc-navigation .misc-tab-panel {
    margin-bottom: 2px
}

.misc-navigation .misc-title {
    color: var(--black90) !important;
    display: block;
    background: var(--white-color);
    border-radius: 4px;
    font-family: 'cabinet-grotesk-bold';
    font-size: 16px;
    line-height: 20px;
    padding: 12px 32px 12px 18px;
    margin: 0px;
    position: relative;
}

.misc-navigation .misc-title:after {
    border: 1px solid var(--black60);
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 3px;
    content: '';
    position: absolute;
    right: 13px;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    top: 38%;
}

.misc-navigation .misc-title[aria-expanded="true"]:after {
    -ms-transform: rotate(-135deg) !important;
    transform: rotate(-135deg) !important;
    -webkit-transform: rotate(-135deg) !important;
}

.misc-navigation .misc-content {
    background: #F9F8F3;
    padding: 5px 0px;
}

.misc-navigation .misc-content ul {
    margin: 10px 18px 0px;
    padding: 0px;
    list-style: none;
}

.misc-navigation .misc-content ul li {
    margin-bottom: 10px
}

.misc-navigation .misc-content ul a {
    font-size: 14px;
    line-height: 18px;
    text-decoration: none;
    color: var(--primary-green);
}

.sec-ques-ans .ans-card p {
    margin-bottom: 10px
}

@media (min-width:992px) {
    .main-ques-ans {
        padding-top: 35px
    }

    .sec-ques-ans .answer-contents .collapse,
    .sec-ques-ans .answer-contents .collapse.in {
        display: block !important;
        height: inherit !important;
    }

    .sec-ques-ans .answer-contents .ans-title {
        pointer-events: none;
    }

    .sec-ques-ans .ans-card {
        margin-bottom: 32px
    }
}

@media (max-width:991px) {
    .sec-ques-ans .answer-contents {
        padding-top: 10px
    }

    .sec-ques-ans .ans-card {
        border: 1px solid #DDDDDD;
        border-top: 0px
    }

    .sec-ques-ans .ans-card:first-child {
        border-top: 1px solid #DDDDDD
    }

    .sec-ques-ans .ans-card .acc-title {
        margin: 0px;
        font-size: 16px;
        line-height: 20px;
        color: var(--primary-green);
        padding: 16px 40px 14px 16px
    }

    .sec-ques-ans .ans-card .acc-title .arrow-down:after {
        border-color: var(--primary-green);
    }

    .sec-ques-ans .ans-card .main-panel {
        margin: 0px 16px 16px
    }

    .sec-ques-ans .ans-card .main-panel:before,
    .sec-ques-ans .ans-card .main-panel:after {
        display: table;
        content: " ";
    }

    .sec-ques-ans .ans-card p,
    .sec-ques-ans .grey-listing li {
        font-size: 14px;
        line-height: 18px;
    }

    .sec-ques-ans .ans-card p:last-child {
        margin-bottom: 0px
    }

    .sec-ques-ans .main-ques-ans {
        flex-direction: column-reverse;
    }

    .misc-navigation {
        max-width: 100%;
    }

    .misc-navigation .misc-tab-panel:first-child {
        max-width: 100%;
        padding-bottom: 0px;
        margin-top: 32px;
        padding-top: 32px;
        position: relative;
    }

    .misc-navigation .misc-tab-panel:first-child:before {
        border-top: 1px solid #DDDDDD;
        position: absolute;
        content: '';
        width: 120%;
        height: 2px;
        left: -20px;
        right: 0px;
        top: 0px;
    }

    .sec-ques-ans {
        overflow-x: hidden;
    }
}

/*-----------  Accordion -----------*/
@media (min-width:992px) {

    .desktop-disabled-acc .collapse,
    .desktop-disabled-acc .collapse.in {
        display: block !important;
        height: inherit !important;
    }

    .desktop-disabled-acc .acc-title {
        pointer-events: none;
    }

    .desktop-disabled-acc .arrow-down {
        display: none !important;
    }
}

.calculator_accordian .acc-title {
    padding-right: 35px
}

.calculator_accordian .acc-title {
    display: block;
    position: relative;
}

.calculator_accordian .arrow-down {
    position: absolute;
    right: 20px;
    top: 24px;
    width: 16px;
    height: 12px;
    display: inline-block;
}

.calculator_accordian .arrow-down:after {
    border: 1px solid var(--black60);
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 3px;
    content: '';
    position: absolute;
    right: 2px;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    top: 0px;
}

.calculator_accordian .acc-title[aria-expanded="true"] .arrow-down:after {
    -ms-transform: rotate(-135deg) !important;
    transform: rotate(-135deg) !important;
    -webkit-transform: rotate(-135deg) !important;
}

/*----------- Content and Listing Section -----------*/
.sec-content-plus-listing b {
    color: var(--black90);
}

.sec-content-plus-listing .listing-content h3 {
    margin: 10px 0px 10px;
    font-size: 20px;
    line-height: 26px;
    font-family: 'cabinet-grotesk-bold';
}

.sec-content-plus-listing .listing-content h3 a {
    color: var(--black90) !important;
}

.sec-content-plus-listing .listing-content li {
    margin-bottom: 25px;
}

@media (min-width:992px) {
    #hra_documents li {
        font-size: 16px
    }
}

@media (max-width:991px) {
    .sec-content-plus-listing .listing-content h3 {
        font-size: 16px;
        line-height: 20px;
        margin: 0px
    }

    .sec-content-plus-listing .listing-content li {
        margin-bottom: 0px
    }

    .sec-content-plus-listing .acc-title {
        padding: 16px 40px 8px 0px
    }

    .sec-content-plus-listing .acc-title .arrow-down {
        top: 20px
    }

    .sec-content-plus-listing .grey-listing {
        margin-bottom: 0px;
    }

    .sec-content-plus-listing {
        padding-bottom: 16px;
    }

    #hra_documents_required ul {
        padding-left: 20px;
    }

    #hra_documents_required ul li {
        list-style: decimal;
        padding-left: 10px;
    }

    #hra_calculator .hra-cal {
        padding-top: 15px
    }
}

/*----------- Blog Section -----------*/
.sec-blog-widget .blog-content {
    max-width: 500px;
    -ms-flex-wrap: wrap;
    flex-wrap: wrap;
}

.sec-blog-widget .blog-artical {
    width: 47%;
    margin: 0px 15px 15px 0px
}

.sec-blog-widget .blog-artical:nth-child(2n+2) {
    margin-right: 0px
}

.sec-blog-widget .blog-artical .blog-figure {
    background: #f6f7f8;
    margin-bottom: 10px;
    position: relative;
    width: 100%;
    height: 134px;
}

.sec-blog-widget .blog-artical .blog-figure img {
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: 2;
    left: 0;
    top: 0;
    -o-object-fit: cover;
    object-fit: cover;
}

.sec-blog-widget .blog-highlights {
    max-width: 420px;
    margin: 0px auto;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.sec-blog-widget .blog-highlights p {
    margin-bottom: 20px
}

.sec-blog-widget .blog-highlights .cta {
    max-width: 220px;
}

.sec-blog-widget .blog-caption {
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    -o-text-overflow: ellipsis;
    text-overflow: ellipsis;
    height: 40px;
}

.sec-blog-widget .blog-caption p {
    font-size: 14px;
    line-height: 18px
}

@media (max-width:991px) {
    .sec-blog-widget .blog-highlights {
        text-align: center;
        padding-bottom: 20px
    }

    .sec-blog-widget .blog-highlights .cta {
        max-width: 414px;
        margin: 0px auto;
        display: block;
        width: 100%;
    }

    .sec-blog-widget .blog-artical .blog-figure {
        height: 100px;
    }

    .sec-blog-widget .blog-content {
        max-width: 355px;
        margin: 0px auto;
    }
}

/*----------- Sidebar Navigation Section -----------*/
.sec-sidebar-navigation {
    padding-top: 32px;
}

/*----------- Toggle Switch -----------*/
.calci-switch {
    position: relative;
    display: inline-block;
    width: 40px;
    height: 20px;
    margin: 0px;
    font-weight: 400;
}

.calci-switch input {
    opacity: 0;
    width: 0;
    height: 0;
}

.calci-switch .rounder {
    position: absolute;
    cursor: pointer;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background-color: #ccc;
    -webkit-transition: .4s;
    -o-transition: .4s;
    transition: .4s;
    border-radius: 20px;
}

.calci-switch .rounder:before {
    position: absolute;
    color: var(--black40);
    content: "N";
    height: 16px;
    width: 16px;
    left: 2px;
    bottom: 2px;
    background-color: white;
    -webkit-transition: .4s;
    -o-transition: .4s;
    transition: .4s;
    border-radius: 50%;
    font-size: 14px;
    line-height: 16px;
    text-align: center;
    font-family: proxima-nova-semibold;
    -webkit-box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.160784);
    box-shadow: 0px 1px 3px rgba(0, 0, 0, 0.160784);
}

.calci-switch input:checked+.rounder {
    background-color: var(--primary-green);
}

.calci-switch input:checked+.rounder:before {
    -webkit-transform: translateX(20px);
    -ms-transform: translateX(20px);
    transform: translateX(20px);
    content: "Y";
    color: var(--primary-green);
}

.rounded-green-switch {
    width: 36px;
    height: 18px;
    border: 1px solid var(--black10);
    background: var(--white-color);
    border-radius: 9px;
}

.rounded-green-switch .rounder {
    background: none;
    border: none
}

.rounded-green-switch .rounder:before {
    top: 1px;
    left: 1px;
    height: 14px;
    width: 14px;
    content: '' !important;
    background: var(--primary-green) !important;
    box-shadow: none;
}

.rounded-green-switch .light-label {
    font-size: 14px;
    line-height: 18px;
}

.rounded-green-switch input:checked+.rounder {
    background: var(--white-color);
}

.rounded-green-switch input:checked+.rounder:before {
    -webkit-transform: translateX(18px);
    -ms-transform: translateX(18px);
    transform: translateX(18px);
}

/*----------- FD Calculator Section -----------*/
.senior-citizen {
    display: flex;
    align-items: center;
}

.senior-citizen .light-label {
    font-size: 16px;
    line-height: 20px;
    color: var(--black60);
    margin-right: 10px;
}

.sec-calculator .table-listing li {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
}

.sec-calculator .table-listing li .property {
    color: var(--black60);
    font-size: 18px;
    line-height: 16px;
    font-weight: 400;
    padding: 7px;
}

.sec-calculator .table-listing li .value {
    color: var(--black90);
    font-size: 22px;
    line-height: 18px;
    font-family: proxima-nova-semibold;
    padding: 7px;
}

.sec-calculator .switch-percent__prop {
    position: relative;
    min-height: 26px;
}

.sec-calculator .tax-slab-box .main-box,
.sec-calculator .switch-percent__prop .main-box {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: end;
    -ms-flex-pack: end;
    justify-content: flex-end;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-transition: all 200ms ease !important;
    -o-transition: all 200ms ease !important;
    transition: all 200ms ease !important;
}

.sec-calculator .table-listing li:nth-child(2) .property .property-child,
.sec-calculator .table-listing li:nth-child(3) .property .property-child {
    position: relative;
    padding-right: 20px;
}

.sec-calculator .table-listing .property .property-child .label-tooltip:after {
    font-family: proxima-nova-regular;
    position: absolute;
    width: 16px;
    height: 16px;
    background: #DDDDDD;
    display: inline-block;
    border-radius: 100%;
    color: var(--black60);
    font-size: 13px;
    font-family: 'cabinet-grotesk-bold';
    line-height: 16px;
    text-align: center;
    right: 0px;
    top: 1px;
    content: '';
    background-image: url(https://img.smartspends.com/static/images/question_mark.svg);
    background-position: center;
    background-repeat: no-repeat;
}

.sec-calculator .table-listing li:nth-child(1) .property,
.sec-calculator .table-listing li:nth-child(1) .value {
    padding-left: 0px
}

.sec-calculator .table-listing li:nth-child(3) .property,
.sec-calculator .table-listing li:nth-child(3) .value {
    padding-right: 0px
}

@media (min-width:992px) {
    .sec-calculator .tax-form-heading {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .sec-calculator .table-listing {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        margin: 0px auto 0px;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .sec-calculator .table-listing li:last-child {
        padding-left: 0px
    }

    .sec-other-calculator .calculator-form .form-group {
        max-width: 210px;
    }

    .sec-other-calculator .calculation-result .chart-box {
        margin-left: -2px;
        height: 240px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .post-tax-title,
    .show-xs {
        display: none;
    }

    .sec-calculator .tax-slab-box {
        height: 27px
    }

    .sec-calculator .table-listing li:nth-child(1) {
        width: 28%
    }

    .sec-calculator .table-listing li:nth-child(2) {
        text-align: center;
        width: 40%
    }

    .sec-calculator .table-listing li:nth-child(3) {
        text-align: right;
        width: 30%
    }

    .fd-cal .calculation-content .onpage-offer-card,
    .rd-cal .calculation-content .onpage-offer-card {
        bottom: 16px;
        height: 125px;
    }
}

@media (max-width:968px) {

    .sec-calculator .table-listing li .property,
    .sec-calculator .table-listing li .value {
        font-size: 14px;
        line-height: 18px
    }
}

@media (min-width:991px) and (max-width:967px) {
    .sec-other-calculator .tax-slab-box {
        height: auto;
    }

    .sec-other-calculator .tax-slab-box .main-box {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        display: flex;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .sec-other-calculator .calculation-result .chart-box {
        height: 160px;
    }

    .sec-other-calculator .mf-offer-card {
        bottom: 0px !important;
    }

    .sec-other-calculator .calculation-result .percent-values li {
        font-size: 12px;
        line-height: 16px;
        padding: 2px 4px
    }

    .calculation-result .percent-values {
        margin-top: 5px;
    }

    .sec-other-calculator .calculation-result .main-heading {
        margin-bottom: 15px;
    }

    .sec-other-calculator .table-listing li .property {
        padding: 3px;
    }

    .sec-calculator .table-listing li:nth-child(1) {
        width: 22%
    }

    .sec-calculator .table-listing li:nth-child(2) {
        width: 38%
    }

    .sec-calculator .table-listing li:nth-child(3) {
        width: 38%
    }
}

@media (max-width:991px) {
    .senior-citizen {
        margin: 6px 0px 8px;
    }

    .senior-citizen .light-label {
        font-size: 14px;
        line-height: 18px;
    }

    .sec-calculator .table-listing {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: wrap;
        flex-flow: wrap;
        margin: 0px;
        border-top: 1px solid #DDDDDD;
    }

    .sec-calculator .table-listing li {
        width: 49.8%;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        padding: 10px 0px 8px;
        text-align: left !important;
    }

    .sec-calculator .table-listing li:nth-child(3) {
        width: 100%;
        -webkit-box-orient: vertical;
        -webkit-box-direction: normal;
        -ms-flex-direction: column;
        flex-direction: column;
        text-align: center !important;
        border-top: 1px solid #ddd;
        padding: 10px 0px 4px;
    }

    .sec-calculator .table-listing li .property {
        font-size: 14px;
        line-height: 18px;
        padding: 2px 3px 4px;
        position: relative;
    }

    .sec-calculator .table-listing li .value {
        font-size: 14px;
        line-height: 18px;
        padding: 2px 1px 4px;
    }

    .sec-calculator .table-listing li:nth-child(3) .bold {
        font-size: 20px;
        line-height: 24px;
    }

    .sec-calculator .table-listing .light-green {
        font-size: 10px;
        position: absolute;
        bottom: -11px;
        left: 3px;
        width: 77px;
    }

    .post-tax-block {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: justify;
        -ms-flex-pack: justify;
        justify-content: space-between;
    }

    .post-tax-title {
        font-size: 14px;
        line-height: 17px;
        color: var(--black90);
        margin: 0px;
    }

    .sec-calculator .tax-slab-box .main-box,
    .sec-calculator .switch-percent__prop .main-box {
        padding-top: 25px;
        -webkit-transition: all .3s ease-in-out;
        -o-transition: all .3s ease-in-out;
        transition: all .3s ease-in-out;
        max-height: 60px;
    }

    .sec-calculator .tax-slab-box .main-box.hide,
    .sec-calculator .switch-percent__prop .main-box.hide {
        display: block !important;
        max-height: 0;
        overflow-y: hidden;
        -webkit-transition: max-height 0.8s ease-in-out;
        -o-transition: max-height 0.8s ease-in-out;
        transition: max-height 0.8s ease-in-out;
        padding-top: 3px
    }

    .post-tax-block .calci-switch {
        width: 32px;
        height: 16px;
    }

    .post-tax-block .calci-switch .rounder:before {
        height: 14px;
        width: 14px;
        left: 1px;
        bottom: 1px;
        font-size: 12px;
        line-height: 14px;
    }

    .post-tax-block .calci-switch input:checked+.rounder:before {
        -webkit-transform: translateX(15px);
        -ms-transform: translateX(15px);
        transform: translateX(15px);
    }

    .post-tax-switch {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .post-tax-switch .light-label {
        margin-right: 8px;
        margin-bottom: 0px
    }

    .sec-calculator .table-listing li .property i {
        font-style: normal;
    }

    .sec-calculator .table-listing li:last-child .property {
        max-width: 145px;
        margin: 0px auto;
    }

    .sec-calculator .table-listing .property .property-child .label-tooltip:after {
        width: 12px;
        height: 12px;
        font-size: 8px;
        right: 0px;
        top: 3px;
        line-height: 12px
    }

    .sec-calculator .table-listing li:nth-child(2) i {
        position: relative;
        right: -14px
    }

    .sec-calculator .table-listing li:nth-child(2) .property .property-child,
    .sec-calculator .table-listing li:nth-child(3) .property .property-child {
        padding-right: 14px
    }

    .sec-calculator .table-listing li:nth-child(2) .property .property-child .label-tooltip:after {
        top: 3px;
        right: 5px;
    }

    .sec-other-calculator .calculation-result .chart-box {
        height: auto;
    }

    #fd_result .main-heading {
        margin-bottom: 13px
    }
}

@media (max-width:359px) {
    .sec-calculator .table-listing li .value {
        font-size: 13px;
    }

    .sec-calculator .table-listing li:nth-child(3) .bold {
        font-size: 16px;
        line-height: 18px;
    }

    .sec-calculator .table-listing li:nth-child(3) {
        padding: 6px 0px 2px;
    }

    .calculation-content .onpage-offer-card .card-body h3 {
        font-size: 14px;
        line-height: 18px;
    }

    .sec-calculator .table-listing li .property {
        font-size: 12px;
        line-height: 16px;
    }

    .sec-calculator .table-listing li:nth-child(2) .property .label-tooltip:after {
        top: 1px;
    }
}

/*----------- FD interest rates -----------*/
.sec-interest-rates .light-text {
    font-style: normal;
    color: var(--black60);
    font-size: 13px
}

@media (min-width:992px) {
    .sec-interest-rates .column-right {
        padding-bottom: 46px
    }

    .sec-interest-rates .green-ribbon {
        display: none;
    }

    .sec-interest-rates .white-theme-table tr th:nth-child(2),
    .sec-interest-rates .white-theme-table tr td:nth-child(2) {
        padding-left: 14px;
        width: 20%;
    }
}

@media (min-width:991px) and (max-width:967px) {
    .sec-interest-rates .white-theme-table {
        overflow: auto;
    }

    .sec-interest-rates .white-theme-table th {
        white-space: nowrap;
    }

    .sec-interest-rates .cta {
        padding: 4px 8px;
        font-size: 13px
    }
}

@media (max-width:991px) {
    .sec-interest-rates .white-theme-table tr td {
        padding: 0px 8px 14px;
        font-size: 14px;
    }

    .sec-interest-rates .white-theme-table .hightlighed-row {
        -webkit-box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.121569);
        box-shadow: 0px 1px 4px rgba(0, 0, 0, 0.121569);
    }

    .sec-interest-rates .white-theme-table .hightlighed-row td {
        padding-top: 14px;
        position: relative;
        border-top: 1px solid #03D000;
        border-bottom: 1px solid #03D000;
    }

    .sec-interest-rates .white-theme-table .hightlighed-row td:nth-child(2) {
        width: 40%;
        border-radius: 4px 0px 0px 4px;
        border-left: 1px solid #03D000;
    }

    .sec-interest-rates .white-theme-table .hightlighed-row td:last-child {
        border-radius: 0px 4px 4px 0px;
        border-right: 1px solid #03D000;
    }

    .sec-interest-rates .white-theme-table th:first-child,
    .sec-interest-rates .white-theme-table th:nth-child(4),
    .sec-interest-rates .white-theme-table td:nth-child(4) {
        display: none;
    }

    .sec-interest-rates .icon-theme-table .col-icon {
        display: none;
    }

    .sec-interest-rates .white-theme-table td:nth-child(2) {
        font-family: proxima-nova-semibold;
    }

    .sec-interest-rates .green-ribbon {
        font-size: 10px;
        line-height: 12px;
        position: absolute;
        top: -7px;
        left: -6px;
        width: 116px;
    }

    .sec-interest-rates .green-ribbon:before {
        content: "";
        bottom: -5px;
        position: absolute;
        display: block;
        border-style: solid;
        border-color: #1AC817 transparent transparent transparent;
        left: 0;
        border-width: 5px 0 0 5px
    }

    .sec-interest-rates .white-theme-table {
        padding: 5px 8px 0px;
    }

    .sec-interest-rates .custom-table {
        width: 100%;
        border-spacing: 0px 14px;
        border-collapse: initial;
    }

    .sec-interest-rates .hightlighed-row .dark-green {
        color: var(--black90) !important
    }

    .sec-interest-rates .main-highlights {
        max-width: 100%;
        text-align: center;
    }
}

@media (max-width:359px) {
    .sec-interest-rates .white-theme-table tr td {
        padding-left: 4px;
        padding-right: 4px;
        font-size: 13px;
    }
}

/*----------- Invest in Fixed Deposits -----------*/
@media (min-width:992px) {
    .sec-allabout-invest {
        padding-top: 94px;
        padding-bottom: 94px
    }

    .sec-allabout-invest .row-flex {
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .sec-allabout-invest .main-highlights p {
        margin-bottom: 20px
    }

    .sec-allabout-invest .counter-prop {
        max-width: 470px
    }

    .sec-allabout-invest .cta-large {
        max-width: 220px
    }
}

@media (max-width:991px) {
    .sec-allabout-invest .counter-prop {
        padding-left: 20px;
        margin: 10px 0px 20px
    }
}

/*----------- Pros & Cons -----------*/
.sec-pro-cons .white-theme-table {
    padding: 10px
}

.sec-pro-cons .white-theme-table tr td {
    color: var(--black60);
    vertical-align: top !important;
}

@media (min-width:968px) {
    .sec-pro-cons .white-theme-table tr td {
        color: var(--black60);
        font-size: 18px;
        line-height: 22px;
    }

    .sec-pro-cons .white-theme-table tr th:first-child,
    .sec-pro-cons .white-theme-table tr td:first-child {
        /* padding-left: 55px */
    }
}

@media (max-width:991px) {
    .sec-pro-cons .main-highlights {
        margin-bottom: 20px
    }

    .sec-pro-cons .white-theme-table tr th {
        font-family: proxima-nova-semibold;
    }

    .sec-pro-cons .white-theme-table tr th,
    .sec-pro-cons .white-theme-table tr td {
        text-align: center;
    }

    .sec-pro-cons .white-theme-table tr td {
        padding: 10px 8px;
    }
}

/*----------- Features Cards -----------*/
.features-card {
    background: var(--white-color);
    position: relative;
    -webkit-box-shadow: 4px 4px 14px rgba(152, 152, 152, 0.1);
    box-shadow: 4px 4px 14px rgba(152, 152, 152, 0.1);
    border-radius: 8px;
    padding: 22px 20px 16px 28px;
    max-width: 330px;
    margin-right: 20px
}

.features-card-row .features-card:last-child {
    margin-right: 0px
}

.features-card ul li {
    margin-bottom: 8px
}

.features-card .card-title {
    font-size: 22px;
    line-height: 26px;
    font-family: proxima-nova-bold;
    margin: 0px 0px 15px;
    color: var(--black90);
}

.features-card .card-foot {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
    -webkit-box-align: end;
    -ms-flex-align: end;
    align-items: flex-end;
    position: relative;
    z-index: 9
}

.features-card .card-main {
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    -webkit-box-pack: justify;
    -ms-flex-pack: justify;
    justify-content: space-between;
}

.features-card-row .last-card-spacing {
    display: none;
}

.features-card:after {
    content: '';
    background-image: url(../../images/calculator/card-icon-bg.svg);
    position: absolute;
    right: 0px;
    bottom: 0px;
    height: 110px;
    width: 195px;
    z-index: 1;
}

@media (min-width:992px) {
    .features-card-row {
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
    }

    /*.features-card .card-foot{height: 68px;}*/
    .features-card .card-icon img {
        width: 85px;
    }

    .features-card .card-icon {
        max-width: 124px;
        height: 109px;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: end;
        -ms-flex-align: end;
        align-items: flex-end;
    }

    .features-card .card-foot .card-cta {
        padding: 0px 10px 10px 0px;
        -webkit-box-flex: 1;
        -ms-flex: 1;
        flex: 1
    }
}

@media (max-width:968px) {
    .features-card-row {
        position: relative;
        width: auto;
        overflow-x: scroll;
        overflow-y: hidden;
        white-space: nowrap;
        -webkit-overflow-scrolling: touch;
        -ms-overflow-style: none;
        scrollbar-width: none !important;
        overflow: -moz-scrollbars-none;
        margin: initial;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-overflow-scrolling: touch;
        padding-bottom: 15px;
    }

    .features-card-row::-webkit-scrollbar-thumb {
        background: #F9F8F3 !important;
        width: 0 !important;
        height: 0 !important;
    }

    .features-card {
        padding: 15px 18px;
        min-width: 230px;
        max-width: 230px;
        display: inline-block;
        margin-right: 12px;
        white-space: initial;
        -webkit-transform: translateZ(0px);
    }

    .features-card:first-child {
        margin-left: 20px;
    }

    .features-card .card-title {
        font-size: 16px;
        line-height: 20px
    }

    .features-card ul li {
        font-size: 12px;
        line-height: 16px;
        margin-bottom: 5px;
    }

    .features-card .card-icon img {
        width: 65px;
    }

    .features-card .cta-small {
        width: 90px;
        margin-top: 12px;
        font-size: 12px;
        line-height: 16px;
        min-width: 90px;
    }

    .features-card-row .last-card-spacing {
        display: inline-block;
        min-width: 5px;
    }
}

@media (max-width:991px) {
    .sec-features-cards .row-inner {
        padding: 0px
    }

    .sec-features-cards .center-highlights {
        padding-right: 16px;
        padding-left: 16px
    }

    .features-card .card-icon img {
        width: 45px;
    }

    .features-card:after {
        height: 115px;
        width: 140px;
        background-size: 100%;
        background-repeat: no-repeat;
        background-position: right bottom;
    }
}

/*----------- RD Interest Rate -----------*/
@media (min-width:992px) {
    .sec-rd-nterest-rates.sec-highlights:before {
        height: 280px;
    }
}

@media (max-width:991px) {
    .main-wrapper {
        padding: 0 15px;
        font-size: 12px;
        line-height: 18px;
    }
}

/* FAQ */
.faq-table-title {
    font-family: proxima-novasemi, proxima-nova-semibold;
    color: var(--black90);
    text-align: center;
    margin: 0 0 10px;
    font-size: 16px;
    line-height: 20px
}

.faq-theme-table table {
    width: 100%;
    border-collapse: collapse;
    text-align: left
}

.faq-theme-table {
    width: 100%;
    margin: 10px auto 15px;
    border: 1px solid #ddd
}

.faq-theme-table .table-head,
.faq-theme-table thead {
    background: #ddd
}

.faq-theme-table .table-head td,
.faq-theme-table th {
    font-family: proxima-novasemi, proxima-nova-semibold;
    font-family: 'cabinet-grotesk-bold';
    color: var(--black90);
    font-size: 16px;
    line-height: 20px;
    padding: 8px 22px;
    vertical-align: middle;
    border-right: 1px solid #ccc
}

.faq-theme-table .table-head td:last-child,
.faq-theme-table th:last-child {
    border-right: 0
}

.faq-theme-table td {
    color: var(--black60);
    font-size: 16px;
    line-height: 20px;
    padding: 8px 22px;
    vertical-align: top;
    border-bottom: 1px solid #ddd;
    border-right: 1px solid #ddd
}

.faq-theme-table tr td:last-child {
    border-right: 0
}

.faq-theme-table tr:last-child td {
    border-bottom: 0
}

.faq-theme-table .tfooter td {
    font-weight: 600
}

@media (max-width:991px) {
    .faq-theme-table {
        overflow: auto
    }

    .faq-theme-table .table-head td,
    .faq-theme-table th {
        white-space: nowrap
    }

    .faq-theme-table .table-head td,
    .faq-theme-table td,
    .faq-theme-table th {
        font-size: 12px;
        line-height: 16px
    }
}

.section-common-faq {
    padding-top: 55px;
    padding-bottom: 55px;
    position: relative;
    -webkit-box-shadow: 0 0 4px rgb(0 0 0 / 14%);
    box-shadow: 0 0 4px rgb(0 0 0 / 14%)
}

.section-common-faq .row-inner {
    max-width: 1100px;
    padding-left: 16px;
    padding-right: 16px;
    margin: 0 auto
}

.faq-section-title {
    font-family: 'cabinet-grotesk-bold';
    font-size: 28px;
    line-height: 32px;
    color: var(--black90);
    margin: 10px 0 15px;
    font-family: proxima-novabold, proxima-nova-bold;
    text-align: center
}

.com-faq-contents {
    max-width: 810px;
    margin: 30px auto 0
}

.com-faq-contents .faq-title {
    font-family: 'cabinet-grotesk-bold';
    font-size: 16px;
    line-height: 20px;
    padding: 14px 40px 14px 7px;
    color: var(--black90) !important;
    display: block;
    position: relative
}

.com-faq-contents .main-panel {
    padding: 15px 10px 10px;
    color: var(--black60);
    font-size: 16px;
    line-height: 22px
}

.com-faq-contents .arrow-down {
    position: absolute;
    right: 20px;
    top: 18px;
    width: 16px;
    height: 12px;
    display: inline-block
}

.com-faq-contents .arrow-down:after {
    border: 1px solid #666;
    border-width: 0 1px 1px 0;
    display: inline-block;
    padding: 4px;
    content: '';
    position: absolute;
    right: 2px;
    -webkit-transition: all .5s;
    -o-transition: all .5s;
    transition: all .5s;
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transform: rotate(45deg);
    top: 0
}

.com-faq-contents .faq-title[aria-expanded=true] .arrow-down:after {
    -ms-transform: rotate(-135deg) !important;
    transform: rotate(-135deg) !important;
    -webkit-transform: rotate(-135deg) !important
}

.faq-listing {
    padding-left: 20px;
    list-style: decimal;
    margin-bottom: 10px
}

.faq-listing li {
    font-size: 16px;
    line-height: 20px;
    position: relative;
    color: var(--black60);
    margin-bottom: 10px
}

.com-faq-contents .main-panel p {
    color: var(--black60);
    font-size: 16px;
    line-height: 22px;
    margin-bottom: 10px
}

.com-faq-contents .main-panel b,
.com-faq-contents .main-panel strong {
    font-family: proxima-novabold, proxima-nova-bold
}

@media (min-width:992px) {
    .com-faq-contents .com-faq-panel {
        margin-bottom: 15px
    }

    .com-faq-contents .faq-title:hover:after,
    .com-faq-contents .faq-title:hover:before {
        position: absolute;
        content: '';
        left: 0;
        right: 0;
        bottom: 0;
        background-color: rgba(177, 177, 0, .25);
        border-radius: 50%;
        -webkit-box-shadow: rgba(0, 0, 0, .3) 5px 2px 10px;
        box-shadow: rgba(0, 0, 0, .3) 5px 2px 10px;
        clip: rect(20px, auto, 50px, 0);
        height: 14px
    }

    .com-faq-contents .faq-title:hover:after {
        top: 28px;
        height: 14px
    }

    .com-faq-contents .faq-title:hover:before {
        top: 4px;
        -webkit-transform: rotate(180deg);
        -ms-transform: rotate(180deg);
        transform: rotate(180deg)
    }
}

@media (max-width:968px) {
    .section-common-faq {
        padding-top: 35px;
        padding-bottom: 35px
    }
}

@media (max-width:991px) {
    .com-faq-contents .arrow-down:after {
        padding: 3px
    }

    .faq-section-title {
        font-size: 18px;
        line-height: 22px
    }

    .com-faq-contents {
        margin-top: 15px
    }

    .section-common-faq {
        padding-top: 22px;
        padding-bottom: 32px
    }

    .com-faq-contents .faq-title {
        font-family: 'cabinet-grotesk-bold';
        font-size: 14px;
        line-height: 17px;
        color: var(--black90) !important;
        padding: 12px 30px 12px 7px
    }

    .com-faq-contents .main-panel {
        padding: 0 7px 5px
    }

    .com-faq-contents .main-panel,
    .com-faq-contents .main-panel p,
    .faq-listing li,
    .faq-table-title {
        font-size: 14px;
        line-height: 20px
    }

    .com-faq-contents .faq-title .arrow-down {
        right: 14px;
        top: 15px
    }
}

.show-more-table {
    padding-top: 12px;
}

.show-more-table p a {
    font-size: 16px;
    text-decoration: none !important;
    color: #00bd92;
}

@media (max-width:991px) {
    .show-more-table {
        padding-bottom: 8px;
        padding-top: 0px;
        margin: -5px 0px -5px;
    }
}

/* custom */
.summary ul {
    font-size: 14px;
    color: var(--black60);
    line-height: 18px;
    font-weight: 400;
}

.decimal-prop-section ul li {
    list-style: decimal;
}

.decimal-large-prop-section ul li {
    color: var(--black90);
    padding-left: 10px;
}

@media (min-width:991px) {
    .decimal-large-prop-section ul li {
        font-size: 20px;
    }
}

.grey-listing-section ul {
    padding-left: 20px;
    position: relative;
}

.grey-listing-section ul .list-title {
    font-size: 20px;
    line-height: 24px;
    font-family: proxima-nova-semibold;
    color: var(--black90);
    margin: 0px 0px 10px
}

.grey-listing-section ul li {
    font-size: 16px;
    line-height: 20px;
    position: relative;
    color: var(--black60);
    margin-bottom: 10px
}

.calculation-result .about-chart .amt-principal:before {
    background: #DDDDDD;
}

.calculation-result .about-chart .amt-interest:before {
    background: #6880C8;
}

.calculation-result .about-chart .amt-interest {
    padding-right: 5px;
}

.main-highlights a {
    color: var(--primary-green);
}

.dummyLink:hover {
    color: var(--black90) !important;
}

.earn_more_see_how {
    margin-left: auto;
    font-size: 18px;
    color: var(--primary-green);
    cursor: pointer;
    white-space: nowrap;
}

.earn_more_see_how img {
    margin: -1px 0px 0px 1px
}

.earn_more_label {
    font-size: 18px;
}

.earn-icon {
    margin-right: 15px;
    width: 30px;
    height: 25px;
}

.cal-table tr td .cta {
    padding: 0px;
    font-size: 12px;
    /* width: auto; */
}

@media (max-width:991px) {
    .earn_more_label {
        font-size: 13px;
        /* width: 65%; */
        width: 57%;
    }

    .earn_more_see_how {
        font-size: 13px;
        align-self: flex-start;
    }

    .earn-icon {
        margin-right: 10px;
        width: 25px;
        height: 20px;
    }

    .earn_more_see_how img {
        margin: -2px 0px 0px 2px;
    }

    .kirby-table-listing {
        justify-content: space-between;
        border: none !important;
    }

    .kirby-table-listing li {
        width: auto !important;
        flex-direction: column !important;
        border: none !important;
    }

    .tenure-label {
        margin-left: 8px;
    }

    .inflation-box .main-box {
        padding-top: 10px;
    }

    .inflation-box .main-box .light-label {
        margin: 0px 10px 0px 0px;
    }

    .cal-table tr td .cta:after {
        border: 1px solid var(--primary-green);
        border-width: 0 1px 1px 0;
        display: inline-block;
        padding: 3px;
        content: '';
        position: absolute;
        right: 7px;
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        top: 40%
    }

    .cal-table tr td .cta {
        background: transparent;
        padding: 5px;
        line-height: 5px;
        border: 0px;
        overflow: hidden;
        text-indent: -99999px;
        min-width: 14px;
        position: relative;
    }

    .fund-table tr td:nth-child(4),
    .fund-table tr th:nth-child(4) {
        display: table-cell !important;
    }

    .calculation-result .post-tax-switch .inf-label {
        font-size: 12px !important;
    }

    .calculation-result .inflation-values {
        margin: 0px !important;
    }

    .sec-calculator .inflation-box .main-box {
        justify-content: center !important;
    }
}

.green-bold {
    font-weight: bold;
    color: #03D000;
}

.calculation-result .pie-about .extempted:before {
    background: #DDDDDD !important;
}

.fund-table tr td:nth-child(2) a:hover {
    color: var(--primary-green) !important;
}

.calculation-result .about-chart .amt-principal:before,
.calculation-result .about-chart .amt-interest:before {
    width: 12px;
    height: 12px;
    content: '';
    display: inline-block;
    position: absolute;
    border-radius: 20px;
    left: 0px;
    bottom: 0px;
}

.calculation-result .about-chart .amt-principal,
.calculation-result .about-chart .amt-interest {
    padding: 0px 20px 0px 20px;
}

@media (min-width:992px) {

    .sec-other-calculator .calculation-result .bar-about,
    .sec-other-calculator .calculation-result .pie-about {
        margin-left: 0px;
    }
}

@media (max-width:991px) {
    .see-how-switch .calci-switch .rounder:before {
        line-height: 15px !important;
    }

    .sec-calculator .kirby-table-listing li:nth-child(3) {
        text-align: right !important;
    }

    .sec-calculator .kirby-table-listing li:last-child .property {
        margin: 0px;
    }

    /* add class 'period-form-group' in div of period field */
    .period-form-group .calci-amount {
        height: auto !important;
    }

    .sec-calculator .kirby-table-listing li:nth-child(1) .value .bold,
    .sec-calculator .kirby-table-listing li:nth-child(2) .value .bold {
        font-family: proxima-nova-regular;
        font-weight: normal !important;
    }

    .sec-other-calculator .calculation-result .bar-graphic-body {
        max-width: unset;
    }

    .sec-other-calculator .calculation-result .bar-graphic-body .chart-box {
        margin-top: 10px;
        height: 170px !important;
        width: 310px !important;
        /* min-width: 300px; */
    }

    .sec-other-calculator .calculation-result .bar-graphic-body {
        margin-right: 0px;
        margin-top: -10px;
    }
}

@media (min-width:1024px) {
    .whitespace {
        white-space: nowrap;
    }

    /*Green Dots*/
    .green-prop .chart-section-box:after {
        z-index: -1;
        background: url(../../images/calculator/green-prop.svg);
        width: 98px;
        height: 98px;
        bottom: -50px;
        right: -50px;
        position: absolute;
        background-repeat: no-repeat;
        background-size: 100% auto;
        content: '';
    }
}

.chart-section:before {
    max-height: 350px !important;
}

@media (max-width:991px) {
    .chart-section:before {
        height: 100%;
    }
}

/* compound cal
 Same class is used for ppf calculator, check both pages if making any changes */
.custom-switch {
    height: 29px;
    border: 1px solid #DDDDDD;
    border-radius: 20px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    padding: 3px;
    margin: 0px;
    width: 133px
}

.custom-switch li {
    -webkit-box-flex: 1;
    -ms-flex: 1;
    flex: 1;
    border-radius: 16px;
    font-size: 15px;
    line-height: 19px;
    color: var(--black60);
    text-align: center;
    font-weight: 300;
    height: 23px;
    cursor: pointer;
    padding: 2px 0px;
}

.custom-switch li.active {
    background: var(--primary-green);
    color: var(--white-color);
}

.inc-span,
.dec-span {
    cursor: pointer;
    position: relative;
    /* width: 30px;
    height: 17px; */
    display: inline-block;
    /* -webkit-transform: rotate( 90deg);
    -ms-transform: rotate(90deg);
    transform: rotate( 90deg); */
    width: 30px;
    height: 34px;
}

.inc-span::after,
.dec-span::after {
    position: absolute;
    content: '';
    width: 30px;
    height: 34px;
    border-left: 8px solid red;
    border-right: 8px solid red;
}

.cmp-year-num-ctrl .form-ctrl {
    padding-left: 32px;
    padding-right: 32px;
}

.compound-cal .period-form-group {
    max-width: 264px !important;
}

.compound-num-ctrl {
    /* max-width: 267px; */
}

.compound-interval-control li {
    color: var(--black60) !important;
    font-weight: 400;
}

.compound-interval-control li.active {
    font-family: 'cabinet-grotesk-bold';
    color: var(--black90) !important;
}

.compound-cal .graph-bottom-section {
    margin-top: 20px;
}

.compound-cal .note-div {
    font-size: 14px;
    color: var(--black90);
    font-family: 'proxima-nova';
    text-align: right;
}

.increase-num-ctrl {
    height: 34px;
    width: 30px;
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    right: 0px;
    top: 2px;
}

.decrease-num-ctrl {
    height: 34px;
    width: 30px;
    position: absolute;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    -ms-flex-direction: column;
    flex-direction: column;
    left: 0px;
    top: 0px;
}

.decrease-num-ctrl span {
    cursor: pointer;
    transform: rotate(90deg);
    width: 30px;
    height: 34px;
}

.increase-num-ctrl span {
    cursor: pointer;
    transform: rotate(270deg);
    width: 30px;
    height: 34px;
}

.increase-num-ctrl span::after,
.decrease-num-ctrl span::after {
    position: absolute;
    content: '';
    width: 0;
    height: 0;
    border-left: 8px solid transparent;
    border-right: 8px solid transparent;
    border-top: 12px solid var(--black40);
    right: 0px;
    left: 8px;
    bottom: 8px;
}

.compound-cal .input-prop.year {
    left: 134.88px;
}

@media (max-width:991px) {
    .compound-cal .input-prop.year {
        left: 147px;
    }

    .calculation-result .flex-dir-col {
        flex-direction: column !important;
    }

    .compound-num-ctrl {
        max-width: 100%;
    }

    .compound-cal .period-form-group .period-label {
        text-align: center;
    }

    .compound-cal .resp-table {
        overflow-x: auto;
    }

    .compound-cal .graph-bottom-section {
        flex-direction: column !important;
    }

    .compound-cal .note-div {
        text-align: left;
    }

    .compound-cal .about-chart {
        justify-content: flex-start;
    }

    .compound-cal .graph-bottom-section {
        margin-top: 0px;
    }

    .compound-cal .calculator-form .form-group {
        margin-bottom: 24px;
    }

    .compound-cal .interest-form-group .calci-num-ctrl {
        margin-bottom: 0px;
    }

    .compound-cal .cal-btn-group {
        margin-bottom: 14px !important;
    }

    .compound-cal .cal-btn-group .calci-button-ctrl {
        margin-bottom: 0px;
    }

    .compound-cal .period-form-group,
    .compound-cal .period-form-group .compound-num-ctrl {
        margin-bottom: 0px !important;
    }

    .compound-cal .about-chart {
        margin-bottom: 20px;
        font-size: 12px;
    }

    .compound-cal .note-div {
        border-top: 1px solid #eee;
        padding-top: 20px;
        font-size: 12px;
    }

    .compound-cal .period-form-group {
        max-width: unset !important;
    }

    .compound-cal .table-listing li:nth-child(3) .value {
        font-family: proxima-nova-regular;
        font-style: normal;
        font-weight: bold;
        font-size: 18px !important;
        line-height: 24px;
    }

    .compound-cal .table-listing li:nth-child(3) .value .bold {
        font-size: 18px;
    }

    .compound-cal .calculation-result .about-chart .color-rect {
        /* position: relative;
                                                padding: 0px 20px 0px 23px !important;
                                                padding-left: 23px; */
    }

    .compound-cal .calculation-result .about-chart .amt-interest {
        padding-right: 5px !important;
    }

    .compound-cal .white-theme-table tr th {
        padding: 8px 0px 8px 7px;
    }

    .compound-cal .white-theme-table tr td {
        padding: 15px 0px 15px 7px;
    }
}

@media (max-width:320px) {
    .compound-cal .input-prop.year {
        left: 129.6px;
    }
}

/* compound cal end */
.investment-type-control li {
    color: var(--black60) !important;
    font-weight: 400;
}

.investment-type-control li.active {
    font-family: 'cabinet-grotesk-bold';
    color: var(--black90) !important;
}

.simple-cal .post-tax-block {
    padding: 4px 0px;
}

.simple-cal .inflation-values {
    width: 136px;
}

.sec-calculator .simple-cal .table-listing li:nth-child(3) .value {
    font-weight: bold;
    font-size: 26px;
}

.sec-calculator .simple-cal .table-listing li:nth-child(1) .value,
.sec-calculator .simple-cal .table-listing li:nth-child(2) .value {
    font-family: 'cabinet-grotesk-bold';
    font-size: 22px;
}

@media (max-width:991px) {
    .sec-other-calculator .simple-cal .calculation-result .graphic-content .graphic-body {
        max-width: 100%;
    }

    .sec-other-calculator .simple-cal .calculation-result .chart-box {
        height: auto;
        width: auto;
        margin-left: -4px;
    }

    .simple-cal .sc-hr1 {
        margin-top: 16px;
        margin-bottom: 4px;
    }

    .simple-cal .calculation-content .light-label {
        color: var(--black60) !important;
    }

    .sec-calculator .simple-cal .table-listing li:nth-child(3) .value {
        font-weight: bold;
        font-size: 18px;
    }

    .sec-calculator .simple-cal .table-listing li:nth-child(1) .value,
    .sec-calculator .simple-cal .table-listing li:nth-child(2) .value {
        font-weight: normal;
        font-size: 14px;
    }
}

/* ppf cal */
.ppf-cal .interest-form-group .input-prop.percentage,
.ppf-cal .interest-form-group .form-ctrl {
    color: var(--black60);
}

/* ppf cal end */
.isApp-container .onpage-offer-card {
    display: none;
}

@media (max-width:991px) {
    .isApp-container .show-xs {
        display: block !important;
    }

    .isApp-container .mweb-ctas {
        z-index: 99;
    }

    .isApp-container .genius-tracking {
        display: none;
    }
}

.onpage-offer-card .card-body .fd-card-title {
    color: var(--black90);
    font-family: 'proxima-nova-semibold';
    font-size: 20px;
    line-height: 24px;
    font-family: 'cabinet-grotesk-bold';
    margin: 0px 0px 5px;
}

@media (max-width:968px) {
    .fd-card-title {
        font-size: 16px;
        line-height: 19px;
    }
}

@media (max-width:991px) {
    .onpage-offer-card .card-body .fd-card-title {
        font-size: 16px;
        line-height: 20px;
    }
}

@media (min-width:991px) and (max-width:1024px) {
    .onpage-offer-card {
        max-width: 530px;
    }

    .onpage-offer-card .card-body .fd-card-title {
        font-size: 18px;
        line-height: 22px;
    }
}

/* NPS Cal */
.check-list {
    margin-bottom: 20px
}

.check-list li,
.check-list-ul li,
.ol-list li {
    font-size: 16px;
    line-height: 20px;
    color: #454545;
    margin-bottom: 15px;
    padding-left: 26px;
    position: relative;
    text-align: left;
    list-style-type: none
}

.check-list li:before {
    content: '';
    top: 5px;
    position: absolute;
    width: 15px;
    height: 11px;
    background-image: url(https://img.smartspends.com/static/images/etmoneyweb/green-check.png);
    background-size: 100%;
    left: 0;
    display: inline-block
}

.check-list {
    padding: 0
}

.bold {
    font-family: proxima-nova-bold;
}

.table-note {
    margin: 0 !important;
    font-size: 13px !important;
}

.top-performing-fund-table .common-table tbody tr td,
.top-performing-fund-table .common-table thead tr td,
.top-performing-fund-table .common-table thead tr td:nth-child(2) {
    width: 30%;
    text-align: center
}

@media(min-width:991px) {
    .top-performing-fund-table {
        max-width: 100%
    }

    .top-performing-fund-table table {
        table-layout: fixed
    }

    .top-performing-fund-table table tbody td,
    .top-performing-fund-table table thead td {
        font-size: 12px
    }

    .top-performing-fund-table table tbody tr td:first-child,
    .top-performing-fund-table table thead tr td:first-child {
        width: 30%
    }

    .top-performing-fund-table table tbody tr td:nth-child(2),
    .top-performing-fund-table table thead tr td:nth-child(2) {
        width: 70%
    }

    .top-performing-fund-table table thead td {
        font-size: 13px
    }
}

.top-performing-fund-table table {
    border-collapse: collapse;
    padding: 11px 16px;
    width: 100%;
    margin: 12px auto 0 auto
}

.top-performing-fund-table table tbody tr td,
.top-performing-fund-table table thead tr td {
    font-size: 14px;
    font-family: proxima-nova, sans-serif;
    padding: 11px 10px;
    border-bottom: 1px solid #e6ebea;
    color: #54504d
}

.top-performing-fund-table table thead tr td {
    font-size: 15px;
    font-family: proxima-nova-bold;
}

.top-performing-fund-table {
    margin-bottom: 15px
}

.top-performing-fund-table.colored-table table {
    border: 1px solid #e6ebea
}

.top-performing-fund-table.colored-table thead td {
    background: #32b389;
    color: var(--white-color);
}

.top-performing-fund-table.colored-table .nowrap td {
    white-space: nowrap
}

@media(max-width:991px) {
    .top-performing-fund-table {
        overflow-x: scroll
    }

    .top-performing-fund-table table tbody td,
    .top-performing-fund-table table thead td {
        font-size: 14px;
        padding: 10px 5px;
        line-height: 19px
    }

    .top-performing-fund-table table {
        table-layout: fixed;
        width: auto
    }

    .top-performing-fund-table h3 {
        padding: 0 15px;
        margin: 20px 0
    }
}

/* NPS Cal End*/
.ans-card .step-heading {
    font-size: 17px;
    font-family: 'cabinet-grotesk-bold';
    margin-bottom: 10px;
}

.output-table {
    width: 100%;
}

.output-table tr th {
    color: var(--black60);
    font-size: 18px;
    line-height: 16px;
    font-weight: 400;
    padding: 7px;
    width: 33.33%;
}

.output-table tr th:first-child {
    padding-left: 0px;
}

.output-table tr th:nth-child(2),
.output-table tr td:nth-child(2) {
    text-align: center;
}

.output-table tr th:nth-child(3),
.output-table tr td:nth-child(3) {
    text-align: right;
    padding-right: 0px;
}

.output-table tr td .value {
    color: var(--black90);
    font-size: 22px;
    line-height: 18px;
    font-family: proxima-nova-semibold;
    padding: 7px;
    display: block;
}

.output-table tr td:nth-child(1) .value {
    padding-left: 0px;
}

.output-table tr td:nth-child(3) .value {
    padding-right: 0px;
}

@media (min-width:992px) {
    .output-table tr th:first-child {
        padding-left: 12px;
    }

    .output-table tr td:nth-child(3) .value {
        font-family: proxima-nova-bold;
        font-size: 26px;
        line-height: 36px;
    }

    .output-table tr td:nth-child(3) .value .count {
        font-family: proxima-nova-bold;
    }

    .output-table tr td:nth-child(1) .value {
        padding-left: 12px;
    }
}

@media (max-width:991px) {
    .output-table tr th {
        font-size: 12px;
        line-height: 16px;
        padding: 2px 3px 4px;
    }

    .output-table tr td .value {
        font-family: proxima-nova-regular;
        font-size: 13px;
        padding: 2px 1px 4px;
    }

    .output-table tr td:nth-child(1) .value .bold,
    .output-table tr td:nth-child(2) .value .bold {
        font-family: proxima-nova-regular;
        font-weight: normal !important;
    }

    .output-table tr td:nth-child(3) .bold {
        font-size: 16px;
        line-height: 18px;
    }
}

.c-star {
    border-radius: 8px;
    color: var(--white-color);
    padding: 0px 17px 0px 4px;
    font-size: 12px;
    display: inline-block;
    width: 32px;
    height: 17px;
    line-height: 16px;
    background: #ECDE03 url(../../images/calculator/star.svg) no-repeat 80% 3px;
    background-size: 12px auto;
    vertical-align: middle;
}

.c-5star {
    background-color: #03D000;
}

.c-4star {
    background-color: #7EEC00;
}

.c-3star {
    background-color: #B6E616;
}

.c-2star {
    background-color: #d8ee2b;
}

.c-1star {
    background-color: #ecde03;
}

/*Gratuity Calculator*/
.graduity-cal .graphic-title-img {
    margin-bottom: 25px;
    display: block;
    margin: 0px auto 16px;
}

.graduity-cal .graphic-body {
    min-height: 306px;
    text-align: center;
}

.graduity-cal .graphic-body .graphic__box {
    position: absolute;
    top: 0px;
    text-align: center;
    margin: 0px auto;
    width: 100%;
    background: #fff;
    display: none;
}

.graduity-cal .graphic-body img {
    max-width: 370px;
}

.graduity-cal .offer-eligiblity {
    position: relative;
}

.graduity-cal .date-box {
    display: flex;
    flex-direction: column;
    width: 94px;
    position: absolute;
    left: 95px;
    bottom: 34px;
}

.graduity-cal .graphic-body .month-year {
    margin: 0px auto;
    font-size: 20px;
    line-height: 20px;
    color: var(--black60);
    text-transform: uppercase;
    max-width: 85px;
}

.graduity-cal .graphic-body .eligible-on {
    font-size: 11px;
    line-height: 20px;
    text-transform: uppercase;
    color: var(--black40);
}

.graduity-cal .post-tax-switch {
    display: flex;
    align-items: center;
}

@media (min-width:992px) {
    .graduity-cal .post-tax-switch {
        width: 240px;
    }

    .graduity-cal .main-box {
        justify-content: flex-end;
        display: flex;
    }

    .graduity-cal .output-table tr th:nth-child(1),
    .graduity-cal .output-table tr td:nth-child(1) {
        width: 32%;
    }

    .graduity-cal .output-table tr th:nth-child(2),
    .graduity-cal .output-table tr td:nth-child(2) {
        width: 38%;
    }

    .graduity-cal .calculation-content .onpage-offer-card {
        bottom: 25px;
    }

    .graduity-cal .calculation-result .graphic-content .graphic-body {
        text-align: center;
        padding-bottom: 32px;
        margin-top: 6px;
    }
}

@media (min-width:992px) and (max-width:1024px) {
    .graduity-cal .graphic-body img {
        max-width: 100%;
    }

    .graduity-cal .date-box {
        left: 80px;
        bottom: 35px;
    }
}

@media (max-width:991px) {
    .graduity-cal .eligible-to-claim .graphic-title-img {
        max-width: 259px;
    }

    .graduity-cal .claim-your-gratuity .graphic-title-img {
        max-width: 187px;
    }

    .graduity-cal .graphic-body {
        min-height: 220px;
        max-width: unset !important;
    }

    .graduity-cal .date-box {
        left: 56px;
        bottom: 25px;
        width: 80px;
    }

    .graduity-cal .graphic-body .month-year {
        font-size: 16px;
        line-height: 16px;
        max-width: 65px;
    }

    .graduity-cal .graphic-body .eligible-on {
        font-size: 10px;
    }

    .graduity-cal .graphic-body img {
        max-width: 320px;
        height: auto;
    }

    .graduity-cal .offer-eligiblity {
        max-width: 320px;
        margin: 0px auto;
    }
}

@media (max-width:359px) {
    .graduity-cal .graphic-body .eligible-on {
        line-height: 16px;
    }

    .graduity-cal .date-box {
        left: 48px;
        bottom: 20px;
    }

    .graduity-cal .graphic-body img {
        max-width: 280px;
    }

    .graduity-cal .graphic-body .month-year {
        font-size: 14px;
    }

    .graduity-cal .graphic-body .eligible-to-claim img {
        max-width: 260px;
    }

    .graduity-cal .graphic-body {
        min-height: 190px;
    }
}

/*Center aligned Result*/
.center-aligned-result {
    display: flex;
    align-items: center;
    flex-direction: column;
    width: 100%;
}

.center-aligned-result .result-for {
    font-size: 16px;
    line-height: 20px;
    color: var(--black90);
    margin-bottom: 4px;
}

.center-aligned-result .result-amount {
    font-size: 40px;
    line-height: 50px;
    font-family: 'cabinet-grotesk-extrabold';
    color: var(--black90);
}

.center-aligned-result .after-result-question {
    padding-top: 8px;
    padding-bottom: 4px;
    font-size: 14px;
    line-height: 18px;
    color: var(--black40);
    font-family: proxima-nova-semibold;
    border-bottom: 1px solid #e5e5e5;
    margin-bottom: 0px;
}

.related-funds-content {
    position: relative;
    margin-top: 16px;
    border-radius: 8px;
    overflow: hidden;
    border: 1px solid var(--black10);
}

.related-fund-head {
    display: flex;
    justify-content: space-between;
    background: var(--bg-green);
    padding: 18px 22px 22px 42px;
}

.related-fund-head .fund-head-left {
    display: flex;
    align-items: center;
}

.related-fund-head .rl-icon {
    width: 30px;
    height: 30px;
}

.related-fund-head .rl-title {
    margin-left: 14px;
    font-size: 18px;
    line-height: 22px;
    font-family: 'cabinet-grotesk-bold';
}

.related-fund-body {
    padding: 0px 22px 20px 42px;
}

.related-fund-body .related-fund-list {
    display: flex;
    flex-flow: wrap;
}

.related-fund-body .related-fund-list li {
    width: 33.3%;
    display: flex;
    flex-direction: row;
    align-items: center;
    margin-top: 22px;
    padding-right: 10px
}

.related-fund-body .related-fund-list li .fund-link {
    align-items: center;
    width: 100%;
    display: flex;
    flex-direction: row;
}

.related-fund-list .fund-list-icon {
    width: 44px;
    height: 44px;
    border: 1px solid var(--border-black5);
    border-radius: 4px;
    overflow: hidden;
    padding: 2px;
}

.related-fund-list .fund-list-icon img {
    width: 100%;
    height: auto;
}

.related-fund-list .fund-list-name {
    padding: 0px 10px;
    width: 94%;
}

.related-fund-list .fn-name {
    margin: 0px;
    font-size: 16px;
    line-height: 20px;
    color: var(--black90);
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 268px;
    overflow: hidden;
}

.related-fund-list .fn-info {
    margin: 0px;
    font-size: 14px;
    line-height: 18px;
}

.related-fund-list .fn-info i {
    font-style: normal;
}

.calculation-rules.modal .modal-dialog {
    margin-top: 15%;
}

.calculation-rules .modal-header {
    padding: 24px 24px 8px;
    border-bottom: 0px;
}

.calculation-rules .modal-header .close {
    display: inline-block;
    width: 40px;
    height: 40px;
    right: 10px;
    top: 10px;
    opacity: 1;
    position: absolute;
}

.calculation-rules .modal-header .modal-title {
    font-family: 'cabinet-grotesk-bold';
    font-size: 22px;
    line-height: 27px;
    color: var(--black90);
}

.calculation-rules .modal-body {
    font-size: 14px;
    line-height: 22px;
    padding: 8px 24px 24px;
}

.tds-applicable {
    margin-bottom: 0px;
    padding-top: 10px;
}

@media (max-width:1200px) {
    .related-fund-list .fn-name {
        max-width: auto;
        white-space: normal;
    }

    .related-fund-body .related-fund-list li {
        width: 49.5%;
    }
}

@media (min-width:992px) {
    .related-funds-content .view-all-funds {
        position: absolute;
        right: 24px;
        top: 18px;
    }

    .related-funds-content .view-all-funds .cta {
        min-width: 211px;
    }
}

@media (max-width:991px) {
    .tds-calci-result .calculation-content {
        overflow: unset !important
    }

    .tds-calci-result .calculation-result {
        background: var(--white-color);
        box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.18);
        border-radius: 8px;
        padding: 24px !important;
    }

    .related-funds-content .view-all-funds {
        padding-top: 20px;
    }

    .related-fund-body {
        padding: 0px 16px 20px 16px;
    }

    .center-aligned-result .after-result-question {
        padding-top: 3px;
    }

    .related-fund-body .related-fund-list li {
        width: 100%;
        margin: 0px
    }

    .related-fund-list .fund-list-name {
        border-bottom: 1px solid #F4F4F4;
        margin-left: 12px;
        padding: 12px 0px 12px 0px;
        position: relative;
    }

    .related-fund-list li:last-child .fund-list-name {
        border-bottom: 0px;
    }

    .related-fund-list .fund-list-name:after {
        border: 1px solid var(--black40);
        border-width: 0 1px 1px 0;
        display: inline-block;
        padding: 4px;
        content: '';
        position: absolute;
        right: 12px;
        -webkit-transition: all .5s;
        -o-transition: all .5s;
        transition: all .5s;
        -ms-transform: rotate(-45deg);
        transform: rotate(-45deg);
        -webkit-transform: rotate(-45deg);
        top: 22px;
    }

    .related-fund-list .fn-name {
        font-size: 14px;
        line-height: 18px;
        margin-bottom: 2px;
    }

    .related-fund-list .fn-info {
        font-size: 12px;
        line-height: 16px;
    }

    .related-fund-list .fund-list-icon {
        width: 36px;
        height: 36px;
        border-radius: 4px;
    }

    .tds-calci-result .mweb-ctas {
        padding-top: 24px;
    }

    .tds-calci-result .mweb-ctas .edit-cta {
        margin-right: 0px;
        width: 100%;
    }

    .calculation-rules .modal-header .modal-title {
        font-size: 18px;
        line-height: 22px;
    }

    .calculation-rules.modal .modal-dialog {
        margin-top: 28%;
    }

    .calculation-rules.modal .modal-dialog p {
        font-size: 14px;
        line-height: 20px;
    }

    .calculation-rules .modal-body {
        padding-top: 0px;
    }
}

/* mweb specific css code for calculator pages */
@media(max-width:767px) {

    /*.sec-calculator .main-content{
                padding-left: 0;
                padding-right: 0;
            }*/
    .sec-calculator .main-content.isApp {
        padding-top: 15px
    }

    .cal-tax-exemption {
        padding: 0 0px;
    }

    .calculation-content {
        border-radius: 0;
        box-shadow: none;
        display: none;
    }

    .sec-calculator .bg-apricot {
        background-color: #ffffff;
    }

    .sec-calculator .form-ctrl {
        background-color: #ffffff;
    }

    .sec-calculator .cal-table th {
        padding: 8px;
        font-size: 13px;
    }

    .sec-calculator .cal-table tr td {
        padding: 12px 12px 0px 8px;
    }

    .new-calc-sidebar {
        padding: 0 16px;
    }

    .new-calc-sidebar .product-btn {
        background: transparent;
        border-radius: 0;
        margin-right: 8px;
    }
}

/*grade css*/
.grade-very-poor {
    color: #D24142 !important;
}

.grade-poor {
    color: #EA5857 !important;
}

.grade-average {
    color: #EEA51F !important;
}

.grade-good {
    color: #53C35C !important;
}

.grade-excellent {
    color: #299A2F !important;
}

/*Panel css removed*/
.tax-form-heading .nps-switch {
    width: auto;
    height: 30px;
}

.tax-form-heading .nps-switch li {
    white-space: nowrap;
    font-size: 14px
}




/*loader css*/

.dotted-loader .dots-group {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-orient: horizontal;
    -webkit-box-direction: normal;
    -ms-flex-direction: row;
    flex-direction: row;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.dotted-loader .dot {
    -webkit-animation: dot-keyframes 1.2s infinite ease-in-out;
    animation: dot-keyframes 1s infinite ease-in-out;
    background-color: #fff;
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    height: 6px;
    width: 6px;
    margin: 0 3px;
}

.dotted-loader .dot:nth-child(2) {
    -webkit-animation-delay: 0.2s;
    animation-delay: 0.2s;
}

.dotted-loader .dot:nth-child(3) {
    -webkit-animation-delay: 0.5s;
    animation-delay: 0.5s;
}

@-webkit-keyframes dot-keyframes {
    0% {
        opacity: 0.9;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.4, 1.4);
        transform: scale(1.4, 1.4);
    }

    100% {
        opacity: 0.9;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
}

@keyframes dot-keyframes {
    0% {
        opacity: 0.9;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }

    50% {
        opacity: 1;
        -webkit-transform: scale(1.4, 1.4);
        transform: scale(1.4, 1.4);
    }

    100% {
        opacity: 0.9;
        -webkit-transform: scale(1, 1);
        transform: scale(1, 1);
    }
}

/*** Commone Css to overWrite css ***/
.before-hide:before {
    display: none !important;
}

.after-hide:after {
    display: none !important;
}

.pr-0 {
    padding-right: 0;
}

.pl-0 {
    padding-left: 0 !important;
}

.pt-0 {
    padding-top: 0;
}

.pb-0 {
    padding-bottom: 0;
}

.calculator-form .input-prop.percentage {
    left: calc(100% - 18px);
}

.items-end {
    align-items: flex-end !important;
}

@media(min-width:992px) {
    .mw150 {
        max-width: 150px;
    }
}

/*** Commone Css to overWrite css ***/