@media (max-height: 680px) {
   
   .left-bar > ul{
        overflow-y: auto;
        height: 700px;
   }

}
/* ==========================================================================
   *Large devices (desktops, 992px and up)*
   ========================================================================== */
@media (min-width: 992px) and (max-width:1199px) {
    
    
    
}


/* ==========================================================================
   *Medium devices (tablets, 1400px and down)*
   ========================================================================== */
@media (max-width: 1400px) {
    .dash-four-box { padding: 20px; text-align: center;}
    .dash-four-box span { position: static; margin-bottom: 15px;}
    .left-bar > ul > li > a { padding: 10px 0;}
}


/* ==========================================================================
   *Medium devices (tablets, 1200px and down)*
   ========================================================================== */
@media (max-width: 1200px) {
    .right-block { margin-left: 0px;}
    .left-bar { width: 260px;}
    .left-bar > ul > li > a { font-size: 16px;}
    .wraper { padding: 0 15px; padding-left: 280px; padding-top: 77px;}
    .dash-top-left { padding: 30px;}
    .dash-top-left h1 { font-size: 32px;}
    span.profile-icon { position: static; margin-bottom: 15px;}
    .dash-four-box h3 { font-size: 32px; line-height: 32px;}
    .copy-right { padding-left: 0px;}
    .check-lists li { margin-right: 20px;}
    
    .commen-box { margin-left: 0px; margin-right: 0px;}
}



/* ==========================================================================
   *Medium devices (tablets, 991px and down)*
   ========================================================================== */
@media (max-width: 991px) {
    .dash-top-right { margin-top: 20px;}
    .dash-four-block { margin-top: 0px;}
    .dash-four-box { margin-top: 20px;}
    .dash-top-left { text-align: center;}
    span.profile-icon { display: inline-block;}
    .dash-table-block .table-responsive { overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar;}
    .dash-table-block .table-responsive table { width: 800px;}
    .dash-table-block .table-responsive::-webkit-scrollbar { width: 5px; height: 5px;}
    .dash-table-block .table-responsive::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.3); box-shadow: inset 0 0 4px rgba(0,0,0,0.3);}
    .dash-table-block .table-responsive::-webkit-scrollbar-thumb { background-color: #4d4d4d; outline: 1px solid slategrey;}
    
    .wraper { padding-left: 280px;}
 
    .left-bar::-webkit-scrollbar { width: 5px;}
    .left-bar::-webkit-scrollbar-track { -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.3); box-shadow: inset 0 0 4px rgba(0,0,0,0.3);}
    .left-bar::-webkit-scrollbar-thumb { background-color: #4d4d4d; outline: 1px solid slategrey;}
    .left-bar > ul > li > a span { font-size: 21px;}
    .left-bar > ul > li > a span.icon-icon-3 { font-size: 28px;}
    .add-career-input { margin-bottom: 10px;}
    
    .accept-top-box .table-responsive { display: block; width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; -ms-overflow-style: -ms-autohiding-scrollbar;}
    .accept-top-box .table-responsive .table { width: 900px !important;}
    .add-career-box.all-port-box .dataTables_wrapper .dataTables_filter { margin-right: 0px;}
    .add-new-staff-btn-div { display: block; position: static; margin-bottom: 5px;}
    
    
    /* ==========================================================================
       New Login Page 23-09-2019
       ========================================================================== */
    .new-login-wraper { width: 100%; padding: 15px; height: auto;}
    .new-login-wraper .new-log-in-right-box { padding: 40px 20px;}
    
    
    
    .commen-box { margin-top: 20px;}
    
}

/* ==========================================================================
   *Small devices (landscape phones, less than 768px)*
   ========================================================================== */ 
@media (max-width: 767px) {
    
    .login-wraper { width: 100%; padding: 15px;}
    .log-in-head { padding: 15px; display: block !important; text-align: center;}
    .log-in-head h4 { text-align: center; margin-top: 10px;}
    .log-in-content { padding: 25px;}
    .login-btns { text-align: center;}
    .login-right-btn ul { text-align: center; margin-top: 15px;}
    .log-in-input p { margin-bottom: 5px;}
    .login-content-bottom p br { display: none;}
    
    .wraper { padding: 0 15px; padding-top: 113px;}
    .left-bar { position: static; width: 100%; padding: 15px; height: auto;}
    .left-bar > ul { height: auto;}
    .dash-top-left { padding: 20px;}
    .dash-top-left h1 { font-size: 26px;}
    .right-block {}
    .header { display: block !important; text-align: center; padding: 10px 15px;}
    .logo { margin-bottom: 10px;}
    .right-block {  margin-top: 20px; padding-top: 0px;}
    
    .add-new-staff-btn-div { text-align: center;}
    .add-career-box h3 { text-align: center;}
    .log-in-input { margin-bottom: 10px;}
    .login-right-btn ul li { margin-left: 0px;}
    .new-login-wraper .log-in-head h3 { font-size: 28px; line-height: 28px;}
    .new-login-wraper .log-in-head p { font-size: 16px;}
    
    
    /* ==========================================================================
       New Login Page 23-09-2019
       ========================================================================== */
    .new-login-wraper .new-login-logo { padding: 40px 20px;}
    
    
    
}

/* ==========================================================================
   *Extra small devices (portrait phones, less than 576px)*
   ========================================================================== */ 
@media (max-width: 575px) {
    
    
}

/* ==========================================================================
   *Extra small devices (portrait phones, less than 400px)*
   ========================================================================== */ 
@media (max-width: 400px) {
    
    
    
}
