.tableDash .btn-success{
    width: auto !important;
}
.dataTables_wrapper input{
    margin-bottom: 8px;
}
.u-costomized{
    width: 100%;
}
.modelOverview, .materialOverview,.modalContainer, .headStone_modalContainer, .u-pr-modal{
    margin-top: 3rem;
}
.overviewHeader button {
    padding: 0.3rem 0.8rem;
}
.searchBox, .u-compent-select-container, .modalHeader h2 {
    width: 27rem;
    margin: 0.5rem;
}
.done,.cancel{
    width: 4rem;
}
.u-input-contain{
    align-items: flex-start;
}
@media only screen and (max-width:1220px){
.r-debtors-table{
    overflow-x: scroll !important;
}
.modalHeader {
    height: auto;
    justify-content: space-between;
    align-items: flex-start;
    flex-wrap: wrap;
}
.r-factor-sec{
    overflow-x:scroll;
}
.r-factor-sec table{
    width: 100rem !important;
}
}
@media only screen and (max-width:1100px){
.r-table-responcive{
    overflow-x: scroll;
}
.r-table-responcive table{
    width: 70rem;
}
.check-container {
    flex-direction: column;
    align-items: center;
}
.table-container {
    width: 98%;
    overflow-x: scroll;
}
.table-container table{
    width: 70rem !important;
}
.r-order-cost-res{
    overflow-x: scroll;
}
.r-order-cost-res table{
    width: 40rem !important;
}
.modal-dialog {
    margin: auto;
}
.modal-body label {
    width: 100% !important;
}
.modal-content{
    margin-top: 4rem;
}
.r-login-logo{
    height: 48vh !important;
}
.table-box {
    width: 31.3%;
}
}
@media only screen and (max-width:1000px){
    .staticpage{
        flex-direction: column;
    }
    .r-profile{
        flex-direction: column;
    }
    .r-profile :where(label,input,.u-input-contain,div){
        width: 100% !important;
    }
    .r-profile label{
        margin-bottom: 10px;
    }
    .r-saleman-res{
        width: 100% !important;
        flex-direction: column;
    }
    .r-saleman-res select{
        width: 100% !important;

        margin-bottom: 10px;
    }
    .r-column-res{
        flex-direction: column;
        align-items: center;
    }
    .r-column-res :where(.col-5,.col-7){
        width: 100% !important;
    }
    .r-column-res .col-5{
        margin-top: 1rem;
    }
    .r-saleman-res{
        /* width: 95% !important; */
    }
    .userInfoColumn {
        width: 97%;
    }
    .r-factor-header{
        flex-direction: column;
        align-items: center;
    }
}
@media only screen and (max-width:900px){

    .u-searchSection form{
        flex-wrap: wrap;
    }
    .searchSection{
        align-items: center;
    }
    .u-filter {
        width: 33.3%;
    }
    .u-search{
        width: 5rem;
    }
    .searchSection h5 {
        width: 97%;
    }
    .tableDash{
        overflow-x: scroll !important;
        display: inline-block !important;
    }
    .tableDash table{
        width: 100rem;
    }
    .dataTables_wrapper .dataTables_length, .dataTables_wrapper .dataTables_filter {
        text-align: start;
    }
    .dataTables_filter :where(input,label){
        width: 99%;
    }
    .r-customize-table{
        overflow-x: scroll;
    }
    .r-customize-table table{
        width: 90rem !important;
    }
    .u-header-des {
        align-items: center;
        flex-direction: column;
    }

    .r-overview-sec button{
        padding: 0.5rem 0;
        margin-bottom: 0.5rem;
    }
    .r-order-sec{
        flex-direction: column;
    }
    .r-order-btn{
        width: 100%;
    }
    .r-order-table{
        overflow-x: scroll;
    }
    .r-order-table table{
        width: 50rem !important;
    }
    .r-refrence-sec{
        margin: 0.5rem;
    }
    .stones,.models, .material {
        width: 18%;
    }
    .staticpage{
        flex-direction: column;
    }
    .modal-block-container{
        align-items: flex-start;
        overflow-x: scroll;
    }
    .modal-block-container table{
        width: 50rem;
    }
    .modal-block-container .u-pagetitle{
        width: 37rem;
    }
    .table-box .tableDash{
        overflow-x: hidden !important;
    }
    .u-search input[type="submit"]{
        width: fit-content;
    }
    .sit-tool{
        display: none !important;
    }
    .tools-btn{
        display: flex;
    }
}
@media only screen and (max-width:800px){
    .table-box {
        width: 48%;
    }
}
@media only screen and (max-width:750px){
    .no-footer{
        width: 100%;
        overflow-x: scroll;
    }
    .datatable{
        width: 50rem !important;
    }
    .tab-pane .col-6{
        width: 100%;
    }
    .nav-tabs-bordered{
        overflow-x: scroll;
        overflow-y: hidden;
        flex-wrap: nowrap;
        align-items: flex-end;
    }
    .nav-tabs-bordered li{
        width: 10rem;
        margin-bottom: 2px;
    }
    .r-service-table,.api-custome-row-model{
        overflow-x: scroll;
    }
    :is(.r-service-table,.u-component-table,.modalTable) table{
        width: 50rem !important;
    }
    .r-order-cost-res table{
        width: 40rem !important;
    }
    .r-table-sec-res{
        overflow-x: scroll;
        display: block !important;
    }
    .r-table-sec-res table{
        width: 40rem !important;
    }

}
@media only screen and (max-width:550px){

    .u-filter {
        width: 50%;
    }
    .stones,.models,.material{
        width: 31%;
    }
    .modal-dialog {
        max-width: 95% !important;
    }
    .u-factor-title{
        font-size: 20px;
    }
    .search-filter {
        position: initial;
    }
}
@media only screen and (max-width:450px){
    .u-filter {
        width: 100%;
    }
    .u-search{
        width: 100%;
    }
    .r-overview-sec button{
        width: 100%;
        margin-top: 0.5rem;
    }
    .r-cutomize-info{
        display: flex;
        flex-direction: column;
    }
    .r-cutomize-info div{
        padding: 0;
        margin-bottom: 0.3rem;
    }
    .r-cutomize-info p{
        width: 100% !important;
        padding: 0.5rem 3%
    }
    .r-order-btn .api-btn-action{
        width: 100%;
        display: flex;
        flex-direction: column;
        align-items: center;
    }
    .r-order-btn button{
        width: 40%;
        margin-bottom: 0.5rem !important;
    }
    .chat-online-box{
        width: 95% !important;
    }
    /* .r-login-logo{
        height: 54vh !important;
    } */
    .table-box {
        width: 98%;
        /* height: 500px; */
    }

    .show-table-btn{
        display: none !important;
    }
    .search-box {
        display: inline;
    }
    .table-box .tableDash{
        overflow-x: scroll !important;
    }
    .pagination-table {
        display: flex;
    }
}
@media only screen and (max-width:394px){
.searchBox{
    height: 30%;
}
.searchBox input,.searchBox label{
    height: 100%;
}
.r-login-logo{
    height: 53vh !important;
}
}

@media only screen and (max-height:1370px){
    /* .login-container{
        width: 90% !important;
    }
    .login-container-fluid .cart-form{
        width: 90% !important;
    } */
    .r-login-logo{
        height: 68vh !important;
    }
}
@media only screen and (max-height:1190px){
    .r-login-logo{
        height: 63.5vh !important;
    }
}
@media only screen and (max-height:1050px){
    .r-login-logo{
        height: 58vh !important;
    }
}
@media only screen and (max-height:940px){
    .r-login-logo{
        height: 55vh !important;
    }
}
@media only screen and (max-height:920px){
    .r-login-logo{
        height: 54vh !important;
    }
}
@media only screen and (max-height:910px){
    .r-login-logo{
        height: 56vh !important;
    }
}
@media only screen and (max-height:600px){
    .r-login-logo{
        height: 73vh !important;
    }
}
@media screen and (max-width: 500px)  {
    .search-filter{
        position: relative !important;
        top: 0;
    }
    .table-box-header{
        width: 1200px !important;
    }
    .tableDash{
        overflow: scroll;
    }
    .tableDash table{
        width: 1200px !important;
    }
    .table-box{
        display: flex !important;
    }
    .table-box table{
        width: 1200px !important;
    }
    .pagination{
        display: flex;
        flex-wrap: wrap;
    }
    .title-search{
        display: block;
        margin: 14px 0;
    }
    .containers-link{
        flex-wrap: wrap;
    }
}