/*new code*/
@font-face {
    font-family: nooshikaybakh;
    src: url(../fonts/Yekan-Bakh-FaNum-01-Hairline.woff);
    font-weight: 100;
}

@font-face {
    font-family: nooshikaybakh;
    src: url(../fonts/Yekan-Bakh-FaNum-02-Thin.woff);
    font-weight: 200;
}

@font-face {
    font-family: nooshikaybakh;
    src: url(../fonts/Yekan-Bakh-FaNum-03-Light.woff);
    font-weight: 300;
}

@font-face {
    font-family: nooshikaybakh;
    src: url(../fonts/Yekan-Bakh-FaNum-04-Regular.woff);
    font-weight: 400;
}

@font-face {
    font-family: nooshikaybakh;
    src: url(../fonts/Yekan-Bakh-FaNum-05-Medium.woff);
    font-weight: 500;
}

@font-face {
    font-family: nooshikaybakh;
    src: url(../fonts/Yekan-Bakh-FaNum-06-Bold.woff);
    font-weight: 700;
}

@font-face {
    font-family: nooshikaybakh;
    src: url(../fonts/Yekan-Bakh-FaNum-07-Heavy.woff);
    font-weight: 800;
}

@font-face {
    font-family: nooshikaybakh;
    src: url(../fonts/Yekan-Bakh-FaNum-08-Fat.woff);
    font-weight: 900;
}

@font-face {
    font-family: nooshikaybakhen;
    src: url(../fonts/Yekan-Bakh-Fa-En-01-Hairline.woff);
    font-weight: 100;
}

@font-face {
    font-family: nooshikaybakhen;
    src: url(../fonts/Yekan-Bakh-Fa-En-02-Thin.woff);
    font-weight: 200;
}

@font-face {
    font-family: nooshikaybakhen;
    src: url(../fonts/Yekan-Bakh-Fa-En-03-Light.woff);
    font-weight: 300;
}

@font-face {
    font-family: nooshikaybakhen;
    src: url(../fonts/Yekan-Bakh-Fa-En-04-Regular.woff);
    font-weight: 400;
}

@font-face {
    font-family: nooshikaybakhen;
    src: url(../fonts/Yekan-Bakh-Fa-En-05-Medium.woff);
    font-weight: 500;
}

@font-face {
    font-family: nooshikaybakhen;
    src: url(../fonts/Yekan-Bakh-Fa-En-06-Bold.woff);
    font-weight: 700;
}

@font-face {
    font-family: nooshikaybakhen;
    src: url(../fonts/Yekan-Bakh-Fa-En-07-Heavy.woff);
    font-weight: 800;
}

@font-face {
    font-family: nooshikaybakhen;
    src: url(../fonts/Yekan-Bakh-Fa-En-08-Fat.woff);
    font-weight: 900;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/PeydaWeb-Thin.woff);
    font-weight: 100;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/peydaWeb-light.woff);
    font-weight: 200;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/peydaWeb-extralight.woff);
    font-weight: 300;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/PeydaWeb-Regular.woff);
    font-weight: 400;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/PeydaWeb-Medium.woff);
    font-weight: 500;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/PeydaWeb-SemiBold.woff);
    font-weight: 600;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/PeydaWeb-Bold.woff);
    font-weight: 700;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/PeydaWeb-ExtraBold.woff);
    font-weight: 800;
}

@font-face {
    font-family: Peyda;
    src: url(../fonts/PeydaWeb-Black.woff);
    font-weight: 900;
}

html {
    max-width: 100vw;
    overflow-x: hidden;
}

* {
    box-sizing: border-box;
}

body {
    background: #0C0D0B;
    margin: 0;
    min-height: 100vh;
    color: rgb(112, 112, 112);
    font-family: 'nooshikaybakhen';
}

p {
    margin: 0;
}

a {
    color: unset;
    cursor: pointer;
    text-decoration: unset;
}
.dorehacon{
    width:100%;
    height:auto;
    overflow:hidden;
    position:relative;
}
.doreha{
    width:1260px;
    height:auto;
    min-height:300px;
    overflow:hidden;
    position:relative;
    top:50px;
    margin-bottom:50px;
    left:0px;
    right:0px;
    margin:0 auto;
}
.doreh1{
    width:180px;
    height:auto;
    min-height:200px;
    overflow:hidden;
    position:relative;
    float:right;
    margin-right:10px;
    padding:0 20px 0 0;
    border-right:1px solid #e9d206;
    color:#fff;

}
.doreh1 p{
    direction:rtl;
    text-align:right;
        z-index:20;
    position:absolute;
    
}
.dorehbold{
    font-weight:bold;
    color:#e9d206;
}
.dorehbg{
    width:150px;
    height:150px;
    position:absolute;
z-index:10;
float:right;
border-radius:100%;
background:#242424;
right:-60px;
top:35px;
}
.doreh1:nth-child(even) .dorehbg{
    border-radius:0px;
    transform:rotate(-45deg);
        width:120px;
    height:120px;
}
.wrap {
    max-width: 100vw;
    margin-left: auto;
    background: #eee;
    padding: 31px 60px 179px;
    margin-right: -44px;
    margin-top: -15px;
}

.each_setting_row {
    margin-left: auto;
    margin-right: auto;
    background: #fff;
    border-radius: 10px;
    border: 1px #c4c4c4 solid;
    padding: 15px 15px 15px 25px;
    margin-bottom: 10px;
}

input[type="text"] {
    max-width: 1000px;
    border: 1px solid #ff572299;
    flex-grow: 1;
    padding: 4px;
}

.input_row {
    display: flex;
    align-items: center;
    margin-bottom: 8px;
    justify-content: flex-start;
}

.input_row label {
    width: 150px;
    font-size: 15px;
    font-weight: 500;
}

button.save_setting_btn {
    font-size: 15px;
    width: fit-content;
    display: block;
    margin-right: auto;
    padding: 9px 42px;
    border-radius: 5px;
    box-shadow: none;
    border: none;
    color: #fff;
    font-weight: 600;
    background: #ff5722;
    outline: none;
    cursor: pointer;
    margin-left: 15px;
}

.modal_wrapper.input_otp_modal {
    /* display: none; */
}

#input_otp_modal.active {
    display: block;
}

.baner_row {
    background: url(../img/baner.jpg) no-repeat;
    background-size: 1920px;
    background-position: center top;
    padding-top: 135px;
    max-width: 1920px;
    margin-right: auto;
    margin-left: auto;
    /* padding-right: 488px; */
    padding-bottom: 339px;
    position: relative;
    /* min-width: 100%; */
}

.input_registry_row {
    display: flex;
    flex-direction: column;
    max-width: 290px;
    gap: 15px;
    min-width: 299px;
}

input.input_data {
    background: #FFFFFF;
    border: 2px solid #27000D;
    box-shadow: 0 0 6px rgba(0, 0, 0, 0.204);
    border-radius: 6px;
    font-weight: 400;
    font-size: 18px;
    line-height: 42px;
    text-align: center;
    color: #A3A3A3;
    font-family: inherit;
}

button.registry_btn {
    font-style: normal;
    font-weight: 700;
    font-size: 19px;
    line-height: 38px;
    text-align: center;
    color: #360028;
    max-width: 190px;
    margin-left: auto;
    margin-right: auto;
    min-width: 299px;
    background: linear-gradient(360deg, #000000 -18.18%, #FA841E 2.29%, #FAD200 14.09%, #FB9520 79.99%, #E93225 97.16%, #000000 113.64%);
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.208), inset -6px -10px 7px #D37A11, inset 5px 3px 7px #FCFF7B;
    border-radius: 6px;
    font-family: inherit;
    cursor: pointer;
}

.baner_information {
    max-width: 1018px;
    display: flex;
    flex-direction: column;
    align-content: flex-start;
    margin-left: auto;
    margin-right: auto;
    align-items: center;
    flex-wrap: wrap;
}

.timer_section {
    display: flex;
    justify-content: center;
    align-content: center;
    align-items: center;
    margin-top: -259px;
    position: relative;
    margin-bottom: 87px;
}

.time_cul {
    text-align: center;
    display: flex;
    margin: 0 15px;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}

.time_cul > div:first-child {
    display: flex;
    min-width: 38px;
    max-height: 62px;
    box-shadow: 0 0 6px #00000035;
    justify-content: center;
    align-items: center;
    font-style: normal;
    font-weight: 700;
    font-size: 50px;
    line-height: 45px;
    text-align: center;
    color: #FFFFFF;
    gap: 7px;
}


.cul_title {
    margin-top: 28px;
    font-weight: 400;
    font-size: 20px;
    line-height: 30px;
    color: #525053;
}

.time_cul span {
    background: #5D555E;
    border-radius: 10px;
    line-height: 80px;
    padding: 0px 14px;
    max-height: 62px;
    overflow: hidden;
    min-width: 56px;
}

span.second {
}

.custom_first, .custom_second {
    background: #8a8418 !important;
}

.custom_cul_title {
    color: #8a8418 !important;
}

.baner_row:after {
    content: '';
    position: absolute;
    width: 1920px;
    height: 237px;
    background: linear-gradient(180deg, rgba(12, 13, 11, 0) 0%, #0C0D0B 86.46%);
    right: 0;
    bottom: 98px;
}

.content_text {
    max-width: 433px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 77px;
}

.text_about_name {
    font-family: 'Peyda';
    font-style: normal;
    font-weight: 900;
    font-size: 46px;
    line-height: 50px;
    text-align: center;
    color: #FFFFFF;
    margin-bottom: 12px;
    margin-top: 0;
}

.text_about_job {
    font-family: 'Peyda';
    font-style: normal;
    font-weight: 700;
    font-size: 20px;
    line-height: 33px;
    text-align: center;
    color: #FFFFFF;
}

.first_concern_text :nth-child(1) {
    font-family: 'Peyda';
    font-style: normal;
    font-weight: 900;
    font-size: 26px;
    line-height: 30px;
    text-align: center;
    color: #E9D206;
    margin-bottom: 0px;
}

.first_concern_text :nth-child(2) {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 25px;
    text-align: justify;
    color: #FFFFFF;
}

.customer_comment {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 50px;
    margin-bottom: 90px;
}

.customer_comment video {
    border: 5px solid #FFFFFF;
    border-radius: 16px;
    max-width: 230px;
    max-height: 230px;
    min-width: 230px;
}

.result_investigation {
    max-width: 433px;
    margin: 0 auto 77px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
}

.result_investigation img {
    margin: 0 auto 36px;
}

.result_investigation p {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    /* or 150% */
    text-align: justify;
    color: #FFFFFF;
}

button.registry_now_btn {
    font-style: normal;
    font-weight: 700;
    font-size: 19px;
    line-height: 40px;
    text-align: center;
    color: #360028 !important;
    min-width: 432px;
    margin-top: 13px;
    background: linear-gradient(360deg, #000000 -18.18%, #E93225 -7.36%, #FA841E 2.29%, #FAD200 14.09%, #FB9520 80.1%, #E12619 100.92%, #000000 113.64%), #FFD600;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.208), inset -8px -8px 7px #BABD0F, inset 8px 8px 7px #FCFF7B;
    border-radius: 6px;
    cursor: pointer;
}

.courses_information {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 74px;
    max-width: 544px;
    margin-right: auto;
    margin-left: auto;
    gap: 56px;
}

.each_courses_information {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    position: relative;
}

.each_courses_information p {
    font-style: normal;
    font-weight: 400;
    font-size: 16px;
    line-height: 19px;
    text-align: center;
    color: #FFFFFF;
}

.intensive_conversation p {
    margin-top: 11px;
}

.intensive_conversation img {
    max-width: 115px;
}

.additional_story p {
    margin-top: 6px;
    /* text-align: justify; */
    max-width: 124px;
}

.additional_story img {
    max-width: 135px;
}


.online_class img {
    max-width: 155px;
}

.online_class p {
    margin-top: 3px;
}

.intensive_conversation:after, .additional_story:after {
    content: '+';
    position: absolute;
    left: -53px;
    top: 48px;
    font-family: 'Peyda';
    font-style: normal;
    font-weight: 700;
    font-size: 75px;
    line-height: 30px;
    text-align: center;
    color: #F043FF;
}

.additional_story:after {
    left: -49px;
    top: 59px;
}

.benefits_course {
    display: flex;
    flex-direction: column;
    max-width: 438px;
    margin-right: auto;
    margin-left: auto;
    text-align: center;
    margin-bottom: 77px;
    justify-content: center;
        text-align:center;
}

.each_benefits_course {
    display: flex;
    align-items: center;
    gap: 23px;
    margin-bottom: 22px;
    text-align:center;
}


.each_benefits_course p {
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 34px;
    text-align: center;
    color: #FFFFFF;
    border-bottom:1px solid #3f403d;
    padding:0 0 20px 0px;
}
.each_benefits_course2 p {
    width:100%;
    font-style: normal;
    font-weight: 400;
    font-size: 18px;
    line-height: 34px;
    text-align: center;
    color: #FFFFFF;
    border-bottom:1px solid #3f403d;
    padding:20px 0 20px 0px;
}
p.title_benefits_course {
    font-family: 'Peyda';
    font-style: normal;
    font-weight: 900;
    font-size: 26px;
    line-height: 30px;
    text-align: center;
    color: #E9D206;
    margin-bottom: 24px;
}

.course_statistics {
    display: flex;
    flex-direction: row;
    gap: 56px;
    justify-content: center;
    align-items: center;
    margin-bottom: 47px;
}

.each_course_statistics {
    display: flex;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    gap: 17px;
}

.text_course_statistics p {
    font-style: normal;
    font-weight: 500;
    font-size: 19px;
    line-height: 19px;
    color: #FFFFFF;
}

p.number_statistics {
    font-style: normal;
    font-weight: 900;
    font-size: 96px;
    line-height: 96px;
    text-align: right;
    color: #E9D206;
}

.input_registry_row p {
    font-style: normal;
    font-weight: 500;
    font-size: 45px;
    line-height: 40px;
    text-align: center;
    color: #EDEDED;
    position: relative;
    display: flex;
    justify-content: center;
    align-items: center;
}

p.real_price {
    position: relative;
    font-size: 35px;
    color: #ffffff85;
}

p.real_price:before {
    content: '';
    position: absolute;
    width: 120%;
    height: 2px;
    background: #fff;
    transform: rotate(-4deg);
}

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

.baner_bottom_row {
    background: url(../img/bannerbottom.jpg) no-repeat;
    background-size: 1920px;
    background-position: center top;
    padding-top: 198px;
    max-width: 1920px;
    margin-right: auto;
    margin-left: auto;
    padding-bottom: 137px;
    position: relative;
}

.baner_bottom_row:before {
    content: '';
    position: absolute;
    width: 1920px;
    height: 334px;
    right: 0;
    top: 0;
    background: linear-gradient(180deg, rgba(12, 13, 11, 0) 0%, #0C0D0B 86.46%);
    transform: matrix(1, 0, 0, -1, 0, 0);
}

.text_about_name strong {
    color: #E9D206 !important;
}

p.text_about_job strong {
    font-weight: 700 !important;
    font-size: 20px !important;
    line-height: 33px !important;
    color: #F043FF !important;
}

.text_about {
    margin-bottom: 46px;
}

.result_investigation strong {
    font-family: 'Peyda';
    font-style: normal;
    font-weight: 700;
    font-size: 21px;
    line-height: 33px;
    text-align: center;
    color: #FFFFFF;
    margin-top: 24px;
    margin-bottom: 32px;
    display: flex;
}


.custom_registry_btn {
    background: #FFD600 !important;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.208), inset -8px -8px 7px #BABD0F, inset 8px 8px 7px #FCFF7B !important;
    border-radius: 6px;
    min-width: 190px !important;
}

.banner_mob {
    display: none;
}

.baner_bottom_row_mob {
    display: none;
}

.input_registry_row p.final_price:after {
    content: '';
    position: absolute;
    width: 26px;
    height: 26px;
    background: url(../img/toman.png) no-repeat;
    top: 6px;
    left: -30px;
}

.courses_information_mob {
    display: none;
}

.wrong_phone_num_error {
    margin-bottom: 15px;
    font-size: 15px;
    font-weight: 700;
    color: red;
    display: none;
    text-align: center;
    line-height: 1.1;
}

@media (max-width: 900px) {
    .baner_row {
        background: unset;
        padding: 0;
    }

    .banner_mob {
        display: block;
        max-width: 100%;
    }

    .baner_information {
        max-width: 100%;
        display: flex;
        align-items: center;
        justify-content: center;
        align-content: center;
    }

    .img_title_mob {
        max-width: 347px;
    }

    .input_registry_row {
        min-width: 294px;
        gap: 11px;
    }

    button.registry_btn {
        min-width: 294px;
    }

    input.input_data {
        line-height: 38px;
    }

    .baner_row:after {
        display: none;
    }

    .timer_section {
        margin-top: 41px;
        margin-bottom: 36px;
        max-width: 100%;
    }

    .time_cul > div:first-child {
        gap: 5px;
        max-height: 47px;
        line-height: 37px;
        font-size: 35px;
    }

    .time_cul span {
        max-height: 47px;
        line-height: 57px;
        padding: 0 10px;
        min-width: 38px;
    }

    .cul_title {
        font-weight: 400;
        font-size: 14px;
        line-height: 21px;
        text-align: center;
        margin-top: 9px;
    }

    .time_cul {
        margin: 0 5px;
    }

    .content_text {
        max-width: 357px;
    }

    p.text_about_name {
        font-size: 32px;
    }

    p.text_about_job {
        font-size: 16px;
        line-height: 24px;
        font-weight: 400;
    }


    .customer_comment {
        display: flex;
        justify-content: flex-start;
        overflow: scroll;
        align-items: center;
        margin-right: 32px;
    }


    .result_investigation {
        max-width: 334px;
    }

    .result_investigation img {
        max-width: 334px;
    }

    button.registry_now_btn {
        max-width: 317px;
        min-width: 317px;
        margin-top: 52px;
    }

    .benefits_course {
        max-width: 312px;
    }


    .each_benefits_course p {
        line-height: 21px;
    }

    .each_benefits_course {
        display: flex;
        align-items: flex-start;
        margin-bottom: 27px;
        gap: 22px;
    }

    .course_statistics {
        display: flex;
        flex-direction: column-reverse;
        max-width: 255px;
        margin: 0 auto 64px;
        align-items: flex-end;
        gap: 20px;
    }

    .each_course_statistics {
        display: flex;
        flex-direction: row-reverse;
        gap: 27px;
    }


    p.number_statistics {
        font-size: 88px;
    }

    .baner_bottom_row {
        display: none;
    }

    .baner_bottom_row_mob {
        display: block;
        margin-bottom: 60px;
    }

    .courses_information_mob {
        display: block;
        margin-bottom: 110px;
    }

    .courses_information {
        display: none;
    }

    .courses_information_top_row {
        display: flex;
        align-items: center;
        justify-content: center;
        max-width: 321px;
        margin: 0 auto 36px;
        gap: 59px;
    }

    .online_class {
        max-width: 164px;
        margin: 0 auto;
    }

    .additional_story:after {
        top: unset;
        bottom: -16%;
        left: 104%;
    }


    .intensive_conversation img {
        max-width: 130px;
    }

    .customer_comment video {
        max-width: 218px;
        min-width: 218px;
        max-height: 218px;
    }

    .text_course_statistics {
        min-width: 78px;
    }

    .additional_story img {
        max-width: 133px;
    }

    p.text_about_job {
        letter-spacing: -0.04em;
    }
}

#loading_modal, #upload_progress {
    position: fixed;
    width: 100vw;
    height: 100vh;
    top: 0;
    left: 0;
    z-index: 200;
    background: #1c1c1c91;
    backdrop-filter: blur(4px);
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0;
    pointer-events: none;
    transition: all ease 0.3s;
    padding: 20px;
    z-index: 1000;
}

.loading_container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    color: #fff;
    font-size: 20px;
}

#loading_modal.active, #upload_progress.active {
    opacity: 1;
    pointer-events: all;
}

.active .loading_container {
    transform: scale(1);
}

.sk-chase {
    width: 40px;
    height: 40px;
    position: relative;
    animation: sk-chase 2.5s infinite linear both;
    color: #fff;
}

.sk-chase-dot {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    animation: sk-chase-dot 2.0s infinite ease-in-out both;
    filter: drop-shadow(0 0 6px #00000033);
}

.sk-chase-dot:before {
    content: '';
    display: block;
    width: 25%;
    height: 25%;
    background-color: #EC406A;
    border-radius: 100%;
    animation: sk-chase-dot-before 2.0s infinite ease-in-out both;
}

.sk-chase-dot:nth-child(1) {
    animation-delay: -1.1s;
}

.sk-chase-dot:nth-child(2) {
    animation-delay: -1.0s;
}

.sk-chase-dot:nth-child(3) {
    animation-delay: -0.9s;
}

.sk-chase-dot:nth-child(4) {
    animation-delay: -0.8s;
}

.sk-chase-dot:nth-child(5) {
    animation-delay: -0.7s;
}

.sk-chase-dot:nth-child(6) {
    animation-delay: -0.6s;
}

.sk-chase-dot:nth-child(1):before {
    animation-delay: -1.1s;
}

.sk-chase-dot:nth-child(2):before {
    animation-delay: -1.0s;
}

.sk-chase-dot:nth-child(3):before {
    animation-delay: -0.9s;
}

.sk-chase-dot:nth-child(4):before {
    animation-delay: -0.8s;
}

.sk-chase-dot:nth-child(5):before {
    animation-delay: -0.7s;
}

.sk-chase-dot:nth-child(6):before {
    animation-delay: -0.6s;
}

@keyframes sk-chase {
    100% {
        transform: rotate(360deg);
    }
}

@keyframes sk-chase-dot {
    80%, 100% {
        transform: rotate(360deg);
    }
}

@keyframes sk-chase-dot-before {
    50% {
        transform: scale(0.4);
    }

    100%, 0% {
        transform: scale(1.0);
    }
}

.loading_container p {
    margin-bottom: 25px;
    font-weight: 700;
}

#otp {
    display: flex;
    justify-content: center;
}

.my_account_btn a {
    display: flex;
}

#otp .form-control {
    text-align: center;
    margin: 8px;
    border-radius: 5px;
    transition: none;
    width: 40px;
    height: 40px;
    padding: 0;
    border: none !important;
    min-height: 40px;
    border-bottom: 2px solid transparent !important;
    direction: ltr;
    font-weight: 500;
    font-size: 19px;
    box-shadow: 0 0 10px #00000025;
}

#otp .form-control:focus {
    border-radius: 5px 5px 0 0;
    border-bottom: 2px solid var(--otp-main) !important;
}

#otp .form-control.filled {
    border-radius: 5px 5px 0 0;
    border-color: var(--otp-main) !important;
}

.modal_label {
    font-size: 15px;
    font-weight: 400;
    position: absolute;
    bottom: 0;
    transition: all .3s ease-in-out;
    width: 100%;
    right: 0;
    text-align: center;
    opacity: 0.5;
    line-height: 2;
}

.modal_input:focus ~ .modal_label {
    transform: scale(0.8) translateY(-23px);
    opacity: 1;
}

.modal_input.filled ~ .modal_label {
    transform: scale(0.8) translateY(-23px);
    opacity: 1;
}

.no_validate_phone, .no_validate_otp, .invalid_email {
    display: none;
    font-size: 15px;
    font-weight: 600;
    color: red;
    margin-top: 5px;
    text-align: center;
    margin-bottom: 5px;
}

.close_form_btn {
    position: absolute;
    top: 20px;
    left: 20px;
    background: transparent;
    font-size: 25px;
}

.input_row {
    position: relative;
    transition: all .3s ease-in-out;
    margin-bottom: 3px;
    padding-top: 11px;
}

.login_modal_text {
    text-align: center;
    margin: 10px 0;
    font-size: 16px;
}

.send_otp_to {
    width: 160px;
    background-color: var(--color-alt-content-secondary);
    color: var(--color-alt-content-link);
    margin: 5px auto;
    border-radius: 25px;
    font-size: 19px;
    display: flex;
    align-items: center;
    justify-content: center;
    line-height: 35px;
}

.send_otp_to i {
    margin-right: 6px;
    cursor: pointer;
    margin-bottom: 6px;
}

.send_otp_to_page_version {
    width: fit-content;
    background-color: var(--otp-secondary);
    color: var(--color-alt-content-text);
    margin: 5px auto;
    border-radius: 25px;
    font-size: 19px;
    padding: 6px 16px 2px;
}

.send_otp_to_page_version i {
    margin-right: 6px;
    cursor: pointer;
}

.input_otp_modal_text {
    text-align: center;
    margin-bottom: 5px;
    font-size: 14px;
}

div.submit_otp {
    margin-top: 5px;
}

.register_page_content_container {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    align-items: center;
    justify-content: center;
    background: var(--otp-login-color);
    display: flex;
    background-image: var(--otp-login-bg);
    background-size: cover;
}

.go_back_btn {
    position: absolute;
    top: 40px;
    right: 40px;
    cursor: pointer;
}

.login_form_comment {
    font-size: 14px;
    text-align: center;
    margin-bottom: 5px;
}

.active_login_modal {
    cursor: pointer;
    font-size: 16px;
    padding-top: 6px;
    display: flex;
    border: 1px solid;
    border-radius: 5px;
    padding: 3px 10px;
}

.active_login_modal img {
    margin-right: 5px;
    margin-bottom: 3px;
}

.my_account_btn {
    cursor: pointer;
    font-size: 18px;
}

input#phone_number_input {
    box-shadow: none;
    min-height: 0;
    border: none;
    border-bottom: 1px solid var(--otp-main);
    border-radius: 0;
    line-height: 1;
    text-align: center;
    direction: ltr;
    background: transparent;
    font-size: 18px;
}

.register_page_content.modal_content {
    background: var(--otp-modal-bg);
}

#send_otp, div.submit_otp {
    background: var(--otp-main);
    color: #000;
}

.input_otp_modal .modal_content {
    color: #000;
    background: #fff;
}

#login_register_modal .modal_content {
    background: var(--otp-modal-bg);
}
@media only screen and (max-width: 1260px) {
.doreha{
    width:630px;
    height:auto;
    min-height:600px;
    overflow:hidden;
    position:relative;

}
}
@media only screen and (max-width: 1000px) {
.doreha{
    width:210px;
    height:auto;
    min-height:600px;
    overflow:hidden;
    position:relative;
    margin-bottom:200px;

}
}
@media (max-width: 768px) {
    .my_account_btn span {
        display: none;
    }

    .active_login_modal span {
        display: none;
    }
}

.modal_wrapper {
    width: 100vw;
    height: 100vh;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 200;
    pointer-events: none;
    display: flex;
    align-items: center;
    justify-content: center;
    background: #00000055;
    backdrop-filter: blur(3px);
    opacity: 0;
    transition: all 0.5s ease;
    direction: ltr;
}

.modal_wrapper.active {
    opacity: 1;
    pointer-events: all;
}

.modal_content {
    max-width: 260px;
    flex-grow: 1;
    background: #fff;
    position: relative;
    padding: 30px 50px;
    box-shadow: 0 0 10px #00000050;
    border-radius: 10px;
    margin: 15px;
    transition: all 0.5s ease;
    transform: scale(0.5);
    width: calc(100% - 30px);
}

.active .modal_content {
    transform: scale(1);
}

.submit_otp_landing {
    width: 130px;
    font-weight: 600;
    color: #fff;
    background: #FFD600;
    border-radius: 5px;
    padding: 0;
    margin: 12px auto auto;
    cursor: pointer;
    text-align: center;
    line-height: 30px;
    font-size: 14px;
}

.send_otp_to_landing {
    width: fit-content;
    background: #ffd600;
    color: #000;
    margin: 5px auto;
    border-radius: 25px;
    font-size: 16px;
    padding: 6px 16px 2px;
}

.send_otp_to_landing i {
    margin-right: 6px;
    cursor: pointer;
}

.btn-container-1 a {
    text-decoration: none;
}

.container-img {
    margin-bottom: -60px;
    pointer-events: none;
}

p.old-price:before {
    content: '';
    position: absolute;
    width: 110%;
    height: 2px;
    background: #1873DC;
    left: -5%;
    top: 16px;
    transform: rotate(-3deg);
}

p.old-price {
    color: #1873DC80;
    font-size: 29px;
}

p.off-price {
    font-weight: 800;
    padding-left: 70px;
}

.price-style p.off-2-price::before {
    content: '';
    position: absolute;
    width: 110%;
    height: 2px;
    background: #1873DC;
    left: -5%;
    top: 16px;
    transform: rotate(-3deg);
}

p.off-2-price {
    position: relative;
    opacity: 0.7;
    font-size: 32px;
}
.intl-tel-input,
.iti{
    width: 100%;
}
.iti__selected-flag {
    z-index: 1;
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 6px 0 8px;
    background: #FFFFFF;
    border-radius: 6px 0 0 6px;
    font-weight: 400;
    font-size: 18px;
    line-height: 42px;
    text-align: center;
    color: #A3A3A3;
    font-family: inherit;
    border-left: 1px solid #27000D;
    border-top: 1px solid #27000D;
    border-bottom: 1px solid #27000D;
}
.iti {
    position: relative;
    display: flex !important;
}