.brand-logo img {
  width: 80px
}

.text-new-primary {
  color: #3321E9
}

.dropdown-menu[x-placement^="top"],
.dropdown-menu[x-placement^="right"],
.dropdown-menu[x-placement^="bottom"],
.dropdown-menu[x-placement^="left"] {
  right: 0;
  bottom: auto;
  /* left: auto !important; */
}

body {
  font-weight: 500
}

label {
  font-weight: 600
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-weight: 600
}

.flatpickr-current-month .flatpickr-monthDropdown-months {
  font-weight: 400
}

.normal-line {
  line-height: 15px !important
}

.innerpageboxed {
  min-height: 70px;
  margin-bottom: 12px !important;
}
.innerpageboxed .card-body { padding: 10px 10px; }
.change-card .card-header { padding: 7px 15px; }



.pass-eyesnew {
  position: absolute;
  right: 1px;
  top: 31px;
}

.border-nonenew {
  border: none;
}

.leavedetailhead {
  font-size: 13px;
  margin: 10px 0
}

.leavedetailtxt {
  color: #000;
  font-size: 13px;
  font-weight: bold;
  margin: 10px 0
}


.btn {
  border-radius: 20px
}

.auth-wrapper .input-group-append .input-group-text {
  border-radius: 0 20px 20px 0
}


.auth-wrapper .form-control {
  border-radius: 20px;
  height: 41px;
}

.emailloginmob {
  border: #D6D6D6 thin solid;
  padding: 5px;
  border-radius: 27px;
}

.emailloginmob .nav-link {
  border-radius: 25px;
  box-shadow: none !important;
}

.emailloginmob .nav-link.active {
  border-color: #4a4a4a;
  background-color: #4a4a4a;
}

.auth-wrapper #profile .btn-outline-primary {
  border: 1px solid #e4e7ea !important;
  border-radius: 30px 0 0 30px;
  padding: 8px;
  text-align: left;
  height: 41px;
}

.auth-wrapper #profile .form-control {
  border: 1px solid #e4e7ea !important;
  border-radius: 0 30px 30px 0
}

.verficationcodeinput .form-control {
  width: 39px !important;
  border-radius: 5px !important;
  margin-right: 10px !important;
  margin-top: 7px !important;
}

.modulessection .my-1 {
  margin: 10px 0 !important
}

.modulessection h6.pl-2 {
  font-size: 13px;
  font-weight: 600
}

.modulessection h6 {
  margin-bottom: 0
}

.modulessection .custom-checkbox .custom-control-label {
  font-size: 12px
}


.custom-checkbox .custom-control-label::before,
.custom-checkbox .custom-control-label::after {
  width: 16px;
  height: 16px
}

.module-action {
  position: sticky;
  top: 100px
}

.edit-rolepermiosion {
  font-size: 12px;
  font-weight: bold
}

.edit-rolepermiosion .feather {
  width: 12px;
}


.modal-slide-in .modal-dialog .modal-content {
  padding-bottom: 0
}


.withoutheadbuttin {
  margin-top: 5px
}

.nav-tabs .nav-link {
  padding: 19px 1.2rem;
}


.punchmarginpad {
  padding-bottom: 10px;
  margin-bottom: 15px
}

.newbrand-logo {
  font-size: 18px;
  font-weight: 600 !important;
  line-height: 20px;
  color: #000 !important;
  text-transform: uppercase
}

.newbrand-logo span {
  font-size: 12px;
  color: #787878 !important;
  text-transform: uppercase
}

.brand-inner-txt {
  color: #000 !important;
  font-size: 14px !important
}

.event-img {
  border: #eee thin solid;
  border-radius: 5px;
  padding: 5px;
  height: 200px
}

.event-img img {
  border-radius: 5px;
  object-fit: cover;
  height: 100%;
  object-position: left
}


.innerpageboxed .feather {
  height: 30px;
  width: 30px;
}

.innerpageboxed h3 {
  margin-bottom: 0;
  font-size: 13px;
  margin-top: 5px
}

.leavetable {
  width: 100%
}

.leavetable th {
  background: #eee;
  font-size: 11px;
  padding: 5px
}

.leavetable td {
  font-size: 11px;
  padding: 5px
}

.eventadd-icons {
  background-color: #c90000;
  color: #fff;
  box-shadow: 0 3px 6px 0 rgb(115 103 240 / 40%);
  width: 30px;
  height: 30px;
  line-height: 25px;
  text-align: center;
  border-radius: 5px;
  display: inline-block;
  margin-right: 6px;
}

.eventadd-icons .feather {
  height: 15px !important
}

.collapse-icon [data-toggle='collapse']:after {
  content: none
}

.collapse-icon .card-header[data-toggle='collapse']:after {
  position: absolute;
  top: 58%;
  right: 1rem;
  margin-top: -8px;
  background-image: url(data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%236e6b7b' stroke-width='2' stroke-linecap='round' stroke-linejoin='round' class='feather feather-chevron-down'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 14px;
  width: 14px;
  height: 11px;
  content: '';
  transition: all 300ms linear 0s;
}


#loaderDiv {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgb(128, 128, 128, 0.25);
}

.loader {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
  width: 165px;
  height: 165px;
}

.first {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  background: #E4170E;
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.second {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  background: #158ECF;
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.third {
  float: left;
  background: #fff;
  animation: animate 2s ease-in infinite;
  border: 2px solid #fff;
}

.four {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  background: #F07C00;
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.five {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  background: #954A97;
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.six {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  background: #2372B5;
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.seven {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  background: #FBB900;
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.eight {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  background: #F07C01;
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.nine {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  background: #E73428;
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.loader span {
  width: 50px;
  height: 50px;
  display: block;
  float: left;
  /* background: #a23607; */
  animation: animate 2s ease-in infinite;
  border: 2px solid #efeacc;
}

.loader span:nth-child(3) {
  animation-delay: 0.8s;
}

.loader span:nth-child(2),
.loader span:nth-child(6) {
  animation-delay: 0.6s;
}

.loader span:nth-child(1),
.loader span:nth-child(5),
.loader span:nth-child(9) {
  animation-delay: 0.4s;
}

.loader span:nth-child(4),
.loader span:nth-child(8) {
  animation-delay: 0.2s;
}

.loader span:nth-child(7) {
  animation-delay: 0s;
}

@keyframes animate {
  0% {
    transform: scale(1);
  }

  25% {
    transform: scale(0);
  }

  50% {
    transform: scale(0);
  }

  75% {
    transform: scale(1);
  }

  100% {
    transform: scale(1);
  }
}


/* =====================Dashbord==================== */
.clock-time h5 {
  padding-top: 2px !important;
}

.new-lightbtn {
  background: #F2F2F2;
  border: 1px solid #F2F2F2;
}

.new-cardbox {
  background: #FFFFFF;
  box-shadow: 0px 10px 30px #0000001A;
  border-radius: 14px;
  padding: 20px 20px 30px 20px;
}

.height-box {
  min-height: 282px;
}

.height-boxnew {
  min-height: 351px;
}

.new-cardbox h1 {
  color: #000000;
  font-weight: 500;
  margin-bottom: 0px;
  font-size: 19px;
  line-height: 24px;
}

.new-cardbox p {
  color: #000000;
  font-size: 14px;
  margin-bottom: 0px;
  padding-top: 10px;
}

.new-calenderbox {
  width: 40px;
  height: 40px;
  background: #F2F2F2;
  border-radius: 50%;
  line-height: 40px;
  text-align: center;
}

.new-calenderbox img {
  object-fit: contain;
  width: 100%;
  height: 20px;
}

.clock-box {
  width: 55px;
  height: 55px;
  line-height: 55px;
  border-radius: 50%;
  background: #059451;
  box-shadow: 0px 14px 15px #0000001A;
  text-align: center;
}

.clock-box img {
  object-fit: contain;
}

.red-clockbox {
  background: #F82D2D;
}

.grey-clockbox {
  background: #B9B6B6;
}

.new-cardboxcontent h5 {
  color: #000000 !important;
  font-weight: 600 !important;
  font-size: 15px !important;
  margin-bottom: 0px;
  padding-top: 15px;
  text-overflow: ellipsis;
  overflow: hidden;
  white-space: nowrap;
}

.new-cardboxcontent h6 {
  color: #000000 !important;
  font-size: 13px !important;
  margin-bottom: 0px;
  padding-top: 0px !important;
  font-weight: normal !important;
}

.cancel-btn {
  background: #F6F6F6;
  border: 1px solid #444444;
  border-radius: 40px;
  color: #000000;
  font-weight: 500;
  font-size: 12px;
  padding: 8px 12px;
}

.user-picbox {
  width: 60px;
  height: 60px;
  line-height: 60px;
  border-radius: 50%;
}

.user-picbox img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 50%;
}

.red-btn {
  background: #F82D2D;
  padding: 8px 14px;
  box-shadow: 0px 4px 20px #00000029;
  border-radius: 37px;
  font-size: 14px;
  font-weight: 500;
  color: #FFFFFF;
}

.upcoming-box {
  background: #F2F2F2;
  border-radius: 9px;
  padding: 20px 20px;
}

.upcoming-box h1 {
  color: #000000;
  font-weight: 600;
  font-size: 24px;
  margin-bottom: 0px;
  line-height: 18px;
}

.upcoming-box h1 span {
  color: #000000;
  font-weight: 500;
  font-size: 13px;
}

.border-rightcolor {
  border-right: 1px solid #888888;
}

.upcoming-box h4 {
  color: #000000 !important;
  font-weight: 500 !important;
  font-size: 15px !important;
  margin-bottom: 0px;
}

.new-cardbox h2 {
  color: #000000;
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 0px;
}

.new-cardbox h3 {
  color: #000000;
  font-weight: 500;
  font-size: 25px;
  margin-bottom: 0px;
}

.new-cardbox h4 {
  margin-bottom: 0px;
  font-weight: 500 !important;
  font-size: 13px !important;
  color: #000000;
}

.new-cardbox h5 {
  color: #888888;
  font-weight: 500;
  font-size: 12px;
  margin-bottom: 0px;
}

.new-cardbox h6 {
  color: #000000;
  font-size: 16px;
  font-weight: 400;
  margin-bottom: 0px;
  padding-top: 4px;
}

.prosese-bar p {
  color: #000000;
  font-weight: 500;
  font-size: 12px !important;
  margin-bottom: 0px;
  line-height: 15px;
}

.prosese-bar .progress-bar-success .progress-bar {
  background-color: #0C8443;
}

.prosese-bar .progress-bar-success {
  background-color: #F1F1F1;
  border-radius: 4px;
}

.prosese-bar .progress .progress-bar:last-child {
  border-top-right-radius: 4rem;
  border-bottom-right-radius: 4rem;
}

.prosese-bar h6 {
  color: #000000;
  font-size: 12px;
  font-weight: 500;
  padding-top: 5px;
  margin-bottom: 0px;
}

.prosese-bar h6 span {
  color: #888888;
}

.progress {
  height: 30px;
  border-radius: 4px;
  background: #F1F1F1;
}


.prosese-bar .progress .progress-bar:last-child {
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.progress-bar {
  background-color: transparent linear-gradient(90deg, #F82D2D 0%, #F82D2D 100%) 0% 0% no-repeat padding-box;
}

.progress-bar-primary .progress-bar {
  background: transparent linear-gradient(90deg, #F82D2D 0%, #F82D2D 100%) 0% 0% no-repeat padding-box !important;
}

.upcoming-box h6 {
  color: #000000;
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 0px;
  line-height: 24px;
  padding-top: 0px !important;
}

.upcoming-box p {
  color: #000000;
  font-size: 16px;
  font-weight: normal;
  padding-top: 0px;
  line-height: 24px;
}

.upcoming-box h5 {
  color: #000000;
  font-size: 16px;
  line-height: 24px;
}

.upcoming-box h5 span {
  color: #000000;
  font-size: 15px;
  font-weight: 600;
}

.upcoming-eventsbox p {
  color: #000000;
  font-size: 19px;
  font-weight: 600;
  margin-bottom: 0px;
  border-radius: 16px;
  line-height: 17px;
}

.upcoming-eventsbox p span {
  font-weight: 500;
  font-size: 12px;
  color: #000000;
}

.head-box {
  background: #F5F5F5;
  text-align: center;
  border-radius: 16px;
  padding: 8px;
}

.upcoming-eventsbox h6 {
  color: #000000;
  font-weight: 500;
  font-size: 16px;
  padding-top: 0px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* .time-btn { padding: 5px 13px; font-size: 12px; font-weight: 500; background: #F5F5F5;
	} */
.time-btn {
  padding: 5px 7px;
  font-size: 12px;
  font-weight: 500;
  background: #F5F5F5;
}

.dot-green {
  height: 8px;
  width: 8px;
  background-color: #0C8443;
  border-radius: 50%;
  display: inline-block;
}

.dot-blue {
  height: 8px;
  width: 8px;
  background-color: #3321E9;
  border-radius: 50%;
  display: inline-block;
}

.yellow-dot {
  background-color: #FF9900;
}

.red-dot {
  background-color: #F82D2D;
}

.gray-dot {
  background-color: #B9B6B6 !important;
}

.new-btn {
  padding: 6px 12px;
  font-weight: 500;
  font-size: 11px;
}

.text-green {
  color: #059451;
}

.text-yellow {
  color: #FF9900;
}

.text-red {
  color: #F82D2D;
}

.upcoming-box h3 {
  color: #000000;
  font-weight: 500;
  font-size: 16px;
}

.fc .fc-view-harness {
  min-height: 320px !important;
}

.display-nonebox {
  display: none !important;
}

.fc-theme-standard td {
  border: none;
}

/* #calendar { height: 350px; } */
.fc-theme-standard .fc-scrollgrid {
  border: none;
}

.fc-theme-standard th {
  border: none;
  color: #B5B5B5;
  font-weight: 500;
  font-size: 14px;
}

.fc-daygrid-day.fc-day.fc-day-sun.fc-day-past {
  height: 50px !important;
}

.fc-scroller-harness.fc-scroller-harness-liquid {
  margin-top: 10px;
}

/* .fc-daygrid-day.fc-day.fc-day-sun.fc-day-future  { height: 40px; } */
.fc-daygrid-day-number {
  color: #222222 !important;
}

.fc-day-future .fc-daygrid-day-number {
  color: #999 !important;
  cursor: not-allowed;
  font-weight: normal;
}


.fc .fc-daygrid-day {
  padding: 0px !important;
}

.clock-newimg {
  width: 30px;
  height: 30px;
}

.clock-newimg img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

/* .fc .fc-daygrid-day-bottom {font-size: 0; padding: 0; background: url(../app-assets/images/clock1.svg);} */
/* .fc-daygrid-more-link .fc-more-link { background: url(../app-assets/images/clock1.svg) !important; } */



.fc-day-today {
  border-radius: 12px !important;
}

.fc-daygrid-day.fc-day.fc-day-mon.fc-day-today {
  border-radius: 12px !important;
  background: #E5E5E5 !important;
}

.fc-daygrid-day-top {
  justify-content: center !important;
}

.fc-daygrid-day-frame.fc-scrollgrid-sync-inner {
  height: 20px !important;
}

.date-box {
  background: #F6F6F6;
  border-radius: 10px;
  padding: 13px;
  text-align: center;
}

.padding-topnone {
  padding-top: 0px !important;
}

.tree-box {
  background: #0C8443;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  line-height: 50px;
  text-align: center;
  float: right;
}

.tree-box img {
  object-fit: contain;
}

.new-cardbox p a {
  color: #000000 !important;
}

.fc .fc-daygrid-event-harness .fc-event {
  background: none;
  border: none;
  padding: 0
}

.red-boderbottom {
  border-bottom: 6px solid #F82D2D;
  z-index: 10;
}

.margin-topbox {
  margin-top: -10px;
  z-index: 3;
}

.dotcirclatt {
  width: 5px;
  height: 5px;
  background: #B5B5B5;
  border-radius: 50%;
  margin: 0 auto;
}

.dotcirclatt.present {
  background: #0C8443;
}

.dotcirclatt.absent {
  background: #F82D2D;
}

.dotcirclatt.present:after {
  content: "";
  position: absolute;
  top: -30px;
  left: 0;
  right: 0;
  border: #0C84435a thin solid;
  height: 45px;
  border-radius: 10px;
  z-index: -1;
  width: 95%;
  margin: 0 auto;
}

.dotcirclatt.absent:after {
  content: "";
  position: absolute;
  top: -30px;
  left: 0;
  right: 0;
  border: #F82D2D5a thin solid;
  height: 45px;
  border-radius: 10px;
  z-index: -1;
  width: 95%;
  margin: 0 auto;
}

.fc-day-other .fc-daygrid-day-events {
  display: none
}

/* ============================ */

/* .progress-circle p{font-weight: 400; font-size: 12px; margin-top: 5px; line-height: 15px; color: #000000;} */

.progress-circle {
  position: relative;
  display: inline-block;
  width: 70px;
  height: 70px;
  border-radius: 50%;
  background-color: #F9F9F9;
}

.progress-circle:before {
  content: "";
  position: absolute;
  width: 64px;
  height: 64px;
  border-radius: 50%;
  background: #F9F9F9;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 5
}

.progress-circle:after {
  content: "";
  display: inline-block;
  width: 100%;
  height: 100%;
  border-radius: 50%;
  background-color: #FFF;
  -webkit-animation: colorload 2s;
  animation: colorload 2s;
  z-index: 4
}

.progress-txt {
  position: absolute;
  top: 50%;
  width: 100%;
  text-align: center;
  font-size: 16px;
  font-weight: 700;
  color: #000000;
  z-index: 6;
  left: 50%;
  transform: translate(-50%, -50%);
}

.progress-circle.progress-0:after {
  background-image: linear-gradient(90deg, #EBE8EA 50%, transparent 50%, transparent), linear-gradient(90deg, #FF0000 50%, #EBE8EA 50%, #EBE8EA);
}

.progress-circle.progress-1:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 1%, #EBE8EA, #EBE8EA 99%);
}

.progress-circle.progress-2:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 2%, #EBE8EA, #EBE8EA 98%);
}

.progress-circle.progress-3:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 3%, #EBE8EA, #EBE8EA 97%);
}

.progress-circle.progress-4:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 4%, #EBE8EA, #EBE8EA 96%);
}

.progress-circle.progress-5:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 5%, #EBE8EA, #EBE8EA 95%);
}

.progress-circle.progress-6:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 6%, #EBE8EA, #EBE8EA 94%);
}

.progress-circle.progress-7:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 7%, #EBE8EA, #EBE8EA 93%);
}

.progress-circle.progress-8:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 8%, #EBE8EA, #EBE8EA 92%);
}

.progress-circle.progress-9:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 9%, #EBE8EA, #EBE8EA 91%);
}

.progress-circle.progress-10:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 10%, #EBE8EA, #EBE8EA 90%);
}

.progress-circle.progress-11:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 11%, #EBE8EA, #EBE8EA 89%);
}

.progress-circle.progress-12:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 12%, #EBE8EA, #EBE8EA 88%);
}

.progress-circle.progress-13:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 13%, #EBE8EA, #EBE8EA 87%);
}

.progress-circle.progress-14:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 14%, #EBE8EA, #EBE8EA 86%);
}

.progress-circle.progress-15:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 15%, #EBE8EA, #EBE8EA 85%);
}

.progress-circle.progress-16:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 16%, #EBE8EA, #EBE8EA 84%);
}

.progress-circle.progress-17:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 17%, #EBE8EA, #EBE8EA 83%);
}

.progress-circle.progress-18:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 18%, #EBE8EA, #EBE8EA 82%);
}

.progress-circle.progress-19:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 19%, #EBE8EA, #EBE8EA 81%);
}

.progress-circle.progress-20:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 20%, #EBE8EA, #EBE8EA 80%);
}

.progress-circle.progress-21:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 21%, #EBE8EA, #EBE8EA 79%);
}

.progress-circle.progress-22:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 22%, #EBE8EA, #EBE8EA 78%);
}

.progress-circle.progress-23:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 23%, #EBE8EA, #EBE8EA 77%);
}

.progress-circle.progress-24:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #F82D2D, #F82D2D 24%, #EBE8EA, #EBE8EA 76%);
}

.progress-circle.progress-25:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 25%, #EBE8EA, #EBE8EA 75%);
}

.progress-circle.progress-26:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 26%, #EBE8EA, #EBE8EA 74%);
}

.progress-circle.progress-27:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 27%, #EBE8EA, #EBE8EA 73%);
}

.progress-circle.progress-28:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 28%, #EBE8EA, #EBE8EA 72%);
}

.progress-circle.progress-29:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 29%, #EBE8EA, #EBE8EA 71%);
}

.progress-circle.progress-30:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 30%, #EBE8EA, #EBE8EA 70%);
}

.progress-circle.progress-31:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 31%, #EBE8EA, #EBE8EA 69%);
}

.progress-circle.progress-32:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 32%, #EBE8EA, #EBE8EA 68%);
}

.progress-circle.progress-33:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 33%, #EBE8EA, #EBE8EA 67%);
}

.progress-circle.progress-34:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 34%, #EBE8EA, #EBE8EA 66%);
}

.progress-circle.progress-35:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 35%, #EBE8EA, #EBE8EA 65%);
}

.progress-circle.progress-36:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 36%, #EBE8EA, #EBE8EA 64%);
}

.progress-circle.progress-37:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 37%, #EBE8EA, #EBE8EA 63%);
}

.progress-circle.progress-38:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 38%, #EBE8EA, #EBE8EA 62%);
}

.progress-circle.progress-39:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 39%, #EBE8EA, #EBE8EA 61%);
}

.progress-circle.progress-40:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 40%, #EBE8EA, #EBE8EA 60%);
}

.progress-circle.progress-41:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 41%, #EBE8EA, #EBE8EA 59%);
}

.progress-circle.progress-42:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 42%, #EBE8EA, #EBE8EA 58%);
}

.progress-circle.progress-43:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 43%, #EBE8EA, #EBE8EA 57%);
}

.progress-circle.progress-44:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 44%, #EBE8EA, #EBE8EA 56%);
}

.progress-circle.progress-45:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 45%, #EBE8EA, #EBE8EA 55%);
}

.progress-circle.progress-46:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 46%, #EBE8EA, #EBE8EA 54%);
}

.progress-circle.progress-47:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 47%, #EBE8EA, #EBE8EA 53%);
}

.progress-circle.progress-48:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 48%, #EBE8EA, #EBE8EA 52%);
}

.progress-circle.progress-49:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #FF9900, #FF9900 49%, #EBE8EA, #EBE8EA 51%);
}

.progress-circle.progress-50:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 50%, #EBE8EA, #EBE8EA 50%);
}

.progress-circle.progress-51:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 51%, #EBE8EA, #EBE8EA 49%);
}

.progress-circle.progress-52:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 52%, #EBE8EA, #EBE8EA 48%);
}

.progress-circle.progress-53:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 53%, #EBE8EA, #EBE8EA 47%);
}

.progress-circle.progress-54:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 54%, #EBE8EA, #EBE8EA 46%);
}

.progress-circle.progress-55:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 55%, #EBE8EA, #EBE8EA 45%);
}

.progress-circle.progress-56:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 56%, #EBE8EA, #EBE8EA 44%);
}

.progress-circle.progress-57:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 57%, #EBE8EA, #EBE8EA 43%);
}

.progress-circle.progress-58:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 58%, #EBE8EA, #EBE8EA 42%);
}

.progress-circle.progress-59:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 59%, #EBE8EA, #EBE8EA 41%);
}

.progress-circle.progress-60:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 60%, #EBE8EA, #EBE8EA 40%);
}

.progress-circle.progress-61:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 61%, #EBE8EA, #EBE8EA 39%);
}

.progress-circle.progress-62:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 62%, #EBE8EA, #EBE8EA 38%);
}

.progress-circle.progress-63:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 63%, #EBE8EA, #EBE8EA 37%);
}

.progress-circle.progress-64:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 64%, #EBE8EA, #EBE8EA 36%);
}

.progress-circle.progress-65:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 65%, #EBE8EA, #EBE8EA 35%);
}

.progress-circle.progress-66:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 66%, #EBE8EA, #EBE8EA 34%);
}

.progress-circle.progress-67:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 67%, #EBE8EA, #EBE8EA 33%);
}

.progress-circle.progress-68:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 68%, #EBE8EA, #EBE8EA 32%);
}

.progress-circle.progress-69:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 69%, #EBE8EA, #EBE8EA 31%);
}

.progress-circle.progress-70:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 70%, #EBE8EA, #EBE8EA 30%);
}

.progress-circle.progress-71:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 71%, #EBE8EA, #EBE8EA 29%);
}

.progress-circle.progress-72:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 72%, #EBE8EA, #EBE8EA 28%);
}

.progress-circle.progress-73:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 73%, #EBE8EA, #EBE8EA 27%);
}

.progress-circle.progress-74:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #3321E9, #3321E9 74%, #EBE8EA, #EBE8EA 26%);
}

.progress-circle.progress-75:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 75%, #EBE8EA, #EBE8EA 25%);
}

.progress-circle.progress-76:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 76%, #EBE8EA, #EBE8EA 24%);
}

.progress-circle.progress-77:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 77%, #EBE8EA, #EBE8EA 23%);
}

.progress-circle.progress-78:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 78%, #EBE8EA, #EBE8EA 22%);
}

.progress-circle.progress-79:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 79%, #EBE8EA, #EBE8EA 21%);
}

.progress-circle.progress-80:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 80%, #EBE8EA, #EBE8EA 20%);
}

.progress-circle.progress-81:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 81%, #EBE8EA, #EBE8EA 19%);
}

.progress-circle.progress-82:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 82%, #EBE8EA, #EBE8EA 18%);
}

.progress-circle.progress-83:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 83%, #EBE8EA, #EBE8EA 17%);
}

.progress-circle.progress-84:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 84%, #EBE8EA, #EBE8EA 16%);
}

.progress-circle.progress-85:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 85%, #EBE8EA, #EBE8EA 15%);
}

.progress-circle.progress-86:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 86%, #EBE8EA, #EBE8EA 14%);
}

.progress-circle.progress-87:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 87%, #EBE8EA, #EBE8EA 13%);
}

.progress-circle.progress-88:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 88%, #EBE8EA, #EBE8EA 12%);
}

.progress-circle.progress-89:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 89%, #EBE8EA, #EBE8EA 11%);
}

.progress-circle.progress-90:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 90%, #EBE8EA, #EBE8EA 10%);
}

.progress-circle.progress-91:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 91%, #EBE8EA, #EBE8EA 9%);
}

.progress-circle.progress-92:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 92%, #EBE8EA, #EBE8EA 8%);
}

.progress-circle.progress-93:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 93%, #EBE8EA, #EBE8EA 7%);
}

.progress-circle.progress-94:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 94%, #EBE8EA, #EBE8EA 6%);
}

.progress-circle.progress-95:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 95%, #EBE8EA, #EBE8EA 5%);
}

.progress-circle.progress-96:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 96%, #EBE8EA, #EBE8EA 4%);
}

.progress-circle.progress-97:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 97%, #EBE8EA, #EBE8EA 3%);
}

.progress-circle.progress-98:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 98%, #EBE8EA, #EBE8EA 2%);
}

.progress-circle.progress-99:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 99%, #EBE8EA, #EBE8EA 1%);
}

.progress-circle.progress-100:after {
  box-shadow: inset 0px 0px 5px rgba(0, 0, 0, 0.35);
  background-image: linear-gradient(to right, #059451, #059451 100%, #EBE8EA, #EBE8EA 0%);
}

@-webkit-keyframes colorload {
  0% {
    opacity: 0;
    transform: rotate(0deg);
  }

  100% {
    opacity: 1;
    transform: rotate(360deg);
  }
}

.circle-box p {
  color: #000000;
  font-weight: 500;
  font-size: 12px;
  padding-top: 5px !important;
  line-height: 18px;
}

.fc-dayGridMonth-button.fc-button.fc-button-primary.fc-button-active {
  display: none !important;
}

.fc-timeGridWeek-button.fc-button.fc-button-primary {
  display: none !important;
}

.fc-timeGridDay-button.fc-button.fc-button-primary {
  display: none !important;
}

.fc-listMonth-button.fc-button.fc-button-primary {
  display: none !important;
}

.fc-button-group {
  position: absolute !important;
  right: 20px !important;
}

.text-last {
  display: flex;
  flex-direction: column;
  justify-content: center;
  overflow: hidden;

  text-align: center;
  /* white-space: nowrap; */
  /* background-color: #c90000; */
  transition: width 0.6s ease;
  color: #000000;
}


/*==============================*/
.new-progress .bg-danger {
  background: transparent linear-gradient(90deg, #F82D2D 0%, #F82D2D 100%) 0% 0% no-repeat padding-box !important;
  border-top-right-radius: 4px;
  border-bottom-right-radius: 4px;
}

.new-progress .bg-warning {
  background: #F1F1F1 !important;
  color: #000000;
}

.new-selctbox {
  background: #F6F6F6;
  border-radius: 10px;
  border: none;
  color: #000000;
  font-weight: 500;
  font-size: 14px;
  height: 53px;
}

.new-selctbox:focus {
  background: #F6F6F6;
  border-radius: 10px;
  border: none;
}


.right-cardbox p {
  color: #888888;
  font-weight: 500;
  font-size: 12px;
  margin-bottom: 0px;
}

.right-cardbox h4 {
  color: #000000;
  font-weight: 500 !important;
  font-size: 16px !important;
  margin-bottom: 0px;
  padding-top: 0px;
}

/* .new-avtar  {  height: 20px !important;} */
.avatar-boxnew {
  width: 50px !important;
  height: 50px !important;
}

/* .avatar-boxnew   { height: 30px !important; } */

.top-calenderbtn {
  background: #F82D2D;
  border-radius: 50%;
  height: 52px;
  width: 52px;
  line-height: 52px;
  text-align: center;
  color: #FFFFFF;
}

.top-calenderbtn .feather,
[data-feather] {
  height: 1.8rem;
  width: 1.8rem;
  display: inline-block;
}

.status-box {
  background: #E5F8ED;
  border-radius: 20px;
  text-align: center;
  padding: 20px 10px;
  position: relative;
}

.status-box h1 {
  color: #000000;
  font-weight: 500;
  font-size: 28px;
  margin-bottom: 0px;
  padding-top: 25px;
}

.status-box h6 {
  color: #000000;
  font-weight: 500;
  font-size: 16px;
  margin-bottom: 0px;
  padding-top: 13px;
}

.pink-statusbox {
  background: #FCEAEA;
}

.device-box {
  background: #FBFBFB;
  border: 1px dashed #E3E3E3;
  border-radius: 12px;
  padding: 10px;
  text-align: center;
  width: 100%;
  height: auto;
}

.device-box img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.device-status h1 {
  color: #000000;
  font-weight: 500;
  font-size: 17px;
  margin-bottom: 5px;
  line-height: 20px;
}

.device-status p {
  color: #000000;
  font-weight: 400;
  font-size: 12px;
  margin-bottom: 0px;
  padding-top: 0px;
}

.question-circle {
  border-radius: 50%;
  width: 30px;
  height: 30px;
  line-height: 28px;
  text-align: center;
  background: #FFFFFF;
  position: absolute;
  right: 10px;
  top: 10px;
}

.question-circle img {
  object-fit: contain;
}

.announcements-boximg {
  width: 90px;
  height: 81px;
  float: right;
}

.announcements-boximg img {
  object-fit: contain;
  width: 100%;
  height: 100%;
}

.fc .fc-toolbar .fc-button-group .fc-button {
  top: -20px !important;
}

.yeaeselect {
  max-width: 130px;
  margin-left: 10px;
  font-weight: 700;
  font-size: 12px;
  padding-left: 10px
}

.attendance-reg-table tr th,
.attendance-reg-table tr td {
  width: 200px;
  font-size: 12px;
  white-space: nowrap;
  padding: 8px 9px;
}

.attendance-reg-table .dropdown-toggle {
  padding: 0 10px 0 0;
  font-size: 12px
}

.attendance-reg-table .dropdown-item {
  padding: 5px 10px;
  font-size: 12px;
  border-bottom: #eee thin solid
}

.attendance-reg-table .dropdown-menu {
  height: 150px;
  overflow-y: scroll
}

.attendance-reg-table .dropdown-toggle:hover {
  padding: 0 10px 0 0;
  font-size: 12px
}

.attendance-reg-table tr th:first-child,
.attendance-reg-table tr td:first-child {
  position: sticky;
  left: 0;
  z-index: 10;
}

.attendance-reg-table tr td:first-child {
  font-weight: bold;
  color: #000
}

.attendance-reg-table tr .bg-datehead {
  background: #d8f5e4 !important
}

.attendance-reg-table tr .bg-datehead2 {
  background: #fceaea !important
}

.attendance-reg-table tr .bg-datehead3 {
  background: #b3f7ff !important
}

.attendance-reg-table tr .bg-datehead4 {
  background: #fff0c1 !important
}

.attendance-reg-table tr .bg-datehead5 {
  background: #d7d7d7 !important;
  font-weight: bold !important;
  color: #000 !important
}

.attendance-reg-table tr .bg-datehead6 {
  background: #333 !important;
  font-weight: bold !important;
  color: #FFFFFF !important;
  font-size: 14px !important
}

.attendance-reg-table tr th {
  background: #edecfb !important;
  border: #fff thin solid !important
}

.attendance-reg-table tr td {
  background: #edecfb;
  border: #fff thin solid !important
}

.attendance-reg-table .badge {
  font-size: 10px;
  font-weight: normal;
  padding: 3px 5px
}

.attendance-reg-table .eldropdpwn {
  border: none;
  outline: none;
  box-shadow: none;
  background: none;
  padding: 0;
  color: #82868b;
  font-size: 12px;
  margin-left: -5px;
  width: 60px
}

.atttimimhg {
  border-top: #c9c9c9 thin solid;
  padding-top: 2px;
  display: block;
  color: #585858
}

@media screen and (max-width: 575px) {
  .status-box h6 {
    font-size: 14px !important;
  }

  .status-box h1 {
    font-size: 20px !important;
  }

  .device-box {
    padding: 5px;
  }

  .device-status h1 {
    font-size: 14px !important;
    line-height: 18px;
  }

  .new-lightbtn {
    padding: 5px 10px;
    margin-bottom: 10px;
  }

  .new-cardbox {
    padding: 12px 15px;
  }

  .cancel-btn {
    padding: 5px 13px;
  }

  .new-btn {
    margin-bottom: 5px;
  }

  .new-cardbox h1 {
    font-size: 16px;
  }

  .red-btn {
    font-size: 12px;
  }

  .upcoming-eventsbox h6 {
    font-size: 12px !important;
    padding-top: 0px !important;
  }

  .more-img {
    float: right;
  }

  .upcoming-box h6 {
    font-size: 14px !important;
  }

  .upcoming-box h5 {
    font-size: 14px;
    line-height: 20px;
  }

  .upcoming-box h5 span {
    font-size: 15px;
  }

  .upcoming-box p {
    font-size: 13px;
    line-height: 16px;
  }

  .new-cardbox h6 {
    font-size: 20px;
    padding-top: 6px;
  }

  .upcoming-box h3 {
    font-size: 13px;
  }

  .new-cardbox p {
    padding-top: 0px;
  }

  .clock-box {
    width: 50px;
    height: 50px;
    line-height: 50px;
  }

  .new-cardboxcontent h5 {
    font-size: 15px !important;
  }

  .new-cardboxcontent h6 {
    font-size: 12px !important;
  }

  .height-box {
    min-height: auto;
  }

  .new-calenderbox {
    width: 35px;
    height: 35px;
    line-height: 35px;
  }

  .prosese-bar h6 {
    font-size: 12px !important;
  }

  .new-cardbox p {
    font-size: 12px;
  }

  .fc-dayGridMonth-button.fc-button.fc-button-primary.fc-button-active {
    padding: 5px 5px !important;
    font-size: 10px !important;
  }

  .fc-sidebarToggle-button.fc-button.fc-button-primary {
    display: none !important;
  }

  .fc-button-group {
    right: 0px !important;
  }

  .fc-daygrid-day.fc-day.fc-day-mon.fc-day-today {
    border-radius: 12px !important;
  }


  .height-boxnew {
    min-height: auto;
  }

}

.tablefirst-column-fixed td:nth-child(2),
.tablefirst-column-fixed th:nth-child(2) {
  left: 0;
  position: sticky;
  z-index: 1;
  background: #fff;
}

.table.datatables-basic tr th{
  position: sticky;
  top:0;
  min-width: 150px;
  /* z-index: 10; */
}
.table.datatables-basic th:nth-child(2) { z-index: 5 !important;  }
.table.datatables-basic th:nth-child(3) { z-index: 3 !important;  }

/* .table.datatables-basic{ height: 800px; } */

.card-statistics-2 .statistics-body{
    padding: 10px 20px !important;
}
.card-statistics-2 .card-header {
    padding: 12px 20px;
}
.card-statistics-2 {
    margin-bottom: 1rem;
}


.anchor-active{
  background: #add8e61a;
  padding: 10px 30px;
  border-radius: 10px;
}


/* FAQ Webiview Css */
.pay-bookingaccord {
  border: 2px solid #f2f2f2;
  border-radius: 4px;
}

.pay-bookingaccord .card-header.collapsed {
  background: #fff;
}

.pay-bookingaccord .card-header {
  border-bottom: #e3e3e3 thin solid;
  background: #f2f2f2;
}

.pay-bookingaccord .card-body {
  font-size: 14px;
  color: #707070;
  font-weight: normal;
}

.pay-bookingaccord .card-header button {
  padding: 0px;
}

.pay-bookingaccord .card {
  border: none;
}

.payment-label {
  font-size: 15px !important;
  font-weight: 500 !important;
  color: #707070 !important;
}

.faq-head h3 {
  font-size: 18px;
  font-weight: 500;
  color: #222;
}

.faq-accordians button.btn-link {
  width: 100%;
  text-align: left;
  text-decoration: none !important;
  padding: 0 !important;
  box-shadow: none;
  outline: none;
}

.faq-accordians button.btn-link:after {
  content: "\f062";
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  font-size: 11px;
  float: right
}

.faq-accordians button.btn-link.collapsed:after {
  content: "\f063";
}