
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600&display=swap');

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;500;600&display=swap');


#filter_form_data{
    font-family: 'Poppins', sans-serif !important;
    font-style: normal;
    font-weight: 500;
    font-size: 16px;
    line-height: 22px;
    color: #061A20;
}
#filter_table,
#filter_table p,
#filter_table th,
#filter_table td,
.open > label >  p,
.dataTable,
.dataTable p,
.dataTable th,
.dataTable td,
.compant-text h5{
    font-family: 'Poppins', sans-serif !important;
}
#filter_table td.monst_font,
.dataTable td.monst_font,
#filter_table td.monst_font > p,
.dataTable td.monst_font > p{
    font-family: 'Montserrat', sans-serif !important;
}
#filter_table a{
    color:#148F81;
}
.filter_top_row{
    display: flex;
    justify-content: space-between;
    width: 100%;
    row-gap: 10px;
    align-items: center;
    flex-wrap: wrap;
}
.total_record{
    font-family: 'Poppins medium'!important;
    font-size: 16px;
    line-height: 22px;
    color: #061A20;
    text-align: right;
    margin-right: 10px;
    padding:10px 0px;
}
.total_record #total_count{
    margin-left:6px;
    color: #148f81;
}
.dataTables_empty{
    text-align: center !important;
}

.filter_top_inner_row{
    display: flex;
    column-gap: 10px;
    row-gap: 10px;
    flex-wrap: wrap;
}
.dataTable{
    min-height:65px;
}
.equal_width.posted_date{
    width: 140px;
}
.equal_width.remote_filter{
    width: 107px;
}
.equal_width.job_type_filter{
    width:117px;
}
.equal_width.location_filter{
    width:111px;
}
.filter_main select, .on_click{
    border: 1px solid #c2c2c2;
    padding: 9px 14px;
    border-radius: 5px;
    background: #F9FBFC;
}
.width_auto{
    width:auto !important;
}
.width_auto > i{
    margin-right:10px;
}
.on_click{
     padding:7px 12px;
     display: flex;
     justify-content: space-around;
     align-items: center;
}
.equal_width.experience_width{
    width:176px;
}
.salary_width{
    width:168px;
}

#filter_now, #reset_filter{
    font-family: 'Poppins Bold';
    border-radius: 5px;
}
#filter_now > i, #reset_filter > i{
    margin-left: 10px;
}


#filter_table thead th{
    font-style: normal;
    font-weight: 600;
    font-size: 20px;
    line-height: 24px;
    color: #061A20;
}

#filter_table tbody td{
    font-weight: 400;
    /*font-size: 16px;*/
    /*line-height: 26px;*/
    color:#7D9592;
}

#filter_table tbody td:last-child{
    line-height: 26px;
}

#filter_table #table100-head {
    padding: 20px 20px;
}

#filter_table thead tr{
    height:80px;
    background:#f9fbfc;
    color: #061A20;
}
table.dataTable thead>tr>th.sorting:before, table.dataTable thead>tr>th.sorting_asc:before{
    border: 2px solid #B3D7D3 !important;
    border-bottom: 0px !important;
    color:#148F81 !important;
    
}
table.dataTable thead>tr>th.sorting:after, table.dataTable thead>tr>th.sorting_asc:after{
    border: 2px solid #B3D7D3 !important;
    border-top: 0px !important;
    color:#148F81 !important;
}


.filter_checkbox.label{
    margin: 7px 0px;
}
.filter_checkbox.child{
    margin-left: 25px;
}
.filter_checkbox.label .checkmark{
    height: 17px;
    width: 17px;
    left: 0px;
    top: 2px;
    background: #ffffff;
}
.filter_checkbox.label p{
    margin-left: 24px;
    color:#7D9592;
    font-size: 14px;
    line-height: 22px;
    font-weight: 400 !important;
}
.filter_checkbox.label .checkmark:after {
    left: 4px !important;
    top: 0px !important;
    width: 7px !important;
    border-width: 0 1.8px 1.8px 0 !important;
}
.equal_width {
    position: relative;
}
tr.table100-head > th,
.dataTables_scrollBody{
    border:none !important;
    font-size:16.5px;
}
.dataTables_scrollBody::-webkit-scrollbar {
    width: 15px;
    height:1px;
}
.dataTables_scrollBody::-webkit-scrollbar-thumb {
    
    border-radius: 10px;
    background:#ACD7D1;

}
.open::-webkit-scrollbar{
    width: 4px;
}
.open::-webkit-scrollbar-thumb {
    
    border-radius: 10px;
    background:#ACD7D1;

}


.slider_filter_items h5{
    color: #148F81;
    font-size: 16px;
    line-height: 22px;
}
#annual_revenue_range,
#no_employee_range{
    background: rgba(231, 178, 28, 0.22);
    border-radius: 4px;
    height:10px;
}

#annual_revenue_range > div,
#no_employee_range > div{
    background: rgb(231, 178, 28);
}

#annual_revenue_range span.ui-state-active.ui-state-focus,
#no_employee_range span.ui-state-active.ui-state-focus{
    background: #ffffff;
}
#annual_revenue_range > span,
#no_employee_range > span{
    border: 8px solid #E7B21C !important;
    border-radius: 50%;
    top: -0.5em;
    width:1.4em;
    height:1.4em;
}
.slider_range_item label,
#annual_revenue_filter,
#no_employee_filter{
    color: #7D9592 !important;
    font-weight: 500 !important;
    font-size: 15.4521px !important;
    line-height: 19px !important;
    width:auto !important;
}



.filter_main{
    display: -webkit-box;   
    display: -moz-box;        
    display: -ms-flexbox; 
    display: -webkit-flex; 
    display:flex;
    flex-direction:row;
    column-gap:10px;
    row-gap: 10px;
    margin:20px 0px;
    flex-wrap: wrap;
    align-items:center;
}
.filter_toggle_main{
    width:20%;
    position:relative;
}




.on_click{
    display: -webkit-box;   
    display: -moz-box;        
    display: -ms-flexbox; 
    display: -webkit-flex; 
    display:flex;
    align-items: flex-start;
}

.on_click i{
    margin-left:10px;
    color:#8F8B8B;
   
}

.open{
   position: absolute;
    min-width: 181px;
    max-width:181px;
    padding: 10px;
    top: 40px;
    display: none;
    z-index: 9999;
    /*min-height: 200px;*/
    /*max-height: 300px;*/
    /*overflow-y: auto;*/
    /*overflow-x: hidden;*/
    box-shadow: 0px 0px 9px 1px #00000047;
    background: #ffffff;
    border-radius: 6px;
}
.equal_width{
    width: 170px;
    margin:5px 0px;
}
.position_relative{
    position: relative;
}


.open.active_item{
    display: block;
}
.filter_main select,
.on_click{
    cursor: pointer;
}
.open input{
    margin: 5px 0px;
}
.equal_width button{
    width: 100%;
}

/*table css*/
.limiter{
    width:100%;
    margin:0 auto
}
.container-table100{
    width:100%;
  
}

.table100{
    border:1px solid #C2C2C2;
    border-radius: 15px;
    overflow-x:auto;
}
table#filter_table{
    border-spacing:1;
    border-collapse:collapse;
    background:#fff;
    border-radius:20px;
    overflow:hidden;
    width:100%;
    margin:0 auto;
    position:relative;
}
table#filter_table *{
    position:relative
}

table#filter_table th, table#filter_table td{
    border:0px ;
}

table#filter_table tbody tr{
    height:100px;
    vertical-align: top;
}

table#filter_table td,table#filter_table th{
    text-align:left
}
.table100-head th{
    font-size:18px;
    color:#061A20;
    line-height:1.2;
}

.dataTables_scrollHead{
    background: #f9fbfc;
}

table#filter_table tbody tr:nth-child(even){
    background-color:#f9fbfc;
}
table#filter_table tbody tr{
    font-size:15px;
    line-height:1.2;
    font-weight:300;
}
table#filter_table tbody tr:hover{
    background-color:#f9fbfc;
    cursor:pointer
}
.margin_top_20{
    margin-top:20px;
}


#filter_table tbody tr{
    color: #7D9592 !important;
}
#filter_table tbody tr td:first-child a{
    color: #061A20 !important;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
}
#filter_table tbody tr td p{
    font-size:14px;
    font-weight:400 !important;
}



#filter_table tbody td:first-child {
    color: #061a20;
    font-weight: 500;
}

.label {
  display: block;
  position: relative;
  cursor: pointer;
  margin-bottom:0px;
  font-size: 22px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}

 /*Hide the browser's default checkbox */
.label input {
  position: absolute;
  opacity: 0;
  cursor: pointer;
  height: 0;
  width: 0;
}

 /*Create a custom checkbox */
.checkmark {
    position: absolute !important;
    top: 6px;
    left: 10px;
    height: 20px;
    width: 20px;
    background-color: #eee;
    border: 1px solid #8F8B8B;
    border-radius: 4px;
}

 /*On mouse-over, add a grey background color */
table#filter_table tbody tr:hover input ~ .checkmark {
  background-color: #F3EFE2;
  border-color:#E7B21C;
}

 /*When the checkbox is checked, add a blue background */
.label input:checked ~ .checkmark {
  background-color: #F3EFE2;
    border: 1px solid #E7B21C;
}

 /*Create the checkmark/indicator (hidden when not checked) */
.checkmark:after {
  content: "";
  position: absolute;
  display: none;
}

 /*Show the checkmark when checked */
.label input:checked ~ .checkmark:after {
  display: block;
}

 /*Style the checkmark/indicator */
.label .checkmark:after {
     left: 6px;
    top: 1px;
    width: 6px;
    height: 12px;
    border: solid #E7B21C;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}



.slider_filter_items{
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 100%;
    flex-wrap:wrap;
    /*overflow:hidden;*/
}
.slider_range_item{
    flex-basis:40%;
    margin-right:16px;
}
.slider_range_item input{
    min-width: 100% !important;
}


.clear_filter_btn{
    margin: 5px 0px; 
    /*flex-basis:37%;*/
    text-align:end;
}


#slider_filter_items input{
    min-width: 100% !important;
}
#filter_table thead tr th:first-child img{
        width: 100px;
        height: 35px;
    }
@media (max-width:768px){
    #filter_table thead tr th:first-child{
        padding:10px;
    }
    .dataTables_scrollBody::-webkit-scrollbar {
    width: 4px;
    height:4px;
}
    
    /*.clear_filter_btn{*/
    /*    flex-basis:unset;*/
    /*}*/
    .slider_filter_items{
        flex-direction: column;
        align-items: flex-start;
         margin: 20px 0px;
    }
    .slider_range_item {
        max-width: 90%;
        width: 100%;
        margin: auto;
    }
}
@media(max-width:576px){
    .container-table100{
        padding-left:15px;
        padding-right:15px
    }
}




table.dataTable thead th {
  background: transparent !important;
  /*white-space: nowrap;*/
}

table.dataTable thead span.sort-icon {
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-left: 10px;
  padding-left: 18px;
  outline: 1px solid #B3D7D3;
  border-radius: 2px;
  margin-bottom: -2px;
  
}



 table.dataTable thead>tr>th.sorting:before, table.dataTable thead>tr>th.sorting_asc:before,
table.dataTable thead>tr>th.sorting:after, table.dataTable thead>tr>th.sorting_asc:after{
    content:unset;
}
table.dataTable thead .sorting span { background: url('image/sort_both.png') no-repeat center right; }
table.dataTable thead .sorting_asc span { background: url('image/up_active.png') no-repeat center right; }
table.dataTable thead .sorting_desc span { background: url('image/down_active.png') no-repeat center right; }

table.dataTable thead .sorting_asc_disabled span { background: url('image/sort_asc_disabled.png') no-repeat center right; }
table.dataTable thead .sorting_desc_disabled span { background: url('image/sort_desc_disabled.png') no-repeat center right; }




@media (min-width:1024px){
    .dataTables_scrollHeadInner,
    .dataTable {
        width: 100% !important;
    }
}
@media only screen and (max-width: 912px) and (min-width: 768px)  {
    .compant-text{
        width:100%;
    }
}
