.modal-login .modal-dialog {
    width: 430px;
    margin: 30px auto;
}
.modal-popup .modal-content:before {
    background: rgb(205,31,50);
    background: var(--bg);
    content: '';
    display: inline-block;
    width: 100%;
    height: 4px;
    position: absolute;
    top: 0;
    left: 0;
}
.modal-popup .modal-content {
    border: 0;
    border-radius: 0;
    box-shadow: none;
}
.modal-login .close {
    opacity: 1;
    position: absolute;
    right: 10px;
    top: 15px;
    width: 20px;
    height: 20px;
    background: url(../member/svg-icons.svg?v=28.05.2020) no-repeat -185px -11px transparent;
    z-index: 10;
}
.modal-login .bl-logo-title {
font-size: 16px;
color: #474747;
font-weight: 500;
display: flex;
align-items: center;
margin-bottom: 20px;
justify-content: center;
flex-direction: column;
}
#popup-login.modal-login .btn-login-fb, #popup-signup.modal-login .btn-register-fb {
    background: #3b5998;
    border: none;
    text-transform: unset;
    color: #fff;
}
.modal-login .btn-login-fb, .modal-login .btn-register-fb {
    width: 100%;
    font-size: 14px;
    color: #fff;
    height: 44px;
    background: #3b5998;
    text-align: center;
    border-radius: 40px;
    position: relative;
}
.modal-login .btn-login-fb:before, .modal-login .btn-register-fb:before {
    content: '';
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url(../member/svg-icons.svg?v=28.05.2020) no-repeat -198px -182px transparent;
    position: absolute;
    left: 65px;
    top: 6px;
}
.modal-login .p-text {
    text-align: center;
    font-size: 13px;
    color: #474747;
    padding: 12px 0 14px;
}
#popup-forgot-password #forgotPassword, #popup-login #form-login, #popup-signup #form-register {
    width: 100%;
}
.modal-login .bl-div {
    margin-bottom: 10px;
}
.modal-login .bl-div {
    position: relative;
}
.modal-login .form-control {
    border: 0;
    border-bottom: 1px solid #d1d1d1;
    border-radius: 0;
    box-shadow: none;
    font-size: 13px;
    height: 38px;
    padding-left: 33px;
}
.modal-login .bl-div:before {
    content: '';
    display: inline-block;
    width: 25px;
    position: absolute;
    background-repeat: no-repeat;
    left: 0;
    background-image: url(../member/svg-icons.svg?v=28.05.2020);
}
.modal-login .div-phone:before {
    background-position: -950px -84px;
    height: 25px;
    top: 6px;
}
.modal-login .div-password:before {
    background-position: -838px -85px;
    height: 26px;
    top: 5px;
}
.modal-login .div-password .span-eyes {
    background: url(../images/svg-icons.svg?v=28.05.2020) no-repeat -873px -84px;
    height: 20px;
    width: 25px;
    right: 5px;
    position: absolute;
    top: 12px;
    cursor: pointer;
}
.modal-login .bl-remember {
}
#form-login .col-sm-12 {
    float: left;
}
.bl-inline {
    display: inline-block;
    float: left;
}
.form-horizontal .checkbox, .form-horizontal .radio {
    min-height: 27px;
}
.form-horizontal .checkbox, .form-horizontal .checkbox-inline, .form-horizontal .radio, .form-horizontal .radio-inline {
    padding-top: 7px;
    margin-top: 0;
    margin-bottom: 0;
}
.modal-login .bl-remember a, .modal-login .bl-remember p {
    font-size: 13px;
    color: #474747;
    cursor: pointer;
}
.modal-login .bl-remember p {
    color: var(--color-red);
    margin-bottom: 0;
    padding-top: 10px;
}
.modal-login .btn-login {
    width: 100%;
    background: var(--color-red);
    border-radius: 40px;
    font-weight: 500;
    font-family: var(--font-roboto);
    font-size: 16px;
    color: #fff;
    height: 44px;
    margin: 15px 0 0 0;
    border: none;
}
.modal-login .bl-creat-account a {
    font-size: 13px;
    color: var(--color-red);
    cursor: pointer;
    display: inline-block;
}
.modal-login .modal-body {
    padding: 25px;
}
.pull-right {
    float: right;
}
#popup-login .bl-brand .bl-checkbox label {
    font-size: 13px;
    color: #888;
    padding-left: 23px;
}
#popup-signup .bl-user p {
    font-size: 14px;
    color: #474747;
    font-weight: 700;
}
.modal-login .i-radio {
    padding-left: 5px;
}
.modal-login .i-radio input[type=radio] {
    opacity: 0;
}


button, input, select, textarea {
    font-size: 14px;
}
input[type=checkbox], input[type=radio] {
    margin: 4px 0 0;
    line-height: normal;
}
.modal-login .i-radio label {
    display: inline-block;
    position: relative;
    font-weight: 400;
    color: #888;
    margin-bottom: 0;
    cursor: pointer;
    padding-left: 12px;
    font-size: 13px;
}
.modal-login .i-radio label::before {
    content: "";
    display: inline-block;
    position: absolute;
    width: 24px;
    height: 24px;
    left: 0;
    margin-left: -20px;
    border: 1px solid var(--color-red);
    border-radius: 50%;
    background-color: #fff;
    -webkit-transition: border .15s ease-in-out;
    -o-transition: border .15s ease-in-out;
    transition: border .15s ease-in-out;
    top: -3px;
}
.modal-login .i-radio label::after, .modal-login .i-radio label::before {
    -webkit-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}
.modal-login .i-radio label::after {
    display: inline-block;
    position: absolute;
    content: " ";
    width: 24px;
    height: 24px;
    left: 0;
    top: -3px;
    margin-left: -20px;
    border-radius: 50%;
    background: url(../member/svg-icons.svg?v=28.05.2020) no-repeat -271px -349px var(--color-red);
    -webkit-transform: scale(0,0);
    -ms-transform: scale(0,0);
    -o-transform: scale(0,0);
    transform: scale(0,0);
    -webkit-transition: -webkit-transform .1s cubic-bezier(.8,-.33,.2,1.33);
    -moz-transition: -moz-transform .1s cubic-bezier(.8,-.33,.2,1.33);
    -o-transition: -o-transform .1s cubic-bezier(.8,-.33,.2,1.33);
    transition: transform .1s cubic-bezier(.8,-.33,.2,1.33);
}
.modal-login .i-radio input[type=radio]:checked+label::after {
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    -o-transform: scale(1,1);
    transform: scale(1,1);
}
#popup-signup .bl-input input+label {
    position: absolute;
    top: 10px;
    left: 33px;
    font-size: 13px;
    color: #888;
    font-weight: 400;
}


.modal-login .div-password .span-eyes {
    background: url(../member/svg-icons.svg?v=28.05.2020) no-repeat -873px -84px;
    height: 20px;
    width: 25px;
    right: 5px;
    position: absolute;
    top: 12px;
    cursor: pointer;
}
.modal-login .div-fullname:before {
    background-position: -922px -80px;
    height: 25px;
    top: 4px;
}
.modal-login .div-email:before {
    background-position: -810px -85px;
    height: 20px;
    top: 12px;
}
#popup-signup .bl-input input[required]:valid+label {
    display: none;
}

.has-error .help-block, .has-error .control-label, .has-error .radio, .has-error .checkbox, .has-error .radio-inline, .has-error .checkbox-inline {
    color: #a94442;
    font-size: 12px;
}
.success{color:#4ab907}
.error{color:var(--color-red)}
.flash-message{font-size: 15px;color:red;}
.flash-message.success{color:#4ab907}
#loadding-ajax {
    overflow: hidden;
    width: 100%;
    position: fixed;
    top: 0;
    left: 0;
    height: 100%;
    background:rgb(0,0,0,20%);
    z-index: 9999;
    padding-top: 20%;
    text-align: center;
    font-size: 16px;
}
#loadding-ajax>.text {
    margin-top: 10px;
    color: #fff;
}
.open>.dropdown-menu {
    display: block;
}
header .group-header {
    position: relative;
}
header .group-header i{position: relative;left: 5px}
header .group-header .dropdown-menu{
    display: none;
}
header .group-header .dropdown-menu li{padding: 0 10px}
header .group-header .dropdown-menu li a{background: transparent;height: auto;padding: 5px 0;text-align: left;width: 100%;display: block;max-width: 100%;color: var(--color-txt);}
header .group-header:hover .dropdown-menu{display: block;}
header .group-header .dropdown-menu li a:hover:before{display: none}
/*end */
.bl-info-account {
    text-align: center;
    padding-bottom: 22px;
    border-bottom: 1px solid #d1d1d1;
}
.bl-info-account a .bl-img {
    width: 90px;
    height: 90px;
    background-color: #bfbfbf;
    font-size: 28px;
    text-align: center;
    color: #fff;
    border-radius: 50%;
    display: inline-block;
    position: relative;
    padding-top: 27px;
    margin-bottom: 15px;
    background-size: cover!important;
}
.image-upload .icon-camera{position: relative;}
.image-upload .icon-camera img{
    width: 90px;
    height: 90px;
    border-radius: 50%;
    object-fit: cover;
}
.image-upload .span-camera {
    height: 30px;
    width: 30px;
    background: url(../member/svg-icons.svg?v=03.06.2019) no-repeat -170px -617px transparent;
    position: absolute;
    right: -4px;
    top: 8px;
    border-radius: 50%;
}
.hidden {
    display: none;
}
.bl-info-account .p-name {
    font-size: 14px;
    color: #474747;
}
.bl-info-account p {
    margin-bottom: 2px;
}
.bl-info-account .p-name b {
    font-size: 16px;
    font-weight: 500;
    margin-right: 5px;
}
.bl-info-account .p-member {
    font-size: 13px;
    color: #474747;
}
.register-contact, .request-contact, .stop-contact {
    color: var(--color-red);
    border-bottom: 1px solid var(--color-red);
}
.register-contact:hover, .request-contact:hover, .stop-contact:hover{
    text-decoration: none;
    color: #f17423;
}
.nav-info {
    margin-left: 10px;
}
.nav {
    padding-left: 0;
    margin-bottom: 0;
    list-style: none;
}

.nav>li {
    position: relative;
    display: block;
    width: 100%;
}
.nav>li>a {
    position: relative;
    display: block;
    padding: 10px 15px;
}
.nav-info>li>a {
    font-weight: 700;
    font-size: 14px;
    color: #474747;
    border-bottom: 1px solid #d1d1d1;
    padding: 15px 30px;
    margin-bottom: 0;
}
.nav-info>li>a:focus, .nav-info>li>a:hover, .nav-info>li>a:visited {
    background-color: transparent;
}
.nav-info>li>a:before {
    left: 0;
    width: 22px;
    height: 26px;
    top: 11px;
    background-image: url(../member/svg-icons.svg?v=03.06.2019);
}
.nav-info>li.li-1>a:before {
    background-position: -270px -615px;
}
.nav-info>li>a:after {
    content: '';
    display: inline-block;
    right: 0;
    top: 21px;
    height: 10px;
    width: 6px;
    background-image: url(../member/ic-arrow.png);
}
.nav-info>li>a:after, .nav-info>li>a:before {
    content: '';
    display: inline-block;
    position: absolute;
    background-repeat: no-repeat;
    background-position-y: center;
}
.nav-info>li.li-3>a:before {
    background-position: -413px -616px;
}
.nav-info>li>a:hover{text-decoration: none}
.nav-info>li.li-4>a:before {
    background-position: -448px -613px;
}
.nav-info>li.li-5>a:before {
    background-position: -522px -618px;
}
.nav-info>li.li-6>a:before {
    background-position: -557px -614px;
}
.nav-info>li.li-7>a:before {
    background-position: -115px -815px;
}
ul.nav.nav-info .icon-search {
    position: absolute;
    margin: 16px 4px;
}

.wrapuser .col-right {

    min-height: 600px;
}
.wrapuser .title-info {
    font-size: 18px;
    font-weight: 500;
    display: inline-block;
    padding-right: 33px;
    line-height: 22px;
    margin: 30px 0 25px;
    position: relative;
}
.wrapuser .title-info:before {
    content: '';
    display: inline-block;
    width: 30px;
    height: 30px;
    background: url(../member/svg-icons.svg?v=03.06.2019) no-repeat -536px -354px transparent;
    position: absolute;
    top: -1px;
    right: -2px;
}
.wrapuser .control-label {
    text-align: left;
    font-size: 14px;
    color: #474747;
    margin-bottom: 8px;
    font-weight: bold;
}
.wrapuser .control-label.red{color:var(--color-red);}
.wrapuser .bl-input-new {
    position: relative;
    margin-bottom: 10px;
}
.bl-input-new:before {
    content: '';
    display: inline-block;
    width: 25px;
    position: absolute;
    background-position: center;
    background-repeat: no-repeat;
    left: 0;
    background-image: url(../member/svg-icons.svg?v=03.06.2019);
}
.bl-input-new.div-fullname:before {
    background-position: -922px -80px;
    height: 25px;
    top: 4px;
}
.form-control-new {
    border: 0;
    border-bottom: 1px solid #d1d1d1;
    border-radius: 0;
    box-shadow: none;
    font-size: 13px;
    height: 38px;
    width: 100%;
}
.bl-input-new .form-control-new {
    padding-left: 33px;
}
.bl-input-new.div-birthday:before {
    background-position: -315px -352px;
    height: 25px;
    top: 4px;
}
.bl-input-new.div-sex:before {
    background-position: -358px -354px;
    height: 25px;
    top: 6px;
}
.bl-input-new.div-email:before {
    background-position: -810px -85px;
    height: 20px;
    top: 11px;
}
.bl-input-new.div-diachi:before {
    background-position: -495px -355px;
    height: 28px;
    top: 5px;
}
.bl-input-new.div-phone:before {
    background-position: -950px -84px;
    height: 25px;
    top: 6px;
}
.wrapuser .control-label.label-active {
    font-size: 13px;
    font-weight: 400;
    float: right;
    padding-right: 15px;
    font-style: italic;
    text-decoration: underline;
    padding-top: 0;
    margin-bottom: 0;
}
.bl-input-new select.form-control-new {
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    color: #848484;
}
.bl-input-new .form-control-new{color: #848484; }
.bl-input-new .form-control-new::-webkit-input-placeholder {
    color: #848484;
}
.wrapuser .btn-save {
    background-color: #fff;
    border-radius: 30px;
    width: 100%;
    color: var(--color-red);
    font-size: 16px;
    font-weight: 700;
    height: 42px;
    margin: 30px 0 30px 15px;
    border: 1px solid var(--color-red);
}
/*end*/
.bl-info-account .btn-orange {
    margin: 20px 0 10px;
    font-weight: 500;
}
.btn-orange {
    border: 0;
    background: var(--color-red);
    color: #fff;
    font-size: 16px;
    box-shadow: none;
    border-radius: 40px;
    height: 47px;
    width: 100%;
    line-height: 47px;
}
/*end*/

.bl-choose-title {
    text-align: center;
    padding: 30px 0 0;
}
.bl-choose-title .btn {
    width: 136px;
    height: 47px;
    border: 1px solid #dadde0;
    background-color: #fff;
    font-size: 15px;
    color: #676767;
    font-weight: 400;
    margin: 0 5px;
    vertical-align: bottom;
}
.bl-choose-title .btn.active {
    background-color: #173e69;
    border: 0;
    color: #fff;
}
.dang-tin .title-dangtin {
    font-size: 26px;
    color: #474747;
    font-weight: 500;
    padding: 10px 0 15px;
}
.bl-info-credibility .bl-radio {
    padding-top: 10px;
}
.bl-radio input[type=radio] {
    opacity: 0;
}
.bl-info-credibility .bl-radio input[type=radio] {
    opacity: 0;
}
.bl-info-credibility .bl-radio label {
    display: inline-block;
    position: relative;
    padding-left: 15px;
    cursor: pointer;
    font-weight: 400;
    font-size: 14px;
    color: #676767;
    font-family: 'Open Sans',sans-serif;
}
.bl-info-credibility .bl-radio label::before {
    content: "";
    display: inline-block;
    position: absolute;
    width: 24px;
    height: 24px;
    left: 4px;
    margin-left: -20px;
    border: 1px solid #888;
    border-radius: 50%;
    background-color: #fff;
    -webkit-transition: border .15s ease-in-out;
    -o-transition: border .15s ease-in-out;
    transition: border .15s ease-in-out;
    top: -3px;
}
.bl-info-credibility .bl-radio input[type=radio]:checked+label::after {
    -webkit-transform: scale(1,1);
    -ms-transform: scale(1,1);
    -o-transform: scale(1,1);
    transform: scale(1,1);
}
.bl-info-credibility .bl-radio label::after {
    display: inline-block;
    position: absolute;
    content: "";
    width: 24px;
    height: 24px;
    left: 4px;
    top: -3px;
    margin-left: -20px;
    border-radius: 50%;
    background: url(../member/svg-icons.svg?v=03.06.2019) no-repeat -271px -349px #4282c3;
    -webkit-transform: scale(0,0);
    -ms-transform: scale(0,0);
    -o-transform: scale(0,0);
    transform: scale(0,0);
    -webkit-transition: -webkit-transform .1s cubic-bezier(.8,-.33,.2,1.33);
    -moz-transition: -moz-transform .1s cubic-bezier(.8,-.33,.2,1.33);
    -o-transition: -o-transform .1s cubic-bezier(.8,-.33,.2,1.33);
    transition: transform .1s cubic-bezier(.8,-.33,.2,1.33);
}
.bl-info-credibility .control-label {
    text-align: left;
    font-size: 15px;
    padding-top: 10px;
    color: #474747;
    padding-bottom: 15px;
}
.color-red {
    color: red;
}
.bl-info-credibility .form-control {
    box-shadow: none;
    border-color: #bcbcbc;
    border-radius: 4px;
    font-size: 13px;
    margin-top: 10px;
}
.bl-info-credibility .form-group {
    margin-top: 0;
    margin-bottom: 15px;
}
.bl-info-credibility .popup-map-dangtin {
    position: relative;
    display: inline-block;
    padding-left: 25px;
    cursor: pointer;
    margin-top: 20px;
}
.popup-map-dangtin:before {
    content: '';
    display: inline-block;
    width: 20px;
    height: 30px;
    position: absolute;
    left: 0;
    top: -6px;
    background: url(../member/svg-icons.svg) no-repeat -160px -412px;
}
.bl-info-credibility .col-upload .control-label span.text {
    font-size: 15px;
    font-weight: 700;
}
.bl-info-credibility .col-upload .control-label {
    font-size: 13px;
    font-weight: 400;
}
.bl-info-credibility .control-label {
    text-align: left;
    font-size: 15px;
    padding-top: 10px;
    color: #474747;
    padding-bottom: 15px;
}
.ajax-file-upload-container, .ajax-file-upload-container-drawing {
    display: inline-block;
    float: left;
    margin-top: 18px;
}
.pic-upload {
    margin-bottom: 10px;
}
.ajax-upload-dragdrop {
    margin-top: 20px;
}
.image-upload>input {
    visibility: hidden;
    width: 0;
    height: 0;
}
.bl-info-credibility .form-control {
    box-shadow: none;
    border-color: #bcbcbc;
    border-radius: 4px;
    font-size: 13px;
    margin-top: 10px;
}
.bl-checkbox label {
    padding-left: 25px;
    cursor: pointer;
    font-weight: 400;
    font-size: 14px;
    color: #676767;
    font-weight: 400;
    margin-bottom: 2px;
    position: relative;
}
.bl-checkbox label::before {
    content: "";
    display: inline-block;
    position: absolute;
    width: 16px;
    height: 16px;
    left: 0;
    border: 1px solid #888;
    border-radius: 4px;
    background-color: #fff;
    -webkit-transition: border .15s ease-in-out,color .15s ease-in-out;
    -o-transition: border .15s ease-in-out,color .15s ease-in-out;
    transition: border .15s ease-in-out,color .15s ease-in-out;
    top: 1px;
}
.bl-checkbox label::after {
    content: '';
    display: inline-block;
    position: absolute;
    width: 16px;
    height: 16px;
    left: 0;
    top: 1px;
    border-radius: 4px;
    border: 1px solid #888;
}
.bl-checkbox input[type=checkbox] {
    opacity: 0;
    position: absolute;
}
.bl-checkbox input[type=checkbox]:checked+i+label::after, .bl-checkbox input[type=checkbox]:checked+label::after {
    background: url(../member/ic-checked.png) no-repeat center #fff;
}
.col-request-type .bl-checkbox {
    margin-bottom: 15px;
}
.bl-info-credibility .btn-send {
    width: 50%;
    background-color: #f17423;
    font-size: 14px;
    color: #fff;
    padding: 10px;
    border-radius: 40px;
    height: 48px;
    font-weight: 700;
}
.form-control-new{color:#8c8a8a;}
.form-control-new::-webkit-input-placeholder{color:#333;}
.bl-checkbox{margin-top: 13px;}
/*end*/

/*danh sách bds*/
.item-bds{
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px dashed #ddd
}
.item-bds .name-dt-bds{margin-bottom: 15px}
.item-bds .name-dt-bds a{
    color:#333;
    font-size: 17px;
    font-weight:700;
    text-decoration: none
}
.item-bds .name-dt-bds a:hover{color:#f00;}
.item-bds .img-bds{position: relative;}
.item-bds .img-bds .tt-bds-c{
    padding: 2px 15px;
    border: 1px dashed #f00;
    color: #fff;
    font-size: 12px;
    border-radius: 20px;
    position: absolute;
    right: 4px;
    top: 7px;
    background: #f00;
}
.item-bds .img-bds .tt-bds-d{
    padding: 2px 15px;
    border: 1px dashed #28a745;
    color: #fff;
    font-size: 12px;
    border-radius: 20px;
    position: absolute;
    right: 4px;
    top: 7px;
    background: #28a745;
}
.tool-bds{
    float: right;
}
.tool-bds a{
    color: #333;
    margin-left: 8px;
    font-size: 18px;
}
.price-bds-dt{
    color:#f00;
    font-weight: 700;
    font-size: 15px;
}
.price-bds-dt span{color:#333;font-size: 14px;}
.matin-bds{margin:10px 0;text-align:center;color: #8c8686;}
/*end */

.item_trich {
    width: 140px;
    float: left;
    margin: 10px 10px 10px 0px;
    position: relative;
}
.delete_images {
    position: absolute;
    z-index: 10;
    top: 8px;
    right: 8px;
    color:#fff;
} 
.delete_images i{color:#000;}  
.update_stt{
    width:100%;
    border:1px solid #ddd;
    margin-top: 5px;
}
.price-text{
    font-size: 14px;
    font-style: italic;
    margin-top: 10px;
    color: #f00
}
/*end*/ 
.profile-user .block-control {
    border-bottom: 1px solid #e7e7e7;
}
.profile-user .order-tabs {
    margin-top: 10px;
    width: 100%;
    display: inline-block;
    padding: 0;
    margin-bottom: 0;
}
.profile-user .order-tabs li {
    display: inline-block;
    margin-right: 0px;
}
.profile-user .order-tabs li:hover, .profile-user .order-tabs li.active {
    border-bottom: 2px solid var(--color-red);
}

.profile-user .order-tabs li a {
    display: block;
    padding: 10px 19px;
    border-bottom: none;
    white-space: nowrap;
    color: #333;
    text-decoration: none
}
.profile-user .order-tabs li.active a, .profile-user .order-tabs li:hover a {
    background: #fff;
    color: var(--color-red);
}
.cont-order-tabs .note-order {
    margin-top: 20px;
    text-align: center;
}
.cont-order-tabs .user-order-items {
    margin-top: 10px;
    border: 1px solid #ddd;
    float: left;
    width: 100%;
}
.cont-order-tabs .user-order-items.first-child {
    margin-top: 20px;
    position: relative;
    min-height: 220px;
}
.user-order-items .order-inf1 {
    background-color: #f5f5f5;
    padding-bottom: 10px;
}
.user-order-items .order-inf1 .cols-order-inf {
    line-height: 1.6;
    position: relative;
    margin-top: 10px;
    width: 30%;
    display: inline-block;
}
.user-order-items .order-inf1 .cols-order-inf p{margin-bottom: 0}
.user-order-items .order-inf1 .cols-order-inf:first-child {
    margin-left: 20px;
}
.user-order-items .order-inf1 .order-code {
    float: left;
    margin-right: 15px;
    width: 100%;
}
.user-order-items .order-inf1 .cols-order-inf span {
    display: inline-block;
    cursor: pointer;
    font-size: 13px;
}
.user-order-items .order-code .link-oder-detail {
    color: #0066ff;
}
.user-order-items .order-inf1 .cols-total-money {
    float: right;
    text-align: right;
    margin-right: 20px;
    font-weight: bold;
}
.order-inf1 .cols-order-inf .user-inf-add {
    position: absolute;
    width: 300px;
    padding: 5px 10px;
    line-height: 20px;
    border: 1px solid var(--color-red);
    background: var(--color-red);
    color: #fff;
    display: none;
    z-index: 999;
    transition: all .2s linear;
    -moz-transition: all .2s linear;
    -webkit-transition: all .2s linear;
    top: 60px;
}
.order-inf1 .cols-order-inf .user-inf-add:before{
    position: absolute;
    content: "";
    left: 10px;
    top: -5px;
    border-top: 6px solid var(--color-red);
    border-left: 6px solid var(--color-red);
    transform: rotate(45deg);
    width: 20px;
    height: 20px;
}
.order-inf1 .cols-order-inf:hover .user-inf-add {
    display: block;
}
.order-inf2 {
    padding-bottom: 2%;
}
.user-order-items .order-inf2 .order-inf2-lf {
    width: 52%;
    float: left;
    padding: 15px 15px 15px 20px;
}
.user-order-items .order-inf2 .order-inf2-lf.feedback {
    width: 40%;
}
.order-inf2 .order-inf2-rg {
}
.order-inf2 .order-inf2-lf .img {
    width: 80px;
    height: 60px;
    float: left;
    margin-right: 10px;
    border: 1px solid #ddd;
    display: flex;
    align-items: center;
    justify-content: center;
}
.order-inf2 .order-inf2-lf .img img{max-height: 100%}
.order-inf2 .order-inf2-lf .pr-name {
    font-weight: bold;
    display: block;
    line-height: 20px;
    color: #333;
}
.order-inf2 .order-inf2-lf .shop-name {
    display: block;
    padding: 5px 0;
    color: #999999;
}

.block-inprogress .inner-steps:first-child {
}
.block-inprogress .inner-steps .icon-order {
    position: relative;
    margin: 10px 0px;
    z-index: 1;
}
.block-inprogress .inner-steps .not-active{font-size: 12px;min-height: 36px;}
.block-inprogress .inner-steps.active .icon-order:after {
    background: url(../member/icon_active_order.png) center /cover no-repeat ;
    z-index: 78;
    content: "";
    position: absolute;
    width: 37px;
    height: 37px;
    top: 0;
    left: 0;
}


.user-order-items .block-btn-group .bt {
    float: right;
}
.order-inf2 .order-inf2-rg .bt, .block-btn-group .bt { 
text-align: center;
margin-top: 0;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px; 
border: 1px solid var(--color-red); 
color: #fff;
background: var(--color-red);
white-space: nowrap;
margin-left: 10px;
padding: 5px 5px;
overflow: auto;
}
.order-inf2 .order-inf2-rg .bt a, .block-btn-group .bt a {
    color: #fff;
}
.user-order-items .block-btn-right {
    float: right;
    text-align: right;
}
.cancel-order {
    float: left;
    margin-top: 6px;
}
.user-order-items .block-btn-group .bt {
    float: right;
}
.cancel-order a {
    font-size: 15px;
    color: #000;
    border: 1px solid #ccc;
    border-radius: 5px;
    padding: 5px 23px;
}
.user-order-items .block-btn-group {
    display: block;
    /* max-width: 50%; */
    padding: 10px 20px 10px;
    overflow: auto;
}
.order-inf2 .order-inf2-rg {
    position: relative;
}
.profile-user{margin-bottom: 25px}
.panel-info>.panel-heading {
    color: #31708f;
    background-color: #d9edf7;
    border-color: #bce8f1;
}
.radio, .checkbox {
    position: relative;
    display: block;
    margin-top: 10px;
    margin-bottom: 10px;
}
.option-order-cancel {
    font-size: 15px;
    color: #000;
    margin-bottom: 6px !important;
}
.radio label, .checkbox label {
    min-height: 20px;
    padding-left: 20px;
    margin-bottom: 0;
    font-weight: normal;
    cursor: pointer;
}
/*end*/
.ttl-box-profile {
    color: #333;
    font-size: 16px;
    font-weight: bold;
    height: 32px;
    line-height: 32px;
    border-bottom: 1px solid #ededed;
    height: auto;
}
.ttl-box-profile span {
    font-weight: normal;
}
.cont-order-detail .block-info-inprogress {
    display: block;
    overflow: auto;
    padding: 15px 0;
}
.cont-order-detail .first-block {
    padding: 10px 0;
    float: left;
    width: 30%;
}
.cont-order-detail .first-block {
    width: 25%;
}
.cont-order-detail .first-block span {
    display: inline-block;
    margin-right: 0;
    line-height: 1.6;
    font-size: 14px;
    color: #333;
}
.cont-order-detail .first-block span b {
    color: #189eff;
    font-weight: 700;
}
.cont-order-detail .block-inprogress {
    width: 100%;
    margin: 0 auto;
    float: none;
}
.block-inprogress .inner-steps {
    float: left;
    text-align: center;
    position: relative;
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    min-width: 75px;
}

.block-inprogress .inner-steps:first-child {
    padding-left: 0;
}

.block-inprogress .inner-steps img {
    margin: 0 auto;
}
.block-left-detail, .block-right-detail {
    padding: 18px;
    border: 1px solid #e7e7e7;
    margin-bottom: 20px;
    border-radius: 3px;
    position: relative;
}
.block-left-detail, .block-right-detail {
    display: table-cell;
    width: 48%;
    min-height: auto;
    margin-left: 0;
    vertical-align: top;
    flex: 0 0 49%;
    max-width: 48%;
}
.block-left-detail.order-left {
    margin-right: 20px;
    padding-right: 20px;
}
.block-left-detail, .block-right-detail:last-child{margin-right: 1px;}
.block-left-detail .cols-left-detail {
    float: left;
    position: relative;
}
.block-left-detail .cols-left-detail {
}
.block-left-detail .cols-left-detail h3, .block-right-detail h3 {
    font-size: 15px;
    font-weight: 700;
    margin: 0 0 15px 0;
}
.block-left-detail .cols-left-detail p {
    margin: 0;
}
.block-left-detail .cols-left-detail .txt-inf label {
    width: 115px;
    display: inline-block;
    font-size: 14px;
    color: #333;
    font-weight: normal;
}
.block-left-detail .cols-right-detail {
    float: left;
    width: 50%;
    font-size: 13px;
    color: var(--color-red);
    border: 1px dashed;
    padding: 10px;
    text-align: center;
    margin: 10px 0;
    border-radius: 3px;
}
.block-left-detail .cols-right-detail {
    width: 45%;
}
.shipment-tracking.pc {
    display: block;
    margin-top: -20px;
    padding: 20px 20px 20px 40px;
    border-radius: 3px;
    border: 1px solid #e7e7e7;
    margin-bottom: 12px;
    margin-top: 15px;
    position: relative;
}
.shipment-tracking .shipment-status {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.shipment-tracking .shipment-icon {
    position: relative;
}
.shipment-tracking .shipment-icon span {
    width: 24px;
    height: 24px;
    position: relative;
    z-index: 2;
    background: white;
}
.shipment-tracking.pc:after {
    content: "";
    position: absolute;
    left: 18px;
    top: 29px;
    height: 45px;
    width: 13px;
    background: url(../member/icon15.png) no-repeat center left;
}
.shipment-tracking .shipment-context {
    padding: 6px 0;
    width: 88%;
}
.shipment-tracking .shipment-text {
    -webkit-box-ordinal-group: 3;
    -ms-flex-order: 2;
    order: 2;
}
.shipment-tracking .shipment-context .shipment-time {
    margin-right: 15px;
}
.shipment-tracking .shipment-context .shipment-time .time, .shipment-tracking .shipment-context .shipment-time .date {
    float: left;
    font-size: 14px;
    color: #333;
}
.shipment-tracking .shipment-context {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -ms-flex-wrap: nowrap;
    flex-wrap: nowrap;
    position: relative;
    z-index: 2;
    -webkit-box-pack: start;
    -ms-flex-pack: start;
    justify-content: flex-start;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    border: 0;
    padding: 7px 0;
}
.shipment-tracking .shipment-status:first-of-type .shipment-text {
    color: var(--color-red);
}

.shipment-tracking .shipment-context .shipment-time .time {
    margin-right: 10px;
}
.block-inner-detail {
    position: relative;
    border: 1px solid #e7e7e7;
    border-radius: 3px;
    padding: 15px 20px 20px;
    margin-bottom: 20px;
}
.detail-block .inner-detail {
    display: block;
    float: left;
    margin: 0 0 10px;
    width: 100%;
    color: #999999;
}
.order-bill {
    overflow: hidden;
    border-top: 1px solid #e7e7e7;
}
.order-btn-group {
    position: absolute;
    bottom: 20px;
    left: 20px;
}
.detail-block .inner-detail .txt-inf {
    float: left;
    margin-right: 10px;
    font-size: 14px;
    color: #333;
    font-weight: normal;
}
.detail-block .inner-detail .txt-inf label {
    font-size: 14px;
    color: #b5b0b0;
    font-weight: normal;
}
.inner-detail .txt-inf .shop-name, .inner-detail .txt-inf .shop-name span {
    font-family: "Roboto-Regular";
    font-size: 14px;
    color: #189eff;
    font-weight: normal;
}
.detail-block .inner-detail .txt-inf span {
    color: #333333;
}
.detail-block .tbl-items-list {
    width: 100%;
}
.detail-block .tbl-items-list th {
    height: 30px;
    line-height: 30px;
    color: #000;
    font-weight: bold;
}
.detail-block .tbl-items-list td {
    vertical-align: top;
    padding: 15px 0;
    border-top: 1px solid #cdcdcd;
}
.detail-block .tbl-items-list td:first-child {
    text-align: left;
}
.order-bill .detail-order-bill {
    width: 300px;
    float: right;
}
.order-bill .detail-order-bill .row-inf {
    padding: 8px 0;
    font-size: 14px;
    overflow: hidden;
}
.order-bill .detail-order-bill .row-inf.point{color: var(--color-red);}
.detail-order-bill .row-inf .lbl {
    width: 200px;
    float: left;
    text-align: right;
    font-weight: bold;
}
.detail-order-bill .row-inf .fee {
    float: right;
    font-weight: bold;
}
.user-address-block .bt-block .bt.back-order-list {
    color: #333;
    line-height: 30px;
    background: #fff;
    border: 1px solid #d7d7d7;
    padding: 0 10px;
    border-radius: 3px;
    font-weight: bold;
}
.user-address-block .bt-block {
    text-align: center;
    margin-top: 15px;
}
.user-address-block .bt-block .bt.back-order-list {
    text-transform: uppercase;
}
.detail-block .tbl-items-list th:first-child {
    width: 40%;
    text-align: left;
}
.tbl-items-list .item-pr img {
    float: left;
    border: 1px solid #e1e1e1;
    margin-right: 10px;
    width: 80px;
    height: 60px;
}
.tbl-items-list .item-pr .item-pr-info {
    overflow: hidden;
}
.tbl-items-list .item-pr .pr-name {
    display: block;
    line-height: 17px;
    padding-bottom: 5px;
    color: var(--color-txt);
    font-weight: bold;
}
.tbl-items-list .price {
    color: #595959;
}
.tbl-items-list .numb {
    color: #000;
}
.detail-block .tbl-items-list td.total-pr {
    color: #595959;
}
/*end*/


.modal-login .btn-login-fb:before, .modal-login .btn-register-fb:before{left: 30px}
.modal-login .i-radio{margin-bottom: 10px;}
.jFiler-input-dragDrop{width: 100%}
.nav-info{margin-left: 0}
.user-order-items .order-inf1 {
    padding: 5px;
}

.user-order-items .order-inf1 .cols-order-inf:first-child {
    margin-left: 0px;
}
.user-order-items .order-inf1 .cols-order-inf {
    width: 30%;
}
.user-order-items .order-inf2 .order-inf2-lf.feedback, .order-inf2 .order-inf2-rg {
    width: 100%;
    padding: 10px;
}
.block-inprogress .inner-steps:first-child {
    width: 37px;
}
.block-inprogress .inner-steps img {
    width: 42px;
    min-width: 41px;
}

.block-inprogress .inner-steps .icon-line{position: relative}
.block-inprogress .inner-steps .icon-line{
    position: absolute;
    top: 20%;
    height: 3px;
    background: #d0d0d0;
    left: -53%;
    width: 100%;
}
.block-inprogress .inner-steps img {
    width: 37px;
    min-width: 37px;
}
.cont-order-detail .first-block {
    width: 100%;
}
.block-left-detail, .block-right-detail{
    flex: 0 0 100%;
    max-width: 100%;
}

.block-inprogress .inner-steps {
    width: 37px;
    height: 91px;
}
.block-left-detail .cols-left-detail .txt-inf label{width: auto}
}
#popup-option-cancel-order .btn-success{
    margin: 25px auto 0 auto;
    display: flex;
    justify-content: center;
}
.logo-regerter{width: 232px;}
.txt-regerter{width: 100%;text-align: center;}
.name-member{
    overflow: hidden;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    display: -webkit-box;
    -webkit-box-orient: vertical;
   font-size: 14px;
   padding: 0 0px 0 8px;
}
.wrapuser{background: #fff}
#popup-option-cancel-order .panel-info>.panel-heading{
    padding: 10px;
    font-weight: 700;
}
#popup-option-cancel-order .panel-body{
    width: 500px;
    padding: 20px 0px;
}
#promote-giftvip {
    border-radius: 8px;
    background: var(--color-yellow);
    padding: 8px 12px;
    margin-top: 40px;
}
#promote-giftvip .user-point {
    display: block;
    padding-bottom: 8px;
    line-height: 20px;
    font-weight: 700;
}
.download-cta {
    display: flex;
    justify-content: space-between;
    gap: 8px;
}
.header-sale-member{
    padding: 10px;
    margin-bottom: 20px;
}
.header-sale-member .sale{font-size: 20px;color:var(--color-red);}
.header-sale-member .title-web{font-size: 20px;}
.money-sale{font-size: 20px;color:var(--color-red);}
.money-total-sale{color:var(--color-red);}
#btn-cancel-order{display: flex;margin:0 auto}
.wrap-user.kichhoat{margin: 40px auto 40px auto}
@media screen and (max-width:767px) {
  .modal-login .modal-dialog{width: 97%;    margin: auto;}
  .modal-login .modal-dialog {margin-top: 48px;}

  .download-cta{justify-content: flex-start;}
  #promote-giftvip{width: 100%;max-width: 270px;margin: 20px auto}
  .bl-info-account .btn-orange{width: 100%;max-width:250px;margin: 20px auto}
  .user-order-items .order-inf1 .cols-order-inf{width: 40%}
  .user-order-items .order-inf1 .cols-order-inf.sale{width: 48%}
  .user-order-items .order-inf1 .cols-order-inf.sale{width:40%}
  .profile-user .order-tabs li a{padding: 7px 10px}
  .block-inprogress .inner-steps .icon-line{top: 50%}
  .wrapuser .btn-save{max-width: 250px;margin: 30px auto 30px auto;}
  .order-bill .detail-order-bill .row-inf{padding: 5px 0}
  .wrapuser .col-right{padding: 0}
  .block-inner-detail{padding: 10px}
  .detail-block .inner-detail .txt-inf{margin-bottom: 0}
  .profile-user{margin-bottom: 0}
  .block-left-detail .cols-right-detail{width: 100%}
  .block-left-detail, .block-right-detail{max-width: 100%;width: 100%;display: block;}
  .block-inprogress .inner-steps{height: 45px}
  .shipment-tracking .shipment-context{flex-direction: column;align-items: flex-start;}
  .shipment-tracking.pc:after{top: calc(50% - 22px);}
  .shipment-tracking.pc{padding: 20px 20px 20px 50px;}
}
@media screen and (max-width:440px) {
    .user-order-items .order-inf1 .cols-order-inf{width: 100%}
    .user-order-items .order-inf1 .cols-total-money{margin-right: 0}
    .block-inprogress .inner-steps{min-width: 55px}
}