.box-flex{
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    align-content: center;
}
.img-banner-web {
    border-radius: 8px;
    box-shadow: 4px -3px 15px -6px #0f79cd;
    width: 92%;
    float: right
}

.text-discount_form {
    text-decoration-color: #021b86;
    text-decoration-style: solid;
    text-decoration-line: line-through
}

.price_doom p {
    margin: 0 !important
}

#close-icons {
    font-size: 23px;
    top: 22px;
    left: 9px;
    color: #1f79c1
}

:focus-visible {
    outline: none !important
}

body > section, .right-post {
    direction: rtl
}

.head-sec {
    direction: ltr
}

.left-post img {
    width: 100%;
    display: block
}

.img-icon-site {
    width: 50px !important;
    display: block !important;
    margin-top: 0 !important;
    top: 0 !important
}

.context-pro {
    direction: rtl
}

.btn-primary {
    height: 32px;
    padding: 6px 12px !important;
    background-color: #673ab7 !important;
    border-color: #673ab7 !important;
    top: -1px;
    position: relative
}

.button-right a {
    background: #cd7ad9 !important;
    padding: 6px !important
}

@keyframes btn-call {
    from {
        box-shadow: 0 2px 20px -4px #c644dd
    }
    to {
        box-shadow: -1px 1px 20px 6px #c644dd
    }
}

#pv-btn-call {
    -webkit-animation: btn-call;
    animation: btn-call;
    -webkit-animation: 1s ease-in-out 0 infinite alternate both btn-call;
    animation: 1s ease-in-out 0 infinite alternate both btn-call;
    transition: all .15s ease-out
}

.sec-six .box-step {
    padding: 9px 25px !important
}

.sec-five .box-step {
    padding: 4px 20px 11px
}

.sec-seven {
    height: fit-content !important
}

.main-text {
    direction: rtl
}

.second-five {
    padding: 75px;
    max-height: 100vh;
    overflow: hidden;
    background: linear-gradient(45deg, #8666df, #9651d5)
}

.four-bottem {
    color: #fff !important
}

.four-top {
    color: #fff !important
}

.fav-div {
    padding: 3px
}

.second-five {
    padding: 50px 0 !important
}

.text-one h3 {
    font-size: 16px;
    height: 52px !important;
    line-height: 1.8 !important
}

.cost-div {
    height: 390px !important
}

.favorite {
    height: 450px !important
}

.context-con, .context-step {
    direction: rtl
}

.sec-five .box-step {
    min-height: 426px !important
}

#phone-a {
    left: 43px !important
}

#whats-app-btn {
    left: 38px !important
}

ol, ul {
    color: #464646
}

@media only screen and (min-width: 1024px)and (max-width: 1440px) {
    .sec-first img {
        width: 96% !important
    }
}

@media only screen and (max-width: 600px) {
    .order-content-step {
        padding: 0 0 70px
    }

    .sec-two {
        padding: 0 0 120px !important
    }

    .title-pro {
        padding: 20px 0 !important
    }
}

.top-text-short, .card {
    direction: rtl
}

.pv-slide {
    height: 100% !important;
    text-align: center;
    padding: 0 !important;
    overflow: hidden;
    display: block;
    width: 100% !important;
    position: relative;
    max-width: 1200px !important;
    margin: auto
}

.a-img-portfolios {
    display: inline-block;
    overflow: hidden;
    max-height: 330px
}

.img-portfolios {
    width: 100%;
    object-fit: contain;
    display: block
}

.a-img-portfolios-m {
    display: inline-block;
    overflow: hidden;
    max-height: 330px
}

.a-img-portfolios-s {
    display: inline-block;
    overflow: hidden;
    max-height: 330px
}

.img-back-7 {
    width: 100%;
    height: 100vh;
    padding: 0 !important;
    z-index: -1;
    position: absolute;
    display: block;
    right: 0;
    border: 0
}

.img-phone-sm {
    padding: 0 !important;
    z-index: 0;
    position: absolute;
    display: block;
    left: 100px;
    top: 134px
}

.top-img-box {
    height: 100%;
    display: block;
    width: 100%;
    padding: 7% 0
}

.p-logo {
    color: #484444;
    text-align: center;
    font-size: 13px;
    line-height: 2.5
}

.logo-img {
    max-width: 100%;
    max-height: 90px;
    display: block;
    margin: 0 auto 4px
}

.a-logo {
    cursor: pointer;
    border: 1px solid #ededed;
    display: inline-block;
    width: 100%;
    height: 185px;
    border-radius: 3px;
    box-shadow: 1px 1px 10px -5px #b3b3b3;
    overflow: hidden;
    background: #fff !important;
    padding: 7px
}

.cl-logo {
    background: #2196f3;
    color: #fff;
    border-radius: 3px
}

.div-img-logo {
    display: block;
    margin: 7px 0
}

.left-post img {
    width: 100%;
    display: block;
    margin-top: 0px;
    height: auto;
}

#contentOrderSubmit {
    color: #337ab7;
    background-color: #fff !important;
    border-color: #fff !important;
    margin: 30px 0
}

.cls {
    background: #246ab9;
    font-size: 12px;
    padding: 5px 35px;
    border-radius: 3px
}

.cls:hover {
    color: #fff;
    background-color: #1a446e;
    border-color: #1a446e
}

.modal-header {
    padding: 5px 15px;
    border-top: none;
    border-bottom: none
}

.modal-footer {
    padding: 7px 15px;
    text-align: right;
    border-top: none;
    height: 50px;
}

.det {
    color: #727272
}

.det-a {
    background: #fff;
    padding: 15px;
    border-radius: 3px;
    border: 1px solid #f3ecec;
    box-shadow: 1px 2px 8px -6px #00000085;
    text-align: center;
    height: 100px
}

.text-mod {
    display: block;
    line-height: 2.5
}

.tittle-top {
    color: #727272;
    text-align: center;
    line-height: 2.7;
    margin-top: 20px;
    width: 100%;
    display: block;
    font-weight: 700
}

.list-con {
    color: #727272;
    direction: rtl;
    text-align: right;
    list-style: none;
    line-height: 2.4;
    font-size: 13px;
    font-weight: 300;
    cursor: pointer;
    padding: 6px 15px
}

.modal-lg .modal-content {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-image: url(https://codoseo.net/img/slider/blue-sldie.jpg)
}

.text-main-mod {
    background: #fff;
    border-radius: 3px;
    border: 1px solid #f3ecec;
    box-shadow: 1px 2px 8px -6px #00000085;
    text-align: center
}

.video-pv {
    width: 72%;
    height: auto;
    margin: auto;
    display: block;
    margin-bottom: 5px;
    margin-top: 50px
}

.video-transcript {
    padding: 15px;
    text-align: center;
    margin: auto;
    display: block;
    margin-bottom: 15px;
    height: auto;
    line-height: 2.5
}

.text-site h4, .text-site .h4 {
    font-size: 15px;
    line-height: 2.5
}

.text-site a, .text-site strong {
    display: contents
}

.text-site h3, .text-site .h3 {
    font-size: 15px;
    margin-bottom: 15px;
    line-height: 2.5
}

.text-site img {
    width: 100%;
    height: auto;
    text-align: center;
    margin-bottom: 15px;
    border-radius: 7px;
    box-shadow: 1px 1px 10px -3px #0000009c;
}

.card {
    padding-top: 0
}

.bottom-text {
    padding: 0 15px 15px
}

.text-site {
    box-shadow: none
}

.text-site h2 {
    font-size: 20px;
    color: #585858;
    margin-bottom: 20px;
    line-height: 2.5
}

.text-site .btn-price:hover {
    background-color: unset;
    color: #1396ff
}

.text-site .btn-price {
    background-color: unset;
    color: #1396ff !important;
    text-align: center;
    width: 120px;
    display: block;
    margin: auto;
    max-width: 100%;
    float: unset
}

.second-eight {
    min-height: 540px;
    max-height: 100%;
    height: auto
}

.faq-title {
    font-size: 13px;
    font-weight: 700;
    text-align: right;
    padding: 5px;
    display: block
}

.order-content-step {
    padding: 50px
}

.tittle-step {
    font-size: 18px;
    color: #2e6da4;
    text-align: center;
    line-height: 2.5;
    margin-bottom: 40px
}

.sub-tittle-step {
    font-size: 13px;
    color: #2e6da4;
    text-align: center;
    line-height: 2
}

.img-step {
    width: 79%;
    margin: auto;
    display: block;
    margin-top: 55px
}

.mob-img-step {
    display: none;
    width: 100%;
    margin-top: 55px
}

.img-back-7, .img-phone-sm {
    display: none
}

.tit-pv {
    line-height: 2.5;
    padding-top: 25px
}

@media only screen and (min-width: 650px) and (max-width: 900px) {
    .p-logo {
        font-size: 11px
    }

    .main-pv-carousel {
        top: 59%
    }

    .img-phone-sm {
        left: 65px;
        top: 17%
    }

    .main-pv-carousel {
        top: 66%;
        display: block;
        width: 74%;
        height: auto;
        position: absolute
    }

    .carousel--selected-cell .carousel-cell.is-selected span, .carousel-cell span {
        top: 18px
    }

    .cost-sec {
        width: 44%
    }

    .ltr-price {
        top: -12px !important
    }

    button[disabled], html input[disabled], [type=button]:not(:disabled), [type=reset]:not(:disabled), [type=submit]:not(:disabled), button:not(:disabled) {
        display: none
    }

    .sec-two {
        display: block;
        height: 307px
    }

    .sec-five .box-step {
        padding: 4px 4px 3px
    }

    .sec-five {
        height: 75vh
    }
}

@media only screen and (min-width: 700px) and (max-width: 1100px) {
    .txt-pv ul {
        padding: 0 16px
    }

    .context-con, .context-step {
        margin-bottom: 17px
    }

    .img-step {
        margin-top: 0
    }

    .box-gh {
        padding: 0 0 15px
    }

    .back-color-blue {
        padding: 17px 8px 5px !important;
        font-size: 13px
    }

    .img-step {
        width: 100%
    }

    .img-phone-sm {
        display: none
    }

    .top-img-box {
        padding: 17% 0 6%
    }
}

@media only screen and (max-width: 600px) {
    .img-fixed {
        display: none !important
    }

    .center-footer {
        padding: 35px 15px
    }

    .tit-pv {
        font-size: 15px;
        line-height: 2.5;
        padding-top: 25px
    }

    .text-sub h2 {
        font-size: 15px;
        line-height: 2.5
    }

    .txt-pv ul {
        padding: 0 16px
    }

    .context-con, .context-step {
        margin-bottom: 17px
    }

    .img-back-7, .img-phone-sm {
        display: block
    }

    .top-img-box {
        bottom: 0;
        position: static
    }

    .tittle-step {
        font-size: 17px;
        line-height: 2;
        float: unset
    }

    .img-step {
        width: 100%;
        margin-top: 10px;
        display: none
    }

    .mob-img-step {
        display: block
    }

    .img-banner-web {
        border-radius: 8px;
        box-shadow: 4px -3px 15px -6px #0f79cd;
        width: 70%;
        float: right
    }

    #close-icons {
        font-size: 15px;
        top: 22px;
        left: 5px;
        color: #1f79c1
    }

    .video-pv {
        width: 100%
    }

    .second-eight {
        height: 100%
    }

    .det:first-child {
        display: none
    }

    .list-con {
        padding: 0
    }

    .text-mod {
        font-size: 13px
    }

    .left-post img {
        margin-top: 0
    }

    .top-img-box {
        padding: 17% 0 0
    }

    .div-img-logo {
        padding-left: 8px !important;
        padding-right: 8px !important
    }

    .img-back-7 {
        height: 100vh
    }

    .img-phone-sm {
        width: 87%;
        left: 0
    }

    .pv-slide {
        height: 100px ٪ !important;
        padding: 0 0 30% !important
    }

    .main-pv-carousel {
        width: 70% !important;
        top: 65%;
        position: absolute
    }

    .second-five {
        max-height: 122vh
    }
}