
.bnr-ht-inr { min-height: 392px!important; }

.btn-permission2 
{ 
background:#79a2d6;
border:1px solid #79a2d6;
 }

 .stat-tab1 
 {
 	border-radius: 0px 6px 6px 6px;
 	background: #79a2d6;
 	color: #fff
 }

  .stat-tab2 
 {
 	border-radius: 0px 6px 6px 6px;
 	background: #f070aa;
 	color: #fff
 }

  .stat-tab3 
 {
 	border-radius: 0px 6px 6px 6px;
 	background: #57c0a4;
 	color: #fff
 }

 .stat-tab-ico { font-size: 50px; }

 .stat-tab-txt2 { font-size: 24px; }

 .perm-bg { background: #fcfcfc; }

 .permission-tbl-bg {   box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.11), 0 6px 20px 0 rgba(0, 0, 0, 0.10); min-height: 575px; }

 .gj-datepicker { float: left!important; }

 .permission-drop { background: #fff!important; border:1px solid #cecece; color: #5e5e5e!important; }

 .permission-tbl-bdr { border-bottom: 1px solid #dbdada; }

 .permission-tbl-hd { color: #242424; font-size: 14px; }

 .permission-tbl-rw { color: #585858; font-size: 12px; }

 .pp-lnk { color: #fa8077; font-size: 20px; }

 .prmission-status-btn1 { background: #c6d5ea!important; color: #4274b9; width: 120px; border-color: #c6d5ea;}

 .prmission-status-btn2 { background: #fad4e5!important; color: #f070aa; width: 120px; border-color: #fad4e5;}

.prmission-status-btn3 { background: #ccece4!important; color: #57c0a4; width: 120px; border-color: #ccece4;}

.perm-ord { color: #79a2d6;font-size: 14px; }

.r-pr-btn-sub { background: #79a2d6; color: #fff; border-color: #79a2d6; }

.r-pr-btn-cncl { background: #fff; border-color: #79a2d6; color: #79a2d6 }

.r-pr-pp-hd { background: #79a2d6; color: #fff; }

.pr-pp-hd-txt { color: #79a2d6; }

h1 { font-family: Poppins-Regular; color: #79a2d6; font-weight: bold; }

.pr-pp .gj-datepicker {width: 100%!important; }

.pr-pp-green-txt { color: #369f7e; }

.pr-pp-gray-rw { background: #ccc; }

.pr-pp-rw-bdr { border-top: 1px solid #dbdada; }

/*------------------Calendar---------------*/

.calendar-pg-bg { background: #f5f5f5; }

.cal-bg-wt { background: #fff; }

.b { background: #f5f5f5; width: 100%; }

.cal-wd { width: 14.28%; }

.cal-cell-basic { background: #f6f7fa; }

.cell-bg-blue { background: #e4ecf7; }

.cell-bg-red { background: #fce2ee; }

.cell-bg-green { background: #dbf3f3; }

.cell-bg-yellow { background: #fdfeee; }

.cell-tp { text-align: right; }

.cell-time { font-size: 18px; font-family: Poppins-Bold; }

.bullet-blue { color: #79a2d6; }

.bullet-pink { color: #f070aa; }

.lev-txt { color: #29cb97; text-align: center; }

.m-0 { margin: 0px; }

.pnk-txt { color: #f070aa; }

.ico-blue { color: #82aadd; }

.l-mr-lnk { color: #2b79bc; font-size: 20px; }


/*------------------Attendance Manager---------------*/


.g-bg { background: #f6f6f8; width: 100%; }

.perm-bg2 { background: #f6f6f8; }

.att-repo-drop { background: #f6f6f8!important; border:1px solid #cecece; color: #5e5e5e!important; }

.stst-mod { height: 250px; }

.stat-bar { width: 20%; float: left; height: 100%; }

.stat-perc-hld { float: left; height: 100%; position: relative; }

.stat-perc-1 { width: 90%; height: 45%; background: #a9d0dd;  text-align: center; color: #fff; font-size: 26px; font-family: Poppins-Bold; border-radius: 15px 0px; bottom: 0px; position: absolute; }

.stat-perc-2 { width: 90%; height: 55%; background: #79a2d6;  text-align: center; color: #fff; font-size: 26px; font-family: Poppins-Bold; border-radius: 15px 0px; bottom: 0px; position: absolute; }

.stat-perc-3 { width: 90%; height: 35%; background: #528dae;  text-align: center; color: #fff; font-size: 26px; font-family: Poppins-Bold; border-radius: 15px 0px; bottom: 0px; position: absolute; }

.stat-perc-4 { width: 90%; height: 25%; background: #55c0a5;  text-align: center; color: #fff; font-size: 26px; font-family: Poppins-Bold; border-radius: 15px 0px; bottom: 0px; position: absolute; }

.stat-perc-5 { width: 90%; height: 25%; background: #d571ad;  text-align: center; color: #fff; font-size: 26px; font-family: Poppins-Bold; border-radius: 15px 0px; bottom: 0px; position: absolute; }

.stst-time { text-align: center; color: #5e5e5e; }

.attnd-tab-ht { height: 264px; overflow-y: scroll; }

.attnd-crcl {
    width: 40px;
    height: 40px;
    background: #cecece;
    border-radius: 50%;
    margin: 0 auto;
    color: #fff;
}

.hvr-mnu-scrl-crcl 
{ 
	position: fixed; /* Fixed/sticky position */
  bottom: 30px; /* Place the button at the bottom of the page */
  left: 30px; /* Place the button 30px from the right */
  z-index: 20; /* Make sure it does not overlap */
  border: none; /* Remove borders */
  outline: none; /* Remove outline */
  background-color: red; /* Set a background color */
  color: white!important; /* Text color */
  cursor: pointer; /* Add a mouse pointer on hover */
  padding: 19px; /* Some padding */
  border-radius: 100px; /* Rounded corners */
  font-size: 18px; /* Increase font size */
  height: 60px; width: 60px;
}

.scrl-menu 
{ 
	width: 400px; height: 158px; background: #000; position: fixed; margin: 0 auto; z-index: 10; display: none; 
bottom: 60px; left: 60px; border-radius: 10px; color: #fff;
}

.scrl-menu li { height: 25%; color: #fff; }

.scrl-menu a { color: #fff; font-size: 20px; }

.modal-backdrop { z-index: 1!important; }

.det-pp-hld { position: relative; }

.det-wt-pp { color: #F09A70; font-size: 18px; }

.det-pp {
  position: absolute;
  z-index: 10;
  top: 12px;
  left: 34px;
    display: none;
    width: 200px; height: auto; background: rgba(0, 0, 0, 0.8); color: #fff; border-radius: 6px;
    padding: 6px;
}
    
.det-wt-pp:hover + .det-pp {  display: block; }


/*------------- manager-daily-attendance-report ------------------*/  

.rep-add-bdr { border-right: 1px solid #ddd; }

.fltr-bdr-m { border-top: 1px solid #f0f0f0; border-left: 1px solid #ccc; border-right: 1px solid #ccc; border-bottom: 1px solid #ccc; background: #f0f0f0; }

.fltr-bdr-sd { border-top: 1px solid #ccc; }

.flt-dscr { float: left; }

.flt-dscr-hld { display: none; }

.flt-dscr-hld2 { display: block; }

.p-0 { padding: 0px; }

.rep-u { float: left; width: 35px; height: 35px; border-radius: 100px; background: #ccc; }

.rep-u2 { float: left; width: 80px; height: 80px; border-radius: 100px; background: #ccc; }

.stf-name { font-size: 14px; }

.stf-desg { font-size: 12px; color: #929090; }

.stf-stat { font-size: 12px; color: #f41976; }

.stf-info ul { list-style: none; padding: 0; }

.stf-info li { padding-top: 4px; padding-bottom: 4px; font-size: 12px; color: #aaa; }

.abt-dept-hd { background: #79a2d6; color: #fff; }

.font-size-16 { font-size: 16px; }

.font-size-14 { font-size: 14px; }

.font-size-12 { font-size: 12px; }

.adv-fltr-hld { background: #f0f0f0; }

.adv-fltr-hld ul { list-style: none; padding: 0; }

.adv-fltr-hld li { float: left; }

.d-hide { display: none; }

.d-show { display: block; }

#adv-fltr-l:hover { text-decoration: none!important; }

.drp-stnd-ut { border:1px solid #eee; box-shadow: 5px 10px 20px #3192c2 inset; border-radius: 6px; background: #afd7e3; }

.color-cd-bdr { border: 1px solid #eee; }

.color-cd-tb-wd { width: 13.5%; color: #000; font-size: 12px; text-align: center; float: right; }

.color-cd-gray { background: #ccc; }

.color-cd-yellow { background: #fcf58d; }

.color-cd-red { background: #fc0d1b; }

.color-cd-green { background: #22b573; }

.color-cd-pink { background: #ff00ff; }

.color-cd-blue { background: #0071bc; }

.color-cd-white { background: #fff; }

.color-cd-lbl { font-size: 13px; font-family: Poppins-Bold; color: #3192c2; }

.att-avg { float: left; width: 50px; height: 50px; border-radius: 100px; background: #ccc; border: 2px solid #f89c25; text-align: center; color: #000; position: relative; cursor: pointer; }

.att-avg-pp { width: 600px; position: fixed; 
  z-index: 10; bottom: 15%; left: 33%; display: none; background: rgba(204, 204, 204, 0.4); border-radius: 8px; border:1px solid #ccc;
box-shadow: 5px 10px 18px #aaa;
   }

.clear-fix { clear: both; }

.att-pp-hd { background: #3192c2; text-align: center; color: #fff; font-size: 16px; }

.att-pp-body { background: #fff; height: auto; font-size: 13px; }

.att-pp-date { width: 50px; height: 50px; border-radius: 100px; color: #fff; background: #5cacd3; font-size: 12px; text-align: center; line-height: 12px; }

/*------------- manager-daily-attendance-report ------------------*/ 



/*------------- to-employee-report ------------------*/  

.emp-att-rt-lbl { background: #3192c2; color: #fff; border-radius: 40px; }

.emp-rep-counter { background: #ccc; color: #000; text-align: center; }

#att-tbl tr {  border-bottom: 1px solid #ddd!important;}

/*------------- to-employee-report ------------------*/  



/*------------- arrival-segment ------------------*/  

.timing-tab { width: 100%; float: left; border:1px solid #ccc; font-size: 14px; color: #383939; }

.timing-tab-text { float: left; }

.timing-tab-count { width: 35px; height: 35px; background: #e57b1d; color: #fff; font-size: 12px; float: right; border-radius: 40px; text-align: center; }

.timing-tab-timing { height: 35px; background: #e57b1d; color: #fff; font-size: 13px; float: right; border-radius: 40px; text-align: center; }

.stf-tm-lst-tb { width: 100%;  }

.t-t-1 { cursor: pointer; }

.stf-tm-lst1 { width: 100%; float: left; display: none; }

/*------------- arrival-segment ------------------*/  




/*------------- absence-details ------------------*/  

.att-pp { cursor: pointer; float: right; }

.blink_me {
  animation: blinker 1s linear infinite;
}

@keyframes blinker {
  50% {
    opacity: 0;
  }
}

/*------------- absence-details ------------------*/  



/*------------- permission report ------------------*/  

.perm-rep-tbl { font-size: 11px; text-align: center; font-family: Poppins-Regular; }

#perm-inr-tbl, #perm-inr-tbl2 { width: 100%; }

#perm-inr-tbl tr { border-bottom: 0px!important;  }

#perm-inr-tbl td { border-top: 0px!important; text-align: left; }

#perm-inr-tbl2 tr { border-bottom: 0px!important; }

#perm-inr-tbl2 td { border-top: 0px!important; text-align: center; }

.perm-rep-employee { cursor: pointer; color: #2e94c4; font-size: 14px; }

.perm-rep-pp-dept { color: #a8e0fb; font-size: 14px; }

/*------------- permission report ------------------*/  


/*------------- Help ------------------*/  

.guid-btn-crcl-2 { background: #3192c2; text-align: center; border-radius: 100px; width: 80px; height: 80px; float: left; }

.guid-btn-crcl-1 { background: #a3ce96; text-align: center; border-radius: 100px; width: 80px; height: 80px; float: left; }

.guid-btn-hld { border:1px solid #e1e2e2; background: #fff; border-radius: 120px; }

.guid-btn-hld:hover { border:1px solid #93cfec; background: #f7f7f7; border-radius: 120px; }

.guid-btn-hld-1 { border:1px solid #e1e2e2; background: #fff; border-radius: 120px; }

.guid-btn-hld-1:hover { border:1px solid #a3ce96; background: #f7f7f7; border-radius: 120px; }

.hd-ico-wt { font-size: 30px; color: #fff; }

.guid-btn-txt { font-size: 16px; color: #3192c2; margin-top: 35px; margin-left: 10px; float: left; }

.guid-btn-txt-1 { font-size: 16px; color: #8fc080; margin-top: 35px; margin-left: 10px; float: left; }

.help-frm { font-size: 14px!important; }

.help-frm text,select,input { font-size: 14px!important; }

.st-lang { border:1px solid #ddd; border-radius: 80px; padding: 5px 20px; color: #3192c2; font-weight: bold; }

.st-lang:hover { text-decoration: none; color: #000; }

.btn-fld-clr { border: 1px solid #3192c2; color: #3192c2; float: right; }

.btn-fld-clr:hover { border: 1px solid #000;  }

#d_file { padding: 4px; border-radius: 3px; border:1px solid #c9c9c9!important; }

/*------------- Help ------------------*/  

/*------------- Latest Updates ------------------*/  

.pos-rel { position: relative; }

.l-upd-tab { position: absolute;  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.06), 0 6px 14px 0 rgba(0, 0, 0, 0.04); z-index: 1; background: #fff; left: -70px; }

.l-upd-lt { background: #57bfa4; }

.l-upd-mdl { width: 163px; }

.l-upd-mdl-txt { font-size: 11px; color: #bbb; }

.hd-ico-wt { font-size: 30px; color: #fff; }

.arrw-pos-bot { position: absolute; bottom: 0px; color: #444; }

.l-upd-rt { height: 64px; }

.l-upd-hd { color: #57bfa4; }

.l-upd-pop { width: 400px; height: 200px; box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.06), 0 6px 14px 0 rgba(0, 0, 0, 0.04); 
  position: absolute; z-index: 10; display: none; overflow-y: scroll; top: 0px; text-align: left;
  background: #fff;
}

.l-upd-pop-close { position: absolute; top: 0px; right: 0px; cursor: pointer; }


#style-4::-webkit-scrollbar-track
{
    -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.1);
    background-color: #F5F5F5;
}

#style-4::-webkit-scrollbar
{
    width: 8px;
    background-color: #F5F5F5;
}

#style-4::-webkit-scrollbar-thumb
{
    background-color: #57bfa4;
    border: 2px solid #F5F5F5;
    border-radius: 10px;
}

.l-upd-ln { float: left; width: 100%; }

.l-upd-ln-lt { width: 36px; text-align: center; float: left; }

.l-upd-ln-rt { width: 310px; float: left; font-size: 14px; color: #999; }

.color-bell { color: #57bfa4; }

/*------------- Latest Updates ------------------*/  