@media screen and (min-width:1200px) and (max-width:1287px) {
  .user-col{
    width: 33%!important;
  }
}
@media screen and (max-width:1100px) {

.content{
  padding-left: 0px;
}



.content.collapse-div{
  padding-left: 0px;
}

.dt-length{
  display: none;
}
.sidebar{
  width: 0;
  opacity: 0;
  visibility: hidden;
}

.sidebar.collapse-div{
  opacity: 1;
  visibility: visible;
  width: 116px;
  overflow-x: auto;
}
.sidebar.collapse-div .submenu.show{
  opacity: 1;
  visibility: visible;
}
.sidebar.collapse-div .collapse-span, .sidebar.collapse-div .sidebar-ul-child{
  display: block;
}


}


@media screen and (max-width: 767px) {
  .head-div{
    padding: 5px 10px 5px 10px;
    /* height: 60px; */
  }
  .main-body {
    /* padding-top: 0; */
    /* margin-top: 60px; */
  }
  .sidebar{
    /* inset: 60px 0 0; */
    /* height: 100vh; */
  }
  div.dt-container div.dt-layout-row:not(.dt-layout-table){
    display: flex;
    /* flex-direction: column;
    align-items: flex-start; */
    /* justify-content: space-between; */
  }


  .logo-sec{
    /* width: 120px; */
    flex-basis: 90px;
    flex-shrink: 0;
  }
  .logo{
    display: none;
  }
  .logo-sm{
    display: block;
  }
  .icons-head{
    width: auto;
    margin-left: 10px;
    gap: 15px;
  }
  .search-bar{
    width: 30px;
    /* overflow: hidden!important; */
    margin-left: auto;
    padding: 5px;
    border-color: #fff;
    transition: all var(--transition-time) ease;
  }
  .search-bar .input-search{
    display: none;
  }
  .search-bar:hover .input-search{
    display: block;
  }
  .search-bar:hover{
    width: 180px;
    border-color: var(--light-color);
  }
  .search-bar:hover .search-drop{
    transition-delay: .5s;
    width: 250px;
    left: -50px;
  }
  #expandScreen{
    display: none;
  }
  .quick-icon{
    display: none;
  }
  .dropdown-div-item.user-drop{
    width: 160px;
  }

  /* .dt-layout-cell{
    display: flex;
    justify-content: center;
  } */
  div.dt-container > div.dt-layout-row div.dt-layout-cell.dt-layout-start{
    display: none;
  }
  .dt-layout-row{
    display: flex;
    justify-content: center!important;
  }




  .chart-body {
    display: flex;
    flex-direction: column;
  }
  .legend-box {
    width: 100%;
  }
  .chart-header {
    display: flex;
    flex-direction: column;
    gap: 20px;
  }
}

@media screen and (min-width: 0px) and (max-width: 480px) {
  .search-bar{
    /* width: 120px; */
    padding-inline: 8px;
    /* display: none!important; */
  }
  .input-search::placeholder{
    font-size: 12px!important;
  }
  .search-bar:hover{
    width: 120px;
  }
  .dropdown-div-item.user-drop{
    right: 0px;
  }
  .dropdown-div-item.notification{
    width: 280px;
    right: -30px;
  }
}