/*login area start*/
html {
    scroll-behavior: smooth;
}
.web-title-block{
    background-color:#005055;
    color:#fff;
    padding: 10px;
    font-size: 25px;
    font-weight: bold;
    text-align: center;
    margin-right: 20%;
    margin-left: 20%;
}
/*login area end*/

.dsp-in-blck{
    display: inline-block;
}

.set-info-block{
    display: block;
    border-bottom:1px solid #ddd;
    margin-top:1px;
    margin-bottom:1px;
}

.bootstrap-datetimepicker-widget{
    z-index:1050 !important;
}

.fz-13-im{
    font-size:13px !important;
}

.fz-15-im{
    font-size:15px !important;
}

.fz-18-im{
    font-size:18px !important;
}

.mt-5{
    margin-top:5px !important;
}
.mt-7{
    margin-top:7px !important;
}
.mt-10{
  margin-top:10px !important;
}

.mt-20{
  margin-top:20px !important;
}
.mb-2{
  margin-bottom:2px !important;
}

.mb-3{
  margin-bottom:3px !important;
}

.mb-10{
  margin-bottom:10px !important;
}

.mr-10{
  margin-right:10px !important;
}

.ml-10{
  margin-left:10px !important;
}

.mr-0{
  margin-right:0px !important;
}

.ml-5{
  margin-left:5px !important;
}
.ml-2{
  margin-left:2px !important;
}

.ml-0{
  margin-left:0px !important;
}

.mb-0{
  margin-bottom:0px !important;
}

.pdl-10{
  padding-left:10px !important;
}

.pdr-10{
  padding-right:10px !important;
}

.p-10{
  padding:10px !important;
}
.text-justify {
    text-align: justify;
}

.bg-white{
    background-color: #ffffff !important;
}

.bc-grey{
  background-color: #f2f2f2 !important;
}

.bc-darker-grey{
  background-color: #AAAAAA !important;
}
.brdr-darker-grey{
  border-color: #AAAAAA !important;
}

.f-bold{
    font-weight:bold;
}

.color-white{
  color:white;
}

.color-darker-grey{
  color:#727272 !important;
}

.color-dark-blue{
    color:#10465E !important;
}

.va-middle{
  vertical-align: middle !important;
}

.header-table{
  background-color:#C80360;
  color:#fff;
}

.name, .designation{
    font-family:Montserrat !important;
}

.fsz-10{
    font-size: 10px !important;
}

.fsz-11{
    font-size: 11px !important;
}

.fsz-12{
    font-size: 12px !important;
}

.fsz-13{
    font-size: 12px !important;
}

.fsz-15{
    font-size: 15px !important;
}

.fsz-18{
    font-size: 18px !important;
}

body{
    font-family:montserrat !important;
    font-size:12px !important;
}

label, button, input, select, textarea, a{
    font-family:montserrat !important;
    font-size:12px !important;
}

table, tr, td{
    font-family:montserrat !important;
    font-size:12px !important;
}


.font-montserrat{
    font-family:montserrat;
}

.extra-title-style{
    font-size: 21px !important;
}

.form-control{
    font-size: 11px !important;
}

.extra-table-title-style{
    font-size: 17px !important;
}

.file .file-spc {
    padding: 10px;
    background-color: #fff;
    border-top: none !important;
}

.A_status{
    color:#32a852 !important;
}

.A_block_status{
    padding: 10px;
    color: #fff;
    background-color: #32a852;
}

.N_block_status{
    padding: 10px;
    color: #fff;
    background-color: #aaa;
}

.D_block_status{
    padding: 10px;
    color: #fff;
    background-color: #FF9CD4;
}

.success-icon{
    color:#32a852 !important;
}

.update-icon{
    color:#d4d400 !important;
}

.delete-icon{
    color:#a83232 !important;
}

.info-icon{
    color:#4287f5 !important;
}

.spc-card-body{
    padding: 0.5rem 0.5rem !important;
    box-shadow: 5px 5px 5px rgba(143, 143, 143, 0.5);
}

.D_trans_status{
    padding: 5px;
    color: #fff !important;
    background-color: #FF9CD4;
}

.D_trans_money{
    color: #FF9CD4 !important;
}

.N_trans_status{
    padding: 5px;
    color: #fff !important;
    background-color: #F33923;
}

.N_trans_money{
    color: #F33923 !important;
}

.T_trans_status{
    padding: 5px;
    color: #fff !important;
    background-color: #F3B523;
}

.T_trans_money{
    color: #F3B523 !important;
}

.R_trans_status{
    padding: 5px;
    color: #fff !important;
    background-color: #005ABE;
}

.R_trans_money{
    color: #005ABE !important;
}

.S_trans_status{
    padding: 5px;
    color: #fff !important;
    background-color: #7200BE;
}

.S_trans_money{
    color: #7200BE !important;
}

.F_trans_status{
    padding: 5px;
    color: #fff !important;
    background-color: #008929;
}

.F_trans_money{
    color: #008929 !important;
}

.C_trans_status{
    padding: 5px;
    color: #000 !important;
    background-color: #ddd;
}

.C_trans_money{
    color: #ddd !important;
}

.RH_trans_status{
    padding: 5px;
    color: #fff !important;
    background-color: #94486f;
}

.RH_trans_money{
    color: #94486f !important;
}

.H_trans_status{
    padding: 5px;
    color: #fff !important;
    background-color: #BE0857;
}

.H_trans_money{
    color: #BE0857 !important;
}

.custom-modal-dialog{
    width: 100%;
    height: 100vh;
}

.custom-modal-content{
    box-shadow: none;
    border: none;
    background: transparent;
}

#loader_modal{
    overflow-y:hidden !important;
    z-index:1100 !important;
}

.final-report-value{
    font-size:18px;
}

.grosir-label{
    padding: 5px;
    color: #fff !important;
    background-color:#fcba03;
}

#shipping_info_modal{
    position:absolute !important;
}

.required-icon{
    color: red;
    font-size: 7px;
    margin-left: 5px;
    vertical-align: super;
}

/*photo uploader*/
.image_area {
    position: relative;
}
/*
img {
    display: block;
    max-width: 100%;
}
*/
.preview {
    overflow: hidden;
    width: 160px; 
    height: 160px;
    margin: 10px;
    border: 1px solid red;
}

.modal-lg{
    max-width: 1000px !important;
}

.overlay {
    position: absolute;
    bottom: 10px;
    left: 0;
    right: 0;
    background-color: rgba(0, 0, 0, 0.8);
    overflow: hidden;
    height: 0;
    transition: .5s ease;
    width: 100%;
}

.image_area:hover .overlay {
    height: 50%;
    cursor: pointer;
}

.text {
    color: #fff;
    font-size: 15px;
    position: absolute;
    top: 50%;
    left: 50%;
    -webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    text-align: center;
}

.private-car-box{
    border : 1px solid #ddd;
}
.way-detail{
    padding:5px;
    background-color:#ddd;
    margin-bottom:10px;
}
.public-car-box{
    border : 1px solid #ddd;
}
.position-detail{
    padding:5px;
    background-color:#ddd;
    margin-bottom:10px;
}

.image-size-info{
    font-size: 10px;
    margin-top: 5px;
    text-align: center;
    color: #b51827;
}

@media (max-width: 480px)  {
    .final-report-value{
        font-size:12px;
    }

    .select2-container--default{
        width:195px !important;
    }
}

.deleted-pic-data{
    background-size:cover;
    background-position:center;
    height:122px;
    width:122px;
}
.deleted-access-data{
    display:inline-block;
    margin-left:5px;
    margin-right:5px;
    margin-bottom:5px;
    padding:10px;
    background-color:#90bfc6;
    color:#000;
}
.pic-box{
    display:inline-block;
    margin-right:5px;
    margin-left:5px;
}
.product-dropify-label{
    text-align:center;
    width: 100%;
}
.about-add-section{
    display: inline-block;
    position: absolute;
    right: 20px;
    top: 10px;
}
.detail-about-box{
    border-bottom: 1px solid #0098a3;
}
.delete-item{
    position:absolute !important;
    right:20px;
}
.picture-add-section{
    display: inline-block;
    position: relative;
    vertical-align: top;
    margin-left: 10px;
    margin-top: 20px;;
}
#picture-separated{
    display:inline-block;
}
#variant-separated{
    
}
.picture-add-btn > i{
    margin-top: 11px;
}
.variant-row{
    padding:20px;
}
.border-variant{
    border:1px solid #90bfc6;
    border-radius:10px;
    padding:10px;
}
.add-variant-btn{
    position: absolute;
    z-index: 100;
    background-color: #90bfc6;
    padding: 3px 1px 1px 10px;
    width: 35px;
    height: 35px;
    font-size: 20px !important;
    border-radius: 50%;
    color: #fff;
    margin-top: -8px;
    right: 50px;
    top: 20px;
}

.variant-block{
    display:inline-block;
    padding:20px;
    border:1px solid #90bfc6;
}
.variant-pic-block{
    width:30%;
    display:inline-block;
}
.variant-info-block{
    width:70%;
    display:inline-block;
}
.variant-info-block > p{
    display:block;
}
.variant-data{
    width:50px;
    height:50px;
    background-size:cover;
    background-position:center;
}
.detail-about-box{
    margin-top:10px;
}
.w-100{
    width:100%;
}
.desc-content{
    border-bottom:1px solid #d3d3d3
}
#add-benefit-point{
    padding:10px;
    background:#d3d3d3;
    text-align:center;
    color:#000;
}
.contact-headline {
    display: inline-block;
    width: 30%;
}
.contact-info {
    color: #fff;
    padding: 2px 10px;
}
.contact-info-unfollowed{
    background: #a83232;
}
.contact-info-followed{
    background: #32a852;
}
.contact-message {
    font-size: 11px !important;
}
.message-seperated{
    margin-top:10px;
    padding-top:5px;
}
.message-seperated-followed{
    border-top:1px solid #32a852;
}
.message-seperated-unfollowed{
    border-top:1px solid #a83232;
}
.page-wrapper.auth-page{
    background-color: #fff;
}
.auth-form{
    background: #fff;
    padding: 30px 25px;
    border-radius: 10px;
    box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;
}
.auth-form-title {
    display: flex;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    margin-bottom:35px;
}
.auth-form-title > img {
    width: 30%;
}
.auth-form-title-detail{
    margin-left: 20px;
}
.auth-form-title > .auth-form-title-detail > h3 {
    font-weight: bold;
}
.auth-form-title > .auth-form-title-detail > label {
    font-size: 13px !important
}