.IndexBlocksOutOut{
    width: 100%;
    max-width: 1000px;
    height: 322px;
    margin-bottom: 30px;
}

@media only screen and (max-width: 768px) {
    .IndexBlocksOutOut {
        display: none;
    }
}

.IndexMainTopHrefElement{
    margin-left: 20px;
    margin-right: 20px;
}

.IndexMainTopHref{
    display: flex;
    justify-content: space-around;
    flex-wrap: wrap;
}

@media only screen and (max-width: 768px) {
    .IndexMainTopHref {
        margin-top: 20px;
    }
    .IndexMainTopHrefElement{
        margin-top: 20px;
    }
}

.IndexMainTopHrefElement{
    display: grid;
    grid-template-rows: 50px auto;
    grid-row-gap: 20px;
    align-items: center;
    justify-content: center;
}

.IndexMainTopHrefElement>a{
    text-decoration: none;
}
.IndexMainTopHrefElement>a>div{
    display: flex;
    justify-content: center;
    font-size: 12px;
    color: #33363f;
    font-weight: 500;
    margin-top: 5px;
    text-decoration: none;
}

.IndexBigElements{
    display: flex;
    justify-content: space-between;
    margin-top: 27px;
}

.IndexNews{
    width: 284px;

}

.IndexNewsTop{
    width: 100%;
    height: 38px;
    padding-left: 38px;
    color: white;
    font-size: 14px;
    display: flex;
    align-items: center;
    background-color: #075a89;
}

.IndexNewsBody{
    margin-top: 33px;
}

.IndexNewsBodyElement{
    margin: 17px 26px 0 36px;
    padding-bottom: 14px;
    border-bottom: 1px solid #e5e5e5;
}

.IndexNewsBodyElementDate{
    color: #33363f;
    font-size: 11px;
    font-weight: 700;
    padding-bottom: 5px;
}

.IndexNewsBodyElementText{
    color: #33363f;
    font-size: 11px;
}

.IndexMT7{
    width: 377px;
}
.IndexMT7Title{
    width: 100%;
    height: 38px;
    padding-left: 38px;
    color: white;
    font-size: 14px;
    display: flex;
    align-items: center;
    background-color: #075a89;
}
.IndexMT7Text{
    justify-content: space-between;
}

.IndexMT7Body{
    display: flex;
    margin-top: 33px;
}

.IndexMT7BodyIMG{
    margin-right: 10px;
}

.IndexMT7Text{
    font-size: 12px;
    line-height: 18px;
}


.IndexMT7TextLink>a{
    text-decoration: underline;
    color: #0a56d0;
    font-size: 14px;
    padding-bottom: 5px;
}


.IndexLiquidity{
    width: 225px;

}

.IndexLiquidityIn{
    background-color: #fcb23c;

    background-image: url(/assets/ProvidersBack.899e8571ecfdbeb58166.png);
    background-size: contain;
    background-repeat: no-repeat;
    background-position: right;
    color: white;
}

.IndexLiquidityTitle{
    margin: 0 29px 11px 38px;
    padding-top: 20px;
    padding-bottom: 11px;
    border-bottom: white solid 1px;

}
.IndexLiquidityText{
    margin: 0 29px 11px 38px;
    padding-top: 20px;
    padding-bottom: 11px;
    font-size: 14px;
}
.IndexLiquidityHref{
    text-align: right;
    font-size: 11px;
    color: #986717;
    padding-bottom: 13px;
    padding-right: 21px;
    border-bottom: white solid 1px;
}

.IndexBigDPWD{
    margin-top: 30px;
}

.IndexBigDPWDTTop {
    display: grid;
    /*grid-template-columns: minmax(140px, 250px) auto  minmax(140px, 250px);*/
    grid-template-columns: auto 1fr auto;
}

.IndexBigDPWDTTopTitle{
    font-size: 14px;
    color: #33363f;
    margin-right: 26px;
}


.IndexBigDPWDTTopMiddle{
    align-self: center;
    width: 100%;
    height: 1px;
    background-color: #e5e5e5;
}

.IndexBigDPWDTTopHref{
    text-align: right;
    width: auto;
    font-size: 11px;
    color: #33363f;
    font-weight: 500;
    margin-left: 26px;
}

.IndexBigDPWDBottom{
    margin-top: 30px;
    margin-bottom: 30px;
    display: flex;
    justify-content: space-between;
}

.IndexBigDPWDBottomElement>img{
    opacity: 0.5;
}

@media only screen and (max-width: 900px) {
    .IndexBigElements{
        display: grid;
        grid-template-columns: auto auto;
    }
    .IndexNews{
        grid-column: 1/span 2;
        width: 100%;
    }
    .IndexNewsTop{
        padding-left: 30px;
        width: calc(100% - 30px);
    }
    .IndexMT7Title{
        padding-left: 30px;
    }
    .IndexNewsBody{
        display: grid;
        grid-template-columns: auto auto auto;
    }
    .IndexNewsBodyElement{
        border-bottom: none;
    }
    .IndexMT7{
        margin-left: 60px;
    }
}

@media only screen and (max-width: 700px) {
    .IndexMT7{
        margin-left: 5px;
    }
}
@media only screen and (max-width: 630px) {
    .IndexBigElements{
        display: block;
    }

    .IndexNewsBody{
        display: block;
    }

    .IndexNewsBodyElement{
        border-bottom: 1px solid #e5e5e5;
    }
    .IndexNews{
        margin-bottom: 30px;
    }
    .IndexMT7{
        margin-left: 20px;
    }
    .IndexMT7Title{
        padding-left: 30px;
        width: calc(100% - 30px);
    }
    .IndexLiquidity{
        margin-left: 20px;
        margin-top: 30px;
    }
    .IndexMT7BodyIMG{
        padding-left: 20px;
    }
}


@media only screen and (max-width: 1050px) {
    .IndexBigDPWD{
        margin-left: 15px;
        margin-right: 15px;
    }
    .IndexBigDPWDBottom{
        flex-wrap: wrap;
    }
    .IndexBigDPWDBottomElement{
        margin-left: 10px;
        margin-right: 10px;
    }
}
@media only screen and (max-width: 500px) {
    .IndexMT7{
        margin: auto;
        width: 100%;
    }
    .IndexLiquidity{
        width: 100%;
        margin-left: 0;
    }
    .IndexMT7Text{
        padding-right: 10px;
    }
}
@keyframes bannerOpacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.IndexBlocksOutOut{
    position: relative;
    min-height: 322px;
}

.IndexBlocksSelect{
    display: grid;
    grid-template-columns: 17px 17px 17px 17px 17px 17px;
    position: absolute;
    bottom: 0;
    right: 0;
    grid-column-gap: 13px;
}

.IndexBlocksSelectElement{
    width: 17px;
    height: 9px;
    background-color: gray;
    cursor: pointer;
}
.IndexBlocksSelectElementActive{
    width: 17px;
    height: 9px;
    background-color: #fcb23c;
}

/* reset for dot buttons (do NOT override background-color) */
.IndexBlocksSelectElement,
.IndexBlocksSelectElementActive {
    border: none;
    padding: 0;
    margin: 0;
    cursor: pointer;
    appearance: none;
    -webkit-appearance: none;
    background-image: none; /* на всякий */
    font: inherit;
    line-height: 1;
}

@keyframes bannerOpacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.Banner500{
    width: 100%;
    height: 294px;
    background: url(/assets/Banner01.d654d8344a2e092ffe15.png);
    display: flex;
    justify-content: flex-end;
    animation-name: bannerOpacity;
    animation-duration: 1500ms;
    animation-fill-mode: forwards;
}

.Banner500Right{
    width: 350px;
    margin-right: 30px;
    color: #e5e5e5;
    justify-self: right;
    display: grid;
    grid-template-rows: auto auto auto;
    grid-row-gap: 20px;
    margin-top: 22px;
}

.Banner500Title{
    font-size: 36px;
    font-weight: 300;
    line-height: 50px;
}
.Banner500Text{
    font-size: 14px;
    line-height: 20px;
}

@media only screen and (max-width: 920px) {
    .Banner500Right{
        margin-right: 5px;
    }
    .Banner500{
        background-position-x: -50px;
    }
    }

@media only screen and (max-width: 830px) {
    .Banner500Right{
        width: 250px;
        grid-row-gap: 0;
    }
    .Banner500Title{
        line-height: 36px;
    }
    }


@keyframes bannerOpacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.BannerIntroduce{
    width: 100%;
    height: 294px;
    background: url(/assets/Banner02.993b511ac6b06439efd1.png);
    position: relative;
    animation-name: bannerOpacity;
    animation-duration: 1500ms;
    animation-fill-mode: forwards;
}

.BannerIntroduceRight{
    width: 500px;
    margin-left: 35px;
    /*justify-self: right;*/
    grid-row-gap: 20px;
}

.BannerIntroduceTitle{
    font-size: 30px;
    font-weight: 300;
    line-height: 50px;
    color: #e5e5e5;
    padding-top: 40px;
}

.BannerIntroduceText{
    font-size: 14px;
    line-height: 20px;
    padding-top: 20px;
}

.BannerIntroduceText>ul{
    list-style-type: none;
    padding-left: 0;
}

.BannerIntroduceText>ul>li{
    margin-top: 10px;
    font-size: 14px;
    color: #0c355d;
}

.BannerIntroduceButton{
    position: absolute;
    left: 370px;
    top: 200px;
}



@keyframes bannerOpacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.BannerProtect{
    width: 100%;
    height: 294px;
    background: url(/assets/Banner03.1800677e8b1cb14ade93.png);
    position: relative;
    animation-name: bannerOpacity;
    animation-duration: 1500ms;
    animation-fill-mode: forwards;
}

.BannerProtectRight{
    width: 500px;
    margin-left: 35px;
    /*justify-self: right;*/
    grid-row-gap: 20px;
}

.BannerProtectTitle{
    font-size: 36px;
    font-weight: 300;
    line-height: 50px;
    color: white;
    padding-top: 40px;
    position: relative;
    left: 40px;
    top: 3px;
}

.BannerProtectText{
    font-size: 14px;
    line-height: 20px;
    padding-top: 20px;
}

.BannerProtectText>ul{
    list-style-type: none;
    padding-left: 0;
}

.BannerProtectText>ul>li:before{
    content: "•";
    color: white;
    margin-right: 30px;
}
.BannerProtectText>ul>li{
    margin-top: 10px;
    font-size: 14px;
    color: white;
}

.BannerProtectButton{
    position: absolute;
    left: 340px;
    top: 170px;
}



@keyframes bannerOpacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.BannerGilt{
    width: 100%;
    height: 294px;
    background: url(/assets/Banner04.e2800a451cafd171ac93.png);
    position: relative;
    animation-name: bannerOpacity;
    animation-duration: 1500ms;
    animation-fill-mode: forwards;
}

.BannerGiltRight{
    justify-self: right;
    grid-row-gap: 20px;
    padding-top: 20px;
}

.BannerGiltTitle{
    border-left: 4px #0e87a8 solid;
    font-size: 36px;
    font-weight: 300;
    line-height: 50px;
    color: white;
    position: relative;
    left: 40px;
    top: 3px;
    padding-left: 30px;
}

.BannerGiltText{
    margin-left: 60px;
    font-size: 14px;
    line-height: 20px;
    padding-top: 20px;

}

.BannerGiltTextIn{
    display: flex;
    justify-content: left;
    width: 100%;
    margin-right: 30px;
    color: white;
    font-size: 18px;
    line-height: 30px;
}

.BannerGiltText01{
    border-right: 10px #4c626f solid;
    padding-right: 60px;
}
.BannerGiltText02{
    border-left: 3px white solid;
    padding-left: 60px;
    padding-right: 60px;
}

.BannerGiltText03{
    font-size: 11px;
    position: absolute;
    bottom: 15px;
    color: white;
    left: 60px;
}


.BannerGiltButton{
    margin-right: 30px;
}
@keyframes bannerOpacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.BannerStart{
    width: 100%;
    height: 294px;
    background: url(/assets/Banner05.77d6f747705e52a16010.png);
    position: relative;
    animation-name: bannerOpacity;
    animation-duration: 1500ms;
    animation-fill-mode: forwards;
}

.BannerStartRight{
    width: 500px;
    margin-left: 35px;
    /*justify-self: right;*/
    grid-row-gap: 20px;
    padding-top: 30px;
}

.BannerStartTitle{
    font-size: 36px;
    font-weight: 300;
    line-height: 50px;
    color: #e5e5e5;
    padding-left: 24px;
    background: url(/assets/banner06back.cae14b50797f9db8861c.svg);

}

.BannerStartText{
    font-size: 14px;
    line-height: 20px;
    padding-top: 20px;
}

.BannerStartText>ul{
    list-style-type: none;
    padding-left: 0;
}

.BannerStartText>ul>li:before{
    content: "•";
    color: #0c355d;
    margin-right: 30px;
}
.BannerStartText>ul>li{
    margin-top: 10px;
    font-size: 14px;
    color: #0c355d;
}

.BannerStartButton{
    position: absolute;
    left: 570px;
    top: 170px;
}



@keyframes bannerOpacity {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.BannerSupport{
    width: 100%;
    height: 294px;
    background: url(/assets/Banner06.bf5bd5d753d4830a1b1a.png);
    position: relative;
    animation-name: bannerOpacity;
    animation-duration: 1500ms;
    animation-fill-mode: forwards;
}

.BannerSupportRight{
    width: 500px;
    margin-left: 35px;
    /*justify-self: right;*/
    grid-row-gap: 20px;
    padding-top: 30px;
}

.BannerSupportTitle{
    font-size: 36px;
    font-weight: 300;
    line-height: 50px;
    color: #e5e5e5;
    padding-left: 24px;
    padding-top: 10px;
}

.BannerSupportText{
    font-size: 14px;
    line-height: 20px;
    padding-top: 20px;
}

.BannerSupportText>ul{
    list-style-type: none;
    padding-left: 0;
}

.BannerSupportText>ul>li:before{
    content: "•";
    color: white;
    margin-right: 30px;
}
.BannerSupportText>ul>li{
    margin-top: 10px;
    font-size: 14px;
    color: #0c355d;
}

.BannerSupportButton{
    position: absolute;
    left: 370px;
    top: 230px;
}



.TISComponent{
    border: 1px solid #d8e4eb;
    border-radius: 5px;
    grid-column: 1/span 4;
}

.TISComponentTop{
    display: flex;
    justify-content: space-between;
    padding: 20px 26px 22px 22px;
}

.TISComponentTopText01{
    font-size: 19px;
    font-weight: 700;
    color: #181818;
}
.TISComponentTopText02{
    font-size: 15px;
    line-height: 23px;
    color: #181818;
}

.TISComponentTopButton>a{
    text-decoration: none;
}


.TisButtonGreen{
    height: 40px;
    width: 204px;
    background-image: linear-gradient(to top, #4ca800, #5bb500);
    display: flex;
    color: white;
    font-weight: 700;
    justify-content: space-around;
    align-items: center;
    border-radius: 3px;
}


.TisButtonGreenImg{
    position: relative;
    top: 3px;
    left: 5px;
}

.TISComponentDown{
    display: grid;
    grid-template-columns: 1fr 1fr;
    margin-bottom: 19px;
}

.TISComponentDownLeft{
    display: flex;
    justify-content: space-around;
}

.TISComponentDownRight{
    display: flex;
    flex-direction: column;
    justify-content: space-around;
}
.TISComponentDownRightElement{
    display: flex;
}

.TISComponentDownLeftElementBorder{
    width: 1px;
    height: 100%;
    border-left: 1px dashed #d4dfe6;
}

.TISComponentDownLeftElementTop{
    font-size: 15px;
    line-height: 28px;
    color: black;
}

.TISComponentDownLeftElementBottom>img{
    margin-right: 5px;
}
.TISComponentDownLeftElementBottom{
    color: #529b22;
    font-size: 22px;
    font-weight: 700;
    display: flex;
    align-items: center;
}

.TISComponentDownRightElementText01{
    font-size: 13px;
    color: #aab9c2;
    margin-left: 5px;
}
.TISComponentDownRightElementText02{
    font-size: 13px;
    margin-right: 5px;
    margin-left: 5px;
}
@media only screen and (max-width: 1000px) {
    .TISComponent>.TISComponentDown{
        display: block;
    }
    .TISComponentDownRight{
        margin-top: 20px;
    }
    .TISComponentDownRight>div{
        display: flex;
        justify-content: center;
        margin-bottom: 10px;
    }
}
@media only screen and (max-width: 700px) {
    .TISComponentTop{
        display: block;
    }
}
.TISComponentDownRightElementLeft{
    display: flex;
}
@media only screen and (max-width: 450px) {
    .TISComponentDownRight>.TISComponentDownRightElement{
        display: block;
        padding-left: 20px;
    }
    .TISComponentDownRightElementLeft{
        padding-bottom: 5px;
    }
    .TISComponentDownLeft{
        flex-wrap: wrap;
        justify-content: center;
    }
    .TISComponentDownLeftElement{
        margin-right: 20px;
        margin-left: 20px;
        margin-bottom: 20px;
    }
    .TISComponentTop{
        padding-bottom: 0;
    }
}
.IndexNewsBodyElement>a{
    text-decoration: none;
}