/*.order_page{
    margin-top: 120px;
}*/
.my_info_page, .order_page{
    max-width: 860px;
}
.order_page h1{
    margin: 0;
}
.icon_order {
    background-image: url(/wa-apps/site/themes/softsale/img_body/icons_order.png);
    width: 48px;
    height: 48px;
    background-size: 192px;
}

.icon_order.email_icon {
    background-position: 0 0;
}
.step_value.active .icon_order.email_icon{
    background-position: -48px 0;
}
.icon_order.courier_icon {
    background-position: -96px 0px;
}
.step_value.active .icon_order.courier_icon{
    background-position: -144px 0;
}

.icon_order.pay_courier_icon {
    background-position: 0 -48px;
}
.step_value.active .icon_order.pay_courier_icon{
    background-position: -48px -48px;
}
.icon_order.pay_order_icon {
    background-position: -0px -96px;
}
.step_value.active .icon_order.pay_order_icon{
    background-position: -48px -96px;
}
.icon_order.pay_card_icon {
    background-position: -96px -48px;
}
.step_value.active .icon_order.pay_card_icon{
    background-position: -144px -48px;
}

.step_order {
    margin-top: 64px;
}

.select_person_company {
    max-width: 370px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    font-size: 16px;
    line-height: 46px;

}
.order_page .select_person_company{
    margin-top: 48px;
}

.select_person_company span {
    width: 100%;
    border: 1px solid #D5DEF0;
    border-radius: 4px;
    text-align: center;
    margin-right: 10px;
    cursor: pointer;
}

.select_person_company span:last-child {
    margin-right: 0;
}

.select_person_company span.active {
    font-weight: 500;
    color: #4486F4;
    background: #E3EDFD;
    border: 1px solid #D5DEF0;
}

.step_select_value {
    display: flex;
    font-size: 16px;
    line-height: 24px;
    margin: 32px -2.5% 20px;
}

.step_select_value .step_value {
    width: 45%;
    border: 1px solid #D5DEF0;
    margin: 0 2.5%;
    cursor: pointer;
    position: relative;
    border-radius: 10px;
    padding: 24px 90px 24px 56px;
    box-sizing: border-box;
}

.step_select_value .step_value:last-child {
    margin-right: 0;
}

.step_select_value .step_value.active {
    border: 1px solid #4486F4;
}
.step_select_value .step_value.active .title{
    font-weight: 500;
}
.step_select_value .step_value .icon_order{
    position: absolute;
    right: 30px;
    top: 26px;
}

.step_select_value .step_value:before {
    content: '';
    width: 10px;
    height: 10px;
    background: #fff;
    border: 5px solid #fff;
    box-shadow: 0 0 0 1px #D5DEF0;

    display: block;
    position: absolute;
    border-radius: 50%;
    left: 20px;
    top: 26px;
    -webkit-transition: all .3s;
    -moz-transition: all .3s;
    -ms-transition: all .3s;
    -o-transition: all .3s;
    transition: all .3s;
}

.step_select_value .step_value.active:before {
    background: #4486F4;
    border: 5px solid #E3EDFD;
}

.step_select_value .step_value .desc {
    display: none;
}

.step_select_value .step_value .summary {
    font-size: 14px;
    line-height: 20px;
    color: #7F91A2;
    margin-top: 8px;
}

.step_desc {
    font-size: 14px;
    line-height: 20px;
    color: #7F91A2;
}
.fields_step{

}
.fields_step .filed{
    margin-top: 32px;
    width: 47.7%;
    margin-right: 4.6%;
    display: inline-block;
}
.fields_step .filed.big{
    width: 100%;
    margin-right: 0%;
}
.fields_step .filed:nth-child(2n){
    margin-right: 0%;
}
.fields_step .filed > span{
    display: block;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 1em;
}
.fields_step .filed > span[data-phone]:after{
    content: ' 'attr(data-phone);
}
.fields_step .filed input{
    background: #F1F3F7;
    border-radius: 4px;
    line-height: 48px;
    font-size: 14px;
    color: #383838;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
}
.fields_step .filed input[disabled]{
    background: #cecece;
    color: #000;
}
.fields_hide{
    padding-top: 16px;
}
.fields_step textarea{
    background: rgb(241, 243, 247);
    border-radius: 4px;
    font-size: 14px;
    color: rgb(56, 56, 56);
    width: 100%;
    box-sizing: border-box;
    margin: 0px;
    height: 100px;
    max-width: 100%;
    min-width: 100%;
    min-height: 100px;
    line-height: 23px;
    padding: 10px 20px;
}
.dop_fields{
    margin-top: 16px;
}
.dop_fields a{
    margin-top: 24px;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #383838;
    border-bottom: 1px dashed rgba(127, 145, 162, 0.4);
}

.dop_fields a:hover, .dop_fields a.active{
    border-bottom: 1px solid transparent;
}

.step_order a#cancel.btn{
    margin-left: 20px;
}

.order_cart_url{
    display: none;
    line-height: 70px;
    border: 1px solid #D5DEF0;
    border-radius: 10px;
    padding: 0 30px;
    font-size: 16px;
    position: relative;
}
.order_cart_url .arrow-right{
    position: absolute;
    right: 30px;
    top: 50%;
    margin-top: -8px;
}
@media (max-width: 1024px) {
    .order_cart_url{
        display: block;
    }

}

@media (max-width: 1024px) and (min-width: 641px) {
   /* .order_page{
        margin-top: 56px;
    }*/
    .order_page .select_person_company{
        margin-top: 40px;
    }
    .fields_step .filed{
        width: 48.5%;
        margin-right: 3%;
    }
    .step_select_value{
        margin: 32px -20px 20px;
    }
    .step_select_value .step_value{
        width: 50%;
        margin: 0 10px;
    }
}

@media (max-width: 640px) {
    /*.order_page{
        margin-top: 40px;
    }*/
    .order_cart_url{
        line-height: 46px;
        padding: 0 16px;
        font-size: 14px;
    }
    .order_cart_url .arrow-right{
        margin-top: -6px;
        right: 16px;
    }
    .select_person_company{
        font-size: 14px;
        line-height: 38px;
    }
    .fields_step .filed{
        width: 100%;
        margin-right: 0;
    }
    .order_page .select_person_company{
        margin-top: 32px;
    }
    .step_order{
        margin-top: 48px;
    }
    .fields_step .filed{
        margin-top: 20px;
    }
    .fields_step .filed > span{
        font-size: 14px;
        line-height: 20px;
        margin-bottom: 12px;
    }
    .fields_step .filed input{
        line-height: 40px;
        padding: 0 16px;
    }
    .fields_hide{
        padding-top: 12px;
    }
    .fields_step textarea{
        line-height: 16px;
        padding: 10px 16px;
    }

    .step_select_value{
        margin: 20px 0 12px;
        flex-wrap: wrap;
    }
    .step_select_value .step_value{
        width: 100%;
        margin: 4px 0;
        font-size: 14px;
        line-height: 20px;
        padding: 16px 68px 16px 44px;
    }
    .step_select_value .step_value .summary {
        font-size: 12px;
        line-height: 16px;
    }
    .step_select_value .step_value:before{
        left: 15px;
        top: 15px;
    }
    .step_select_value .step_value .icon_order{
        right: 20px;
        top: 50%;
        margin-top: -16px;
    }

    .step_desc{
        font-size: 12px;
        line-height: 16px;
    }
    .dop_fields a{
        font-size: 14px;
        line-height: 20px;
    }

    .icon_order{
        width: 32px;
        height: 32px;
        background-size: 128px;
    }
    .step_value.active .icon_order.email_icon{
        background-position: -100% 0;
    }
    .icon_order.courier_icon {
        background-position: -64px 0px;
    }
    .step_value.active .icon_order.courier_icon{
        background-position: -96px 0;
    }

    .icon_order.pay_courier_icon {
        background-position: 0 -32px;
    }
    .step_value.active .icon_order.pay_courier_icon{
        background-position: -32px -32px;
    }
    .icon_order.pay_order_icon {
        background-position: -0px -64px;
    }
    .step_value.active .icon_order.pay_order_icon{
        background-position: -32px -64px;
    }
    .icon_order.pay_card_icon {
        background-position: -64px -32px;
    }
    .step_value.active .icon_order.pay_card_icon{
        background-position: -96px -32px;
    }
    .step_order a#cancel.btn{
        margin-left: 8px;
    }
}