* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

body {
    color: white;
    font-family: sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.4;
    background-color: #FCFAF1;
}

a {
    text-decoration: none;
}

/* Chrome, Safari, Edge, Opera */
input::-webkit-outer-spin-button,
input::-webkit-inner-spin-button {
    -webkit-appearance: none;
}

/* Firefox */
input[type=number] {
    -moz-appearance: textfield;
}

.container {
    margin: 0 auto;
    padding: 0 92px;
    max-width: 1600px;
    width: 100%;
}

@media (max-width: 1024px) {
    .container {
        padding: 0 60px;
    }

    .calculator-section .container {
        padding: 0 20px;
    }
}

@media (max-width: 600px) {
    .container {
        padding: 0 40px;
    }
}

#menu-eqraz li .header__link-top svg {
    display: block;
}

/*  INTRO  */
.intro {
    position: relative;
    height: 868px;
}

.intro__bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    display: block;
    object-fit: cover;
}

.intro:after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #0C0A15;
    opacity: .25;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 0;
    z-index: -1;
}

.intro .container {
    z-index: 2;
}

.intro__inner {
    padding: 433px 0 218px 0;
}

.intro__title {
    font-family: Queens, sans-serif;
    color: #fff;
    margin-bottom: 20px;
    font-size: 65px;
    font-weight: 400;
    font-style: italic;
}

.intro__subtitle {
    margin-bottom: 43px;
    max-width: 620px;
    width: 100%;
    font-family: 'DM sans', sans-serif;
    font-size: 20px;
    letter-spacing: -0.01em;
    font-weight: 400;
    line-height: 1.5;
    color: #fff;
}

.intro__btn {
    padding: 20px 44px;
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
    letter-spacing: 2.3px;
    color: #00205B;
    background-color: white;
}

.pagination {
    display: block;
    margin: 40px 0 60px 0;
    text-align: center;
}

.pagination a {
    width: fit-content;
    padding: 5px 5px;
    font-size: 18px;
    border-radius: 50px;
    color: #00205B;
    font-weight: 300;
}

.current {
    font-size: 18px;
    font-weight: bold;
    color: #00205B;
    padding: 5px 5px;
    border-radius: 50px;
    margin: 0 5px;
}

.posts__content-new {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.eqraz-posts__menu {
    max-width: 872px;
    width: 100%;
    padding: 50px 0 45px 0;
    display: flex;
    justify-content: space-between;
    align-content: center;
    flex-wrap: wrap;
}

.cal-tip ul {
    margin: 20px 20px;
}

.cal-tip ul li {
    list-style: none;
    position: relative;
    margin-bottom: 10px;
}

.cal-tip h6 {
    font-family: 'DM sans', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #FFFFFF;
}

.cal-tip ul li:marker {
    color: #FFFFFF;
}

.cal-tip ul li:before {
    content: "\2022";
    color: #FFFFFF;
    font-weight: bold;
    display: inline-block;
    margin-left: -1em;
    position: absolute;
    top: -2px;
    width: 20px;
    height: 20px;
}

.tooltip_open {
    overflow-y: hidden;
}

.print-btn {
    border: 2px solid #28724F;
    font-family: 'DM sans', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    color: #28724F;
    background: transparent;
    padding: 10px 44px;
    height: 40px;
    display: none;
}

.income-banner-text .note {
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    margin-top: 10px;
}

.calculator-print-logo {
    display: none;
    text-align: center;
}

@media (max-width: 1024px) {
    .intro__title {
        font-size: 54px;
    }

    .intro__subtitle {
        font-size: 18px;
    }
}

@media (max-width: 768px) {
    .intro {
        height: 728px;
    }

    .intro__inner {
        padding: 300px 0 218px 0;
    }

    .intro__title {
        font-size: 44px;
    }

    .intro__subtitle {
        font-size: 15px;
    }

    .intro__btn {
        padding: 16px 36px;
        font-size: 12px;
        letter-spacing: 1px;
    }
}

@media (max-width: 600px) {
    .intro__title {
        font-size: 38px;
    }

    .intro__subtitle {
        font-size: 14px;
    }

    .intro__btn {
        padding: 16px 36px;
        letter-spacing: 1px;
    }
}

@media (max-width: 375px) {
    .intro {
        height: 402px;
    }

    .intro__inner {
        padding: 160px 0 107px;
        display: flex;
        flex-direction: column;
        align-items: center;
    }

    .intro__title {
        font-size: 35px;
        text-align: center;
    }

    .intro__subtitle {
        display: none;
    }

    .intro__btn {
        max-width: 248px;
        width: 100%;
    }
}

/*  POSTS  */
.posts {
    background-color: #FCFAF1;
}

@media (max-width: 600px) {
    .posts .container {
        padding: 0;
    }
}

.posts__inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.posts__menu {
    max-width: 872px;
    width: 100%;
    padding: 50px 0 45px 0;
    display: flex;
    justify-content: space-between;
    align-content: center;
    flex-wrap: wrap;
}

@media (max-width: 600px) {
    .posts__menu {
        padding: 0;
    }
}

.posts__subject {
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.posts__subject.active a {
    font-weight: 700;
}

.posts__subject:last-child .posts__icon-container {
    display: none;
}

@media (max-width: 600px) {
    .posts__subject {
        display: none;
    }
}

.posts__subject:last-child {
    justify-content: end;
}

.posts__name {
    font-size: 14px;
    font-weight: 400;
    color: #00205B;
}

@media (max-width: 1200px) {
    .posts__name {
        font-size: 12px;
    }
}

.posts__subject:not(:last-child) .posts__name {
    margin-right: 90px;
}

@media (max-width: 768px) {
    .posts__subject:not(:last-child) .posts__name {
        margin-right: 60px;
    }
}

.posts__icon-container {
    width: 16px;
    height: 16px;
}

.posts__icon {
    width: 100%;
    height: 100%;
}

/*  Posts Item  */
.posts__content {
    width: 100%;
    display: grid;
    grid-template-columns: 1fr 1fr 1fr 1fr;
    grid-column-gap: 16px;
    grid-row-gap: 16px;
}

@media (max-width: 600px) {
    .posts__content {
        display: flex;
        flex-direction: column;
        grid-column-gap: 0px;
        grid-row-gap: 0px;
    }
}

.posts__card {
    display: none;
    flex-direction: column;
    position: relative;
    z-index: 1;
}

.posts__card:nth-child(-n+6) {
    display: flex;
}

.posts__card:nth-child(6n+6) {
    grid-column: 1/5;
}

.posts__card:nth-child(6n+1) {
    grid-column: 1/3;
    grid-row: 2 span / span 3;
}

@media (max-width: 1024px) {
    .posts__card:nth-child(6n+1) {
        grid-column: 1/5;
    }

    .posts__card:nth-child(6n+2) {
        grid-column: 1/3;
    }

    .posts__card:nth-child(6n+3) {
        grid-column: 5/3;
    }

    .posts__card:nth-child(6n+4) {
        grid-column: 1/3;
    }

    .posts__card:nth-child(6n+5) {
        grid-column: 5/3;
    }
}

.posts__photo {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    z-index: -1;
}

.posts__photo:after {
    content: '';
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    background: rgb(0, 0, 0);
    background: linear-gradient(0deg, rgba(0, 0, 0, 1) -10%, rgba(255, 255, 255, 0) 81%);
}

.posts__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.posts__attr {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.posts__suptitle {
    margin-bottom: 20px;
    display: block;
    color: black;
    background-color: white;
    border-radius: 20px;
    -webkit-box-shadow: 0px 5px 29px -5px rgb(0 0 0);
    box-shadow: 0px 5px 29px -5px rgb(0 0 0);
}

.posts__title {
    font-family: Queens, sans-serif;
    font-weight: 400;
    font-style: italic;
    color: white;
}

.posts__link {
    margin-top: auto;
    overflow: hidden;
}

.posts__subtitle {
    font-weight: 400;
    line-height: 1.5;
    color: white;
}

@media (max-width: 375px) {
    .posts__subtitle {
        line-height: 1.6 !important;
    }
}

.posts__more {
    padding: 62px 0;
    display: flex;
    align-items: center;
    justify-content: center;
}

@media (max-width: 375px) {
    .posts__more {
        padding: 50px 0;
    }
}

.posts__btn {
    padding: 10px 39px;
    font-size: 13px;
    font-weight: 400;
    color: white;
    background-color: #00205B;
    text-align: center;
    border-radius: 20px;
}

/*  Posts Mobile  */
.posts__mobile {
    padding: 16px 0;
    display: none;
    justify-content: center;
    width: 100%;
    background-color: #00205B;
    position: relative;
}

@media (max-width: 600px) {
    .posts__mobile {
        display: flex;
    }
}

.posts__mobile__btn {
    width: 100%;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.posts__mobile__btn svg {
    transition: .5s transform;
}

.posts__mobile__btn span {
    font-size: 14px;
    font-weight: 700;
    margin-right: 8px;
    text-transform: uppercase;
    color: #fff;
}

.posts__mobile__btn.active svg {
    transform: rotate(180deg);
}

.posts__mobile__content {
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    position: absolute;
    left: 0;
    top: 58px;
    z-index: 10;
    background-color: #00205B;
    max-height: 0;
    opacity: 0;
    overflow: hidden;
    pointer-events: none;
    transition: .5s;
    transform-origin: top;
}

.posts__mobile__content.active {
    max-height: 400px;
    opacity: 1;
    pointer-events: visible;
}

.posts__mobile .posts__name {
    margin-right: 0;
    margin-bottom: 20px;
    color: white;
}

.posts__mobile .posts__icon path {
    fill: white;
}

.posts__mobile__subject {
    margin-bottom: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;

}

.posts__mobile__subject.active a {
    font-weight: 700;
    color: #ffcc88;
}

.posts__mobile__subject:first-child {
    margin-top: 30px;
}

/*  Card Size  */
/*  Card Big  */
.card-big {
    width: 100%;
    padding: 37px 38px 36px;
}

.card-big .posts__subtitle {
    max-width: 544px;
    width: 100%;
    font-size: 16px;
}

.card-big .posts__attr {
    margin-bottom: 455px;
}

.card-big .posts__suptitle {
    padding: 8px 17px;
    font-size: 13px;
    font-weight: 400;
}

.card-big .posts__suptitle:not(:last-child) {
    margin-right: 15px;
}

.card-big .posts__title {
    margin-bottom: 7px;
    font-size: 45px;
}

@media (max-width: 1440px) {
    .card-big .posts__attr {
        margin-bottom: 280px;
    }

    .card-big .posts__img {
        object-position: top;
    }
}

@media (max-width: 1200px) {
    .card-big .posts__attr {
        margin-bottom: 180px;
    }

    .card-big .posts__title {
        font-size: 42px;
    }

    .card-big .posts__subtitle {
        font-size: 14px;
    }
}

@media (max-width: 600px) {
    .card-big {
        padding: 20px 16px 20px;
        align-items: start;
    }

    .card-big .posts__attr {
        margin-bottom: 95px;
    }

    .card-big .posts__suptitle {
        padding: 4px 12px;
        font-size: 10px;
    }

    .card-big .posts__suptitle:nth-child(2) {
        padding: 4px 12px;
    }

    .card-big .posts__title {
        font-size: 30px;
        text-align: start;
    }

    .card-big .posts__subtitle {
        font-size: 13px;
        text-align: start;
    }
}

@media (max-width: 375px) {
    .card-big {
        padding: 25px 26px 20px;
    }

    .card-big .posts__title {
        font-size: 25px;
    }

    .card-big .posts__suptitle {
        padding: 4px 12px;
        font-size: 10px;
    }

    .card-big .posts__subtitle {
        font-size: 14px;
    }
}

/*  Card Small  */
.card-small {
    padding: 20px 16px 20px;
}

.card-small .posts__suptitle {
    padding: 5px 12px;
    font-size: 10px;
}

.card-small .posts__suptitle:not(:last-child) {
    margin-right: 8px;
}

.card-small .posts__link {
    min-height: 87px;
}

.card-small .posts__title {
    margin-bottom: 6px;
    font-size: 30px;
}

.card-small .posts__subtitle {
    font-size: 13px;
}

@media (max-width: 1200px) {
    .card-small .posts__title {
        font-size: 25px;
    }

    .card-small .posts__subtitle {
        font-size: 12px;
    }
}

@media (max-width: 1024px) {
    .card-small .posts__attr {
        margin-bottom: 95px;
    }

    .card-small .posts__title {
        font-size: 30px;
    }

    .card-small .posts__subtitle {
        font-size: 13px;
    }
}

@media (max-width: 375px) {
    .card-small {
        padding: 25px 26px 20px;
    }

    .card-small .posts__suptitle {
        padding: 4px 12px;
    }

    .card-small .posts__title {
        font-size: 25px;
    }

    .card-small .posts__subtitle {
        font-size: 14px;
    }
}

/*  Card Full  */
.card-full {
    padding: 222px 20px 70px;
    width: 100%;
    flex-direction: column;
    align-items: center;
}

.card-full .posts__subtitle {
    max-width: 544px;
    width: 100%;
    font-size: 16px;
    text-align: center;
}

.card-full .posts__attr {
    margin-bottom: 8px;
}

.card-full .posts__suptitle {
    padding: 5px 17px;
    font-size: 13px;
    font-weight: 400;
}

.card-full .posts__suptitle:not(:last-child) {
    margin-right: 15px;
}

.card-full .posts__suptitle:nth-child(2) {
    padding: 5px 24px;
}

.card-full .posts__title {
    margin-bottom: 7px;
    font-size: 45px;
    text-align: center;
}

@media (max-width: 1024px) {
    .card-full {
        padding: 125px 20px 70px;
    }

    .card-full .posts__title {
        font-size: 42px;
    }

    .card-full .posts__subtitle {
        font-size: 14px;
    }
}

@media (max-width: 600px) {
    .card-full {
        padding: 20px 16px 20px;
        align-items: start;
    }

    .card-full .posts__attr {
        margin-bottom: 95px;
    }

    .card-full .posts__suptitle {
        padding: 4px 12px;
        font-size: 10px;
    }

    .card-full .posts__suptitle:nth-child(2) {
        padding: 4px 12px;
    }

    .card-full .posts__title {
        font-size: 30px;
        text-align: start;
    }

    .card-full .posts__subtitle {
        font-size: 13px;
        text-align: start;
    }
}

@media (max-width: 375px) {
    .card-full {
        padding: 25px 26px 20px;
    }

    .card-full .posts__title {
        font-size: 25px;
    }

    .card-full .posts__subtitle {
        font-size: 14px;
    }
}

/*  Blog Page  */
.blog {
    height: 470px;
    padding: 170px 0 144px;
    position: relative;
}

@media (max-width: 375px) {
    .blog {
        height: 402px;
        padding: 105px 0 65px;
    }
}

.blog__bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    display: block;
    object-fit: cover;
}

/*.blog:after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #0C0A15;
    opacity: .25;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 0;
    z-index: -1;
}*/
.blog__inner {
    width: 100%;
    display: flex;
    flex-direction: column;
}

.blog__top {
    display: flex;
    flex-direction: column;
    align-items: center;
}

.blog__attr {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-wrap: wrap;
    margin-bottom: 15px;
}

@media (max-width: 375px) {
    .blog__attr {
        margin-bottom: 14px;
    }
}

.blog__suptitle {
    display: block;
    color: black;
    background-color: white;
    border-radius: 20px;
    padding: 5px 17px;
    font-size: 13px;
    font-weight: 400;
}

@media (max-width: 600px) {
    .blog__suptitle {
        margin-bottom: 20px;
        font-size: 10px;
    }
}

@media (max-width: 375px) {
    .blog__suptitle {
        font-size: 10px;
    }
}

.blog__suptitle:not(:last-child) {
    margin-right: 15px;
}

.blog__suptitle:nth-child(2) {
    padding: 5px 24px;
}

.blog__title {
    font-family: Queens, sans-serif;
    font-size: 65px;
    font-weight: 400;
    font-style: italic;
    color: white;
    margin-bottom: 20px;
    text-align: center;
}

@media (max-width: 600px) {
    .blog__title {
        font-size: 48px;
    }
}

@media (max-width: 375px) {
    .blog__title {
        font-size: 35px;
        margin-bottom: 13px;
    }
}

.blog__data {
    font-size: 20px;
    font-weight: 400;
    color: white;
    letter-spacing: -1px;
}

@media (max-width: 600px) {
    .blog__data {
        font-size: 18px;
    }
}

/*  Content  */
.content {
    padding: 50px 0;
}

@media (max-width: 375px) {
    .content {
        padding: 40px 0 121px;
    }
}

@media (max-width: 375px) {
    .content .container {
        padding: 0 25px;
    }
}

.content__inner {
    width: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.content__text {
    /*max-width: 735px;*/
    width: 100%;
}

.content__info {
    color: black;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.94;
}

.content__info:not(:last-child) {
    margin-bottom: 25px;
}

/*  showcase  */
.showcase {}

.showcase__inner {}

.showcase-swiper {
    position: relative;
    height: 700px;
}

@media (max-width: 375px) {
    .showcase-swiper {
        height: 293px;
    }
}

.showcase-wrapper {
    height: 86% !important;
    will-change: transform !important;
}

.showcase-slide {
    width: 100%;
    height: 100%;
}

.showcase-swiper {
    overflow: hidden;
}

.showcase__img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.showcase-pagination {
    display: flex;
    align-items: center;
    justify-content: center;
    bottom: 33px !important;
}

.swiper-pagination-bullet {
    width: 13px !important;
    height: 13px !important;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA4AAAAOCAYAAAAfSC3RAAAABHNCSVQICAgIfAhkiAAAANlJREFUKFNjZMAC1p9/L8D48+f6/0xMhYFmYhewqWFEFwRr+vVzP1DC4D8Dw4f/jEyO2DTDNW48+QKojhD43+hvLtkAUkWZRpDzmH79fE/IPgYGJBuR/URII7KfGTeefH4A6GJ7Qppg8mDN//4bMq4/9cqA8f+/A0DP8hOn+f9CYAAlgAMHpJnp/7/zBDX+Z9jobyERQHmogkygIB6fgyMWBP4zMBbA/Qx0HgPjf3Cy+8fEcCDQVBIYmEgJANl/iAD7vwEUENj8jpFWYYrWH3+uEGgp+QBXgAEAgiRrjMXRRJsAAAAASUVORK5CYII=) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
    background-color: transparent !important;
    opacity: 1 !important;
    transition: .2s background-image !important;
}

.swiper-pagination-bullet:not(:last-child) {
    margin-right: 20px !important;
}

.swiper-pagination-bullet.swiper-pagination-bullet-active {
    width: 33px !important;
    height: 33px !important;
    background-image: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAACIAAAAiCAYAAAA6RwvCAAAABHNCSVQICAgIfAhkiAAAATNJREFUWEdjZKAQVC+53f/vP8Ot9ljV6ZQYxUiJZpAjgPoLIGb8z2yNUZtBrnlkOwTVETDryXcMWQ7B7giIYxj//09qiVWbT2rIkOwQfI4ARxAQMf3/n0yqYzAc0rD5Gdfvj1+/kuoj4tX/fwNMS6Lo6kcdMhoiiBAYTSPoqYHIECFUThCfTfGpxCyBUbIvfRyBvQSGOwToiHagkgrq+JiwKeglMNgh9HYEvIpEqg4YqxbfbmBkZKgn7AcaqvjPEMMIDI1GoBV1NLQGr9GwKBo8UQNzLr3TCdbEiuQYpKYf7SILW5sFoxlAj7IEWytutD0y2h4ZbY/gzvxEtkcGTXeCUDFGqJyhWgeLkEOgzQacJTDdupz4qwM6d8KxO4Z8R4DMI7kTjh51wIbVNGC6uEzpQA0AFnsP4G8+nNQAAAAASUVORK5CYII=) !important;
    background-repeat: no-repeat !important;
    background-size: cover !important;
}

.swiper-pagination-bullet svg {
    display: none;
}

@media (max-width: 375px) {
    .showcase-pagination {
        bottom: 2px !important;
    }

    .swiper-pagination-bullet {
        width: 9px !important;
        height: 9px !important;
    }

    .swiper-pagination-bullet:not(:last-child) {
        margin-right: 13px !important;
    }

    .swiper-pagination-bullet.swiper-pagination-bullet-active {
        width: 22px !important;
        height: 22px !important;
    }
}

@media (max-width: 600px) {
    .swiper-pagination-bullet {
        width: 10px !important;
        height: 10px !important;
    }

    .swiper-pagination-bullet.swiper-pagination-bullet-active {
        width: 25px !important;
        height: 25px !important;
    }
}

.showcase__bottom {
    padding: 55px 0 125px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

@media (max-width: 375px) {
    .showcase__bottom {
        padding: 47px 0 86px;
    }

    .showcase__bottom .container {
        padding: 0 25px;
    }
}

.showcase__text {
    max-width: 735px;
    width: 100%;
    margin: auto;
}

.showcase__info {
    color: black;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.9;
}

.showcase__info:not(:last-child) {
    margin-bottom: 30px;
}

/*  Navigation  */
.navigation {
    padding: 0 0 16px;
}

.navigation__inner {
    display: flex;
    justify-content: space-between;
}

@media (max-width: 600px) {
    .navigation__inner {
        flex-direction: column;
    }
}

.navigation__prev {
    margin-right: 16px;
    align-items: end;
}

.navigation__next {
    align-items: start;
}

.navigation__next,
.navigation__prev {
    width: 50%;
    padding: 97px 40px;
    position: relative;
    display: flex;
    flex-direction: column;
}

@media (max-width: 600px) {

    .navigation__next,
    .navigation__prev {
        width: 100%;
        padding: 57px 25px;
        justify-content: center;
    }

    .navigation__prev {
        align-items: start;
    }

    .navigation__next {
        align-items: flex-end !important;
    }
}

.navigation__img {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
    display: block;
    object-fit: cover;
    object-position: top;
}

.navigation__next:after,
.navigation__prev:after {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #0C0A15;
    opacity: .45;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 0;
    z-index: -1;
}

.navigation__suptitle {
    margin-bottom: 5px;
    font-size: 13px;
    font-weight: 400;
    color: white;
}

.navigation__title {
    font-family: Queens, sans-serif;
    font-size: 30px;
    font-weight: 400;
    font-style: italic;
    color: white;
}

/*  Fixed Item  */

.fixed {
    position: fixed;
    bottom: 92px;
    right: 0;
    z-index: 100;

}

.blog:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -67px;
    width: 70px;
    height: 140px;
    background-image: url("../img/right-star.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.blog:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -67px;
    width: 70px;
    height: 140px;
    background-image: url("../img/left-star.png");
    background-repeat: no-repeat;
    background-size: cover;
}

.single_page_title .blog__title {
    font-style: italic;
    font-weight: 700;
    font-size: 56px;
    line-height: 72px;
    text-align: left;
    color: #00205B;
}

.single_page_title .blog__data,
.single_page_title .blog__name {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    color: #00205B;
}

.single_page_title .blog__name {
    margin-right: 10px;
    text-transform: uppercase;
}

.content__text p img {
    float: right;
    width: 400px !important;
    margin: 20px 0px 20px 30px;
}

.single_page_bottom_cat {
    margin: 30px 0 0;
}

.single_page_bottom_cat .cat-list-tag {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.single_page_bottom_cat .cat-list-tag .category_name {
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    color: #00205B;
    padding-right: 20px;
    position: relative;
    font-family: 'DM sans', sans-serif;
}

.single_page_bottom_cat .cat-list-tag .category_name:after {
    content: "";
    position: absolute;
    right: 10px;
    width: 4px;
    height: 4px;
    background: #00205B;
    top: 50%;
    border-radius: 100%;
}

.single_page_bottom_cat .cat-list-tag .tags_name {
    font-style: normal;
    font-weight: 400;
    font-size: 14px;
    line-height: 18px;
    color: #00205B;
    margin: 0 10px 0 0;
    font-family: 'DM sans', sans-serif;
}

.back_btn a {
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 21px;
    text-align: center;
    color: #00205B;
    font-family: 'DM sans', sans-serif;
}

.back_btn {
    text-align: center;
    margin: 50px 0 0;
}

section.posts.blog_main_parent {
    padding-top: 130px;
}

.blog_featured_image {
    position: relative;
    height: 400px;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: top center;
    display: flex;
    align-items: center;
}

.blog_featured_image .blog_overlay {
    content: '';
    width: 100%;
    height: 100%;
    background-color: #0c0a1547;
    opacity: 1;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 0;
    z-index: 1;
}

.blog_featured_image .container {
    position: relative;
    z-index: 9;
}

.blog_featured_image:before {
    content: "";
    position: absolute;
    left: 0;
    bottom: -67px;
    width: 70px;
    height: 140px;
    background-image: url("../img/right-star.png");
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 2;
}

.blog_featured_image:after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -67px;
    width: 70px;
    height: 140px;
    background-image: url("../img/left-star.png");
    background-repeat: no-repeat;
    background-size: cover;
    z-index: 2;
}

.blog_featured_image .page_title {
    font-style: italic;
    font-weight: 700;
    font-size: 56px;
    line-height: 72px;
    text-align: center;
    color: #FFFFFF;
    width: 100%;
    font-family: Queens, sans-serif;
}

/*.blog_posts ul {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
}*/

.blog_posts ul {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    grid-column-gap: 64px;
    list-style-type: none;
}

.blog_posts ul li {
    max-width: 100%;
}

.blog_posts ul li {
    list-style: none;
    margin-bottom: 40px;
}

.blog_thumbnail {
    height: 300px;
}

.blog_thumbnail img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.blog_posts ul li h2 {
    font-style: italic;
    font-weight: 700;
    font-size: 24px;
    line-height: 31px;
    color: #00205B;
    margin: 15px 0;
    font-family: Queens, sans-serif;
}

.blog_posts ul li p {
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #00205B;
    font-family: 'DM sans', sans-serif;
}

.blog_posts ul li span {
    font-style: normal;
    font-weight: 700;
    font-size: 12px;
    line-height: 16px;
    text-decoration-line: underline;
    color: #00205B;
    margin: 10px 0 0;
    display: block;
    font-family: 'DM sans', sans-serif;
}


@media (max-width: 1024px) {
    .fixed {
        bottom: 20px;
    }

    .blog_posts ul {
        grid-column-gap: 32px;
    }
}

@media (max-width: 767px) {
    .blog_posts ul {
        grid-auto-columns: 1fr;
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        grid-column-gap: 40px;
    }

    .blog_posts {
        width: 100%;
    }
}

@media (max-width: 600px) {
    .fixed {
        width: 100%;
    }

    .single_page_title .blog__title {
        font-size: 26px;
        line-height: 42px;
    }
}

.fixed .container {
    display: flex;
    justify-content: space-between;
}

@media (max-width: 375px) {
    .fixed .container {
        padding: 0 25px;
    }
}

.fixed__item {
    width: 66px;
    height: 66px;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

@media (max-width: 600px) {
    .fixed__item {
        width: 48px;
        height: 48px;
    }
}

.fixed__item:not(:last-child) {
    margin-right: 20px;
}

.fixed__img {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: -1;
}

.fixed__name {
    font-size: 10px;
    font-weight: 700;
    text-transform: uppercase;
    color: white;
}

@media (max-width: 767px) {
    .blog_main_parent .container {
        padding: 34px 25px;
    }

    .blog_posts ul li {
        max-width: 100%;
        flex: 0 0 100%;
    }
}

@media (max-width: 600px) {
    .fixed__name {
        font-size: 7px;
    }

}

.single-page {
    padding-top: 130px;
}

.content__text a {
    text-decoration: underline;
}

/*  calculator css  */
.calculator-section {
    position: relative;
    margin: 185.84px 0 100px 0;
    z-index: 5;
}

.mortgage-calculator h1 {
    font-family: Queens, sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 56px;
    line-height: 72px;
    text-align: center;
    color: #00205B;
    margin: 48px 0;
}

.calculator-section .container {
    max-width: 1320px;
    display: block;
}

.mortgage-cal-btn {
    display: flex;
    align-items: center;
    justify-content: center;
}

.mortgage-cal-btn .btn {
    width: 100%;
    max-width: 270px;
    height: 68px;
    border: 2px solid #00205B;
    font-family: 'DM sans', sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    text-align: center;
    color: #00205B;
    padding: 11px 9px;
    background: transparent;
}

.mortgage-cal-btn .btn.active {
    color: #fff;
    background: #00205B;
    border: 2px solid #00205B;
}

.min-income-btn,
.max-income-btn {
    margin-right: 50px;
}

.calculator-info {
    margin-top: 80px;
    font-family: 'DM sans', sans-serif;
    font-weight: 400;
    font-size: 12px;
    line-height: 14px;
    text-align: center;
    color: #000000;
}

/*.optin-input ul{
    display: flex;
    flex-flow: wrap;
}*/

.maxOption_form .optin-input ul {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    grid-column-gap: 50px;
}

.minOption_form .optin-input ul {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    grid-column-gap: 50px;
    list-style-type: none;
}


/*.optin-input ul li {
    width: 27%;
    display: inline-block;
    font-family: 'DM sans',sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 17px;
    color: #ABB8C3;
    margin: 50px 50px 0 0;
    vertical-align: top;
}*/
.optin-input ul li:nth-child(1),
.optin-input ul li:nth-child(2),
.optin-input ul li:nth-child(3) {
    margin-top: 0;
}

.optin-input ul li:nth-child(3n) {
    margin-right: 0;
}

.optin-input ul li .cal-input {
    width: 100%;
    border-bottom: 1px solid #28724F;
    background: transparent;
    padding: 0 12px 0 0px;
    font-family: 'DM sans', sans-serif;
    font-weight: 500;
    min-width: 168.8px;
    /*font-size: 18px !important;*/
    font-size: 16px !important;
    line-height: 16px;
    color: #00205B;
    padding-bottom: 3px;
}

.amortization-input-form .additional-fileds-ul label input[type=number] {
    padding-left: 12px;
}

.optin-input ul li .cal-input#principle {
    padding-left: 12px;
}

.pl-0 {
    padding-left: 0 !important
}

/*.optin-input ul li select.cal-input {
    min-width: 133.8px;
    padding-left: 0;
    appearance: none;
}*/

.optin-input ul li select.cal-input {
    padding-left: 6px;
    appearance: none;
    width: 133.8px;
}

.optin-input ul li .cal-input+.cal-input--abs {
    position: absolute;
    right: 0;
    bottom: 3px;
}

.optin-input ul li {
    list-style: none;
}

.optin-input ul li .cal-select {
    width: 100%;
    border-bottom: 1px solid #28724F;
    background: transparent;
    font-family: 'DM sans', sans-serif;
    font-weight: 500;
    font-size: 18px;
    line-height: 16px;
    color: #00205B;
    -webkit-appearance: none;
    border-radius: 0;
    padding-bottom: 7px;
}

.number-input {
    position: relative;
    display: block;
}

.number-input svg {
    position: absolute;
    bottom: 3px;
    left: 0 !important;
    height: 22px;
    top: 0;
}

.posts__subject.active_cat a.posts__name {
    padding-bottom: 3px;
    position: relative;
}

.posts__subject.active_cat a.posts__name:before {
    padding-bottom: 1px;
    position: absolute;
    width: 70px;
    height: 1px;
    left: 0;
    right: 0;
    margin: 0 auto;
    content: "";
    background: #00205B;
    bottom: -4px;
}

.cal-option-wrapper {
    display: flex;
    justify-content: space-between;
    margin-top: 15px;
}

.tip-wrapper {
    width: 25%;
}

.cal-option-wrapper .tip-wrapper .cal-tip {

    /*padding: 20px 20px;*/
    z-index: 999;
}

.cal-option-wrapper .tip-wrapper .cal-tip .cal-dynamic-tip,
.cal-option-wrapper .tip-wrapper .cal-tip .cal-default-tip {
    padding: 20px;
    background: #28724F;
}

.minOption_form .optin-input {
    width: 65%;
}

.maxOption_form .optin-input {
    width: 70%;
}

/*.optin-input ul li select option {
    background: #fff !important;
    color:  #000;
}*/

.optin-input ul:nth-child(2),
.optin-input ul:nth-child(3) {
    margin: 50px 0px 0 0;
}

.optin-input ul li:nth-child(3n) {
    margin-right: 0;
}

.cal-tip h5 {
    font-family: 'DM sans', sans-serif;
    font-weight: 400;
    font-size: 18px;
    line-height: 23px;
    text-align: center;
    color: #FFFFFF;
    border-bottom: 1px solid #fff;
    padding-bottom: 20px;
    margin-bottom: 20px;
}

.cal-tip p {
    font-family: 'DM sans', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #FFFFFF;
}

.calculate-wrapper {
    text-align: center;
    vertical-align: top;
    display: flex;
    align-items: center;
    justify-content: center;
    margin: 80px;
}

.calculate-btn {
    font-family: 'DM sans', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    color: #FCF9EF;
    background: #28724F;
    padding: 11px 44px;
    margin-right: 12px;
    height: 40px;
    border: 2px solid #28724F;
}

.range-slider {
    position: relative;
}

.wrap {
    position: relative;
    padding-top: 9px;
}

.optin-input .range {
    cursor: pointer;
    opacity: 0;
    padding: 0;
    z-index: 1;
    width: 100%;
}

.optin-input .range::-ms-tooltip {
    display: none;
}

.optin-input .track {
    width: 99%;
    height: 6px;
    background: rgba(40, 114, 79, 0.41);
    transform: translateY(-183%);
    pointer-events: none;
    border-radius: 5px;
    margin: 0 auto;
}

.optin-input .track-inner {
    width: 0;
    height: 100%;
    background: #28724F;
    border-radius: 5px;
}

.optin-input .thumb {
    width: 30px;
    height: 30px;
    background-color: transparent;
    background-image: url(/documents/2022/08/range.png);
    border-radius: 50%;
    position: absolute;
    top: 51% !important;
    pointer-events: none;
}

.total-down-payment {
    margin: 10px 0 0;
    text-align: center;
}

.total-down-payment span {
    font-size: 13px;
    line-height: 17px;
    text-align: center;
    color: #ABB8C3;
}

.field-name {
    min-height: 20px;
    padding-bottom: 10px;
    display: inline-block;
    width: 100%;
    font-family: 'DM sans', sans-serif;
    font-weight: 500;
    font-size: 13px;
    line-height: 17px;
    color: #717d87;
}

.field-name svg {
    vertical-align: super;
}

.images-wrapper {
    background-image: url(/documents/2022/08/cal-income-bg.png);
    background-repeat: no-repeat;
    background-size: 100% auto;
    padding: 40px 40px;
    display: flex;
    justify-content: space-around;
    position: relative;
    background-position: 0px -100px;
}

.images-wrapper:before {
    background: rgb(0 0 0 / 39%);
    width: 100%;
    height: 100%;
    z-index: 9;
    position: absolute;
    content: "";
    top: 0;
}

.income-banner-text {
    position: relative;
    z-index: 9;
}

.images-wrapper.SK-SASKATOON {
    background-image: url(/documents/2022/08/SK_-Saskatoon.jpeg);
}

.images-wrapper.SK-REGINA {
    background-image: url(/documents/2022/08/SK_-_Regina.jpeg);
}

.images-wrapper.SK-OTHER {
    background-image: url(/documents/2022/08/SK_-_Other.jpeg);
}

.images-wrapper.ON-OTTAWA {
    background-image: url(/documents/2022/08/ON_-_OTTAWA.jpeg);
}

.images-wrapper.ON-OTHER {
    background-image: url(/documents/2022/08/ON_-_OTHER.jpeg);
}

.images-wrapper.MB-WINNIPEG {
    background-image: url(/documents/2022/08/MB_-_Winnipeg.jpeg);
}

.images-wrapper.ON-WINNIPEG {
    background-image: url(/documents/2022/08/MB_-_Winnipeg.jpeg);
}

.images-wrapper.BC-GREATER_VANCOUVER_AREA {
    background-image: url(/documents/2022/08/BC_-Greater_Vancouver.jpeg);
}

.images-wrapper.BC-OTHER {
    background-image: url(/documents/2022/08/BC_-_OTHER.jpeg);
}

.images-wrapper.AB-OTHER {
    background-image: url(/documents/2022/08/AB_-_Other.jpeg);
}

.images-wrapper.AB-EDMONTON {
    background-image: url(/documents/2022/08/AB_-_EDMONTON.jpeg);
}

.images-wrapper.AB-CALGARY {
    background-image: url(/documents/2022/08/AB_-_Calgary.jpeg);
}

.images-wrapper.MB-OTHER {
    background-image: url(/documents/2022/08/MB_-_Other.jpeg);
}

.images-wrapper.NFL-Newfoundland-Labrador {
    background-image: url(/documents/2022/08/NFL-Newfoundland-Labrador.jpeg);
}

.images-wrapper.NB-New-Brunkswick {
    background-image: url(/documents/2022/08/NB-New-Brunkswick.jpeg);
}

.images-wrapper.NS-Nova-Scotia {
    background-image: url(/documents/2022/08/NS-Nova-Scotia.jpeg);
}

.images-wrapper.PE-Prince-Edward {
    background-image: url(/documents/2022/08/PE-Prince-Edward.jpeg);
}

.income-required {
    margin: 55px 0;
    display: none;
}

.images-wrapper h4 {
    font-family: 'DM sans', sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    color: #FFFFFF;
}

.images-wrapper p {
    font-family: 'DM sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 12px;
}

.monthly-mortgage-payment-wrapper {
    margin: 33px 0;
}

.monthly-mortgage-payment-wrapper ul {
    display: flex;
    justify-content: space-around;
    list-style: none;
}

.m-payment-col h6 {
    font-family: 'DM sans', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 14px;
    line-height: 18px;
    text-align: center;
    color: #00205B;
    margin-bottom: 20px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.m-payment-col p {
    font-family: 'DM sans', sans-serif;
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 27px;
    text-align: center;
    color: #28724F;
}

.monthly-mortgage-payment-wrapper ul li {
    position: relative;
    padding: 10px 10px;
    width: 100%;
}

.monthly-mortgage-payment-wrapper ul li:after {
    right: 0;
    position: absolute;
    content: "";
    width: 2px;
    background: #00205B;
    top: 0;
    height: 100%;
    bottom: 0;
}

.monthly-mortgage-payment-wrapper ul li:last-child:after {
    display: none;
}

.tooltip {
    position: relative;
    margin-left: 10px;
}

.tooltip.cash-required-tooltip .toolttip-wrapper {
    left: unset;
    right: 0;
}

.toolttip-wrapper p {
    font-family: 'DM sans', sans-serif;
    font-style: normal;
    font-weight: 400;
    font-size: 12px;
    line-height: 16px;
    color: #FFFFFF;
}

.toolttip-wrapper {
    position: absolute;
    width: 200px;
    height: fit-content;
    left: 0;
    background: #28724F;
    border-radius: 5px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px 15px;
    z-index: 1;
    display: none;
}

.tooltip:hover .toolttip-wrapper {
    display: block;
}

.col-option-wrapper {
    display: none;
}

.mobile-tooltip {
    display: none;
}

.empty_error {
    font-size: 10px;
    color: #FF0000;
    margin-top: 4px;
    display: block;
}

.perm_error {
    font-size: 10px;
    color: #FF0000;
    margin-top: 4px;
    display: block;
}


/* amortization-calculators */
.amortization-calculators {
    position: relative;
    margin: 185.84px 0 100px 0;
    z-index: 5;
}

.amortization-content h1 {
    font-family: 'Queens';
    font-weight: 700;
    font-size: 56px;
    line-height: 72px;
    text-align: center;
    color: #00205B;
}

.amortization-content p {
    font-family: 'DM sans', sans-serif;
    font-style: normal;
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    text-align: center;
    color: #00205B;
    margin-top: 10px;
}

.ac-option-input.optin-input {
    width: 100%;
}

/*.ac-option-input.optin-input ul {display: none;}*/
.ac-option-input.optin-input ul li {
    width: 100%;
}

.amortization-cal-wrapper .additional-fileds-ul li .number-input .error {
    color: red;
    font-size: 10px;
    font-weight: bold;
    padding-left: 0px;
}

.additional-fileds-ul .number-input svg {
    top: 0;
    bottom: unset !important;
}

.amortization-cal-wrapper .additional-fileds-ul li {
    position: relative;
}

.ac-option-input.optin-input ul li {
    width: 100%;
    margin: 0 0 29px 0;
}

.ac-option-input.optin-input ul li label {
    display: flex;
    align-items: baseline;
}

.amortization-cal-wrapper {
    display: flex;
    width: 80%;
    margin: 17px auto 0;
}

.a-cal-left {
    width: 35%;
}

.field-name.additional-expenses {
    font-weight: 500;
    font-size: 13px;
    line-height: 17px;
    color: #000000;
    margin-left: 10px;
}

.a-cal-right .ac-payment-table th {
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    color: #00205B;
    font-family: 'DM sans', sans-serif;
    width: 33%;
    text-align: left;
    border-right: 1px solid #ABB8C3;
    padding: 14px 0;
}

.a-cal-right .ac-payment-table th td {
    font-weight: 700;
    font-size: 18px;
    line-height: 23px;
    color: #28724F;
    font-family: 'DM sans', sans-serif;
    margin-bottom: 28px;
    display: inline-block;
}

.a-cal-right .ac-payment-table tr td {
    font-weight: 700;
    font-size: 18px;
    line-height: 23px;
    color: #28724F;
    font-family: 'DM sans', sans-serif;
    width: 33%;
    text-align: center;
    padding: 14px 0;
}

.a-cal-right .ac-payment-table {
    border-collapse: collapse;
    width: 100%;
}

.a-cal-right {
    width: 75%;
    padding-left: 70px;
}

.a-cal-right .ac-payment-table tr {
    display: flex;
    justify-content: space-between;
}

.a-cal-right .ac-payment-table tr:first-child {
    border-bottom: 1px solid #ABB8C3;
    padding-bottom: 15px;
}

.a-cal-right .ac-payment-table tr:first-child th {
    text-align: center;
    padding-top: 0;
}

.a-cal-right .ac-payment-table tr:first-child th:first-child {
    text-align: left;
    border-right: 0;
}

.a-cal-right .ac-payment-table tr:nth-child(1) th {
    border: 0;
}

.amortization-cal-chart {
    display: flex;
    justify-content: space-between;
    margin-top: 64px;
    align-items: flex-start;
}

.amortization-cal-chart h2 {
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    text-align: center;
    color: #00205B;
    margin-bottom: 24px;
    font-family: 'DM sans', sans-serif;
}

.amortization-tabs {
    margin-top: 60px;
    max-width: 80%;
    margin-left: auto;
    margin-right: auto;
    position: relative;
}

.amortization-tabs .tab .tablinks {
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    text-align: center;
    color: #00205B;
    margin-right: 28px;
    background: transparent;
    margin-bottom: 10px;
    padding-bottom: 10px;
    font-family: 'DM sans', sans-serif;
    display: flex;
    align-items: center;
    position: relative;
    transition: all .3s;
    padding-left: 0;
}

.amortization-tabs .tab .tablinks:not(.active) svg {
    margin-right: 15px;
    opacity: 1
}

.amortization-tabs .tab .tablinks.active svg {
    /*    position: absolute;*/
    /*    left: 0;*/
    margin-right: 15px;
    opacity: 1;
}

.amortization-tabs .tab .tablinks.active svg path {
    fill: #00205B;
}

.amortization-tabs .tab {
    margin-bottom: 10px;
    display: block;
}

.amortization-tabs .tab .tablinks:last-child {
    margin-right: 0;
}

.annualSchedule-table {
    width: 100%;
    text-align: center;
    border-collapse: collapse;
}

.annualSchedule-table tr th {
    font-weight: 500;
    font-size: 12px;
    line-height: 150%;
    color: #121212;
    font-family: 'DM sans', sans-serif;
    border: 0;
    padding: 15px 0;
}

.annualSchedule-table tr td {
    font-weight: 400;
    font-size: 12px;
    line-height: 12px;
    text-align: center;
    color: #00205B;
    padding: 15px 0;
}

.annualSchedule-table tr {
    padding: 15px 0;
}

.annualSchedule-table tr:nth-child(odd) {
    background: rgba(255, 255, 255, 0.25);
    border: 0.65034px solid rgba(85, 86, 90, 0.12);
}

.annualSchedule-table tr:nth-child(even) {
    background: rgba(0, 32, 91, 0.11);
    border-width: 0px 0.65034px;
    border-style: solid;
    border-color: rgba(85, 86, 90, 0.12) !important;
    border: 1px solid;
}

.cal-btn-wrapper .calculate-btn {
    width: 100%;
}

.amortization-content .calculator-info {
    font-weight: 400;
    font-size: 10px;
    line-height: 13px;
    text-align: center;
    color: #000000;
    margin: 70px 0;
    font-family: 'DM sans', sans-serif;
}

.amortization-payemnt-col {
    width: 35%;
    padding: 0 20px;
}

.amortization-payemnt-col+.amortization-payemnt-col {
    width: 65%
}

.extra-payments-option #month__number {
    min-width: 100%;
}

.extra-payments-option {
    max-width: 100%;
    margin: 20px 0 0 auto;
}

.extra-payments-option label .field-name {
    /* max-width: 45%;*/
}


.extra-payments-option label span.number-input {
    width: 168.8px;
    margin-left: auto;
}

.extra-payments-option label span #month__number {
    width: 100% !important;
    min-width: 100% !important;
}

.extra-payments-option label span {
    width: calc(100% / 2);
}

.extra-payments-option label .number-input {
    text-align: right;
}

.extra-payments-option label .number-input #month__number {
    width: 85%;
    min-width: unset;
}

.total__amnt .number-input .extra_payments_options {
    width: 55%;
    min-width: unset;
}

/*.ac-option-input.optin-input ul li label .number-input select {
    font-size: 12px !important;
}*/

.extra-payments-option .number-input .error {
    font-size: 10px;
    text-align: left;
    color: red;
    font-weight: bold;
    width: 100% !important;
    display: block;
}


#extra_payments_options--amount label {
    position: relative;
}


#extra_payments_options--amount label .combined__fields .number-input span.error {
    width: 168.8px;
    position: absolute;
    min-width: 168.8px;
    bottom: -30px;
}

.total__amnt {
    display: flex;
    flex-wrap: wrap;
}

.total__amnt .combined__fields {
    width: 168.8px;
    margin-left: auto;
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    -ms-grid-rows: auto;
    grid-template-rows: auto;
    grid-column-gap: 4px;
    border-bottom: 1px solid #28724F;
}

.amortization-input-form .optin-input ul li .combined__fields .cal-input {
    min-width: 50.8px !important;
    padding-right: 0;
    border-bottom: 0px !important;

}

.extra-payments-option label .combined__fields span.number-input {
    width: 100%;
}

.total__amnt label {
    width: 100%;
}

.amortization-input-form .optin-input ul li select.cal-input {
    font-size: 16px !important;
}

.combined__fields .middle-text {
    font-size: 14px;
    text-align: center;
    color: var(--blue-color);
    line-height: 1em;
    display: flex;
    justify-content: center;
    align-items: center;
}

.combined__fields input {
    padding-left: 10px !important;
}

.repayment__box {
    margin-top: 40px;
}

.heading_repayment {
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    color: #00205B;
    font-family: 'DM sans', sans-serif;
    padding: 14px 0;
    border-bottom: 1px solid #ABB8C3;
}

.profit__savings,
.time__saved {
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    color: #00205B;
    font-family: 'DM sans', sans-serif;
    padding: 14px 0 0;
}

.profit__savings span,
.time__saved span {
    font-weight: 500;
    font-size: 18px;
    line-height: 23px;
    color: #28724F;
    font-family: 'DM sans', sans-serif;
    margin-left: 10px;
}

@media (max-width: 1024px) {

    .extra-payments-option label .field-name {
        max-width: 50%;
    }

    .extra-payments-option {
        max-width: 100%;
    }
}


@media (max-width: 875px) {
    .total__amnt .combined__fields {
        width: 100%;
        grid-template-columns: 1fr auto 1fr;
    }

    .amortization-input-form .optin-input ul li .combined__fields .cal-input {
        min-width: 100% !important;
        text-align: center;
    }

    .extra-payments-option label .field-name {
        max-width: 100%;
        width: calc(100%);
    }

    .extra-payments-option label span.number-input {
        width: 100%;
        margin-left: auto;
    }
}





/*end amortization-calculators */

@media (max-width:875px) {

    .extra-payments-option label .number-input #month__number {
        width: 100%;
    }

    .optin-input ul li select.cal-input {
        width: 100%;
    }

    .calculator-section {
        margin: 150px 0 0 0;
        padding-bottom: 30px !important;
    }

    .mortgage-calculator h1 {
        font-size: 26px;
        line-height: 35px;
    }

    .mortgage-cal-btn {
        display: block;
    }

    .mortgage-cal-btn .btn {
        width: 100%;
        max-width: 100%;
        margin: 0 0 10px 0;
        font-size: 14px;
        line-height: 18px;
    }

    .calculate-wrapper {
        display: block;
        width: 100%;
        margin-left: 0;
        margin: 20px 0;

    }

    .cal-option-wrapper {
        display: block;
    }

    .optin-input {
        width: 100%;
    }

    .optin-input ul li {
        width: 100%;
        margin: 0 0 20px 0;
    }

    .monthly-mortgage-payment-wrapper ul {
        display: flex;
        flex-flow: wrap;
        justify-content: left;
    }

    .monthly-mortgage-payment-wrapper ul li {
        width: 50%;
        padding: 20px 5px 20px;
        display: inline-block;
        border-right: 1px solid;
        border-bottom: 1px solid;
    }

    .monthly-mortgage-payment-wrapper ul li:after {
        display: none;
    }

    .monthly-mortgage-payment-wrapper ul li:nth-child(even) {
        border-right: 0;
    }

    .monthly-mortgage-payment-wrapper ul li:nth-child(3) {
        border-bottom: 0;
    }

    .monthly-mortgage-payment-wrapper ul li:nth-child(4) {
        border-bottom: 0;
    }

    .calculate-btn {
        margin: 30px 0 20px;
        width: 100%;
    }

    .print-btn {
        width: 100%;
        margin-bottom: 20px;
    }

    .mobile-tooltip {
        background: #28724F;
        padding: 20px;
        display: block;
        position: absolute;
        bottom: 0;
        left: 0;
        right: 0;
    }

    .mobile-tooltip h4 {
        font-weight: 700;
        font-size: 14px;
        line-height: 18px;
        text-align: center;
        color: #FCF9EF;
        align-items: center;
        display: flex;
        justify-content: center;
    }

    .mobile-tooltip h4 svg {
        margin-left: 10px;
    }

    .cal-tip {
        margin-bottom: 20px;
    }

    .cal-tip h5 {
        font-weight: 500;
        font-size: 18px;
        line-height: 23px;
    }

    .cal-tip-wrapper {
        position: absolute;
        background: #28724F;
        left: 0;
        right: 0;
        bottom: 0;
        display: none;
        height: 90vh;
        margin-bottom: 59px;
        z-index: 99;
    }

    .cal-tip-wrapper.open {
        display: block;
        padding: 30px;
        overflow-y: scroll;
    }

    /*     .tip-wrapper {
        display: none;
    } */
    .mobile-tooltip h4 svg {
        margin-left: 10px;
    }

    .mobile-tooltip.open-tooltip h4.close-quick-tip {
        display: flex;
    }

    .images-wrapper h4 {
        font-size: 18px;
        line-height: 24px;
    }

    .images-wrapper p {
        font-weight: 700;
        font-size: 16px;
        line-height: 23px;
    }

    .images-wrapper {
        padding: 20px 20px;
    }

    .images-wrapper h4 {
        font-size: 18px;
        line-height: 24px;
    }

    .images-wrapper p {
        font-weight: 700;
        font-size: 16px;
        line-height: 23px;
    }

    .images-wrapper {
        padding: 20px 20px;
        background-position: 100% 100%;
    }

    .m-payment-col h6 {
        font-size: 14px;
        line-height: 18px;
        margin-bottom: 10px;
        align-items: baseline;
    }

    .m-payment-col p {
        font-size: 14px;
        line-height: 21px;
    }

    .payment-info-modal.tooltip-modal.modal {
        position: fixed;
        background: rgba(0, 0, 0, 0.25);
        top: 0;
        bottom: 0;
        height: 100vh;
        width: 100%;
        left: 0;
        align-items: center;
        justify-content: center;
        display: none;
    }

    .payment-info-modal.tooltip-modal.modal.open {
        display: flex;
    }

    .payment-info-modal.tooltip-modal.modal .toolttip-wrapper {
        display: block !important;
        right: 0;
        margin: 0 auto;
        max-width: 260px;
        height: fit-content;
        width: 100%;
        padding: 10px 20px 20px 20px;
    }

    .close-modal {
        text-align: right;
        margin-bottom: 20px;
    }

    .tooltip:hover .toolttip-wrapper {
        display: none;
    }

    .calculator-info {
        margin: 10px 0 80px;
    }

    .hover_tooltip {
        display: none;
    }

    .amortization-cal-wrapper {
        display: block;
        width: 100%;
        padding: 0 20px;
    }

    .a-cal-left {
        width: 100%;
    }

    .ac-option-input.optin-input ul li label {
        display: block;
    }

    .a-cal-right {
        width: 100%;
        padding: 0;
        margin-top: 40px;
    }

    .amortization-cal-chart {
        display: block;
    }

    .amortization-content h1 {
        font-size: 26px;
        line-height: 35px;
    }

    .amortization-content p {
        font-size: 14px;
    }

    .amortization-cal-wrapper {
        margin-top: 40px;
    }

    .a-cal-right .ac-payment-table th {
        font-size: 14px;
    }

    .a-cal-right .ac-payment-table tr td {
        font-size: 14px;
    }

    .amortization-cal-chart h2 {
        font-size: 14px;
    }

    .amortization-tabs .tab .tablinks {
        font-size: 14px;
    }

    .amortization-payemnt-col {
        width: 100% !important;
        padding: 0;
    }
}

/*******1march 2023********/


@media (max-width: 875px) {

    .maxOption_form .optin-input {
        width: 100%;
    }

    .minOption_form .optin-input {
        width: 100%;
    }

    .additional--fields {
        display: flex !important;
        align-items: baseline
    }
}

@media (max-width: 600px) {

    .minOption_form .optin-input ul {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        margin: 20px 0 0 0;
    }

    .maxOption_form .optin-input ul {
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        margin: 20px 0 0 0;
    }


}


.designer--checkbox {
    position: absolute;
    left: -100%;
    opacity: 0
}

.designer--checkbox+label {
    width: 16px;
    height: 16px;
    background: #fff;
    margin: 0 0 -2px 0;
    border-radius: 2px;
    border: 1px solid #00205B;
    position: relative
}

.designer--checkbox:checked+label:after {
    transform: rotate(45deg);
    content: '';
    position: absolute;
    border-right: 2px solid #00205B;
    border-bottom: 2px solid #00205B;
    width: 10px;
    height: 20px;
    left: 1px;
    top: -10px
}

#extra_payments_options--amount .middle-text {
    margin-left: 12px;
    margin-bottom: 3px;
}

select#extra_payments_amount--year {
    color: #28724F;
    appearance: auto;
    width: auto;
    text-align: right;
    font-size: 13px !important;
}

.cal-input.extra_payments_options[name="extra_payments_options"] {
    appearance: auto;
}



/*******single page listing css**********/

.single__list {
    padding-left: 15px;
}

.single__list li {
    font-size: 14px;
    line-height: 21px;
}



.chart-wrapper ul li {
    display: flex;
    flex-direction: row-reverse;
    justify-content: space-between;
    align-items: center;
    font-size: 12px;
    color: var(--blue-color);
    font-family: 'DM sans', sans-serif;
    margin-bottom: 0px;
}

.chart-wrapper ul li span {
    margin-right: 0;
    height: 5px;
    border: 0px;
    width: 20px;
}

.chart-wrapper .chart-legend ul {
    margin-top: 30px;
}

.chart-wrapper canvas#payment_breakdown_chart {
    width: 100% !important;
    margin-right: 0px;
}

.amortization-input-form .optin-input ul li select.number-of-term-year {
    appearance: auto;
}


/******pie--legend css********/

.pie__legends {
    width: 100%;
    margin-top: 30px;
}

.chart-wrapper ul li:nth-child(2) span {
    border: 0.5px solid #000;
}

.skip__year {
    position: relative;
}

.skip__year select {
    background-color: transparent;
}

.lebel_skip {
    text-transform: uppercase;
    font-size: 12px;
    font-weight: bold;
    color: var(--blue-color);
}

.skip__year select {
    width: 180px;
    font-size: 12px;
}


/******mortage-calculator*********/


.optin-input ul li input[type=number] {
    padding-left: 10px !important;
}

.minOption_form .optin-input ul li select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url(../img/caret.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.maxOption_form .optin-input ul li select {
    appearance: none;
    -webkit-appearance: none;
    background-image: url(../img/caret.png);
    background-repeat: no-repeat;
    background-position: right center;
}

.minOption_form .same__margin {
    margin: 75px 0;
}

.minOption_form .min-down-payment-section .button.min-income-btn {
    margin: 0 auto;
}

.minOption_form .page-test ul {
    list-style: none;
    max-width: 380px;
    margin: 0 auto;
    text-align: center;
}

.minOption_form .page-test ul label .number-input input {
    background-color: transparent;
    min-height: 30px;
    border-bottom: 1px solid #28724F;
}

.minOption_form .min-down-payment-section ul label .field-name .number-input {
    max-width: 168px;
    margin: 10px auto;
}


.minOption_form .min-down-payment-section .minOptionpage-test ul {
    max-width: 380px;
    margin: 20px auto 0 0;
}

.minOption_form .minOptionpage-test ul label .field-name .number-input {
    max-width: 168px;
    /*    margin: 10px auto 10px 0;*/
}

.minOption_form .min-down-payment-section ul label .field-name {
    text-align: center;
}

.minOption_form .min-down-payment-section ul label .field-name .number-input input {
    background-color: transparent;
    min-height: 24px;
    border-bottom: 1px solid #367250;
    width: 100%;
    color: var(--blue-color);
    font-size: 16px;
}

.minOption_form .min-down-payment-section ul label .field-name .error {
    color: #D52E2E;
    font-size: 10px;
    font-weight: bold;
    line-height: 16px;
}

.minOptionpage-test .calculate-wrapper {
    margin: 40px 0;
}

.minOptionpage-test ul {
    list-style: none;
}

.minOption_form .calculate-wrapper button {
    display: flex;
    justify-content: center;
    align-items: center;
    line-height: 1em;
}

.minOption_form .mortgage-cal-btn button {
    display: flex;
    justify-content: center;
    align-items: center;
}

.minOption_form .minOptionpage-test .calculate-wrapper {
    margin-bottom: 0px;
}

.minOption_form .minOptionpage-test .income-required .monthly-mortgage-payment-wrapper ul {
    max-width: 100%;
}

.minOption_form .minOptionpage-test .income-required .monthly-mortgage-payment-wrapper ul p {
    font-size: 24px;
}

/*.minOption_form .minOptionpage-test .income-required .monthly-mortgage-payment-wrapper ul li::after {

    display:  none;
}

.cal-property-you-can-afford, .minOptionpage-test{
    display:none;
}*/


@media (max-width: 767px) {
    .images-wrapper {
        flex-wrap: wrap;
        background-size: cover;
    }

    .images-wrapper .income-banner-text {
        margin-bottom: 10px;
    }

    .images-wrapper .income-banner-text:last-child {
        margin-bottom: 0px;
    }

    .images-wrapper p {
        margin: 8px 0 0;
    }

    .minOption_form .minOptionpage-test .income-required .monthly-mortgage-payment-wrapper ul h6 {
        font-size: 14px;
    }

    .minOption_form .minOptionpage-test .income-required .monthly-mortgage-payment-wrapper ul p {
        font-size: 16px;
    }

    .max-down-payment-section .income-required p {
        font-size: 16px !important;
        font-weight: 500;
        margin-top: 0;
    }


    .max-down-payment-section .income-required h6 {
        font-size: 14px !important;
        min-height: auto;
    }

}

.minOption_form .have_hover_tooltip .empty_error {
    position: unset !important;
}

.maxOption_form .optin-input ul {
    grid-gap: 16px;
}

.maxOption_form .optin-input ul .have_hover_tooltip .empty_error {
    position: unset;
}

.maxOption_form .optin-input ul {
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr 1fr;
    grid-template-columns: 1fr 1fr 1fr;
    grid-column-gap: 40px;
}


.max-down-payment-section .cal-property-you-can-afford {
    text-align: center;
}

.max-down-payment-section .cal-property-you-can-afford button {
    margin: 0 auto;
    border: 0px;
    color: #00205B;
    display: flex;
    align-items: center;
    justify-content: center;
}

.max-down-payment-section .minOptionpage-test {
    max-width: 100%;
    margin: 20px 0 0 auto;
}

.maxOption_form .max-down-payment-section .minOptionpage-test ul {
    display: block;
}

.maxOption_form .max-down-payment-section .minOptionpage-test .optin-input {
    width: 70%;
}

.max-down-payment-section .minOptionpage-test .number-input {
    max-width: 168px;
    margin: 10px auto;
}

.max-down-payment-section .minOptionpage-test .number-input input {
    background-color: transparent;
    min-height: 24px;
    border-bottom: 1px solid #367250;
    width: 100%;
    padding-left: 12px;
    font-size: 16px;
}

.max-down-payment-section .minOptionpage-test .error {
    color: #D52E2E;
    font-weight: 500;
    font-size: 10px;
}

.max-down-payment-section .income-required h6 {
    font-size: 20px;
}

.max-down-payment-section .income-required p {
    font-size: 16px;
}

.max-down-payment-section .income-required ul li:after {
    display: none;
}

.max-down-payment-section .income-required .toolttip-wrapper p {
    font-size: 12px !important;
}


.minOption_form .calculator-option.cal-option-wrapper {
    position: relative;
}

.maxOption_form .calculator-option.cal-option-wrapper {
    position: relative;
}

.minOption_form .calculator-option .tip-wrapper {
    position: relative;
}

.maxOption_form .calculator-option .tip-wrapper {
    position: relative;
}

.minOption_form .calculator-option .tip-wrapper .cal-tip {
    /*     position: absolute; */
    right: 0;
    width: 100%;
    top: 0;
}

.minOption_form .calculator-option .tip-wrapper .cal-tip {
    /*     position: absolute; */
    right: 0;
    width: 100%;
    top: 0;
}


.minOption_form .minOptionpage-test .calculator-option .optin-input {
    width: 70%;
}

.minOptionpage-test {
    margin-top: 20px;
}

.maxOption_form .max-down-payment-section .minOptionpage-test .optin-input ul {
    max-width: 380px;
    margin-left: auto;
}

.minOptionpage-test .calculator-option {
    margin-top: 20px;
}

.minOption_form .minOptionpage-test .calculator-option .optin-input ul {
    display: block;
    margin: 20px 0 0 auto;
}

.minOption_form .minOptionpage-test .calculator-option {
    margin-top: 0;
}

.minOption_form .min-down-payment-section .minOptionpage-test ul .field-name {
    /*    text-align: left;*/
}

.cal-option-wrapper .tip-wrapper .cal-tip:has(< .cal-default-tip:empty) {
    display: none;
}

.minOptionpage-test .income-required .monthly-mortgage-payment-wrapper {
    display: block;
    width: 100%;
}

@media (max-width: 767px) {

    .maxOption_form .optin-input ul {
        grid-auto-columns: 1fr;
        -ms-grid-columns: 1fr;
        grid-template-columns: 1fr;
        grid-column-gap: 40px;
    }

    .maxOption_form .max-down-payment-section .minOptionpage-test .optin-input {
        width: 100%;
    }

    .max-down-payment-section .minOptionpage-test .number-input {
        max-width: 60%;
    }

    .minOption_form .minOptionpage-test .calculator-option .optin-input {
        width: 100%;
    }

    .minOption_form .minOptionpage-test ul label .field-name .number-input {
        max-width: 100%;
    }

}

.maxOption_form .cal-option-wrapper .tip-wrapper .cal-tip {
    /*     position: absolute; */
    top: 0;
    right: 0;
}


.min-down-payment-section .mortgage-cal-btn .btn.active {
    color: #00205B;
    border: 0px;
    background-color: transparent;
}


.final__incomebg {
    background-image: url(../img/final-calculationbg.jpg);
    background-size: cover;
    background-repeat: no-repeat;
    position: relative;

}

.final__incomebg .monthly-mortgage-payment-wrapper {
    padding: 40px 40px;
    position: relative;
    z-index: 1;
}

.final__incomebg .monthly-mortgage-payment-wrapper:before {
    content: "";
    background: rgb(0 0 0 / 39%);
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.final__incomebg h6 {
    font-family: 'DM sans', sans-serif;
    font-weight: 700;
    font-size: 20px;
    line-height: 30px;
    text-align: center;
    color: #FFFFFF;
    margin-bottom: 12px;
}

.final__incomebg p {
    font-family: 'DM sans', sans-serif;
    font-weight: 700;
    font-size: 16px;
    line-height: 20px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 0px;
}

@media (max-width: 876px) {

    .final__incomebg .monthly-mortgage-payment-wrapper ul li {
        width: 100%;
        padding: 0;
        border: 0px;
    }

    .final__incomebg .monthly-mortgage-payment-wrapper {
        padding: 20px 20px;
    }

    .final__incomebg h6 {
        font-size: 18px;
        line-height: 25px;
    }

    .final__incomebg p {
        font-size: 16px;
        line-height: 18px;
        margin-top: 15px;
    }

    .max-down-payment-section .income-required h6 {
        margin-bottom: 5px;
    }

    .minOption_form .minOptionpage-test ul label .field-name .number-input {
        max-width: 60%;
    }

    .minOption_form .minOptionpage-test .calculator-option .optin-input ul {
        margin: auto;
    }

    .maxOption_form .max-down-payment-section .minOptionpage-test .optin-input ul {
        margin: auto;
    }

    .maxOption_form .max-down-payment-section .minOptionpage-test .optin-input {
        width: 100%
    }
}


.maxOption_form .calculate-wrapper button.button.calculate-btn.max-calculate-btn {
    margin: 0 auto;
}

.mortgage-calculator .minOptionpage-test .cal-dynamic-tip {
    display: none;
}

.maxOption .cal-option-2 .cal-dynamic-tip {
    padding: 0px;
}

/*.minOption_form .cal-tip .cal-dynamic-tip {
    padding: 0 !important;
}*/


/********scroll-top-css**********/

.scoll_top {
    display: none;
    justify-content: center;
    height: 90px;
    width: 90px;
    background-color: var(--blue-color);
    border-radius: 100%;
    align-items: center;
    flex-wrap: wrap;
    flex-direction: column;
    padding: 15px;
    position: fixed;
    bottom: 50px;
    right: 150px;
    box-shadow: 1px 2px 3px rgba(0, 0, 0, 0.5);
}

.scoll_top-active {
    display: flex;
    cursor: pointer;
}

.scoll_top p {
    color: #fff;
    margin: 0;
    font-size: 100%;
    text-transform: capitalize;
    line-height: 1em;
}

.scoll_top img {
    margin-bottom: 5px;
    width: 18px;
}

#monthlySchedule {}

@media (max-width: 875px) {

    .scoll_top p {
        display: none;
    }

    .scoll_top {
        height: 50px;
        width: 50px;
    }

    .scoll_top img {
        margin-bottom: 0px;
    }

}

@media (max-width: 767px) {
    .scoll_top {
        height: 35px;
        width: 35px;
        right: 10px;
        padding: 0;
        bottom: 200px;
    }



    .scoll_top img {
        margin-bottom: 0px;
        width: 15px;
    }
}

button#print {
    margin-top: 15px;
}


/****************april-2023********************/

/*************minimum calculator new css********************/


.minimum__calculator .col-option-wrapper.minOption {
    display: block;
}

.minimum__calculator .mortgage-cal-btn .btn {
    max-width: unset;
}



.minimum__calculator .mortgage-cal-btn .btn {
    max-width: unset;
    text-align: left;
    border: 0px;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
}

.alphabatic-order {
    font-size: 59px;
    color: rgb(0 32 91 / 25%);
    font-family: Queens, sans-serif;
    display: inline-flex;
    height: 100%;
    line-height: 39px;
}

.minimum__calculator .mortgage-cal-btn {
    display: grid;
    grid-template-columns: auto auto auto auto;
    grid-auto-columns: 1fr;
    -ms-grid-columns: auto auto auto;
    grid-template-rows: auto;
    grid-column-gap: 48px;
    grid-template-columns: repeat(5, 1fr);

}

.btn__copytext {
    font-size: 14px;
    font-weight: normal;
    color: rgb(0 32 91 / 25%);
    letter-spacing: -0.15px;
}

.minimum__calculator .mortgage-cal-btn .btn .btn__copytext {
    flex: 1;
    padding-left: 10px;
}

.minimum__calculator .mortgage-cal-btn .active-mode span {
    color: var(--blue-color);
}

.minimum__calculator .mortgage-cal-btn .active-mode .btn__copytext {
    font-weight: bold;
}

.minimum__calculator .mortgage-cal-btn .btn .alphabatic-order {
    width: 48px;
    align-items: center;
}

.minimum__calculator .col-option-wrapper ul {
    display: -ms-grid;
    display: grid;
    grid-auto-columns: 1fr;
    -ms-grid-columns: 1fr 1fr;
    grid-template-columns: 1fr 1fr;
    -ms-grid-rows: auto;
    grid-gap: 30px;
    padding-left: 150px;
}

.minimum__calculator .col-option-wrapper .calculator-option .optin-input {
    width: 68%;
}

/* .minimum__calculator .col-option-wrapper .calculator-option .tip-wrapper {
    width: 100%;
} */

.minimum__calculator .col-option-wrapper .calculator-option .optin-input .field-name {
    color: rgb(0 32 91 / 50%);
    text-align: left;
}

.minimum__calculator .col-option-wrapper .calculator-option .optin-input .number-input input {
    border-bottom: 1px solid var(--blue-color);
}

.minimum__calculator .col-option-wrapper .calculator-option .optin-input .number-input select {
    border-bottom: 1px solid var(--blue-color);
    background-image: url(../img/feather-arrow-down.png);
    background-size: 13px;
    padding-right: 15px;

}

.minimum__calculator .cal-option-wrapper .tip-wrapper .cal-tip .cal-dynamic-tip,
.minimum__calculator .cal-option-wrapper .tip-wrapper .cal-tip .cal-default-tip {
    padding: 20px;
    background: rgb(236 236 236);
    border-radius: 15px;
}


.minimum__calculator .cal-option-wrapper .tip-wrapper .cal-tip .cal-dynamic-tip h5,
.minimum__calculator .cal-option-wrapper .tip-wrapper .cal-tip .cal-default-tip h5 {
    color: var(--blue-color);
    text-align: left;
    font-size: 14px;
    font-weight: bold;
    border-bottom: 0px;
    margin-bottom: 0;
}

.minimum__calculator .cal-option-wrapper .tip-wrapper .cal-tip .cal-dynamic-tip p,
.minimum__calculator .cal-option-wrapper .tip-wrapper .cal-tip .cal-default-tip p {
    color: var(--blue-color);
    font-size: 14px;
    margin: 0;
}

.minimum__calculator .blue-btn {
    background-color: var(--blue-color);
    border-color: var(--blue-color);
    margin-right: 0px;
}

.minimum__calculator .cal-option-wrapper .tip-wrapper .cal-tip .cal-dynamic-tip {
    display: none;
}

.minimum__calculator .cal-option-wrapper .tip-wrapper .cal-tip .cal-dynamic-tip h5 {
    padding-bottom: 0px;
}

.minimum__calculator .col-option-wrapper .tip-wrapper ul {
    padding-left: 0px;
    grid-template-columns: 1fr;
    -ms-grid-columns: 1fr;
    grid-gap: 0px;
    list-style-type: none;
}

.minimum__calculator .col-option-wrapper .tip-wrapper h6 {
    color: var(--blue-color);
}

.minimum__calculator .col-option-wrapper .calculator-option .optin-input .field-name svg {
    vertical-align: middle;
}

.minimum__calculator .col-option-wrapper .calculator-option .tip-wrapper h5 {
    padding-left: 20px;
    background-image: url(../img/tip-img.png);
    background-repeat: no-repeat;
    background-size: 14px;
    background-position: top 4px left;
}

.minimum__calculator .images-wrapper {
    background-image: unset;
    flex-wrap: wrap;
    padding: 0;
}

.minimum__calculator .images-wrapper::before {
    display: none;
}

.minimum__calculator .images-wrapper .property-image {
    width: 50%;
}

.minimum__calculator .images-wrapper .property-info {
    width: 50%;
    background-color: var(--blue-color);
    padding: 56px 0 40px 40px;
}

.minimum__calculator .images-wrapper .property-image img {
    width: 100%;
}


.minimum__calculator .images-wrapper .property-info h4 {
    text-align: left;
    font-size: 17px;
    line-height: 33px;
}

.minimum__calculator .images-wrapper .property-info p {
    text-align: left;
    font-size: 31px;
    font-weight: bold;
    line-height: 33px;
}

.minimum__calculator .images-wrapper .property-info .income-banner-text {
    display: flex;
    flex-direction: column-reverse;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.minimum__calculator .col-option-wrapper .tip-wrapper ul li:before {
    position: absolute;
    left: 0;
    height: 10px;
    width: 10px;
    color: var(--blue-color);
    top: -5px;
}

.minimum__calculator .images-wrapper .property-image img {
    width: 100%;
    display: block;
    object-fit: cover;
    height: 100%;
}

.minimum__calculator .min-down-payment-section .mortgage-cal-btn.cal-property-you-can-afford {
    grid-template-columns: 1fr;
    -ms-grid-columns: 1fr;
}

.minimum__calculator .min-down-payment-section .min-income-btn {
    text-align: center;
}

.minOption_form .min-down-payment-section .minOptionpage-test .optin-input ul {
    padding-left: 0;
}

.minOption_form .min-down-payment-section .minOptionpage-test .optin-input ul .number-input {
    max-width: 100%;
}

.minOption_form .min-down-payment-section .minOptionpage-test .optin-input .error {
    color: var(--blue-color);
    line-height: 1em;
    text-align: center;
    display: block;
    font-size: 11px;
    font-weight: 500;
    line-height: 15px;
}

.minOption_form .min-down-payment-section .minOptionpage-test .optin-input .error br {
    display: none;
}

.minOption_form .min-down-payment-section .minOptionpage-test .optin-input .error span#min-percentage-val {
    display: contents;
}

.minimum__calculator .col-option-wrapper.minOption .calculate-wrapper {
    margin: 60px 0 0;
}

.minimum__calculator .col-option-wrapper.minOption .same__margin {
    margin: 60px 0;
}

.minimum__calculator .col-option-wrapper.minOption .same__margin .images-wrapper .print-btn {
    border: 0px;
    text-align: left;
    padding: 0;
    color: #fff;
    border-bottom: 1px solid #fff;
    line-height: 1em;
    height: 22px;
    margin-top: 10px;
    cursor: pointer;
}

.minimum__calculator .final__incomebg {
    background-color: #7BA4DB;
    background-image: unset;
}

.minimum__calculator .final__incomebg .monthly-mortgage-payment-wrapper::before {
    display: none;
}

.minimum__calculator .final__incomebg .monthly-mortgage-payment-wrapper ul {
    grid-template-columns: 1fr;
    -ms-grid-columns: 1fr;
    padding-left: 0;
}

.minimum__calculator .minOptionpage-test label.have_hover_tooltip {
    display: block;
}

.minimum__calculator .final__incomebg .m-payment-col .print-btn {
    border-bottom: 1px solid #fff !important;
    border: 0px;
    padding: 0;
    height: 25px;
    margin-top: 25px;
    color: #fff;
    cursor: pointer;
    width: max-content;
}

.minimum__calculator .final__incomebg .m-payment-col {
    text-align: center;
}

.minimum__calculator .final__incomebg .monthly-mortgage-payment-wrapper .maximum_allowed_property_value {
    font-size: 75px;
    line-height: 1.2em;
    margin: 20px 0;
}

.minimum__calculator .final__incomebg .monthly-mortgage-payment-wrapper h6 {
    font-size: 40px;
}

.minimum__calculator .final__incomebg .m-payment-col {
    text-align: center;
    display: flex;
    flex-wrap: wrap;
    flex-direction: column-reverse;
    align-items: center;
}

.minimum__calculator .final__incomebg .monthly-mortgage-payment-wrapper {
    padding-bottom: 25px;
    padding-top: 55px;
}

.minOption_form .min-down-payment-section .button.min-income-btn {
    font-weight: bold;
}

@media (max-width: 875px) {

    .minimum__calculator .col-option-wrapper ul {
        padding-left: 0;
    }

    .minimum__calculator .col-option-wrapper .calculator-option .optin-input {
        width: 100%;
    }

    .minimum__calculator .mortgage-cal-btn .btn__copytext br {
        display: none;
    }

    .minimum__calculator .mortgage-cal-btn {
        grid-column-gap: 10px;
    }

    .minimum__calculator .col-option-wrapper.minOption .same__margin .images-wrapper .print-btn {
        width: auto;
        font-size: 12px !important;
        letter-spacing: 1px;
    }

    .minimum__calculator .images-wrapper {
        flex-direction: column;
    }

    .minimum__calculator .images-wrapper .property-image {
        width: 100%;
    }

    .minimum__calculator .images-wrapper .property-info {
        width: 100%;
        padding: 40px 40px 40px 40px;
        text-align: center;
    }

    .minimum__calculator .images-wrapper .property-info p {
        text-align: center;
        font-size: 25px;
    }

    .minimum__calculator .images-wrapper .property-info h4 {
        text-align: center;
        font-size: 14px;
    }

    .minimum__calculator .final__incomebg .monthly-mortgage-payment-wrapper .maximum_allowed_property_value {
        font-size: 30px !important;
        font-weight: bold;
    }

    .minimum__calculator .final__incomebg .monthly-mortgage-payment-wrapper h6 {
        font-size: 17px !important;
        font-weight: bold;
    }

    .minimum__calculator .final__incomebg .m-payment-col .print-btn {
        font-size: 12px;
        letter-spacing: 1px;
    }

    .new__amortization-calc .tag__line .new__tagline {
        max-width: 78%;
    }

}

@media (max-width: 767px) {
    .minimum__calculator .mortgage-cal-btn .btn__copytext br {
        display: none;
    }

    .minOption_form .min-down-payment-section .minOptionpage-test .optin-input .error {
        text-align: left;
    }

    .minimum__calculator .mortgage-cal-btn {
        grid-template-columns: 1fr;
        -ms-grid-columns: 1fr;
    }

    .minimum__calculator .col-option-wrapper ul {
        grid-template-columns: 1fr;
        -ms-grid-columns: 1fr;
    }

    .minimum__calculator .calculator-info {
        max-width: 100% !important;
        margin-bottom: 75px !important;
    }

    .print-btn {
        width: auto;
        margin-bottom: 0px;
    }

    .maximum__calculator .maxOption_form .max-down-payment-section .minOptionpage-test .calculator-option .optin-input ul li .field-name .error {
        text-align: left !important;
    }

    .new__amortization-calc .mortgage-cal-btn {
        padding: 0 20px;
    }

    .new__amortization-calc .a-cal-right .ac-payment-table th {
        width: 50%;
    }

    .new__amortization-calc .a-cal-right .ac-payment-table th {
        border-right: 1px solid #ccc;
        width: 50%;
    }

    .new__amortization-calc .a-cal-right .ac-payment-table th:first-child {
        border-right: 1px solid #ccc !important;
        width: 50%;
    }

    .new__amortization-calc .a-cal-right .ac-payment-table th {
        border-right: 0px;
        width: 25%;
    }

    .new__amortization-calc .a-cal-right .ac-payment-table td {
        width: 25%;
        border-right: 1px solid #ccc;
    }

    .new__amortization-calc .a-cal-right .ac-payment-table td:last-child {

        border: 0px !important;
    }

    .new__amortization-calc .a-cal-right .ac-payment-table tr:nth-child(1) th:last-child {
        border-right: 0px;
    }

    .new__amortization-calc .a-cal-right .ac-payment-table tr:nth-child(1) th {
        border-right: 1px solid #ccc;
    }

    .new__amortization-calc .chart-wrapper ul li {
        max-width: 145px;
    }

    .new__amortization-calc button.tablinks {
        width: 100% !important;
        justify-content: center;
    }

    .new__amortization-calc .skip__year select#selectTerm {
        width: 100px;
    }

    .new__amortization-calc .skip__year {
        text-align: center !important;
        top: 0 !important;
    }

    .new__amortization-calc .amortization-tabs {
        max-width: 90% !important;
    }

    .new__amortization-calc p.calculator-info {
        padding: 0 20px;
    }
}

@media (max-width: 480px) {
    .minimum__calculator .images-wrapper .property-image {
        width: 100%;
        height: 186px;
    }

    .new__amortization-calc .tag__line .new__tagline {
        max-width: 85% !important;
    }

    .minimum__calculator .mortgage-cal-btn .btn__copytext br {
        display: block;
    }

    .new__amortization-calc .tag__line .new__tagline {
        max-width: 85%;
    }

    .annualSchedule-table tr td {
        font-size: 12px !important;
        padding: 16px 0;
    }

    .new__amortization-calc .annualSchedule-table tr th {
        font-size: 12px !important;
    }
}

/************Maximum calculator css******************/


.maximum__calculator .col-option-wrapper.maxOption {
    display: block;
}

.maximum__calculator .maxOption_form .calculate-wrapper {
    margin: 40px 0;
}

.maximum__calculator .maxOption_form .option2-income-required .property-info .print-btn {
    padding: 0;
    color: #fff;
    cursor: pointer;
    border: 0px;
    border-bottom: 1px solid #fff;
    height: 25px;
    margin-top: 10px;
}

.maximum__calculator .maxOption_form .max-down-payment-section .min-income-btn {
    text-align: center;
    font-weight: bold;
}

.maximum__calculator .maxOption_form .max-down-payment-section .minOptionpage-test .calculator-option .optin-input ul {
    padding-left: 0;
    max-width: 340px;
}

.maximum__calculator .maxOption_form .max-down-payment-section .minOptionpage-test .calculator-option .optin-input ul li .field-name {
    text-align: left !important;
}

.maximum__calculator .maxOption_form .max-down-payment-section .minOptionpage-test .calculator-option .optin-input ul li .field-name .number-input {
    max-width: 100%;
}

.maximum__calculator .maxOption_form .max-down-payment-section .minOptionpage-test .calculator-option .optin-input ul li .field-name .error {
    display: block;
    text-align: center;
    color: var(--blue-color);
}

.maximum__calculator .maxOption_form .max-down-payment-section .minOptionpage-test .calculator-option .optin-input ul li .field-name .error br {

    display: none;
}

.maximum__calculator .maxOption_form .max-down-payment-section .minOptionpage-test .calculator-option .optin-input ul li .field-name .error #max-percentage-val {
    display: inline-block;
}

.minimum__calculator .calculator-info {
    color: var(--blue-color);
    max-width: 68%;
    margin: 40px auto 0;
}

/*********amortization new calculator********/

.new__amortization-calc .tag__line .new__tagline {
    max-width: 40%;
    margin: 25px auto 0;
    font-weight: bold;
}

.new__amortization-calc .tag__line .new__tagline br {
    display: none;
}

.new__amortization-calc .a-cal-right .ac-payment-table tr {
    border-bottom: 1px solid #ABB8C3;
    padding-bottom: 0px;
}

.new__amortization-calc .a-cal-right .ac-payment-table th {
    border-right: 0px;
}

.new__amortization-calc .a-cal-right .ac-payment-table th strong {
    color: var(--blue-color);
}

.a-cal-right .ac-payment-table tr td {
    font-weight: 500;
    color: var(--blue-color);
}

.new__amortization-calc .a-cal-left .amortization-input-form .optin-input .form__fields label {
    flex-wrap: wrap;
    align-items: center;
}

.new__amortization-calc .a-cal-left .amortization-input-form .optin-input .form__fields label .number-input {
    width: 100%;
}

.new__amortization-calc .a-cal-left .amortization-input-form .optin-input .form__fields label input,
.new__amortization-calc .a-cal-left .amortization-input-form .optin-input .form__fields label select {
    min-width: 100%;
    border-bottom: 1px solid var(--blue-color);
}

.new__amortization-calc .a-cal-left .amortization-input-form .optin-input .form__fields label select {
    padding-left: 0px;
}

.new__amortization-calc .skip__year {}

.new__amortization-calc .a-cal-left .amortization-input-form .optin-input .form__fields label select {
    padding-left: 0px;
    background-image: url(../img/feather-arrow-down.png);
    background-repeat: no-repeat;
    background-position: center right;
    -webkit-appearance: none;
    appearance: none;
    border-radius: 0px;
}

.new__amortization-calc .cal-input.extra_payments_options[name="extra_payments_options"] {
    appearance: none;
    -webkit-appearance: none;
    background-image: url(../img/feather-arrow-down.png);
    background-repeat: no-repeat;
    background-position: center right;
    color: var(--blue-color);
    font-size: 12px;
    border-radius: 0px;
}

.new__amortization-calc .annualSchedule-table tr:nth-child(odd) {
    border: 0px;
    background: #B1C9E8;
}

.new__amortization-calc .annualSchedule-table tr:nth-child(even) {
    border: 0px;
    background: #fff;
}

.new__amortization-calc .annualSchedule-table tr th strong {
    color: var(--blue-color);
}

.new__amortization-calc .annualSchedule-table tr:first-child {
    background: #fff;
}



.new__amortization-calc .annualSchedule-table tbody tr:first-child {
    background: #b1c9e8;
}

.page-template-halalmortage-minimum-new,
.page-template-halalmortage-maximum-new,
.page-template-amortization-calculator-new {
    background-color: #fff;
}

.new__amortization-calc .a-cal-left .amortization-input-form .optin-input .form__fields label.additional--fields>span.additional-expenses {
    flex: 1;
    color: var(--blue-color);
    font-weight: bold;
    font-size: 18px;
    line-height: 22px;
    padding-bottom: 0;
    padding-left: 10px;
}

.new__amortization-calc .a-cal-left .amortization-input-form .optin-input .form__fields label.additional--fields>.number-input {
    width: 22px;
}

.new__amortization-calc .designer--checkbox+label {
    width: 22px;
    height: 22px;
    border-radius: 5px;

}

.new__amortization-calc .designer--checkbox+label:after {
    transform: translate(-50%, -50%);
    left: 50%;
    width: 15px;
    border: 0px;
    top: 50%;
    height: 15px;
    background-color: var(--blue-color);
    border-radius: 4px;
}

.new__amortization-calc .amortization-cal-wrapper .a-cal-left label .number-input #term_length {
    padding-left: 0px !important;
}

.new__amortization-calc .amortization-cal-wrapper .a-cal-left label span.cal-input--abs {
    color: var(--blue-color);
    font-weight: bold;
    text-transform: capitalize;
}

.new__amortization-calc .amortization-cal-wrapper .a-cal-left label .number-input input,
.new__amortization-calc .amortization-cal-wrapper .a-cal-left label .number-input select {
    font-weight: bold;
    font-size: 18px;
}

.new__amortization-calc .amortization-cal-wrapper .a-cal-left label .number-input input::placeholder {
    font-wieght: bold;
}

.new__amortization-calc .extra-payments-option label .field-name {
    width: 100%;
}

.new__amortization-calc .total__amnt .combined__fields {
    min-width: 100%;
    grid-template-columns: 1fr 1fr;
    -ms-grid-columns: 1fr 1fr;
    border-bottom: 0px;
}

.new__amortization-calc .total__amnt .combined__fields .number-input {
    border-bottom: 1px solid var(--blue-color);
}

.new__amortization-calc .total__amnt .combined__fields .middle-text {
    position: absolute;
    left: 50%;
    transform: translate(-50%);
    font-weight: bold;
    top: auto;
    bottom: 2px;
}

.new__amortization-calc .total__amnt .combined__fields .number-input #extra_payments_amount--year {
    -webkit-appearance: none;
    appearance: : none;
    width: 100%;
    text-align: center;
    color: var(--blue-color);
    text-transform: lowercase;
    text-align: center;
    text-align-last: center;
    -webkit-text-align-last: center;
}

.new__amortization-calc .optin-input .form__fields input.padd-left {
    padding-left: 0px !important;
}

.new__amortization-calc .amortization-payemnt-col {
    padding: 0;
}

.new__amortization-calc .amortization-cal-chart {
    column-gap: 15px;
}

.new__amortization-calc .chart-wrapper ul li {
    flex-direction: row;
}

.new__amortization-calc .chart-wrapper ul li {
    max-width: 85%;
    margin: 0 auto;
    font-size: 13px;
    line-height: 27px;
    font-weight: 500;
    justify-content: flex-start;
}

.new__amortization-calc .chart-wrapper ul li span {
    width: 54px;
    height: 16px;
    margin-right: 12px;
}

.new__amortization-calc .annualSchedule-table tr th {
    font-size: 18px;
    padding: 16px 0;
}

.new__amortization-calc .a-cal-right .ac-payment-table th .mortage_month {
    color: var(--blue-color);
}

.annualSchedule-table tr td {
    font-size: 18px;
    padding: 16px 0;
}

.new__amortization-calc button.tablinks {
    font-size: 24px !important;
    font-weight: bold !important;
}

.new__amortization-calc button.tablinks svg {
    display: none;
}

.new__amortization-calc .skip__year .lebel_skip {
    text-transform: capitalize;
}

.profit__savings span,
.time__saved span {
    color: var(--blue-color);
    font-weight: bold;
}

.new__amortization-calc .a-cal-right table.ac-payment-table {
    margin-top: 13px;
}

.new__amortization-calc .cal-input.extra_payments_options[name="extra_payments_options"] {
    padding-bottom: 10px;
    border-bottom: 1px solid var(--blue-color);
    width: 150px;
    font-weight: bold;
}

.new__amortization-calc .skip__year .lebel_skip {
    text-transform: capitalize;
    font-weight: 400;
}

.new__amortization-calc .left__side-form .form__fields {
    width: 100%;
    margin: 0 0 28px 0;
}

.new__amortization-calc .left__side-form .form__fields label {
    flex-wrap: wrap;
    align-items: center;
    display: flex;
}

.new__amortization-calc .left__side-form .form__fields label .number-input {
    width: 100%;
}


.new__amortization-calc .left__side-form .form__fields label .number-input input {
    min-width: 100%;
    border-bottom: 1px solid var(--blue-color);
    font-weight: bold;
}

.new__amortization-calc .amortization-cal-wrapper .a-cal-left label span.cal-input--abs {
    color: var(--blue-color);
    font-weight: bold;
    text-transform: capitalize;
    position: absolute;
    right: 0;
    bottom: 3px;
}

#month__number {
    padding-left: 0px !important;
}


.new__amortization-calc .left__side-form .form__fields label .number-input input[type=number] {

    padding-left: 10px !important;
}

.new__amortization-calc .left__side-form .form__fields label .number-input input[type=number]#month__number {
    padding-left: 0 !important;
}



.print__view .middle-text {
    width: max-content;
}

.print__view #extra_payments_amount--year {
    display: -webkit-flex;
    display: flex;
    align-self: center;
    justify-content: center;
}

.print__view #extra_payments_amount--year #month {
    text-align: center;
}

.time__saved .penalty {
    position: relative;
}

.show__hover {
    display: none;
}

.profit__savings .penalty span img {
    position: relative;
    top: 3px;
    margin-right: 5px;
}

.hovr__element {
    margin-left: 0 !important;
    font-weight: 400 !important;
    position: relative;
}

.hovr__element:hover .show__hover {
    display: block;
}


.hovr__element .show__hover {

    position: absolute;
    width: 265px;
    right: 0;
    top: -80px;
    background-color: #ccc;
    padding: 8px;
    border-radius: 5px;
}


.penalty_pre .hovr__element .show__hover {
    top: -40px;
}

#profit_rate {
    cursor: default;
}

.show__hover p {
    font-size: 12px;
    color: var(--blue-color);
    line-height: 1.1em;
    margin-top: 0;
}

.hovr__element img {
    margin-right: 5px;
    position: relative;
    top: 3px;
}


@media (max-width: 767px) {
    .penalty {
        float: none !important;
    }

    .hovr__element:hover .show__hover {
        left: 50%;
        transform: translateX(-50%);
        right: unset;
    }

    .hovr__element {
        width: 100%;
        display: block;
    }

    .test_t {
        position: relative;
        top: -34px;
        margin-left: 0px !important;
    }

    .penalty.penalty_priv {
        position: relative;
        top: 36px;
    }

}

.profit-rate .pre-percent {
    position: absolute;
    right: 0px;
    /* font-weight: bold; */
    color: var(--blue-color);
    top: 0;
}

.optin-input ul li .profit-rate input {
    padding-left: 0px !important;
}

.rate_info {
    font-size: 17px;
    font-style: italic;
    text-align: center;
    font-weight: bold;
    margin-top: 15px;
}

.profit-rate {
    position: relative;
}