
.btn_status_success {
    background-color: green;
}

.btn_status_false {
    background-color: #d9534f;
}

.btn_status {
    width: auto;
    border : none;
    -moz-border-radius: 5px;
    -webkit-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
    color: #ffffff;
}

.sweet-alert h2 {
    font-size: 18px!important;
}

.table > tbody > tr.selected_item {
    background: rgba(38, 185, 154, 0.16);
}

.material-switch > input[type="checkbox"] {
    display: none;
}

.material-switch > label {
    cursor: pointer;
    height: 0px;
    position: relative;
    width: 40px;
}

.material-switch > label::before {
    background: rgb(0, 0, 0);
    box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
    border-radius: 8px;
    content: '';
    height: 16px;
    margin-top: -8px;
    position:absolute;
    opacity: 0.3;
    transition: all 0.4s ease-in-out;
    width: 40px;
}
.material-switch > label::after {
    background: rgb(255, 255, 255);
    border-radius: 16px;
    box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
    content: '';
    height: 24px;
    left: -4px;
    margin-top: -8px;
    position: absolute;
    top: -4px;
    transition: all 0.3s ease-in-out;
    width: 24px;
}
.material-switch > input[type="checkbox"]:checked + label::before {
    background: inherit;
    opacity: 0.5;
}
.material-switch > input[type="checkbox"]:checked + label::after {
    background: inherit;
    left: 20px;
}


.img-fluid {
    max-width: 100%!important;
    height: auto!important;
}


#crop-avatar {
    width: 200px;
    height: 200px;
    overflow: hidden;
    border: 3px solid #fff;
    margin: auto;
}
#crop-avatar img {
    display: block;
    width: 100%;
}

#crop-avatar_index {
    width: 50px;
    height: 50px;
    overflow: hidden;
    border: 3px solid #fff;
    margin: auto;
}
#crop-avatar_index img {
    display: block;
    width: 100%;
}

.image-w100{
    width: 100%!important;
}

.panel_toolbox > li {
    float: left;
    cursor: pointer;
}

.viewing {
    padding-top: 10px;
    padding-right: 20px;
}


.show-field fieldset {
    display: block!important;
    -webkit-margin-start: 0px!important;
    -webkit-margin-end: 0px!important;
    -webkit-padding-before: 0.35em!important;
    -webkit-padding-start: 0.75em!important;
    -webkit-padding-end: 0.75em!important;
    -webkit-padding-after: 0.625em!important;
    min-width: -webkit-min-content!important;
    border-width: 1px!important;
    border-style: solid!important;
    border-color: #0c0101!important;
    border-image: initial!important;
    border-radius: 4px!important;
    -webkit-box-shadow: 1px 1px 2px #fff inset!important;
    box-shadow: 1px 1px 2px #fff inset!important;
    background-color: #fafafa!important;
    margin-bottom: 20px!important;
}

.show-field legend {
    display: block!important;
    margin-bottom: 20px!important;
    border-bottom: none;
}

.list-group-unbordered li.list-group-item {
    padding: 10px!important;
}

.break-word {
    word-break : break-word;
}
.mg-top-10 {
    margin-top: 10px!important;
}

.mb-5 { margin-bottom: 5px;}
.mb-10 { margin-bottom: 10px;}
.mb-15 { margin-bottom: 15px;}
.ml-5 { margin-left: 5px;}
.ml-10 { margin-left: 10px;}
.ml-15 { margin-left: 15px;}
.mr-5 { margin-right: 5px;}
.mr-10 { margin-right: 10px;}
.mr-15 { margin-right: 15px;}
.mt-5 { margin-top: 5px;}
.mt-10 { margin-top: 10px;}
.mt-15 { margin-top: 15px;}
.mt-30 { margin-top: 30px;}

.font-weight-normal { font-weight: normal;}

div.progressbar { position: relative !important; width: 100%}
td.progressbar { padding:120px 70px 40px !important;}
td.noprogressbar { vertical-align: middle !important;}

.progress{ margin-bottom: 0 !important;}

.step3 .zero, .step3 .one, .step3 .two, .step3 .three{ position:absolute; margin-top:-10px; z-index:1; height:40px; width:40px; border-radius:25px; line-height: 40px; text-align: center; color: #d8d8d8;}
.step3 .zero {left: -20px;}
.step3 .one{ left:33%; }
.step3 .two{ left:67%; }
.step3 .three{ right:-20px;}


.step4 .zero, .step4 .one, .step4 .two, .step4 .three, .step4 .four{ position:absolute; margin-top:-10px; z-index:1; height:40px; width:40px; border-radius:25px; line-height: 40px; text-align: center; color: #d8d8d8;}
.step4 .zero {left: -20px;}
.step4 .one{ left:24%; }
.step4 .two{ left:49%; }
.step4 .three{ left:74%; }
.step4 .four{ right:-20px;}


.step5 .zero, .step5 .one, .step5 .two, .step5 .three, .step5 .four, .step5 .five{ position:absolute; margin-top:-10px; z-index:1; height:40px; width:40px; border-radius:25px; line-height: 40px; text-align: center; color: #d8d8d8;}
.step5 .zero {left: -1%;}
.step5 .one{ left:19%; }
.step5 .two{ left:39%; }
.step5 .three{ left:59%; }
.step5 .four{ left:79%; }
.step5 .five{ left:99%;}


.progress .primary-color{ background-color:#4989bd; }
.progress .success-color{ background-color:#5cb85c; }
.progress .danger-color{ background-color:#d9534f; }
.progress .warning-color{ background-color:#f0ad4e; }
.progress .info-color{ background-color:#5bc0de; }
.progress .no-color{ background-color:#ececec; }

.list-bank-accounts > .row:first-child .col-md-1:last-child { display: none;}

.bag-color-w{
    background-color: white!important;
}

header .logo img { max-height: 100%;}

.order-status { position: relative;}
.order-status .step-breadcrumb { max-width: 1100px; min-width: 1060px; position: relative;}
.order-status .cd-breadcrumb.triangle li { min-width: 130px;}
.order-status .cd-breadcrumb.triangle li > * { padding: 8px 0 8px 30px; height: 76px; font-size: 13px; width: 100%;}
.order-status .cd-breadcrumb.triangle li:first-child > * { padding-left: 8px;}
.order-status .cd-breadcrumb.triangle li .title { display: block; font-weight: 700;}
.order-status .cd-breadcrumb.triangle li::after, .order-status .cd-breadcrumb.triangle li > *::after { border-width: 38px 38px 38px 20px}
.order-status .cd-breadcrumb.triangle.color-info li.visited > *, .order-status .cd-breadcrumb.triangle.color-info li.current > * { background-color: #5bc0de; border-color: #5bc0de;}
.order-status .cd-breadcrumb.triangle.color-danger li.visited > *, .order-status .cd-breadcrumb.triangle.color-danger li.current > * { background-color: #d9534f; border-color: #d9534f; color: #fff;}
.order-status .cd-breadcrumb.triangle.color-success li.visited > *, .order-status .cd-breadcrumb.triangle.color-success li.current > * { background-color: #5cb85c; border-color: #5cb85c;}

.order-status .cd-multi-steps li { vertical-align: top;}
.order-status .cd-multi-steps li>* { font-size: 12px;}
.order-status .cd-multi-steps li .title { font-size: 12px; font-weight: 700; display: block;}
.order-status .cd-multi-steps.text-top li, .order-status .cd-multi-steps.text-bottom li { width: 130px;}
.order-status .cd-multi-steps.color-info li.visited > *::before, .order-status .cd-multi-steps.color-info li.visited::after, .order-status .cd-multi-steps.color-info li.current > *::before { background-color: #5bc0de;}
.order-status .cd-multi-steps.color-info li.visited > *::before { color: #fff !important;}
.order-status .cd-multi-steps.color-danger li.visited > *::before, .order-status .cd-multi-steps.color-danger li.visited::after, .order-status .cd-multi-steps.color-danger li.current > *::before { background-color: #d9534f;}
.order-status .cd-multi-steps.color-danger li.visited > *::before { color: #fff !important;}
.order-status .cd-multi-steps.color-success li.visited > *::before, .order-status .cd-multi-steps.color-success li.visited::after, .order-status .cd-multi-steps.color-success li.current > *::before { background-color: #5cb85c;}
.order-status .cd-multi-steps.color-success li.visited > *::before { color: #fff !important;}

.order-detail .view-data { color: #dc3545; font-size: 15px; line-height: 25px;}
.order-detail div.view-data { border-bottom: 1px dotted #d8d8d8; margin-bottom: 30px;}

.select2-container--default .select2-results__option--highlighted[aria-selected] .text-muted { color: #fff;}
.menu.list-processing-order { padding: 5px 10px !important;}
.menu.list-processing-order li { margin: 0 !important; border-bottom: 1px solid #ddd;}
.menu.list-processing-order li a { margin: 0; padding-bottom: 10px !important; color: #111; text-decoration: none}
.menu.list-processing-order .progress-bar { text-align: center; padding: 1px 5px;}
.menu.list-processing-order .progress-bar>span { color: #111; white-space: nowrap}

#list-orders-table { table-layout: fixed;}

#order-status-bar { width: 100%; height: 110px; position: relative;}

.autocomplete-suggestions { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; border: 1px solid #999; background: #FFF; cursor: default; overflow: auto; -webkit-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); -moz-box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); box-shadow: 1px 4px 3px rgba(50, 50, 50, 0.64); }
.autocomplete-suggestion { padding: 2px 5px; white-space: nowrap; overflow: hidden; }
.autocomplete-no-suggestion { padding: 2px 5px;}
.autocomplete-selected { background: #F0F0F0; }
.autocomplete-suggestions strong { font-weight: bold; color: #000; }
.autocomplete-group { padding: 2px 5px; font-weight: bold; font-size: 16px; color: #000; display: block; border-bottom: 1px solid #000; }

.modal .transfer-info { border: 1px solid #ddd; background: #eee; border-radius: 5px; padding: 10px;}
.modal .transfer-info td { border-color: #ddd;}
.modal .transfer-info td span { color: red;}

@media (min-width: 992px) {
    .mt-lg-5 { margin-top: 5px;}
    .mt-lg-15 { margin-top: 15px;}
    .mt-lg-30 { margin-top: 30px;}
}

@media (max-width: 768px) {
    #list-orders-table, #list-orders-table tbody, #list-orders-table tbody tr, #list-orders-table tbody td { display: block;}
    #list-orders-table tbody tr { width: 100%; border-bottom: 1px solid #ddd;}
    #list-orders-table tbody td { border: none;}
    .order-status .step-breadcrumb { margin: 0;}
}

.img-thumbnail{padding: 0}
.zoom:hover {-ms-transform: scale(10); /* IE 9 */-webkit-transform: scale(10); /* Safari 3-8 */transform: scale(10);}
.line-through {text-decoration: line-through;}
/*!* Extra small devices (phones, less than 768px) *!*/
/*!* No media query since this is the default in Bootstrap *!*/

/*!* Small devices (tablets, 768px and up) *!*/
/*@media (min-width: @screen-sm-min) {*/
    /**/
/*}*/

/*!* Medium devices (desktops, 992px and up) *!*/
/*@media (min-width: @screen-md-min) {*/

/*}*/

/*!* Large devices (large desktops, 1200px and up) *!*/
/*@media (min-width: @screen-lg-min) {*/

/*}*/
