/*           This is new css for new custom  hr_portal     */

#suggesstion-box {position: relative;}
#suggesstion-box #emp_list {margin: 0px;padding: 0px;border: 1px solid #e1e1e1;}
#suggesstion-box .emplist {list-style: none;padding: 7px;border-bottom: 1px solid #e1e1e1;}
#suggesstion-box .emplist:hover {background-color: #f1f1f1;}

.clock { width: 70%;margin-left: 30px;  display: flex; flex-direction: column; justify-content: center; align-items: center; background-color: #ffffff; }

 .time { font-size: 20px;font-weight: bold;color: #000; }

 .date-time { font-size: 10px; color: #fff; }

  @media screen and (max-width: 768px) {  .time { font-size: 10px; } }

/***********************************************/
.birthday-alert {
  color: #fff;
  font-size: 18px;
}
.birthday-alert .avatar {
  width: 100% !important;
  max-width: 100px !important;
  height: 100px !important;
  object-fit: cover;
  border: 5px solid #fff;
}
.birthday-alert table tr td {color:#ffffff !important;}
.bg-birthday1 {background: #27005D;}
.bg-birthday2 {background: #088395;}
.bg-birthday3 {background: #35A29F;}

.anniversary-alert {
  color: #fff;
  font-size: 18px;
}
.anniversary-alert .avatar {
  width: 100% !important;
  max-width: 100px !important;
  height: 100px !important;
  object-fit: cover;
  border: 5px solid #fff;
}
.anniversary-alert  table tr td {color:#ffffff !important;}
.bg-anniversary1 {background:#793FDF;;}
.bg-anniversary2 {background:#7091F5;}
.bg-anniversary3 {background:#5C5470;}

.scroll {overflow: auto;height: 250px;}
/***********************************************/
.customTimeSheet tbody td span {max-width:auto; }
        .customTimeSheet thead th {word-break: break-all;}
        .customTimeSheet thead th {min-width:200px !important;}
        .customTimeSheet tbody td {min-width:200px !important;}
        .customTimeSheet thead th:first-child {min-width:125px !important;}
        .customTimeSheet thead th:nth-child(2) {min-width:80px !important;}
        .customTimeSheet tbody td:first-child {min-width:125px !important;}
        .customTimeSheet tbody td:nth-child(2) {min-width:80px !important;}
        .customTimeSheet tbody td {min-width:200px !important;}
        th {font-size:12px;}
        td {font-size:12px;color:#999;height:80px;}
        .popover {width:100%;max-width:300px;}
        .page-item.active .page-link {color:#fff;}


.card.card-callout{border-left-width:.4rem;border-left-color:var(--primary-color)}.card .card-header{background-color:transparent;border-bottom:none}
 
 .only-mobile {display: none;}.only-desktop {display:block;}.header {background: #f1f1f1;border-bottom: 1px solid #e1e1e1;}
 @media (max-width: 767px) {.only-mobile {display: block;}.only-desktop {display: none;}}

.txt-orange {
    color: #ff5722;
}
.txt-green {
    color: #1cb251;
}

.bg-present { background-color: #103c1e; color: #ffffff; }
.bg-short-leave { background-color: orange; color: #ffffff; }
.bg-full-leave { background-color: #198754; color: #ffffff; }
.bg-halfday-leave { background-color: #4ea17e; color: #ffffff; }
.bg-halfday-absent { background-color: #c28412; color: #ffffff; }
.bg-full-day-absent { background-color: #FF0000; color: #ffffff; }
.bg-holiday { background-color: #0dcaf0; color: #000000; }
.bg-today-attendance { background-color: #484c7f; color: #000000; }
.attendance td{display: table-cell!important;}

.attendance thead tr th, .attendance tbody tr td { min-width:50px;}
.download-att{margin-right:10px}
.attendance thead tr th:first-child, .attendance tbody tr th:first-child {min-width:200px;}


.ui-datepicker table td{height:23px!important}
.attandence-cal {
    position: relative;
}
.fa.fa-calendar.attandeance-icon {
    position: absolute;
    right: 8px;
    top: 10px;
    font-size: 18px;
}