.hidden {
  display:none;
}
.sidebar {
    position: fixed;
    top: 40px;
    bottom: 0;
    left: 0;
    z-index: 100; /* Behind the navbar */
    padding: 0;
    box-shadow: inset -1px 0 0 rgba(0, 0, 0, .1);  
}

.client.delete {
    background-color: #ffaaaa;
  }

  .client.added {
    transition: all 1s;
    background-color: #aaffaa;
  }

  .client {
    transition: all 1s;
  }

  .boldLabel {

  }


  .bold {
  font-weight:bold;
  color:green;
}
  #globalCodeBackup label {

  }


  .toast {
    z-index:1000;
  }

  #userEmail {margin-left:10px;}


  @media screen and (max-width:768px) {
    #userName {display:none;}
    #offerLogout { padding-left:15px;}
  }
  

.panel-heading.note-toolbar {
  background-color:#eee;
}

#loadingDiv {
  width: 100%;
  text-align: center;
  position: fixed;
  top: 50%;
}

.link { cursor:pointer; color:blue;}
.link:hover {text-decoration:underline;}

.docSearch {margin-right: 10px;
  border-radius: 5px;
  padding: 2px;
  margin-left: 10px;
  background-color: #ddd;}

  #DocumentsSubFolders {margin-left:10px;}

  .indent {display:inline-block; width:20px;}

  #orgChart .orgChart { width:100%; height:92vh; border:1px solid #eee; border-radius:5px; margin-bottom:1%; overflow:hidden;position:relative; }
  #orgChart .noManager {margin-right:0.5%;}
  #orgChart .exEmployees {margin-left:0.5%;}
  #orgChart .noManager, #orgChart .exEmployees { display:none; width:49.5%; height:20vh; border:1px solid #eee; border-radius:5px; overflow:hidden; }
  #orgChart .orgChart .container, #orgChart .noManager .container, #orgChart .exEmployees .container { min-height:100%; overflow-y:scroll; margin-top:25px; margin-left:0; margin-right:0; max-width:100%; width:100%;height:100%; }

  #orgChart .orgChart:before {content:'Org-chart'; position:absolute; font-size: 8px;background-color:#eee; padding:5px;border-radius:5px;}
  #orgChart .noManager:before {content:'No manager'; position:absolute; font-size: 8px;background-color:#eee; padding:5px;border-radius:5px;}
  #orgChart .exEmployees:before {content:'Ex-employees'; position:absolute; font-size: 8px;background-color:#eee; padding:5px;border-radius:5px;}
  .orgChartUser[draggable=true] {cursor:grab;}
  .orgChartUser.makeManager {outline:2px dashed red;}
  .orgChartUser.manager {border:2px solid #777;}
  .orgChartUser.manager delete {display:none;}
  .orgChartUser {position:relative; border:1px solid #aaa; border-radius:5px; padding:5px; margin:5px; display:inline-block;}
  .orgChartUser name  {margin-right:10px;font-size:10px; display:block;font-weight:bold;}
  .orgChartUser jobTitle, .orgChartUser grade, .orgChartUser reportsTo {font-size:10px;display:block;}
  .orgChartUser delete {display:none; position:absolute; width:10px; height:10px; cursor:pointer;right:-17px; top:0px; }
  .orgChartUser delete:before { display:block; position:absolute; content:''; transform:rotate(45deg); border-left:2px solid red; height:10px; width:2px; }
  .orgChartUser delete:after { display:block; position:absolute; content:''; transform:rotate(-45deg); border-left:2px solid red; height:10px; width:2px; }

  #orgChart .orgChart .orgChartUser  {position:absolute; transform: translate(-50%); background-color:#eee; display:flex; min-width:200px;}
  .orgChartUser.manager name {margin-right:0;}
  #orgChart .orgChart .container .background {width:100%; height:100%; padding:0; margin:-20px 0;}

  .orgChartUser icon img {width:60px; border-radius:60px;min-height:60px;}
  .orgChartUser .userIcon {width:70px;}

  .orgChartUser .userIcon, .orgChartUser .userDetails {display:inline-block; line-height:12px;}

  .orgChartAdmin delete, .orgChartAdmin #orgChart .noManager, .orgChartAdmin #orgChart .exEmployees {display:inline-flex;}
  .orgChartAdmin #orgChart .orgChart { height:70vh; }
  #orgChart a {font-size:10px;display:block;text-decoration:underline;}

  .sidebar-sticky { height:100%; }

  .nav {
    flex-wrap:nowrap;
    height:100%;
    overflow-y:auto;
  }

  #offerLogin {
    text-align: center;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
  }


  .burgerMenu { display:none; color:white; margin-left:10px;}


  @media screen and (max-width:768px) {
    nav.sidebar { display:none; }
    .showMenu nav.sidebar { display:inline-block; z-index:100000;position:relative; top:0;}
    .showMenu main {display:none;}
    .burgerMenu { display:inline-block; color:white;margin:15px;}
    .burgerMenu a { color:white; }
  }