.loading-msg-overlay {
  position: absolute;
  top: 0;
  bottom: 0;
  width: 100%;
  /* background: rgba(0,0,0,.4); */
}

client__row {
  padding-top: 1rem;
  border-bottom: 1px solid rgba(255,255,255,.2);
}

client__dropdown {
  display: inline-block;
  /* width: 22rem; */
  /* height: 100%; */
  padding-left: 1.5rem;
  font-size: 1.5rem;
  /* background: 0 0; */
  color: #000000e7;
}

ul{
    margin: 0;
    padding: 0;
    list-style: none;
  }

  .mobileViewHide{

  }
  


::-webkit-scrollbar
{
  height: 10px;  
	width: 10px;
	background-color: white;
}

::-webkit-scrollbar-thumb
{
	border-radius: 4px;
	background-color: #FFF;
	background-image: -webkit-linear-gradient(top,
											  #e4f5fc 0%,
											  #bfe8f9 50%,
											  #9fd8ef 51%,
rgb(40 95 143) 100%);
}

::-webkit-scrollbar-track {
  -webkit-box-shadow: inset 0 0 6px rgba(196, 119, 75, 0.3); 
  -webkit-border-radius: 10px;
  border-radius: 10px;
}
/* Test */
#hes-breadcrumbs {
  border: 1px solid #cbd2d9;
  border-radius: 0.3rem;
  display: inline-flex;
  overflow: hidden;
}

#hes-breadcrumbs a {
  background: #fff;
  color: #333;
  outline: none;
  padding: 0.75em 0.75em 0.75em 1.25em;
  position: relative;
  text-decoration: none;
  font-size: small;
  transition: background 0.2s linear;
}

#hes-breadcrumbs a.current {
  background: #f47b20;
  color: #fff;
}

#hes-breadcrumbs a:hover:after,
#hes-breadcrumbs a:hover {
  background:  #f47b20;
  color: #fff;
}

/* #hes-breadcrumbs a:focus:after,
#hes-breadcrumbs a:focus,
#hes-breadcrumbs a.current:focus {
  background: #323f4a;
  color: #fff;
} */

#hes-breadcrumbs a:after,
#hes-breadcrumbs a:before {
  background: white;
  bottom: 0;
  clip-path: polygon(50% 50%, -50% -50%, 0 100%);
  content: "";
  left: 100%;
  position: absolute;
  top: 0;
  transition: background 0.2s linear;
  width: 1em;
  z-index: 1;
}

#hes-breadcrumbs a:before {
  background: #cbd2d9;
  margin-left: 1px;
}

#hes-breadcrumbs a:last-child {
  border-right: none;
}

#hes-breadcrumbs a.is-active {
  background: #edf1f5;
}



  .serverDatetime {
    font-size: 20px;
    font-weight: bolder;
  }

  @media screen and (min-width: 0px) and (max-width: 400px) {
    #hes-breadcrumbs { display: none; }  /* hide it on small screens */
    /* .pageheader {display: none !important;} */
    .mobileViewHide {display: none;}
    .pagination {font-size: xx-small;}
    .serverDatetime {font-size: 80%;}
    .layout-row{display: inline-grid;}
  }



  /* nav bar horizontal */
  .topnav {
    overflow: hidden;
    border-bottom: 1px solid rgb(0,11,47);
  }
  
  .topnav a {
    float: left;
    color: rgb(244,123,32);
    text-align: center;
    padding: 14px 16px;
    text-decoration: none;
    font-size: 17px;
  }
  
  .topnav a:hover {
    background-color: rgb(244,123,32);
    color: white;
  }
  
  .topnav a.active {
    color: rgb(0,11,47);
    background-color: white;
    font-size: 18px;
    font-weight: 600;

  }
  
  .topnav-right {
    float: right;
  }


  /* test grid*/
  
  thead th {
    position: -webkit-sticky; 
    position: sticky;
    top: 0;
    background: rgb(40 95 143);
    color: #FFF;
  }
  
  thead th:first-child {
    left: 0;
    z-index: 1;
  }
  
  tbody th {
    position: -webkit-sticky; 
    position: sticky;
    left: 0;
    background: #FFF;
    border-right: 1px solid #CCC;
  }
  

  /* hes loader */
  .hand {
    width: 25%;
    min-width: 15em;
    text-align: center;
    margin: 20% auto;
    padding: 0;
    border-bottom: .25em solid #70e94e;
  }
  .thumb {
    display: inline-block;
    width: 1em;
    height: 1.5em;
    /* background-color: #bb357a; */
    /* margin: 1em .75em 0 .25em;
    border-left: .5em solid #dc84b1; */
    border-radius: 25% 15% 15% 40%;
  }
  .finger {
    display: inline-block;
    width: 1.5em;
    height: 2.5em;
    background-color: #bb357a;
    margin: 0 .25em;
    border-bottom: .5em solid #dc84b1;
    border-left: .25em solid #ab3070;
    border-radius: 15% 15% 25% 25%;
    animation-name: tap;
    animation-duration: 1s;
    animation-iteration-count: infinite;
  }
  
  .finger:nth-child(2) {
    animation-delay: .8s;
  }
  .finger:nth-child(3) {
    animation-delay: .7s;
  }
  .finger:nth-child(4) {
    animation-delay: .6s;
  }
  .finger:nth-child(5) {
    animation-delay: .5s;
  }
  
  @keyframes tap {
    0% {
      transform: translateY(0);
    }
    
    60% {
      transform: translateY(-1em);
    }
    
    70% {
      transform: translateY(0);
    }
    100% {
      transform: translateY(0);
    }
  }


  /* dynamic forms */
  
  .formly-field {
    margin-bottom: 16px;
  }
  
  .formly-error-summary {
    margin-bottom: 20px;
  }
  
  .color-error {
    color: #a94442;
  }
  
  .color-success {
     color: #3c763d
  }
  
  /* messages fanciness */
  .form-error-messages {
    position: relative;
  }
  
  .form-error-messages, .form-error-message {
    opacity: 1;
    transition: .3s linear all;
  }
  
  .form-error-message {
    font-size: .8em;
    position: absolute;
    width: 100%;
    color: #a94442;
  }
  
  .form-error-messages.ng-enter.ng-enter-active,
  .form-error-message.ng-enter.ng-enter-active {
    opacity: 1;
    top: 0;
  }
  
  .form-error-messages.ng-enter,
  .form-error-message.ng-enter {
    opacity: 0;
    top: -10px;
  }
  
  .form-error-messages.ng-leave,
  .form-error-message.ng-leave {
    opacity: 1;
    top: 0;
  }
  
  .form-error-messages.ng-leave-active,
  .form-error-message.ng-leave-active {
    opacity: 0;
    top: -10px;
  }

  /* Pulsing Button */
  @keyframes pulse {
    from { transform: scale(1); }
    50% { transform: scale(0.85); }
    to { transform: scale(1); }
  }
  
  .fe-pulse {
    animation-name: pulse;
    animation-duration: 3s;
    animation-iteration-count: infinite;
  }