/**********- PC LG VIEW -***********/ 
@media screen and (max-width: 1600px){
    .data-list .data-item.status{width:18%}
    .data-list .data-item.sessions{width: 22%;}
    .data-list .data-item.number{width:10%}
    .data-item.search {width: 30%;}
    


}
/**********- PC LG VIEW -***********/ 
@media screen and (max-width: 1400px){
    .data-list .data-item.number{width:12%}
    .data-list .data-item.status{width:20%}
    .data-list .data-item.sessions{width: 26%;}
    .data-list .data-item.date{width: 19%;}
    .data-item.search{width: 43%;}
    .data-list .data-item{max-width: calc(43% - 20px);}
    .data-list .data-item-two{max-width: calc(43% - 20px);}

}

/**********- PC VIEW -***********/ 
@media screen and (max-width: 1200px){
    /* .search-option{margin: 15px 0 0;} */
    .data-list .data-item.status{width:25%}
    .data-list .data-item.number{width:16%}
    .data-list .data-item.sessions{width: 32%;}
}
/**********- TABLET VIEW -***********/ 
@media screen and (max-width: 991px){
    .topbar #sidebarToggleTop{display: none !important;}
    .sidebar .nav-item.dropdown.show .dropdown-toggle::after, .topbar .nav-item.dropdown.show .dropdown-toggle::after{display: none;}
    .sidebar .nav-item.dropdown .dropdown-toggle::after, .topbar .nav-item.dropdown .dropdown-toggle::after{display: none;}
    .navbar-nav .dropdown .dropdown-menu.show{    transform: translate(-70%,0) !important}
    .navbar-nav .dropdown .dropdown-menu{transform: translate(-70%,50px) !important}
    .sidebar .nav-item .nav-link{text-align: left !important;}
    .search{width: 100%;}
    .table-responsive{overflow-x: auto !important;}
    /* .daterangepicker{left: 20px !important;} */
    .data-list .data-item.status{width:36%}
    .data-list .data-item.date{width:30%}
    .data-list .data-item.number{width:19%}
    .data-list .data-item{width:60%;max-width:calc(60% - 20px)}
    .title{font-size: 25px;}
    /* .num-drop .dropdown .dropdown-toggle{font-size: 14px;}
    .date .date-inner .date-input{font-size: 14px;}
    .search .search-inner .search-input{font-size: 14px;} */
    .data-list .data-item {
        width: 100%;
        max-width: calc(100% - 20px);
    }
    .data-list .data-item.sessions{width: 47%;}
    .data-list .data-item-two{width: 100%;max-width: calc(100% - 18px);}
    .item-media{margin: 0 0 10px;}
    .loe-uploaded-content{margin: 10px 5px;}
    .range{font-size: 14px;}
}
/**********- MOBILE VIEW -***********/ 
@media screen and (max-width: 767px){
    .date,.num-drop{margin: 0 0 15px;}
    /* .search-option{margin: 0;} */

}
/**********- MOBILE SM VIEW -***********/ 
@media screen and (max-width: 480px){
    /* .sidebar .nav-item .nav-link[data-toggle=collapse].collapsed::after{display: none;} */
    .navbar-nav .dropdown .dropdown-toggle{padding-right: 5px !important;}
    .topbar.navbar-light .navbar-nav .nav-item .nav-link{padding: 0 7px;}
    .sidebar-btn #sidebarToggle{font-size: 20px;}
    .sidebar{width:200px!important;position:absolute;z-index:10}
    .sidebar.toggled{width:0!important}
    .menu-overlay{position:fixed;z-index:2;top:0;left:0;width:100%;height:100%;background-color:rgba(0,0,0,0.3);opacity:1;visibility:hidden;cursor:pointer;}
    .menu-overlay.active{opacity:1;visibility:visible}
    .sidebar{height:100%;width:200px!important;position:fixed;z-index:10;top:0;overflow:auto}
    .sidebar .nav-item .collapse{position: relative;left: 0;}
    .sidebar .nav-item .nav-link span{width: 70%;max-width: calc(70% - 0px);font-size: 15px;font-weight: 500;}
    .sidebar .nav-item .collapse .collapse-inner{margin: 0 10px;}
    .pagination{justify-content: flex-start !important;}
    .title{font-size: 18px;}
    .data-list .data-item.status{width:100%}
    .data-list .data-item.date{width:100%}
    .data-list .data-item.number{width:100%}
    .data-list .data-item{width:100%;max-width:calc(100% - 20px);margin:0}
    .search .search-inner{margin:0}
    .data-list{justify-content:center}
    .data-list .data-item.search{margin-bottom: 20px;}
    .data-list .data-item.sessions{width:100%;}
    .card-body{padding: 10px;}
    .option-mb{margin-bottom: 20px;}
    .data-list .data-item-two{margin: 0 0 15px;}
}