.overlay {
    display: none;
    position: fixed;
    z-index: 99;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    overflow-y: scroll;
    overflow-x: hidden
}

.overlay.active {
    display: block
}

.overlay_bg {
    display: block;
    position: fixed;
    z-index: -99;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    transform: translate3d(-100%, 0, .1px);
    transition: opacity .22s ease-in-out, transform 0s .3s, z-index 0s .3s;
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: rgba(0, 0, 0, .7)
}

.overlay_bg.active {
    transform: translate3d(0, 0, 0);
    opacity: 1;
    transition: opacity .22s ease-in-out, transform 0s, z-index 0s;
    z-index: 99
}

.overlay_bg .modal_wr {
    padding: 70rem 0;
    position: relative;
    z-index: 2;
    margin: 0 auto;
    width: 100vw;
    max-height: 100%;
    min-height: 100%;
    height: 100%;
    overflow-y: auto;
    display: flex;
    justify-content: center;
    align-items: center
}

.close {
    width: 46rem;
    height: 46rem;
    display: flex;
    border-radius: 50%;
    justify-content: center;
    align-items: center;
    fill: #ef5121;
    background-color: #1d1d1d;
    transition: fill .22s ease-in-out, background-color .22s ease-in-out;
    cursor: pointer
}

.close i {
    width: 16rem;
    height: 16rem;
    display: flex;
    justify-content: center;
    align-items: center;
    fill: inherit
}

.close:focus, .close:hover {
    fill: #fff;
    background-color: #ef5121
}

.modal {
    margin: auto;
    display: flex;
    flex-direction: column;
    justify-content: center;
    position: relative;
    opacity: 1;
    z-index: -99;
    pointer-events: none;
    display: none;
    overflow: hidden;
    color: #fff;
    width: calc(100% - 200rem);
    max-width: 920rem;
    padding: 65rem;
    border-radius: 40rem 0 40rem 40rem
}

.modal::after, .modal::before {
    content: "";
    display: block;
    position: absolute;
    right: 0;
    top: 0
}

.modal::before {
    width: 100%;
    height: 100%;
    background-color: #1d1d1d;
    border-radius: inherit;
    -webkit-clip-path: polygon(calc(100% - 60rem + 2px) 0, calc(100% - 60rem + 2px) calc(60rem - 1px), 100% calc(60rem - 1px), 100% 100%, 0 100%, 0 0);
    clip-path: polygon(calc(100% - 60rem + 2px) 0, calc(100% - 60rem + 2px) calc(60rem - 1px), 100% calc(60rem - 1px), 100% 100%, 0 100%, 0 0)
}

.modal:after {
    width: 60rem;
    height: 60rem;
    background-image: url(/assets/Main/Main/icons/modal_d.svg);
    background-size: cover;
    background-repeat: no-repeat;
    background-position: 0 0
}

.modal .close {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 2
}

.modal.active {
    z-index: 100;
    pointer-events: auto;
    display: flex;
    -webkit-animation: fade .3s 0s ease-in-out;
    animation: fade .3s 0s ease-in-out
}

.modal_cont {
    position: relative
}

.modal_descr {
    margin-top: 20rem;
    font-size: 18rem;
    line-height: 120%
}

.modal_form_wr {
    margin-top: 75rem
}

.coloredText {
    color: var(--tangerine);
}

.modal_form_inputs {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    gap: 60rem;
}

.modal_form_inputs .input_block {
    /*width: calc((100% - 40rem) / 3);*/
    width: 75%;
}

.modal_form_foot {
    margin-top: 45rem;
    display: flex;
    align-items: center
}

.modal_form_foot .btn {
    border-color: rgba(0, 0, 0, 0) !important
}

.modal_form_foot_r {
    margin-left: 75rem;
    font-size: 14rem;
    line-height: 120%
}

.modal_form_foot_r a {
    display: inline-block;
    border-bottom: 1px solid #fff;
    transition: border-color .22s ease-in-out, color .22s ease-in-out
}

.modal_form_foot_r a:focus, .modal_form_foot_r a:hover {
    color: #ef5121;
    border-color: #ef5121
}

.modal_thnx {
    max-width: 600rem
}

.modal_thnx .modal_descr {
    margin-top: 40rem
}

@media (max-width: 1024px) {
    .overlay_bg .modal_wr {
        padding: 30rem 0
    }

    .modal {
        width: 964rem;
        max-width: 964rem
    }

    .modal_thnx {
        max-width: 600rem
    }
}

@media (max-width: 590px) {
    .close {
        width: 36rem;
        height: 36rem
    }

    .close i {
        width: 10rem;
        height: 10rem
    }

    .modal {
        width: 290rem;
        max-width: 290rem;
        padding: 50rem 20rem;
        border-radius: 20rem 0 20rem 20rem
    }

    .modal::before {
        -webkit-clip-path: polygon(calc(100% - 46rem + 2px) 0, calc(100% - 46rem + 2px) calc(46rem - 1px), 100% calc(46rem - 1px), 100% 100%, 0 100%, 0 0);
        clip-path: polygon(calc(100% - 46rem + 2px) 0, calc(100% - 46rem + 2px) calc(46rem - 1px), 100% calc(46rem - 1px), 100% 100%, 0 100%, 0 0)
    }

    .modal:after {
        width: 46rem;
        height: 46rem
    }

    .modal_descr {
        margin-top: 20rem;
        font-size: 12rem;
        line-height: 120%
    }

    .modal_form_wr {
        margin-top: 30rem
    }

    .modal_form_inputs {
        display: block
    }

    .modal_form_inputs .input_block {
        width: 100%;
        margin-top: 30rem
    }

    .modal_form_inputs .input_block:first-child {
        margin-top: 0
    }

    .modal_form_foot {
        margin-top: 30rem;
        display: block
    }

    .modal_form_foot_r {
        margin-left: 0;
        margin-top: 20rem;
        font-size: 10rem;
        line-height: 120%
    }

    .modal_thnx {
        max-width: 290rem
    }
}