@import url('https://fonts.googleapis.com/css2?family=Roboto+Condensed:wght@300;400;700&display=swap');
* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body {
    font-family: 'Roboto Condensed', sans-serif;
    font-size: 18px;
    font-weight: 400;
    background: #F5F5F7;
    color: #302C37;
}
a {
    color: white;
    text-decoration: none;
}
a:hover {
    text-decoration: none;
}
ul {
    list-style: none;
    margin-bottom: 0;
    padding-left: 0;
}
button, input, select, textarea {
    border: none;
    outline: none;
}
input:focus, textarea:focus {
    outline: none;
}
h1{
    font-size: 48px;
    font-weight: 700;
    color: #1A0A37;
    text-transform: uppercase;
}
h2 {
    font-size: 24px;
    font-weight: 700;
    color: #1A0A37;
}
h3 {
    font-size: 20px;
    font-weight: 700;
}
.fs-16 {
    font-size: 16px;
}
.fs-14 {
    font-size: 14px;
}
.fs-12 {
    font-size: 12px;
}
.fs-8 {
    font-size: 8px;
}
.fc-black {
    color: #1A0A37;
}
.fc-white {
    color: white;
}
.fc-dark-purple {
    color: #322054;
}
.fc-white {
    color: white;
}
.fc-purple {
    color: #765BAA;
}
.fc-light-purple {
    color: #E0CEEE;
}
.fc-mid-purple {
    color: #7C59B5;
}
.fc-poor-purple {
    color: #AE9DC0;
}
.fc-grey {
    color: #B0ACB7;
}
.fc-alert {
    color: #A82424;
}
.fc-yellow {
    color: #998A36;
}
.fc-blue {
    color: #405587;
}
.fc-green {
    color: #386A37;
}
.fc-neon-blue {
    color:#20AAF8;
}
.fc-neon-green {
    color: #2ED62B;
}
.fc-red {
    color: #EA2222;
}

.btn {
    width: 264px;
    height: 53px;
    background: #7C59B5;
    color: white;
    font-size: 16px;
    font-weight: 400;
    border-radius: 10px;
    transition: 0.3s ease-in-out;
}
.btn:hover {
    color: white;
    background: #322054;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.bg-purple {
    background: #322054;
}
.bg-dark-purple {
    background: #1A0A37;
}
.bg-dirty-purple {
    background: #2C213F;
}
.bg-light-purple {
    background: #765BAA;
}
.bg-mid-purple {
    background: #7C59B5;
}
.bg-mid-purple2 {
    background: rgba(124, 89, 181, 0.2);
}
.bg-alert {
    background: #ECC8C8;
}
.bg-grey {
    background: #F5F5F7;
}
.bg-white {
    background: #FCFCFC;
}
.bg-blue {
    background: #AFC3F4;
}
.bg-yellow {
    background: #FFF5BE;
}
.bg-green {
    background: #AFFEAE;
}
.bg-khaki {
    background: #959F9A;
}
.bg-dark-yellow {
    background: #E0E34F;
}
.bg-neon-blue {
    background: #20AAF8;
}
.bg-neon-green {
    background: #2ED62B;
}
.bg-red {
    background: #EA2222;
}
.bg-dark-grey {
    background: #AAA4B6;
}
.border-alert {
    border: 1px solid #A82424;
}
.border-white {
    border: 1px solid white;
}
.border-black {
    border: 1px solid #1A0A37;
}
.border-none {
    border: none;
}
.border-grey {
    border: 1px solid #AAA4B6;
}
.border-red {
    border: 1px solid #EA2222;
}
.blockTitle {
    padding: 24px 0;
}
.block__description {
    margin-top: 23px;
    margin-bottom: 68px;
}
.text-break {
    overflow-wrap: break-word;
    word-wrap: break-word;
}

/* header */

.headerMain.home {
    height: 105vh;
    /* padding: 20px 80px; */
    overflow: hidden;
}
.headerMain {
    padding: 20px 0 20px 80px;
    /* overflow: hidden; */
}

.headerMain__content {
    position: relative;
    z-index: 2;
}
.headerMain__content.home {
    height: 105vh;
}
.headerMain__content a:hover{
    color: white;
}
.headerMain__content.home a:hover{
    color: #1A0A37;
}
.headerMain__bg {
    top: 0;
    left: 0;
    z-index: 1;
    overflow: hidden;
    background: url('../img/main-bg.jpg') no-repeat left center;
    background-size: cover;
    background-attachment: fixed;
    height: 105vh;
    transform-origin: center center;
    animation-name: bg-appear;
    animation-duration: 3.5s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0s;
}
.headerNav.home {
    transform: translateY(-110%);
    opacity: 0;
    animation-name: menu-appear;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 1s;
}
.headerNav__logo {
    font-size: 32px;
    font-weight: 500;
}
.headerNav__btns__login {
    margin-right: 50px;
    cursor: pointer;
}
.headerNav__btns__register {
    width: 195px;
    padding: 10px 0;
    border-radius: 10px;
    cursor: pointer;
    margin-right: 70px;
}

.headerMain__head {
    transform: translateY(-150%);
    /* margin-top: 136px; */
    margin-top: 10vh;
    margin-bottom: 75px;
    opacity: 0;
    animation-name: title-appear;
    animation-duration: 1.5s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 1.5s;
}
.headerMain__head p {
    font-size: 24px;
    font-weight: 500;
    margin: 25px auto;
}
.headerMain__head p span {
    color: #7C59B5;
}


.headerAnim__block {
    width: 200px;
    height: 200px;
    border: 1px solid #7C59B5;
    border-radius: 10px;
    background: RGBA(124,89,181,0.3);
    transition: 0.3s ease;
}
.headerAnim__block:not(.block__center) {
    margin-right: 3px;
}
.headerAnim__blocks:first-child,
.headerAnim__blocks:last-child {
    z-index: 2;
}
.headerAnim__blocks:first-child,
.headerAnim__blocks:last-child .headerAnim__block a {
    transform: rotate(45deg);
}
.headerAnim__blocks:last-child,
.headerAnim__blocks:first-child .headerAnim__block a,
.headerAnim__blocks:nth-child(2) .block__center__wrapper {
    transform: rotate(-45deg);
}
.headerAnim__block.block__center {
    /* transform: rotate(45deg); */
    background: #381E4A;
    overflow: hidden;
}
.headerAnim__block:not(.block__center) a{
    color: #1A0A37;
}
.headerAnim__block.block__center .block__center__wrapper div {
    color: white;
    cursor: pointer;
    transition: 0.3s ease-in-out;
}
.headerAnim__block.block__center .block__center__wrapper div:last-child {
    padding-top: 45px;
    padding-bottom: 67px;
    display: block;
    width: 280px;
    text-align: center;
}
.headerAnim__block.block__center.logged .block__center__wrapper div:last-child {
    padding-top: 20px;
    padding-bottom: 20px;
}
.headerAnim__block.block__center:not(.headerAnim__block.block__center.logged) .block__center__wrapper div:hover {
    background: #7C59B5;
}
.headerAnim__block.block__center .block__center__wrapper div:first-child {
    padding-bottom: 45px;
    padding-top: 67px;
    display: block;
    width: 280px;
    text-align: center;
}
/* .headerAnim__block.block__center .block__center__wrapper div:first-child {
    margin-bottom: 40px;
} */
.headerAnim__empty {
    width: 367px;
    height: 689px;
    /* transform: translateY(689px); */
}
.headerAnim__block:not(.headerAnim__block.block__center):hover{
    background: #7C59B5;
}
.headerAnim__block.block__center.logged:hover{
    background: #7C59B5;
}
.headerAnim__block:hover a,
.headerAnim__block a:hover div,
.headerAnim__block a div:hover {
    color: white;
}
.img-white {
    display: none;
}
.headerAnim__block:hover a .img-dark,
.headerAnim__block a:hover .img-dark {
    display: none;
}
.headerAnim__block:hover a .img-white,
.headerAnim__block a:hover .img-white {
    display: inline;
}
.center__block__anim {
    z-index: 1;
}
.center__front img {
    width: 60px;
}
.block__center__wrapper div:last-child{
    border-top: 1px solid white;
}
.center__front.logged div{
    border-top: none;
}
.block__center__wrapper div:hover {
    color: white;
    font-weight: 700;
}


.second__block__anim, .first__block__anim {
    transform: translate(6px, -304px);
    opacity: 0;
}
.second__block__anim {
    transform-origin: top center;
    animation-name: second-appear;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 1.5s;
}
.first__block__anim {
    transform: translate(210px, -304px);
    opacity: 0;
    transform-origin: right center;
    animation-name: first-appear, first-appear-next;
    animation-duration: 1s, 1s;
    animation-timing-function: ease-in-out, ease-in-out;
    animation-fill-mode: forwards, forwards;
    animation-delay: 1.5s, 2.5s;
}
.third__block__anim, .forth__block__anim {
    transform: translate(-3px, -304px);
    opacity: 0;
}
.third__block__anim {
    transform-origin: top center;
    animation-name: third-appear;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 2s;
}
.forth__block__anim {
    transform: translate(-206px, -304px);
    opacity: 0;
    transform-origin: left center;
    animation-name: forth-appear, forth-appear-next;
    animation-duration: 1s, 1s;
    animation-timing-function: ease-in-out, ease-in-out;
    animation-fill-mode: forwards, forwards;
    animation-delay: 2.5s, 3s;
}
.center__block__anim {
    position: relative;
    perspective: 1000px;
    transition: 0.3s ease-in-out;
}
.center__front, .center__back {
    position: absolute;
    backface-visibility: hidden;
    transition: 0.5s ease;
}
.center__front {
    transform: translateY(-400%) rotate(45deg) rotateY(180deg);
    transition: 0.3s ease-in-out;
    animation-name: center-front-appear, center-front-rotate;
    animation-duration: 1s, 0.3s;
    animation-timing-function: ease-in-out, ease-in-out;
    animation-fill-mode: forwards, forwards;
    animation-delay: 0s, 1.2s;
}
.center__back {
    transform: translateY(-400%) rotate(45deg);
    animation-name: center-back-appear, center-back-rotate;
    animation-duration: 1s, 0.3s;
    animation-timing-function: ease-in-out, ease-in-out;
    animation-fill-mode: forwards, forwards;
    animation-delay: 0s, 1.2s;
}

.romb {
    width: 0;
    height: 0;
    border: 8px solid transparent;
    border-bottom-color: #1A0A37;
    position: relative;
    top: -8px;
}
.romb:after {
    content: "";
    width: 0;
    height: 0;
    position: absolute;
    left: -8px;
    top: 8px;
    border: 8px solid transparent;
    border-top-color: #1A0A37;
}
.headerMain__stat {
    opacity: 0;
    transform-origin: bottom center;
    animation-name: stat-appear;
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 2.5s;
}
.headerMain__stat__item>div>div:last-child {
    margin-left: 10px;
    font-weight: 500;
}
.headerMain__stat__item>div:last-child {
    margin-left: 26px;
    font-size: 16px;
    color: #7C59B5;
}
.headerMain__stat__item {
    position: absolute;
}
.headerMain__stat__item:first-child {
    bottom: 28vh;
}
.headerMain__stat__item:last-child {
    right: 0;
    bottom: 28vh;
}
.headerMain__stat__item:nth-child(2) {
    left: 50%;
    transform: translateX(-50%);
    bottom: 14vh;
}
.headerPartners {
    bottom: 8vh;
    /* padding-right: 80px; */
    opacity: 0;
    animation-name: partners-appear;
    animation-duration: 1s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 3s;
}
.headerPartners>div:last-child {
    padding-right: 80px;
}
.headerNav__profile {
    padding: 12px 4px 14px 13px;
    background: #7C59B5;
    border-radius: 10px 0 0 10px;
    color: white;
    /* transform: translateX(80px); */
}
.headerNav__account {
    padding: 6px 0 10px 13px;
    background: #1A0A37;
    /* transform: translateX(80px); */
}
.headerNav__account a {
    color: white;
}


@keyframes bg-appear {
    from {
        transform: scale(2);
    }
    to {
        transform: none;
    }
}
@keyframes menu-appear {
    from {
        transform: translateY(-110%);
        opacity: 0;
    }
    to {
        transform: none;
        opacity: 1;
    }
}
@keyframes title-appear {
    from {
        transform: translateY(-150%);
        opacity: 0;
    }
    to {
        transform: none;
        opacity: 1;
    }
}
@keyframes stat-appear {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
@keyframes partners-appear {
    from {
        transform: translateY(150%);
        opacity: 0;
    }
    to {
        transform: none;
        opacity: 1;
    }
}
@keyframes center-front-appear {
    from {
        transform: translateY(-400%) rotate(45deg) rotateY(180deg);
    }
    to {
        transform: rotate(45deg) rotateY(180deg);
    }
}
@keyframes center-back-appear {
    from {
        transform: translateY(-400%) rotate(45deg);
    }
    to {
        transform: rotate(45deg);
    }
}
@keyframes center-front-rotate {
    from {
        transform: rotate(45deg) rotateY(180deg);
    }
    to {
        transform: rotate(45deg) rotateY(360deg);
    }
}
@keyframes center-back-rotate {
    from {
        transform: rotate(45deg);
    }
    to {
        transform: rotate(45deg) rotateY(360deg);
    }
}

@keyframes first-appear {
    from {
        transform: translate(210px, -304px);
        opacity: 0;
    }
    to {
        transform: translate(210px, 0);
        opacity: 0;
    }
}
@keyframes second-appear {
    from {
        transform: translate(6px, -304px);
        opacity: 0;
        transform: rotateX(-180deg);
    }
    to {
        transform: translate(0, 0);
        opacity: 1;
        transform: rotateX(0);
    }
}
@keyframes first-appear-next {
    from {
        transform: translate(210px, 0);
        opacity: 0;
        transform: rotateY(-180deg);
    }
    to {
        transform: translate(0, 0);
        opacity: 1;
        transform: rotateY(0);
    }
}
@keyframes third-appear {
    from {
        transform: translate(-3px, -304px);
        opacity: 0;
        transform: rotateX(-180deg);
    }
    to {
        transform: translate(0, 0);
        opacity: 1;
        transform: rotateX(0);
    }
}
@keyframes forth-appear {
    from {
        transform: translate(-206px, -304px);
        opacity: 0;
        transform: rotateY(-180deg);
    }
    to {
        transform: translate(-206px, 0);
        opacity: 0;
        transform: rotateY(0);
    }
}
@keyframes forth-appear-next {
    from {
        transform: translate(-206px, 0);
        opacity: 0;
        transform: rotateY(-180deg);
    }
    to {
        transform: translate(0, 0);
        opacity: 1;
        transform: rotateY(0);
    }
}

/* parallax */
.parallax-image {
    background: url('../img/main-bg.jpg') no-repeat top left;
    background-size: cover;
    background-attachment: fixed;
    height: 105vh;
}



/* serviceInfo */

.serviceInfo__items {
    transform-origin: top center;
    transform: translateY(-100%);
    transition: 0.3 ease-in-out;
    /* animation-name: info-appear; */
    animation-duration: 0.5s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    /* animation-delay: 3s; */
}
.serviceInfo__item {
    position: relative;
    z-index: 1;
    padding: 41px 30px 30px 41px;
    height: 240px;
    cursor: pointer;
    transition: 0.3s ease;
}
.more:hover {
    color: white;
}
.serviceInfo__item img {
    width: 60px;
    height: 60px;
}

@keyframes info-appear {
    from {
        transform: translateY(-100%);
    }
    to {
        transform: none;
    }
}

/*dealsControl */

.dealsControl {
    height: 103vh;
    background: url('../img/bg-control.png') no-repeat top right;
    background-size: contain;
    overflow: hidden;
    transform-origin: right center;
    opacity: 0;
    transform: scale(0);
    /* animation-name: bg-animation; */
    animation-duration: 1.5s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    transition: 0.3 ease-in-out;
}
.dealsControl h2,
.dealsScheme {
    margin: 115px 0 0 75px;
}
.dealsControl__icon {
    position: relative;
    cursor: pointer;
}
.dealsControl__icon:not(:last-child) {
    margin-right: 134px;
}
.dealsControl__items {
    height: 80vh;
    margin-left: 80px;
    margin-top: 30px;
    /* transform: translateX(100%); */
}
.dealsControl__item h2 {
    margin-bottom: 50px;
}
.dealsControl__item ul {
    margin: 30px 0;
}
.dealsControl__item ul li:not(:last-child){
    margin-bottom: 17px;
}
.dealsControl__toggle {
    margin-left: 75px;
}
.dealsControl__icon:nth-child(2)::before {
    content: "";
    display:block;
    position: absolute;
    top: 50%;
    right: 81px;
    width: 143px;
    height: 1px;
    background: #AAA4B6;
}
.dealsControl__icon:nth-child(2)::after {
    content: "";
    display:block;
    position: absolute;
    top: 50%;
    left: 81px;
    width: 143px;
    height: 1px;
    background: #AAA4B6;
}
.dealsScheme__items__title {
    font-weight: 700;
    margin-top: 10px;
    margin-bottom: 10px;
}
.dealsScheme__item .btn {
    margin-top: 40px;
}
.dealsScheme .slider-indicators {
    width: 100%;
    margin-top: 30px;
    transition: 0.3s ease-in-out;
}

.autoSlider {
    height: auto;
    overflow: hidden;
}
.autoSlide {
    transition: 0.3s ease-in-out;
    transform-origin: right center;
}

.dealsScheme__gif,
.slider-indicators {
    top: 0;
    right: 0;
    opacity: 0;
    /* animation-name: animationGif; */
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    transition: 0.3 ease-in-out;
}
.slider-indicators {
    animation-delay: 1s;
}

.dealsScheme__wrapper {
    margin-top: 30px;
}

@keyframes bg-animation {
    from {
        opacity: 0;
        transform: scale(0);
    }
    to {
        opacity: 1;
        transform: scale(1);
    }
}
@keyframes animationGif {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

.tab-content {
    position: absolute;
    left: 0;
    transform-origin: center right;
    transform: scale(0);
    opacity: 0;
    transition: 0.7s ease-in-out;
}
.tab-content.active {
    transform: scale(1);
    opacity: 1;
}
.tab-indicators,
.slider-indicators {
    width: 500px;
}
.tab-indicators div,
.slider-indicators div {
    width: 8px;
    height: 8px;
    background: #D9D9D9;
    border-radius: 100px;
    cursor: pointer;
    margin-bottom: 25px;
}
.tab-indicators div:not(:last-child),
.slider-indicators div:not(:last-child) {
    margin-right: 8px;
}
.tab-indicator.active,
.slider-indicator.active {
    background: #7C59B5;
}
.tab-title .img-purple{
    display: none;
}
.tab-title.active .img-purple{
    display: inline;
}
.tab-title.active .img-grey{
    display: none;
}

/* dealSafe */

.dealSafe {
    height: 100vh;
    overflow: hidden;
    margin-top: 100px;
}
.dealSafe__adventages {
    position: absolute;
    height: 100%;
    padding: 60px 80px 70px 105px;
    transition: 0.3s ease-in-out;
    transform: translateX(120%);
    transform-origin: left center;
    /* animation-name: safe-bg-appear; */
    animation-duration: 4s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0s;
    transition: 0.3 ease-in-out;
}
.dealSafe__adventages__items {
    position: absolute;
    top: 50%;
    right: -162px;
    transform: translateY(120%);
    /* animation-name: safe-items-appear; */
    animation-duration: 3s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0s;
    transition: 0.3s ease-in-out;
    transform-origin: top center;
}
.dealSafe__adventages__item {
    height: 420px;
    padding: 20px 15px 5px 18px;
    border-radius: 10px;
    margin: 0 10px;
    margin-bottom: 20px;
    transition: 0.3s ease-in-out;
}
.dealSafe__adventages h2{
    transition: 0.3s ease-in-out;
    transform: translateX(-320%);
    transform-origin: left center;
    /* animation-name: safe-h2-appear; */
    animation-duration: 4s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0s;
    transition: 0.3 ease-in-out;
}
.dealSafe__adventages h2 {
    margin-bottom: 30px;
}
.dealSafe__img {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    left:-20%;
    transform-origin: center center;
    /* animation-name: safe-circleBlock-appear; */
    animation-duration: 2.5s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0s;
    transition: 0.3 ease-in-out;
}
.dealSafe__img img{
    transform: rotate(-360deg);
    transform-origin: center center;
    /* animation-name: safe-circle-appear; */
    animation-duration: 2.5s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    animation-delay: 0s;
    transition: 0.3 ease-in-out;
}

@keyframes safe-items-appear {
    from {
        transform: translateY(120%);
    }
    to {
        transform: translateY(-50%);
    }
}
@keyframes safe-bg-appear {
    from {
        transform: translateX(120%);
    }
    90% {
        transform: translateX(-10%);
    }
    100% {
        transform: none;
    }
}
@keyframes safe-h2-appear {
    from {
        transform: translateX(-320%);
    }
    to {
        transform: none;
    }
}
@keyframes safe-circle-appear {
    from {
        transform: rotate(-360deg);
    }
    to {
        transform: none;
    }
}
@keyframes safe-circleBlock-appear {
    from {
        transform: translate(-50%, -50%);
    }
    to {
        transform: translate(0, -50%);
    }
}


/*review slider */

.reviewsBlock {
    margin: 140px 0;
}
.reviewsBlock h2,
.dealsScheme h2,
.dealsControl h2{
    margin-bottom: 60px;
    transform: translateX(-100%);
    transition: 0.3s ease-in-out;
    /* animation-name: reviews-title-appear; */
     animation-duration: 1s;
     animation-timing-function: ease-in-out;
     animation-fill-mode: forwards;
     transition: 0.3 ease-in-out;
}
.dealsScheme h2 {
    animation-delay: 1s;
}
.reviewsBlock__item {
    padding: 20px 30px 40px 40px;
    border: 1px solid #AAA4B6;
    border-radius: 30px;
    margin-right: 15px;
    background: white;
}
.reviewsBlock__item:before {
    content: "";
    background: url('../img/kavichki.svg') no-repeat top center;
    width: 40px;
    height: 40px;
    display: block;
    position: absolute;
    top: -10px;
    right: 50px;
}
.reviewsBlock__item__person {
    margin-left: 12px;
}
.reviewsBlock__item__img {
    width: 74px;
    height: 74px;
    border-radius: 100%;
}
.reviewsBlock__item__stars {
    margin-top: 14px;
}
.reviewsBlock__item__stars img {
    margin-right: 3px;
}
.reviewsBlock__item__txt {
    margin-top: 14px;
}

.slider {
    overflow: hidden;
    height: 480px;
}
.slide {
    cursor: pointer;
    transition: 0.3s ease-in-out;
    /* transform-origin: left center;
    animation-duration: 4s;
    animation-fill-mode: forwards;
    animation-timing-function: linear;
    animation-iteration-count: infinite;
    animation-delay: 2s;
    transition: 0.3 ease-in-out;
    animation-play-state: running; */
}

 .slides {
    cursor: pointer;
    transform-origin: left center;
    transform: translateX(100%);
    transition: 0.3s ease-in-out;
    /* animation-name: animationSlider, slider-animation; */
    animation-duration: 5s, 20s;
    animation-direction: normal, alternate;
    animation-timing-function: linear, linear;
    animation-iteration-count: 1, infinite;
    animation-fill-mode: forwards, forwards;
    animation-delay: 0, 5s;
    animation-play-state: running, running;
}

.autoSlides,
.dealsControl__items {
    transform-origin: left center;
    transform: translateX(100%);
    /* animation-name: animationSlider; */
    animation-fill-mode: forwards;
    /* animation-direction: alternate; */
    animation-timing-function: ease-in-out;
    animation-iteration-count: 1;
    transition: 0.3 ease-in-out;
    /* animation-play-state: running; */
}
/* .slides {
    animation-duration: 1.5s;
} */
/* .slides:hover .slide{
    animation-play-state: paused;
} */
.slides:hover{
    animation-play-state: paused;
}
.slide:hover {
    transform: scale(1.2);
}
.autoSlides {
    animation-duration: 1s;
    animation-delay: 1s;
}
.dealsScheme__gif,
.slider-indicators,
.dealsControl__toggle {
    top: 0;
    right: 0;
    opacity: 0;
    /* animation-name: animationGif; */
    animation-duration: 2s;
    animation-timing-function: ease-in-out;
    animation-fill-mode: forwards;
    transition: 0.3 ease-in-out;
}
.slider-indicators {
    animation-delay: 1s;
}

.dealsScheme__wrapper {
    margin-top: 30px;
}
@keyframes animationGif {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}
.dealsScheme__gif {
    top: 0;
    right: 0;
}
.dealsScheme__gif img {
    width: 20%;
    height: auto;
}

@keyframes reviews-title-appear {
    from {
        transform: translateX(-100%);
    }
    to {
        transform: none;
    }
}
@keyframes animationSlider {
    from {
        transform: translateX(100%);
    }
    to {
        transform: none;
    }
}
/* footer */

footer {
    background: url('../img/bg-footer.svg') no-repeat bottom center;
    background-size: 100% auto;
    padding: 60px 130px 30px 173px;
    height: 165px;
}
footer a:hover {
    color: white;
}
.footerNav__items li:not(:last-child) {
    margin-bottom: 30px;
}

/* modal footer */


.Modal, .darkScreen {
    position: fixed;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    background: rgb(0,0,0);
    background: rgba(255,255,255,0.3);
}
.Modal {
    display: none;
    z-index: 10;
}
.Modal .form__field input{
    box-shadow: none;
}
.darkScreen {
    pointer-events: none;
    opacity: 0;
    z-index: 1;
    transition: 2s ease;
}
.active__darkScreen {
    pointer-events: visible;
    opacity: 1;
}
.modal__content {
    padding: 23px 50px 43px 34px;
    background: white;
    border-radius: 16px;
    animation-name: animateBottom;
    animation-timing-function: ease;
    animation-duration: 0.5s;
}
.modal__footer {
    font-size: 14px;
}
.modal__alert {
    display: none;
    color: #A82424;
    margin-bottom: 24px;
}
.modal__footer {
    padding-left: 12px;
    margin-top: 20px;
}
.modal__footer span {
    cursor: pointer;
}
.modalButtons {
    margin: 24px 0;
}
.modalButtons .btn {
    width: 177px;
}
@keyframes animateBottom {
    from {
        bottom:-300px;
        opacity:0
    }
    to {
        bottom:0;
        opacity:1;
    }
}
.iconClose {
    color: #302C37;
    font-size: 3vh;
    margin-bottom: 0.5rem;
    font-weight: bold;
    transition: 0.3s ease;
    cursor: pointer;
}
.forgotten {
    margin: 7px auto;
    cursor: pointer;
}

/*form */

.form__field {
    position: relative;
}
.form__field:not(:last-child){
    margin-bottom: 10px;
    margin-top: 10px;
}
.form__login .form__field {
    width: 305px;
}
.form__field label {
    width: 287px;
    margin-bottom: 10px;
}
.form__field input:not(.agree), .form__field select {
    height: 45px;
    width: 287px;
    padding-left: 12px;
    border-radius: 10px;
    border: 1px solid #302C37;
    background: #F5F5F7;
}
.form__field textarea {
    width: 287px;
    height: 305px;
    padding: 12px;
    border-radius: 10px;
    overflow-y: scroll;
    background: #F5F5F7;
    border: 1px solid #302C37;
}
.form__field>div{
    position: absolute;
    top: 9px;
    right: 16px;
    cursor: pointer;
}
.form__field>img {
    margin-right: 15px;
}
.agree {
    position: absolute;
    z-index: -1;
    opacity: 0;
    cursor: pointer;
}
.agreeSpan {
    padding-left: 60px;
}
.agree ~ label {
    align-items: center;
    user-select: none;
}
.agree ~ label:before {
    content: '';
    position: absolute;
    top:0;
    left: 0;
    display: inline-block;
    width: 27px;
    height: 24px;
    border: 2px solid #322054;
    border-radius: 5px;
    margin-right: 12px;
    background-repeat: no-repeat;
    background-position: center center;
    background-size: 50% 50%;
  }
.agree:checked ~ label:before {
    background: #7C59B5;
    /* border: none; */
  }
.invalid {
    border: 1px solid #A82424;
}
.form__btn {
    width: 225px;
    text-transform: uppercase;
}
.send-code {
    position: absolute;
    right: 0;
    z-index: 2;
    display: block;
    width: 85px;
    height: 25px;
    text-align: center;
    /* pointer-events: none; */
    cursor: pointer;
    background: transparent;
    border-left: 1px solid #AAA4B6;
}
.send-code.active {
    color: #7C59B5;
    font-weight: bold;
}

.form__field_error{
    margin: 0;
    margin-top: -10px;
    font-size: 12px;
    display: flex;
    align-items: start;
    color: red;
}
.form__field > input.error{
    border-color: red;
}

.form__login label {
    width: auto;
    margin-right: 15px;
    margin-bottom: 0;
}
.forgotten label {
    font-size: 14px;
}
::placeholder {
    font-size: 16px;
    color: #AAA4B6;
}

/*help */

.helpCalculation {
    z-index: 1;
}
.helpCalculation__calculate>div,
.helpCalculation__ordering>div {
    margin: 0 auto;
}
.helpCalculation__calculate {
    background: #F5F5F7;
    padding: 24px 0;
}
.helpCalculation__calculate input,
.helpCalculation__calculate button {
    border-radius: 10px;
    padding: 14px;
    margin: 0 10px;
}
.helpCalculation__calculate label:not(.helpCalculation__calculate__side),
.helpCalculation__ordering label {
    margin: 8px 10px;
}
.helpCalculation__calculate div:first-child input {
    width: 305px;
}
.helpCalculation__calculate__side {
    width: 133px;
    transition: 0.3s ease-in-out;
    border-radius: 10px;
    padding: 14px;
    margin: 0 10px;
    cursor: pointer;
}
.helpCalculation__calculate__side:hover {
    background: #E0CEEE;
    color: white;
    border: none;
}
.helpCalculation__calculate__pay input {
    position: absolute;
    left: -9999px;
}
.helpCalculation__calculate__pay input:checked + label {
    background: #2C213F;
    color: white;
}
.helpCalculation__ordering {
    background: white;
    padding: 24px 0;
}
.helpCalculation__ordering input {
    width: 196px;
    border-radius: 10px;
    padding: 14px;
    margin: 0 10px;
}

.helpAbout {
    min-height: 100vh;
    padding: 50px 0;
}
.helpAbout h2 {
    margin-bottom: 15px;
}
.helpAbout__steps.helpBlock {
    min-height: calc(100vh - 110px);
    background: url('../img/bg-help.png') no-repeat top 20% right;
    background-size: contain;
    overflow: hidden;
    padding: 33px 0 0 139px;
}
.helpAbout__step {
    margin-bottom: 35px;
    cursor: pointer;
}
.helpAbout__step__description div:first-child {
    margin-right: 20px;
}
.helpAbout__step div:nth-child(2) {
    margin-bottom: 20px;
}
.helpAbout__step:hover {
    animation: shakeX;
    animation-duration: 2s;
}

.dealSafe.help {
    height: 135vh;
}
.dealSafe.help .dealSafe__adventages__item {
    height: 181px;
}
.dealSafe__adventages__item__title {
    margin-bottom: 10px;
}
.dealSafe__adventages__item__title h3 {
    margin-left: 15px;
}

.helpSafePeriod {
    margin-top: 70px;
    margin-bottom: 50px;
}
.helpSafePeriod__alert {
    padding: 25px 0;
}
.helpSafePeriod__txt {
    padding: 30px 113px 30px 80px;
}
.helpSafePeriod__txt h2 {
    margin-bottom: 30px;
}
.helpSafePeriod__txt p {
    margin: 0 auto;
}

/* forwhom */

.forwhomAdv h2 {
    margin-bottom: 30px;
}
.helpAbout__steps.forwhomBlock {
    min-height: calc(100vh - 110px);
    background: url('../img/help-forwhom.png') no-repeat top 20% right;
    background-size: contain;
    overflow: hidden;
    padding: 33px 0 0 139px;
}
.forwhomAdv__adventages__item li:not(:last-child) {
    margin-bottom: 23px;
}
.forwhomAdv ul li:before {
    content: "";
    display: inline-block;
    width: 20px;
    height: 20px;
    background-image: url('../img/list-icon.svg');
    background-size: cover;
    margin-right: 15px;
    transform: translateY(3px);
}
.forwhomAdv button {
    margin-top: 35px;
}

.forwhomProfit {
    padding-top: 70px;
    padding-bottom: 140px;
    margin-top: 100px;
}
.forwhomProfit h2 {
    margin-bottom: 10px;
    margin-left: 80px;
}
.forwhomProfit__item {
    margin-bottom: 20px;

}
.forwhomProfit__item__txt {
    margin: 0 20px;
    padding: 46px 15px 20px 30px;
}

/* sertificates */


.sertificates__items,
.reviews__items {
    padding: 0 80px;
}
.sertificates__item {
    width: 95%;
    height: 570px;
    border: 1px solid #AAA4B6;
    border-radius: 10px;
    padding: 60px 10px 15px 20px;
}
.sertificates__item h2 {
    margin: 20px 0;
}
.sertificates__item__img {
    margin: 0 auto;
}
.sertificates__item__img img,
.reviews__item__img img {
    width: 100%;
}

/* reviews */

.reviews__item {
    width: 95%;
    height: 500px;
    border-radius: 10px;
    padding: 30px 35px;
}
.reviews__item__txt {
    margin-top: 50px;
}
.reviews__item .btn:hover {
    background: #AFC3F4;
}


@media screen and (max-width: 768px){
    body {
        font-size: 12px;
    }
    h1 {
        font-size: 20px;
        font-weight: 700;
    }
    h2 {
        font-size: 12px;
    }
    h3 {
        font-size: 12px;
    }
    .headerMain__head {
        margin-top: 7vh;
    }
    .headerMain__head p {
        font-size: 14px;
        font-weight: 500;
        margin: 25px auto;
    }
    .headerAnim {
        transform: scale(0.4) translateY(-100%);
    }
    .headerMain__stat__item:first-child {
        bottom: 35%;
        left: 20px;
    }
     .headerMain__stat__item:nth-child(2) {
        left: 20px;
        bottom: 27%;
        transform: none;
    }
    .headerMain__stat__item:last-child {
        left: 20px;
        bottom: 19%;
    }
    .headerPartners {
        bottom: 7%;
    }
    .headerPartners img {
        transform: scale(0.7);
    }
    .serviceInfo__items {
        padding: 0;
    }
    .serviceInfo__item {
        height: 135px;
        padding: 11px 4px 7px 4px;
        margin-top: 0;
    }
    .serviceInfo__item img {
        width: 30px;
        height: 30px;
        float: right;
        margin-left: 3px;
    }
    .serviceInfo__item p {
        margin-bottom: 0;
        overflow-wrap: break-word;
        word-wrap: break-word;
    }
    .text {
        overflow-wrap: break-word; /* Перенос длинных слов */
        word-wrap: break-word; /* Для поддержки старых браузеров */
    }
    .dealsControl h2 {
        margin: 30px 0 0 20px;
    }
    .autoSlider .btn{
        width: 141px;
    }
    .btn {
        font-size: 14px;
        padding: 14px;
    }
    .dealsControl__item .btn {
        width: 254px;
    }
    .dealsControl__icon img {
        width: 36px;
        height: 36px;
    }
    .dealsControl__icon svg {
        width: 36px;
        height: 36px;
    }
    .dealsControl__toggle {
        margin-left: 0;
    }
    .dealsControl__icon:not(:last-child) {
        margin-right: 80px;
    }
    .tab-indicators {
        width: auto;
    }
    .dealsControl__icon:nth-child(2)::before {
        right: 36px;
        width: 82px;
    }
    .dealsControl__icon:nth-child(2)::after {
        left: 36px;
        width: 82px;
    }
    .dealSafe__adventages {
        padding: 30px 15px 25px 60px;
    }
    .dealSafe__img {
        top: 20%;
    }
    .dealSafe__img img {
        width: 316px;
        height: 316px;
    }
    .dealSafe__adventages__items {
        right: -55px;
    }
    .dealSafe__adventages__item p {
        font-size: 10px;
    }
    .dealsScheme__gif img {
    width: 80%;
    }
    .reviewsBlock__item__person div:last-child,
    .reviewsBlock__item__txt{
        font-size: 10px;
    }
    .reviewsBlock {
        margin: 45px 0;
    }
    .reviewsBlock h2 {
        margin-bottom: 35px;
    }
    .reviewsBlock__item {
        padding: 12px 20px 11px 20px;
    }
    .reviewsBlock__item::before {
        right: 27px;
    }
    .helpCalculation__ordering input {
        width: 130px;
    }
    .forwhomAdv__adventages__img img {
        width: 100%;
    }
    .forwhomAdv__adventages__item li {
        font-size: 12px;
    }
    .forwhomProfit {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .forwhomProfit h2 {
        margin-left: 0;
    }
    .forwhomProfit__item:first-child .forwhomProfit__item__img img {
        height: 135px;
    }
    .forwhomProfit__item:nth-child(2) .forwhomProfit__item__img img {
        height: 111px;
    }
    .forwhomProfit__item:nth-child(3) .forwhomProfit__item__img img {
        height: 123px;
    }
    .forwhomProfit__item:nth-child(4) .forwhomProfit__item__img img {
        height: 100px;
    }
    .forwhomProfit__item:nth-child(odd) .forwhomProfit__item__img {
        border-radius: 10px 0 0 10px;
    }
    .forwhomProfit__item:nth-child(even) .forwhomProfit__item__img {
        border-radius: 0 10px 10px 0;
    }

    .forwhomProfit__item:nth-child(4) .forwhomProfit__item__img {
        height: 100px;
    }
    .forwhomProfit__item__img {
        overflow: hidden;
    }
    .forwhomProfit__item__txt {
        max-height: 135px;
        font-size: 10px;
        padding: 10px;
    }
    .helpSafePeriod {
        margin-top: 20px;
    }
    .sertificates__items,
    .reviews__items {
        padding: 0 17px;
    }
    .sertificates__item h2 {
        margin: 10px 0;
    }
    .sertificates__item {
        height: 435px;
        margin-bottom: 20px;
        padding: 20px 17px;
    }
    .reviews__item {
        height: 375px;
        padding: 20px 17px;
    }
}

@media screen and (min-width: 769px){
    .headerAnim {
        transform: scale(0.7) translateY(-25%);
    }
    .serviceInfo__item {
        padding: 20px 15px 15px 20px;
        height: 185px;
    }
}

@media screen and (min-width: 992px){
    .sertificates__item {
        height: 650px;
    }
}

@media screen and (max-width: 1200px){
    .fs-16 {
        font-size: 10px;
    }
    .fs-14 {
        font-size: 10px;
    }
    .headerMain,
    .headerMain.home {
        padding : 10px 0 10px 0;
    }
    .headerMain__content {
        /* height: auto; */
        padding: 0 20px;
    }
    .headerMain__content.logged {
        padding: 0 0 0 20px;
    }
    .headerMain__content.home .headerNav__btns.logged {
        transform: translateX(20px);
    }
    .headerNav__drop {
        position: absolute;
        transform: translateX(-100%);
        top: -10px;
        left: -20px;
        z-index: 10;
        transition: 0.3s ease-in-out;
        /* padding: 36px 22px 67px 60px; */
        padding-bottom: 67px;
        background: RGBA(255,255,255,0.95);
    }
    .headerNav__logo {
        margin-top:20px;
        margin-left: 36px;
        margin-bottom: 14px;
    }
    .headerNav__mobile .headerNav__logo {
        margin-left: 36px;
        margin-top:0;
        margin-bottom: 14px;
    }
    .headerNav__menu li:not(.headerNav__account) {
        padding: 14px 60px 14px 0;
        margin-left: 36px;
    }
    .headerNav__menu li:not(.headerNav__account),
    .headerNav__btns__login {
        border-bottom: 1px solid #AAA4B6;
    }
    .headerNav__menu li a:hover {
        color: #302C37;
    }
    .headerNav__mobile .headerNav__btns {
        margin-top: 0;
        margin-left: 0;
    }
    /* .headerNav__mobile .headerNav__btns.logged {
        transform: translateX(20px);
    } */
    .headerNav__mobile .headerNav__account {
        background: #7C59B5;
        padding: 5px 0 8px 13px;
        transform: none;
    }
    .headerNav__mobile .headerNav__account>div {
        transform: translateX(-10px);
    }
    .headerNav__mobile .headerNav__profile {
        transform: none;
    }
    .headerNav__mobile .headerNav__profile a {
        margin-right: 5px;
    }
    .headerNav__btns {
        margin-top: 40px;
        margin-left: 36px;
    }
    .headerNav__btns__register {
        margin-top: 20px;
        margin-right: 5px;
    }
    .headerNav__profile {
        height: 52px;
    }

    .headerNav__account {
        height: 52px;
    }
    .headerNav__logo .headerNav__profile {
        background: transparent;
        color: #7C59B5;
        transform: none;
        border: none;
        padding: 0;
    }
    .headerNav .headerNav__profile img{
        margin-right: 15px;
    }
    .headerNav__menu .headerNav__account {
        background: #7C59B5;
        transform: none;
        padding-left: 36px;
    }
    .headerNav__menu__exit {
        margin-top: 90px;
        border-bottom: none !important;
    }

    .headerNav {
        transform: translateX(-100%);
        transition: 0.3s ease-in-out;
    }
    .headerNav__content__close {
        width: 25px;
        height: 25px;
        cursor: pointer;
        position: relative;
        transition: 0.3 ease-in-out;
    }
    .headerNav__content__close span {
        position: absolute;
        display: block;
        background: #302C37;
        width: 14px;
        height: 2px;
        top: 20px;
        transition: 0.3s ease-in-out;
    }
    .headerNav__content__close span:first-child {
        transform: rotate(45deg);
    }
    .headerNav__content__close span:last-child {
        transform: rotate(-45deg);
    }
    .headerNav__mobile .headerNav__logo {
        margin-bottom: 0;
    }
    .headerNav__mobile .headerNav__btns img {
        width: 20px;
    }
    .headerNav__mobile .headerNav__btns__login {
        border: none;
        margin-right: 20px;
    }
    .headerNav__mobile .headerNav__btns__register {
        width: 128px;
        margin-top: 0;
    }
    .headerNav__toggle {
        height: 20px;
        cursor: pointer;
        position: relative;
    }
    .headerNav__toggle span {
        width: 30px;
        display: block;
        position: absolute;
        height: 3px;
        background: white;
    }
    .headerNav__toggle span::before {
        content: "";
        position: absolute;
        top: -10px;
        left: 0;
        height: 3px;
        width: 30px;
        margin-top: 3px;
        background: white;
    }
    .headerNav__toggle span::after {
        content: "";
        position: absolute;
        top: 5px;
        left: 0;
        height: 3px;
        width: 30px;
        margin-top: 3px;
        background: white;
    }
    .headerMain.home  .headerNav__toggle span,
    .headerMain.home  .headerNav__toggle span:before,
    .headerMain.home  .headerNav__toggle span:after {
        background: #302C37;
    }
    .headerPartners {
        padding-right: 0;
        padding: 0 10px;
    }
    .more {
        font-size: 8px;
    }
    .dealsControl {
        background: url('../img/bg-control.png') no-repeat top 15% right;
        background-size: 50% auto;
        height: 90vh;
    }
    .dealsControl__items {
        height: 65vh;
        margin-left: 20px;
    }
    .dealSafe {
        height: 123vh;
        margin-top: 0;
    }
    .dealSafe__img {
        left: -60%;
    }
    .dealSafe__adventages__item,
    .dealSafe.help .dealSafe__adventages__item {
        height: auto;
    }
    .dealSafe.help .dealSafe__adventages__item__title img {
        width: 30px;
        height: 30px;
    }
    .reviewsBlock__item__person div:first-child {
        font-size: 14px;
    }
    footer {
        background: url('../img/bg-footer.svg') no-repeat bottom left;
        background-size: auto;
        height: auto;
        padding: 64px 25px 15px 25px;
    }
    .footerCopyright {
        margin-top: 30px;
    }
    .footerNav__items li:not(:last-child) {
        margin-bottom: 10px;
    }
    .helpCalculation__calculate input,
    .helpCalculation__calculate__side,
    .helpCalculation__ordering input  {
        margin-bottom: 20px;
    }
    .helpCalculation h2,
    .helpAbout h2 {
        font-size: 14px;
    }
    .helpCalculation .fs-16, .buhelpCalculation .fs-16 {
        font-size: 16px;
    }
    .helpAbout__steps.helpBlock {
        background: url('../img/bg-help-about.png') no-repeat top 10% right;
        background-size: 60% auto;
        padding: 24px 0 0 15px;
    }
    .helpAbout.forwhomBlock {
        padding: 50px 0 0 0;
    }
    .helpAbout__steps.forwhomBlock {
        background: url('../img/help-forwhom.png') no-repeat top 5% right;
        background-size: 55% auto;
        padding: 24px 15px 0 15px;
    }
    .helpSafePeriod__txt {
        padding: 23px 29px 29px 23px;
    }
    .sertificates__item,
    .reviews__item {
        margin-bottom: 20px;
    }
    .helpAbout__step__description div:first-child {
        margin-right: 0;
        margin-bottom: 10px;
    }
}

@media screen and (min-width: 1201px){
    .dealSafe__adventages__item {
        height: 360px;
    }
    .serviceInfo__item {
        padding: 41px 30px 30px 41px;
        height: 260px;
    }
    .more {
        opacity: 0;
    }
    .serviceInfo__item:hover {
        transform: scale(1.1);
    }
    .serviceInfo__item:hover .more {
        opacity: 1;
    }
    .more:hover {
        color: white;
    }
}

@media screen and (min-width: 1300px){
    .dealsControl__items {
        height: 65vh;
    }
    .dealSafe__adventages__items {
        top: 54%;
        right: -137px;
    }
    .dealSafe__adventages__item {
        height: 285px;
    }
    .dealSafe__adventages {
        padding: 30px 80px 30px 105px;
    }
    .dealSafe__img {
        left: -25%;
    }
    .dealSafe__img img {
        width: 45%;
    }
}

@media screen and (max-width: 1400px){
    .sertificates__item, .reviews__item {
        margin-bottom: 20px;
    }
    .dealsScheme__gif img {
         height: auto;
    }
}
@media screen and (max-width: 1919px){
    .dealSafe.help {
        height: 150vh;
    }
    .dealsControl {
        height: 115vh;
    }
}

@media screen and (min-width: 1920px){
    .serviceInfo__item {
        height: 220px;
    }
    /* .headerMain.home {
        padding: 20px 80px;
    } */
    .dealSafe__adventages h2 {
        margin-top: 100px;
        margin-left: 100px;
    }
    .headerAnim {
        transform: none;
    }
    footer {
        padding: 71px 130px 23px 173px;
        height: 230px;
    }
    .helpAbout__steps__wrapper {
        padding-top: 120px;
    }
}

/*logged pages */

/* sysytem Message */

.systemMsg {
    min-height: calc(100vh - 89px - 165px);
}
.systemMsg__msg {
    border-radius: 10px;
    padding: 40px 30px 40px 50px;
    margin: 30px 50px;
}

/* deals */

.dealsList {
    min-height: calc(100vh - 89px - 165px - 173px);
    margin-top: 40px;
    margin-bottom: 40px;
}
.deals .blockTitle {
    padding-right: 80px;
}
.dealsList__items {
    background: white;
    padding: 15px 80px 15px 20px;
    border-radius: 10px;
}
.dealsList__title,
.dealsList__item {
    padding-bottom: 10px;
}
.dealsList__title:not(:last-child),
.dealsList__item:not(:last-child) {
    padding-bottom: 10px;
    border-bottom: 1px solid #E7E7EC;
}
.dealsList__item {
    padding-top: 10px;
    transition: 0.3s ease-in-out;
}
.dealsList__item:hover {
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.dealStatus__item {
    padding: 5px 10px;
    border-radius: 10px;
}
.dealsList__title span {
    margin-right: 10px;
}

/* new deal*/

.newDeal {
    padding-bottom: 55px;
    padding-top: 40px;
}
.newDealBlock, .newDeal__payments {
    margin-bottom: 36px;
}
.newDeal__payments__title {
    font-weight: 700;
    margin-bottom: 20px;
}
.newDeal__payments {
    padding: 24px;
    border-radius: 10px;
}
.newDeal__payment{
    padding: 16px 0;
}
.newDeal__payment span:last-child {
    font-weight: 700;
    margin-top: 10px;
}
.newDeal__payment:not(:last-child) span:last-child {
    border-right: 1px solid #AAA4B6;
}
.newDeal .btn {
    margin-top: 40px;
}

/* deal status */

.dealStatus {
    padding: 40px 80px;
}
.dealStatus__calc__title {
    font-weight: 700;
    margin-bottom: 11px;
}
.dealStatus__calc__info {
    margin-bottom: 20px;
}
.dealStatus__calc__info__row {
    padding: 10px 80px 10px 20px;
}
.dealStatus__calc__info__row:nth-child(odd) {
    background: white;
}

.deals__result-confirm{
    margin:10px;
}
.dealStatus__chat__title {
    font-weight: 700;
    margin-bottom: 10px;
    font-size: 16px;
}
.dealStatus__chat__main {
    background: white;
    border-radius: 10px;
}
.dealStatus__chat__main__warning,
.dealStatus__chat__main__dialog {
  padding: 10px 20px 0 20px;
}

.dealStatus__chat__main__dialog {
    margin-top: 15px;
    overflow-y: scroll;
    height: 500px;
}

.dealStatus__chat__main__message {
    min-width: 248px;
    max-width: 70%;
    border: 1px solid black;
    padding: 20px 25px 10px 20px;
    border-radius: 10px;
    margin-bottom: 20px;
}
.dealStatus__chat__message {
    padding: 12px 39px 12px 10px;
    border: 1px solid black;
    border-radius: 0px 0px 16px 16px;
}
.dealStatus__chat__message__btn img:first-child {
    margin-right: 15px;
}
.dealStatus__status >div:first-child {
    font-size: 14px;
}
.dealStatus__status__img {
    margin: 0 auto;
    width: 60px;
    height: 60px;
    border-radius: 100%;
    margin-bottom: 34px;
}
.dealStatus__line {
    display: block;
    bottom: -57%;
    left: 50%;
    width: 1px;
    height: 35px;
}

/* account */

.accountInfo .helpSafePeriod__txt .block__description:last-child {
    margin-top: 10px;
    font-weight: 700;
}
.accountTitle .blockTitle {
    padding-right: 80px;
}
.accountTitle .blockTitle>div span:last-child {
    font-size: 20px;
    font-weight: 700;
}
.accountHistory {
    height: calc(100vh - 98px - 101px - 165px);
    margin-top: 40px;
}
.accountHistory__table,
.accountHistory__topup__empty,
.accountHistory__withdrawal__empty {
    margin: 0 auto;
    background: white;
    border-radius: 10px;
    padding-top: 15px;
}
.tableRow {
    padding: 20px 80px 12px 20px;
}
.tableRow:hover {
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.tableRow:not(:first-child) {
    border-top: 1px solid #E7E7EC;
}
.accountHistory__btns {
    margin: 0 auto;
}
.accountHistory__btn {
    padding: 13px 20px;
    background: #DBDBDE;
    border-radius: 10px;
    color: #757578;
    cursor: pointer;
}
.accountHistory__btn.active {
    background: white;
    color: #302C37;
}

.accountTitle .btn, .deals .btn{
    width: 180px;
    margin: 0 5px;
}
.accountHistory__transfer button{
    width: 100%;
    padding: 13px 20px;
    background: #7C59B5;
    border-radius: 10px;
    color: white;
    transition: 0.3s ease-in-out;
}
.accountHistory__transfer button:hover {
    color: white;
    background: #322054;
    box-shadow: 0 4px 4px 0 rgba(0, 0, 0, 0.25);
}
.sendBlock {
    margin: 0 auto;
    background: white;
    border-radius: 10px;
    padding: 34px 0 20px 30px;
}
.sendBlock .btn {
    margin-top: 30px;
    margin-left: 10px;
}
.sendBlock .form__field input:not(.agree) {
    background: white;
}
.sendBlock label {
    margin-left: 15px;
}
.accountHistory__topup__empty,
.accountHistory__withdrawal__empty {
    height: 75px;
    padding-left: 30px;
}
.sendBlock select {
    font-size: 16px;
    background: white;
}
.sendBlock select option{
    font-size: 12px;
}


/*pagination*/

.pagination {
    margin-bottom: 64px;
}
.pagination__block {
    width: 32px;
    height: 32px;
    border-radius: 4px;
    cursor: pointer;
    font-size: 10px;
    font-weight: 700;
}
.pagination__block img {
    width: 10px;
    height: 10px;
}

/* settings*/

.settingsBlock {
    min-height: calc(100vh - 98px - 165px);
}
.settingBlock__photo {
    margin-bottom: 50px;
}
.settingBlock__photo__img {
    margin-bottom: 10px;
}
.settingBlock__photo__img img{
    width: 150px;
    height: 150px;
}
.settingsBlock .btn {
    margin-top: 40px;
}
.settingsBlock .form__field label {
    margin-right: 15px;
    margin-bottom: 0;
    width: 125px;
}
.settingsBlock .form__field input {
    width: 287px;
    height: 45px;
    box-shadow: none;
}
.settingsBlock .form__field label {
    font-weight: 700;
}


@media screen and (max-width: 576px){
    .dealsList__items {
        padding: 15px 10px 15px 7px;
    }
}
@media screen and (max-width: 768px){
    .deals .blockTitle {
        padding-right: 10px;
    }
    .dealStatus {
        padding: 10px 5px 48px 5px;
    }
    .dealStatus__status__img {
        width: 34px;
        height: 34px;
    }
    .dealStatus__status__img img {
        width: 17px;
        height: 17px;
    }
    .dealStatus__status__imgs:not(:last-child) .dealStatus__status__img{
        margin-right: 26px;
    }
    .dealStatus__calc__title {
        margin-left: 20px;
    }
    .dealStatus__line {
        display: block;
        bottom: 14px;
        left: 33px;
        width: 28px;
        height: 1px;
    }
    .accountTitle .blockTitle>div span:first-child {
        font-size: 12px;
    }
    .accountTitle .blockTitle>div span:last-child {
        font-size: 14px;
    }
    .accountInfo .block__description:last-child {
        font-size: 16px;
        font-weight: 700;
    }
    .account-number {
        width: 90%;
        word-wrap: break-word;
        overflow-wrap: break-word;
    }
    .accountHistory {
        height: calc(100vh - 72px - 52px - 170px);
    }
    .accountHistory__table {
        margin-bottom: 40px;
    }
    .accountHistory__table .tableRow {
        padding: 10px 8px 12px 8px;
    }
    .accountHistory__table .colContent div,
    .accountHistory__table .colTitle {
        font-size: 10px;
    }

    .accountHistory__transfer button{
        margin: 0 0 15px 5px;
        padding: 10px 5px;
    }
    .sendBlock {
        padding: 24px 40px 50px 20px;
    }
    .tab-content>.accountHistory__transfer {
        margin: 0 auto;
    }
    .accountHistory__topup__empty {
        margin-bottom: 40px;
    }
    .accountHistory__table {
        height: 85%;
        overflow: hidden;
    }
    .tabs__content {
        height: 100%;
    }
    .tab-content {
        height: 60%;
    }
    .settingsBlock {
        padding-top: 40px;
        padding-bottom: 40px;
    }
    .settingsBlock .form__field label {
        margin-bottom: 10px;
    }
    .settingsBlock .form__field>div {
        top: 37px;
    }
    .settingsBlock .btn {
        width: 200px;
    }
}


@media screen and (max-width: 1200px){
    .blockTitle,
    .dealStatus__chat__title,
    .newDealBlock label,
    .dealStatus__calc__title {
        font-size: 14px;
    }

    .newDealBlock select,
    .newDeal__payment span:last-child {
        font-size: 16px;
    }
    .newDeal__payment span:first-child {
        font-size: 10px;
    }
    .dealStatus__calc .btn {
        margin-bottom:30px;
    }
    .dealStatus__status__names {
        margin-bottom: 5px;
    }
    .dealStatus__status__img {
        margin-bottom: 0;
    }
    .dealStatus__calc {
        margin-top: 30px;
    }
    .dealStatus__chat__message {
        padding: 12px 30px 12px 10px;
    }
    .dealStatus__chat__message__btn img {
        width: 20px;
        height: 20px;
    }
    .accountTitle .blockTitle {
        padding: 13px;
    }
    .settingsBlock .form__field label {
        font-size: 14px;
        margin-left: 10px;
    }
    .dealsScheme {
        margin: 40px 30px 0 23px;
    }

}

#payment-bank-name {
    display: none;
}