@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@300;400;500;600;700&family=Roboto:wght@300;400;500;700&display=swap');
/*font-family: 'Poppins', sans-serif; | font-family: 'Roboto', sans-serif;*/
@import url('remixicon.css');

/*Common css start*/
*{box-sizing: border-box;}
html,body{width:100%;height:100%;margin:0;padding:0}
body{font-family: 'Roboto', sans-serif;font-weight:400;color:#000;background:#fff;position:relative;overflow-x:hidden;}
ul{list-style:none;margin:0;padding:0}
a,a:visited,a:focus,a:active,a:hover{text-decoration:none;outline:none}
input:required,input:invalid,textarea:required,textarea:invalid{-webkit-box-shadow:none;box-shadow:none}
a,button{-webkit-transition:.3s;transition:.3s}
a{color:#000;font-size:14px}
h1,h2,h3,h4,h5,h6,.h1,.h2,.h3{font-weight:400;margin-top:0;margin-bottom: 0;}
.mb-3{margin-bottom: 30px;}
.justify-content-center{justify-content: center;}
.container-fluid{width:100%;padding-right:15px;padding-left:15px;margin-right:auto;margin-left:auto}
.row{display:-ms-flexbox;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;margin-right:-10px;margin-left:-10px}
.no-gutters{margin-right:0;margin-left:0}
.no-gutters>.col,.no-gutters>[class*=col-]{padding-right:0;padding-left:0}
.col,.col-1,.col-10,.col-11,.col-12,.col-2,.col-3,.col-4,.col-5,.col-6,.col-7,.col-8,.col-9,.col-auto,.col-lg,.col-lg-1,.col-lg-10,.col-lg-11,.col-lg-12,.col-lg-2,.col-lg-3,.col-lg-4,.col-lg-5,.col-lg-6,.col-lg-7,.col-lg-8,.col-lg-9,.col-lg-auto,.col-md,.col-md-1,.col-md-10,.col-md-11,.col-md-12,.col-md-2,.col-md-3,.col-md-4,.col-md-5,.col-md-6,.col-md-7,.col-md-8,.col-md-9,.col-md-auto,.col-sm,.col-sm-1,.col-sm-10,.col-sm-11,.col-sm-12,.col-sm-2,.col-sm-3,.col-sm-4,.col-sm-5,.col-sm-6,.col-sm-7,.col-sm-8,.col-sm-9,.col-sm-auto,.col-xl,.col-xl-1,.col-xl-10,.col-xl-11,.col-xl-12,.col-xl-2,.col-xl-3,.col-xl-4,.col-xl-5,.col-xl-6,.col-xl-7,.col-xl-8,.col-xl-9,.col-xl-auto{position:relative;width:100%;min-height:1px;padding-right:10px;padding-left:10px}
.col{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}
.col-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}
.col-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}
.col-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}
.col-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}
.col-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}
.col-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}
.col-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}
.col-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}
.col-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}
.col-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}
.col-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}
.col-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
@media (min-width:576px) {
.col-sm{-ms-flex-prefer-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}
.col-sm-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}
.col-sm-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}
.col-sm-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}
.col-sm-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}
.col-sm-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}
.col-sm-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}
.col-sm-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-sm-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}
.col-sm-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}
.col-sm-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}
.col-sm-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}
.col-sm-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}
.col-sm-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
}
@media (min-width:768px) {
.col-md{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}
.col-md-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}
.col-md-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}
.col-md-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}
.col-md-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}
.col-md-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}
.col-md-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}
.col-md-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-md-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}
.col-md-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}
.col-md-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}
.col-md-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}
.col-md-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}
.col-md-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
}
@media (min-width:992px) {
.col-lg{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}
.col-lg-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}
.col-lg-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}
.col-lg-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}
.col-lg-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}
.col-lg-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}
.col-lg-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}
.col-lg-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-lg-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}
.col-lg-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}
.col-lg-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}
.col-lg-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}
.col-lg-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}
.col-lg-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
}
@media (min-width:1200px) {
.col-xl{-ms-flex-preferred-size:0;flex-basis:0;-ms-flex-positive:1;flex-grow:1;max-width:100%}
.col-xl-auto{-ms-flex:0 0 auto;flex:0 0 auto;width:auto;max-width:none}
.col-xl-1{-ms-flex:0 0 8.333333%;flex:0 0 8.333333%;max-width:8.333333%}
.col-xl-2{-ms-flex:0 0 16.666667%;flex:0 0 16.666667%;max-width:16.666667%}
.col-xl-3{-ms-flex:0 0 25%;flex:0 0 25%;max-width:25%}
.col-xl-4{-ms-flex:0 0 33.333333%;flex:0 0 33.333333%;max-width:33.333333%}
.col-xl-5{-ms-flex:0 0 41.666667%;flex:0 0 41.666667%;max-width:41.666667%}
.col-xl-6{-ms-flex:0 0 50%;flex:0 0 50%;max-width:50%}
.col-xl-7{-ms-flex:0 0 58.333333%;flex:0 0 58.333333%;max-width:58.333333%}
.col-xl-8{-ms-flex:0 0 66.666667%;flex:0 0 66.666667%;max-width:66.666667%}
.col-xl-9{-ms-flex:0 0 75%;flex:0 0 75%;max-width:75%}
.col-xl-10{-ms-flex:0 0 83.333333%;flex:0 0 83.333333%;max-width:83.333333%}
.col-xl-11{-ms-flex:0 0 91.666667%;flex:0 0 91.666667%;max-width:91.666667%}
.col-xl-12{-ms-flex:0 0 100%;flex:0 0 100%;max-width:100%}
}
.btn{display:inline-block;font-weight:500;text-align:center;white-space:nowrap;vertical-align:middle;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;padding:.5rem 1.5rem;font-size:12px;line-height:1.5;border-radius:100px;transition:color .15s ease-in-out,background-color .15s ease-in-out,border-color .15s ease-in-out,box-shadow .15s ease-in-out}
@media screen and (prefers-reduced-motion:reduce) {
.btn{transition:none}
}
.btn:focus,.btn:hover{text-decoration:none}
.btn.focus,.btn:focus{outline:0;box-shadow:none}
.btn.disabled,.btn:disabled{opacity:.65}
.btn:not(:disabled):not(.disabled){cursor:pointer}
a.btn.disabled,fieldset:disabled a.btn{pointer-events:none}
.btn-primary{color:#fff;background: #35BFCD; background: linear-gradient(90deg, #35BFCD 0%, #59C690 100%);}
.btn-primary:hover{color:#fff;background: rgb(254,126,80);background: linear-gradient(0deg, rgba(254,126,80,1) 0%, rgba(222,89,39,1) 100%);}

.btn-success{color:#fff;background: rgb(27,201,51);background: linear-gradient(180deg, rgba(27,201,51,1) 0%, rgba(21,133,36,1) 100%);}
.btn-success:hover{color:#fff;background: rgb(27,201,51);background: linear-gradient(0deg, rgba(27,201,51,1) 0%, rgba(21,133,36,1) 100%);}

.btn-danger{color:#fff;background: rgb(255,91,91); background: linear-gradient(180deg, rgba(255,91,91,1) 0%, rgba(190,10,10,1) 100%);}
.btn-danger:hover{color:#fff;background: rgb(255,91,91); background: linear-gradient(0deg, rgba(255,91,91,1) 0%, rgba(190,10,10,1) 100%);}

.btn-blue{color:#fff; background: rgb(77,148,234); background: linear-gradient(180deg, rgba(77,148,234,1) 0%, rgba(8,90,188,1) 100%);}
.btn-blue:hover{color:#fff;background: rgb(77,148,234); background: linear-gradient(0deg, rgba(77,148,234,1) 0%, rgba(8,90,188,1) 100%);}

.btn-bluegreen{color:#fff;background: #35BFCD;background: linear-gradient(90deg, #35BFCD 0%, #59C690 100%);}
.btn-bluegreen:hover{color:#fff;background: #59C690; background: linear-gradient(90deg, #59C690 0%, #35BFCD 100%);}

.btn-pink{color:#fff;background: rgb(255,132,102); background: linear-gradient(180deg, rgba(255,132,102,1) 0%, rgba(254,106,164,1) 100%);}
.btn-pink:hover{color:#fff;background: rgb(255,132,102); background: linear-gradient(0deg, rgba(255,132,102,1) 0%, rgba(254,106,164,1) 100%);}
/*Common css end*/
/*Header css start*/
.header-top-block {padding: 20px 5px;}
.head-left-block {display: flex;}
.asg-logo {display: flex;flex-wrap: wrap;}
.logo-title,.year-info {display: block;text-align: center;font-size: 14px;color: #19B266;font-weight: 600;font-family: 'Roboto', sans-serif;}
.head-right-block {display: flex;justify-content: flex-end;flex-wrap: wrap;}
.year-info-block {display: block;width: 100%;text-align: right;}
.year-info{text-align: right;margin: 0;}
/*Menu css start*/
.main-menu-block {background: #35BFCD; background: linear-gradient(90deg, #35BFCD 0%, #59C690 100%);}
.nav-menu-list {display: flex;flex-wrap: wrap;}
.nav-menu-list li {display: flex;}
.nav-menu-list li a {padding: 2px 10px;border-right: 1px solid #fff;line-height: 2;display: inline-block;color: #fff;font-weight: 400;font-size: 13px;transition: 0.2s ease-in-out all;}
.nav-menu-list li a:hover {color: rgb(255 255 255 / 70%);}
/*Menu css end*/
/*Header css end*/
/*Middle css start*/
.middle-section {padding: 15px;display: flex;flex-wrap: wrap;}
.middle-left-block {width: 100%;max-width: 255px;}
.middle-right-block{width: calc(100% - 255px);padding-left: 30px;}

.middle-left-container-block {margin-bottom: 50px;}
.user-profile-info-block {box-shadow: 0 2px 4px rgba(0,0,0,0.25);border-radius: 10px;margin-bottom: 20px;}
.user-porfile-info{background: #35BFCD; background: linear-gradient(90deg, #35BFCD 0%, #59C690 100%);border-radius: 10px 10px 0 0;text-align: center;padding: 25px 0 30px;}
.user-profile-pic {width: 90px;height: 90px;overflow: hidden;margin: 0 auto 15px;background: #fff;border-radius: 100px;}
.user-profile-title {font-size: 18px;color: #fff;font-weight: 600;margin: 0;line-height: 1.2;}
.user-profile-sub-title {font-size: 14px;color: #fff;font-weight: 500;margin-top: 0;margin-bottom: 0;}
.user-profile-info-menu {display: flex;align-items: center;justify-content: center;padding-top: 15px;position: relative;}
.user-profile-info-menu .user-profile-info {margin: 0 10px;transition: 0.2s ease-in-out all;border-bottom: 2px solid transparent;}
.user-profile-info-menu .user-profile-info:hover {border-bottom: 2px solid #35BFCD;}
.user-profile-info-menu .user-profile-info a {font-weight: 500;}

.announcement-block{box-shadow: 0 2px 4px rgba(0,0,0,0.25);border-radius: 10px;padding: 15px;background: #fff;margin-bottom: 20px;position: relative;}
.announcement-list-block {display: flex;justify-content: space-between;}
.announcement-item {text-align: center;}
.announcement-icon-block {width: 62px;height: 62px;display: flex;align-items: center;justify-content: center;position: relative;border: .125rem solid #a7a7a7;margin: 0 auto;border-radius: 6px;}
.alert-icon{border-color: #EC4916;}
.alert-icon:hover{background: #35BFCD; background: linear-gradient(90deg, #35BFCD 0%, #59C690 100%);}
.notification-icon:hover{background: rgb(106,234,119);background: linear-gradient(180deg, rgba(106,234,119,1) 0%, rgba(27,159,40,1) 100%);}
.reports-icon:hover{background: rgb(222,121,248);background: linear-gradient(180deg, rgba(222,121,248,1) 0%, rgba(144,23,174,1) 100%);}
.announcement-icon-block:hover .announcment-icon img{filter: brightness(10);}
.announcement-icon-block:hover .announcment-counter{background: #000;}
.notification-icon{border-color: #1B9F28;}
.reports-icon{border-color: #C116EC;}
.announcment-icon {display: flex;position: relative;}
.announcment-counter {position: absolute;right: -10px;top: -5px;width: 16px;height: 16px;display: flex;align-items: center;justify-content: center;background: #a7a7a7;border-radius: 100px;font-size: .65rem;
color: #fff;font-weight: 500;}
.alert-counter{background: #EC4916;}
.notification-counter{background: #1B9F28;}
.reports-counter{background: #C116EC;}
.announcement-item h6 {font-size: 12px;font-weight: 500;color: #000;margin-bottom: 0;margin-top: 5px;}

.quick-links-block{box-shadow: 0 2px 4px rgba(0,0,0,0.25);border-radius: 10px;padding: 0;background: #fff;margin-bottom: 20px;}
.card-title-block{background: #35BFCD; background: linear-gradient(90deg, #35BFCD 0%, #59C690 100%);border-radius: 10px 10px 0 0;text-align: center;padding: 15px 18px;display: flex; align-items: center;width: 100%;}
.title-h2 {color: #fff;font-weight: 500;font-size: 16px;text-align: left;margin: 0;line-height: 1.4;}
.quick-links-block .title-h2 {font-weight: 600;font-size: 16px;}
.quick-links-list {padding: 18px 20px;}
.quick-links-item {position: relative;margin: 8px 0;padding-left: 15px;}
.quick-links-item::before{content: '';position: absolute; left: 0; top: 8px; background: url("../images/arrow-right.png") no-repeat; background-size: contain; width: 6px; height: 11px;}
.quick-links-item a {font-size: 14px;line-height: 1.4;font-weight: 500;color: #000;}
.quick-links-item a:hover{color: #35BFCD;}

.gradient-btn{border-radius: 10px; display: flex; align-items: center; justify-content: center; color: #fff; height: 57px;background: rgb(238,174,202);background: linear-gradient(90deg, rgba(238,174,202,1) 0%, rgba(148,187,233,1) 100%);font-size: 16px;font-weight: 500;}
.gradient-btn img{margin-right: 10px;}
.gradient-1{background: rgb(42,190,168); background: linear-gradient(90deg, rgba(42,190,168,1) 0%, rgba(13,162,255,1) 100%);}
.gradient-1:hover{background: rgb(42,190,168); background: linear-gradient(280deg, rgba(42,190,168,1) 0%, rgba(13,162,255,1) 100%);}
.gradient-2{background: rgb(255,132,102);background: linear-gradient(90deg, rgba(255,132,102,1) 0%, rgba(254,105,168,1) 100%);}
.gradient-2:hover{background: rgb(255,132,102);background: linear-gradient(280deg, rgba(255,132,102,1) 0%, rgba(254,105,168,1) 100%);}
.gradient-3{background: rgb(237,112,234);background: linear-gradient(90deg, rgba(237,112,234,1) 0%, rgba(135,100,248,1) 100%);}
.gradient-3:hover{background: rgb(237,112,234);background: linear-gradient(280deg, rgba(237,112,234,1) 0%, rgba(135,100,248,1) 100%);}
.user-action-block .gradient-btn-block:not(:last-child) {margin-bottom: 15px;}
.user-info-graph-block{padding: 0; margin-bottom: 25px;}
.user-info-graph-list {display: flex;flex-wrap: wrap;position: relative;margin-left: 0; margin-right: 0;}
.user-info-graph-item{width: calc(100% / 7); padding-left: 0; padding-right: 0;display: flex; align-items: center; justify-content: center;}

/*Announcement dropdown css start*/
.announcement-dropdown-block {position: absolute;background: #fff;z-index: 9;box-shadow: 1px 2px 5px rgba(0,0,0,0.25);border-radius: 20px;min-width: 564px;top: 132px;left: 0;}
.announcement-dropdown-header {position: relative;border-radius: 18px 18px 0 0;background: #35BFCD; background: linear-gradient(90deg, #35BFCD 0%, #59C690 100%);padding: 14px 0;}
.dropdown-close {position: absolute;right: 11px;top: 11px;width: 24px;cursor: pointer;}
.dropdown-close img {width: 100%;filter: brightness(10);}
.announcement-dropdown-header h3 {display: flex;align-items: center;justify-content: center;font-size: 16px;font-weight: 600;color: #fff;}
.announcement-dropdown-header h3 img{margin-right: 10px;width: 18px;height: 18px;object-fit: contain;}
.announcement-dropdown-content-block {padding: 40px 0 40px 50px;}
.announcement-dropdown-list, .notification-dropdown-list {max-height: 300px;overflow: auto;padding-right: 50px;}
.announcement-dropdown-list .announcement-dropdown-item {text-align: left;padding: 12px 0;}
.announcement-dropdown-list .announcement-dropdown-item a {display: flex;align-items: center;font-weight: 500;font-size: 14px;color: #232323;}
.announcement-dropdown-list .announcement-dropdown-item a img {margin-right: 10px;}
.notification-dropdown-item a {display: flex;text-align: left;}
.notification-dd-info {padding-left: 15px;}
.notification-dd-info h4 {font-weight: 500;font-size: 14px;margin-bottom: 0;display: flex;align-items: center;justify-content: space-between;}
.notification-dd-info p {margin-top: 5px;font-size: 12px;}
.notification-dd-label {padding: 3px 8px;background: #ccc;font-size: 12px;border-radius: 3px;color: #fff;}
.label-blue{background: #4897F1;}
.label-purple{background: #884FE4;}
.label-pink{background: #E94FAB;}
/*Announcement dropdown css end*/

/*About dropdown css start*/
.about-dropdown-block{position: absolute;background: #fff;z-index: 9;box-shadow: 1px 2px 5px rgba(0,0,0,0.25);border-radius: 20px;min-width: 1065px;top: 60px;left: 0;padding: 50px;}
.dropdown-close img.filter-none {width: 100%;filter: none;}
.about-dropdown-info-block {display: flex;align-items: flex-start;}
.about-dropdown-img {width: 195px;height: 195px;display: flex;align-items: center;justify-content: center;border-radius: 100px;background: #d2d2d2;}
.about-dropdown-img img{width: 100%; height: 100%; object-fit: cover;}
.about-dropdown-info {width: calc(100% - 195px);padding-left: 70px;}
.about-dropdown-info-head h4 {font-weight: 600;font-size: 20px;}
.about-dropdown-info-head h6 {font-weight: 500;font-size: 13px;}
.about-user-info-list {display: flex;flex-wrap: wrap;margin-top: 30px;}
.about-user-info-item {width: calc(100% / 3);margin-bottom: 20px;padding-right: 15px;}
.about-user-info-item span {font-size: 12px;color: #868686;font-weight: 500;}
.about-user-info-item p {margin: 0;font-size: 12px;font-weight: 500;color: #000;}
/*About dropdown css end*/

/*Timeline dropdown css start*/
.timeline-dropdown-block{position: absolute;background: #fff;z-index: 9;box-shadow: 1px 2px 5px rgba(0,0,0,0.25);border-radius: 20px;min-width: 580px;top: 60px;left: 0;padding: 50px;padding-right: 0;}
.timeline-dropdown-info-list{max-height: 630px;overflow: auto;padding-right: 50px;}
.timeline-dropdown-info-item {display: flex;align-items: center;padding: 20px 0;position: relative;}
.timeline-dropdown-info-item:not(:last-child)::before {content: '';position: absolute;height: 100%;border-left: 2px dashed #000;left: 23px;top: 25px;z-index: -1;}
.timeline-info-icon {display: flex;}
.timeline-info {padding-left: 20px;}
.timeline-info h5 {font-weight: 500;font-size: 14px;line-height: 1;}
.timeline-info span {font-size: 12px;line-height: 1;font-weight: 500;color: #868686;}
/*Timeline dropdown css end*/

/*Team dropdown css start*/
.team-dropdown-block{position: absolute;background: #fff;z-index: 99;box-shadow: 1px 2px 5px rgba(0,0,0,0.25);border-radius: 20px;min-width: 995px;top: 47px;left: 0;padding: 50px;}
.team-dropdown-block{padding-right: 0;}
.team-info-list-block{max-height: 630px;overflow: auto;padding-right: 50px;}
.team-info-block {display: flex;align-items: center;padding-bottom: 30px;}
.team-info-icon {display: flex;}
.team-info {padding-left: 15px;font-weight: 500;font-size: 14px;}
.team-info-level-one, .team-info-level-two, .team-info-level-three, .team-info-level-four, .team-info-level-one-item, .team-info-level-two-item, .team-info-level-three-item, .team-info-level-four-item {position: relative;}
.team-info-level-two, .team-info-level-three, .team-info-level-four {margin-left: 35px;}
.team-info-level-one-item::before {content: '';position: absolute;left: 19px;top: 0;height: calc(100% - 99px);border-left: 2px dotted #000;z-index: -1;}
.team-info-level-two-item::before {content: '';position: absolute;left: 13px;top: 0;height: 11.5%;border-left: 2px dotted #000;z-index: -1;}
.team-info-level-two-item:last-child::before{height: calc(100% - 42px);}
.team-info-level-three-item::before {content: '';position: absolute;left: 13px;top: 0;height: calc(100% - 0px);border-left: 2px dotted #000;z-index: -1;}
.team-info-level-three-item:last-child::before{height: calc(100% - 42px);}

.team-info-level-two-item::after {content: '';position: absolute;left: -14px;top: 15px;height: 1px;width: 20px;border-top: 2px dotted #000;z-index: -1;}
.team-info-level-three-item:first-child::after {content: '';position: absolute;left: -22px;top: 15px;height: 1px;width: 30px;border-top: 2px dotted #000;z-index: -1;}
.team-info-level-four-item::after {content: '';position: absolute;left: -22px;top: 15px;height: 1px;width: 30px;border-top: 2px dotted #000;z-index: -1;}
/* .team-info-level-four-item::before {content: '';position: absolute;left: 13px;top: 0;height: calc(100% - 0px);border-left: 2px dotted #000;z-index: -1;}
.team-info-level-four-item:last-child::before{height: 0;} */
/*Team dropdown css end*/

/*Clock css start*/
.clock-block{width: 180px; height: 180px; position: relative; display: flex; align-items: center; justify-content: center;}
.clock-block::before{content: ''; position: absolute; top: 0; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; background: url('../images/clock-bg.png') no-repeat; background-size: contain; background-position: center center;}
.clock {position: relative;width: 130px;height: 130px;left: 0;top: 0;background-color: white;border-radius: 50%;border: 2px dashed #000;}
.hour-hand {position: absolute;height: 28px;width: 5px;background-color: #000;left: calc(50% - 3.5px);bottom: 50%;transform-origin: center 100%;z-index: 30;}
.hour-hand::after {content: "";	width: 7px;height: 10px;background-color: #000;position: absolute;bottom: -10px;z-index: 30;}
.minute-hand {position: absolute;height: 40px;width: 3px;background-color: #000;left: calc(50% - 2px);bottom: 50%;transform-origin: center 100%;z-index: 20;}
.minute-hand::after {content: "";width: 4px;height: 15px;background-color: #000;position: absolute;bottom: -15px;z-index: 20;}
.second-hand {position: absolute;height: 48px;width: 2px;background-color: #ff0000;left: calc(50% - 1px);bottom: 50%;transform-origin: center 100%;z-index: 10;}
.second-hand::after {content: "";width: 2px;height: 15px;background-color: #ff0000;position: absolute;bottom: -15px;z-index: 10;}
.circle {position: absolute;width: 8px;height: 8px;background-color: #ff0000;left: calc(50% - 4px);top: calc(50% - 4px);border-radius: 50%;z-index: 40;}
.circle::after {content: "";width: 6px;height: 6px;background-color: #ff0000;border-radius: 50%;position: absolute;left: calc(50% - 3px);top: calc(50% - 3px);}
.digits {list-style: none;padding: 0;margin: 0;}
.digit {position: absolute;width: 24px;height: 24px;font-size: 12px;text-align: center;line-height: 24px; font-weight: 700;}
.digit:nth-child(1) {top: 8%;right: 24%;}
.digit:nth-child(2) {top: 24%;right: 8%;}
.digit:nth-child(3) {right: 5px;top: calc(50% - 12px);}
.digit:nth-child(4) {bottom: 24%;right: 8%;}
.digit:nth-child(5) {bottom: 8%;right: 24%;}
.digit:nth-child(6) {left: calc(50% - 12px);bottom: 5px;}
.digit:nth-child(7) {bottom: 8%;left: 24%;}
.digit:nth-child(8) {bottom: 24%;left: 8%;}
.digit:nth-child(9) {left: 5px;top: calc(50% - 12px);}
.digit:nth-child(10) {top: 24%;left: 8%;}
.digit:nth-child(11) {top: 8%;left: 24%;}
.digit:nth-child(12) {top: 5px;left: calc(50% - 12px);}
/*Clock css end*/
/*Month summary css start*/
.box-card-block {box-shadow: 0 1px 5px rgba(0,0,0,0.25);border-radius: 10px;}
.employee-info-card-block .tabs_item {padding-top: 0;}
.min-height-375{min-height: 375px;}
.min-height-285{min-height: 285px;}
.month-summary-card-block .card-title-block {justify-content: space-between;}
.month-summary-dropdown {display: flex;align-items: center;}
.ms-dropdown .ms-select {background: none;border: none;color: #fff;max-width: 65px;}
.ms-dropdown .ms-select:focus{outline: none;}
.ms-dropdown .ms-select option{color: #000; line-height: 1.4;}
.custom-select {width: 100%;position: relative;}
.custom-select select {display: none;}
.selected-item {background: none;padding: 0 10px;color: #fff;cursor: pointer;z-index: 99;font-size: 15px;}
.selected-item:after {content: "";position: absolute;right: 0;top: 7px;background: url('../images/arrow-down.png') no-repeat;width: 7px;height: 5px;background-size: contain;background-position: center;transition: 0.5s;}
.arrowanim.selected-item:after {transform: rotate(180deg);}
.item {background: #fe7e50;padding: 5px 8px;color: #fff;border-top: 1px solid #e76b3e;cursor: pointer;font-size: 14px;text-align: left;}
.item:hover {background: #eb6f43;}
.all-items {position: absolute;top: 100%;left: 0;width: 100%;z-index: 100;min-width: 85px;}
.all-items-hide {display: none;}
.sdf {border: 1px solid red;}

.month-summary-card-list {display: flex;flex-wrap: wrap;align-items: center;justify-content: center;height: 100%;min-height: 320px;gap: 0 70px;}
.ms-card-info {width: 99px;height: 99px;display: flex;flex-wrap: wrap;align-items: center;justify-content: center;border: 1px solid #ccc;border-radius: 17px;box-shadow: 0 3px 0 #ccc;}
.ms-card-green{border-color: #10972F; box-shadow: 0 3px 0 #10972F; color: #10972F;}
.ms-card-purple{border-color: #8A3ABD; box-shadow: 0 3px 0 #8A3ABD; color: #8A3ABD;}
.ms-card-red{border-color: #E81414; box-shadow: 0 3px 0 #E81414; color: #E81414;}
.ms-card-blue{border-color: #0B94CF; box-shadow: 0 3px 0 #0B94CF; color: #0B94CF;}
.ms-value {font-size: 18px;font-weight: 500;margin-top: auto; width: 100%; display: block; text-align: center;}
.ms-title {font-size: 14px;font-weight: 600;margin-bottom: auto; margin-top: 5px; width: 100%; display: block; text-align: center;}
/*Month summary css end*/
/*Calendar css start*/
.calendar-block {width: 100%;margin-bottom: auto;height: 100%;}
.buttons-container {cursor: pointer;}
.week {overflow: hidden;}
.weeks-wrapper.header .day {color: #195fcb;}   
.day{display:inline-block;width:14.28%;text-align:center;cursor:pointer;box-sizing:border-box}
.day.disabled span{color:#aaa}
.day.today span{font-weight:700}
.months-container.hidden,.weeks-container.hidden{display:none}
.months-wrapper{overflow:hidden}
.months-wrapper .month{display:inline-block;width:25%;text-align:center;cursor:pointer}
.months-wrapper .month.one-third{width:33.33%}
.buttons-container{display:flex;align-items:center;justify-content:center;padding:15px 0}
.buttons-container .label-container{display:inline-block;text-align:center;color:#35BFCD;text-transform:capitalize;font-weight:500;margin:0 20px}
.year-dropdown{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;font-size:inherit;font-weight:inherit;font-family:inherit;padding:5px 20px}
.prev-button,.next-button{background:transparent;border:none;padding:10px;position:relative;font-size:0;width:25px;height:25px;cursor:pointer}
.prev-button::before,.next-button::before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background-size:contain;background-position:center center}
.prev-button::before{background:url('../images/back-btn.png') no-repeat}
.next-button::before{background:url('../images/next-btn.png') no-repeat}
.week.highlight{border-radius:5px}
.week .day.header{font-weight:500;text-transform:uppercase;font-size:100%}
.day span{display:inline-block;width:40px;height:40px;line-height:40px;border-radius:50%;vertical-align:middle}
.day.today span{position:relative;display:inline-block;font-size:110%}
.day.today span::after{content:"";position:absolute;bottom:7px;left:50%;transform:translateX(-50%);border-bottom:2px solid orange;width:10px;height:1px}
.day.sunday span{color:#ff8a80}
.week .day.selected span{background:none;color:#35BFCD;font-weight:600}
.weeks-wrapper.header{margin-bottom:5px}
.week .day[disabled="disabled"] span{color:#aaa;cursor:not-allowed}
.months-wrapper .month span{display:inline-block;padding:10px;text-transform:capitalize;margin-bottom:10px}
.special-buttons{text-align:center;border-top:1px solid #eee;padding-top:10px;display:none}
.today-button{margin:0 auto;background:transparent;border:none;padding:5px}
/*Calendar css end*/

/*Tab css start*/
.custom-tab-block{width:100%}
.tab{position:relative;overflow:hidden;width:100%;margin:0;-webkit-font-smoothing:antialiased}
.tabs{display:table;position:relative;overflow:hidden;margin:0;width:100%;padding-top:13px;padding-left:30px;padding-right:30px;border-bottom:1px solid #ACACAC}
.tabs li{float:left;line-height:38px;overflow:hidden;padding:0;position:relative;margin-right:12px}
.tabs li:last-child{margin-right:0}
.tabs a{background-color:#BAFFFA;color:#1D534F;font-weight:600;font-size:16px;display:block;letter-spacing:0;outline:none;padding:7px 15px;min-width:100px;border-radius:10px 10px 0 0;text-decoration:none;text-align:center;line-height:normal;-webkit-transition:all .2s ease-in-out;-moz-transition:all .2s ease-in-out;transition:all .2s ease-in-out}
.tabs_item{display:none;padding:15px 30px;max-height:300px;overflow:auto}
.tabs_item:first-child{display:block}
.tabs .current a, .tabs a:hover{color:#fff;background: #35BFCD; background: linear-gradient(90deg, #35BFCD 0%, #59C690 100%);}
.company-info-item a, .holiday-info-item a{display:flex;align-items:center;background:#F8F8F8;border-radius:10px;padding:7px 12px;margin-bottom:15px;position:relative}
.holiday-info-item a{background: #fff; border: 1px solid #B4B4B4;}
.holiday-info-item a:hover{background: #f8f8f8; border: 1px solid #f8f8f8;}
.company-info-icon, .holiday-info-icon{display:flex;align-items:center;justify-content:center}
.company-info-item h4, .holiday-info h4{margin-left:12px;font-size:14px;font-weight:500;color:#000}
.holiday-info{margin-left: 12px;}
.holiday-info h4{margin-left: 0;}
.holiday-info span{font-weight: 500; color: #919191; font-size: 14px;}
.action-arrow{position:absolute;top:50%;transform:translateY(-50%);right:12px;width:14px;height:11px;background:url('../images/arrow-right-black.png') no-repeat center center;background-size:contain}
.company-info-item a:hover .action-arrow, .holiday-info-item a:hover .action-arrow{background:url('../images/arrow-right-orange.png') no-repeat center center}
.info-tab-block {display: flex;align-items: center;}
.info-tab-img-block {margin-right: 25px;width: 100%;max-width: 350px;}
.info-tab-img-block img{width: 100%;}
.info-tab-description p {font-size: 14px;color: #000;font-weight: 400;line-height: 1.8;}
.info-tab-description {width: calc(100% - 350px);}
.tabs_item .info-tab-img-block {margin-right: 25px;width: auto;max-width: initial;}
.tabs_item .info-tab-description {width: calc(100% - 0px);}
/*Tab css end*/

/*Custom scrollbar css start*/
.tabs_item,.announcement-dropdown-list,.notification-dropdown-list,.timeline-dropdown-info-list,.team-info-list-block,.wish-card-block {scrollbar-width: thin;scrollbar-color: #38BFC8 #F2FDFF;}  
.tabs_item::-webkit-scrollbar, .announcement-dropdown-list::-webkit-scrollbar, .notification-dropdown-list::-webkit-scrollbar,.timeline-dropdown-info-list::-webkit-scrollbar, .team-info-list-block::-webkit-scrollbar,.wish-card-block::-webkit-scrollbar {height: 5px;width: 5px;}
.tabs_item::-webkit-scrollbar-track, .announcement-dropdown-list::-webkit-scrollbar-track, .notification-dropdown-list::-webkit-scrollbar-track,.timeline-dropdown-info-list::-webkit-scrollbar-track, .team-info-list-block::-webkit-scrollbar-track,.wish-card-block::-webkit-scrollbar-track {border-radius: 0px;background-color: #F2FDFF;}
.tabs_item::-webkit-scrollbar-track:hover, .announcement-dropdown-list::-webkit-scrollbar-track:hover, .notification-dropdown-list::-webkit-scrollbar-track:hover,.timeline-dropdown-info-list::-webkit-scrollbar-track:hover, .team-info-list-block::-webkit-scrollbar-track:hover,.wish-card-block::-webkit-scrollbar-track:hover {background-color: #F2FCFF;}
.tabs_item::-webkit-scrollbar-track:active, .announcement-dropdown-list::-webkit-scrollbar-track:active, .notification-dropdown-list::-webkit-scrollbar-track:active,.timeline-dropdown-info-list::-webkit-scrollbar-track:active, .team-info-list-block::-webkit-scrollbar-track:active,.wish-card-block::-webkit-scrollbar-track:active {background-color: #F2FCFF;}
.tabs_item::-webkit-scrollbar-thumb, .announcement-dropdown-list::-webkit-scrollbar-thumb, .notification-dropdown-list::-webkit-scrollbar-thumb,.timeline-dropdown-info-list::-webkit-scrollbar-thumb, .team-info-list-block::-webkit-scrollbar-thumb,.wish-card-block::-webkit-scrollbar-thumb {border-radius: 3px;background-color: #38BFC8;}
.tabs_item::-webkit-scrollbar-thumb:hover, .announcement-dropdown-list::-webkit-scrollbar-thumb:hover, .notification-dropdown-list::-webkit-scrollbar-thumb:hover,.timeline-dropdown-info-list::-webkit-scrollbar-thumb:hover, .team-info-list-block::-webkit-scrollbar-thumb:hover,.wish-card-block::-webkit-scrollbar-thumb:hover {background-color: #38BFC8;}
.tabs_item::-webkit-scrollbar-thumb:active, .announcement-dropdown-list::-webkit-scrollbar-thumb:active, .notification-dropdown-list::-webkit-scrollbar-thumb:active,.timeline-dropdown-info-list::-webkit-scrollbar-thumb:active, .team-info-list-block::-webkit-scrollbar-thumb:active,.wish-card-block::-webkit-scrollbar-thumb:active {background-color: #38BFC8;}
/*Custom scrollbar css end*/

/*Web login css start*/
.web-login-block {width: 100%;margin-top: 50px;margin-bottom: auto;padding: 0 65px;}
.web-login-summary-list li {display: flex;align-items: center;margin: 15px 0;}
.wl-icon {margin-right: 15px;width: 32px;display: flex;align-items: center;justify-content: center;}
.wl-title {font-weight: 500;font-size: 16px;color: #636161;}
.web-login-action-block {margin-top: 30px;}
.web-login-action-block .btn {margin-right: 10px;}
/*Web login css end*/

/*Leave Summary css start*/
.leave-summary-graph-block {width: 100%;margin-top: 40px;}
/*Leave Summary css end*/

/*Employee info css start*/
.employee-info-list-block, .employee-info-table{position: relative;}
.table{width: 100%;border-spacing: 0;}
.employee-info-table .table thead tr th {font-weight: 600;text-align: left;padding: 15px 10px;color: #9B9B9B;font-size: 14px;position: sticky;top: 0;background: #fff;}
.employee-info-table .table thead tr th:last-child {text-align: center;}
.employee-info-table .table tbody tr td {border-top: 1px solid #B4B4B4; border-bottom: 1px solid #B4B4B4; padding: 10px; font-size: 14px; font-weight: 400; color: #000;}
.employee-info-table .table tbody tr td:first-child{border-left: 1px solid #B4B4B4; border-radius: 10px 0 0 10px;}
.employee-info-table .table tbody tr td:last-child{border-right: 1px solid #B4B4B4; border-radius: 0 10px 10px 0;text-align: center;}
.employee-info {display: flex;align-items: center;}
.employee-pic {display: flex;align-items: center;justify-content: center;overflow: hidden;width: 42px;height: 42px;border-radius: 100px;margin-right: 15px;}
.employee-name{font-weight: 500;}
.spacer td{border: none !important; padding: 5px !important;}
/*Employee info css end*/

/*Attendance Summary css start*/
.attedance-summary-block{box-shadow: 0 1px 5px rgba(0,0,0,0.25);border-radius: 10px; padding: 20px;margin-bottom: 20px;}
.attendance-info-text{font-weight: 600; font-size: 22px; color: #000;margin-bottom: 15px;}
.as-card-item {width: 140px;height: 140px;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;border: 1px solid #ccc;border-radius: 20px;box-shadow: 0 3px 4px rgb(204 204 204 / 50%);}
.as-info h5 {font-weight: 500;margin-top: 0;font-size: 16px;}
.as-value {font-weight: 500; font-size: 18px;}
.as-card-blue{border: 1px solid #3C8EEF; box-shadow: 0 3px 4px rgba(60, 141, 239, 0.5);}
.as-card-blue .as-value {color: #2580EC;}
.as-card-green{border: 1px solid #0CB13A; box-shadow: 0 3px 4px rgba(12, 177, 59, 0.5);}
.as-card-green .as-value {color: #0CB13A;}
.as-card-pink{border: 1px solid #E316C2; box-shadow: 0 3px 4px rgba(227, 22, 193, 0.5);}
.as-card-pink .as-value {color: #E316C2;}
.as-card-light-green{border: 1px solid #0EAFBB; box-shadow: 0 3px 4px rgba(14, 175, 187, 0.5);}
.as-card-light-green .as-value {color: #0EAFBB;}
.as-card-red{border: 1px solid #EB1515; box-shadow: 0 3px 4px rgba(235, 21, 21, 0.5);}
.as-card-red .as-value {color: #EB1515;}
.as-card-purple{border: 1px solid #8B3CEF; box-shadow: 0 3px 4px rgba(138, 60, 239, 0.5);}
.as-card-purple .as-value {color: #8B3CEF;}
.as-card-orange{border: 1px solid #ED7A10; box-shadow: 0 3px 4px rgba(237, 123, 16, 0.5);}
.as-card-orange .as-value {color: #ED7A10;}
.as-card-dark-pink{border: 1px solid #E4187A; box-shadow: 0 3px 4px rgba(228, 24, 123, 0.5);}
.as-card-dark-pink .as-value {color: #E4187A;}
.as-card-dark-blue{border: 1px solid #110DC9; box-shadow: 0 3px 4px rgba(16, 13, 201, 0.5);}
.as-card-dark-blue .as-value {color: #110DC9;}
.as-card-list {display: flex;width: 100%;overflow-y: hidden;overflow-x: auto;padding: 8px 5px;gap: 25px;margin-left: -5px;}
.as-img {margin-top: auto;}
.as-info {width: 100%;text-align: center;margin-bottom: auto;}
/*Attendance Summary css end*/

/*Attendance and overtine graph css start*/
.attendance-overtime-graph-card-block .tabs_item {overflow: hidden;}
/*Attendance and overtine graph css end*/

/*Model css start*/
.blocker{position:fixed;top:0;right:0;bottom:0;left:0;width:100%;height:100%;overflow:auto;z-index:99;padding:20px;box-sizing:border-box;background-color:#000;background-color:rgba(0,0,0,0);text-align:center}
.blocker:before{content:"";display:inline-block;height:100%;vertical-align:middle;margin-right:-.05em}
.blocker.behind{background-color:transparent}
.modal{display:none;vertical-align:middle;position:relative;z-index:2;max-width:1280px;box-sizing:border-box;width:90%;background:#fff;padding:15px 30px;-webkit-border-radius:8px;-moz-border-radius:8px;-o-border-radius:8px;-ms-border-radius:8px;border-radius:30px;-webkit-box-shadow:-3px 0 14px rgb(0 0 0 / 42%);-moz-box-shadow:-3px 0 14px rgb(0 0 0 / 42%);-o-box-shadow:-3px 0 14px rgb(0 0 0 / 42%);-ms-box-shadow:-3px 0 14px rgb(0 0 0 / 42%);box-shadow:-3px 0 14px rgb(0 0 0 / 42%);text-align:left}
.modal a.close-modal{position:absolute;top:20px;right:20px;display:block;width:30px;height:30px;text-indent:-9999px;background-size:contain;background-repeat:no-repeat;background-position:center center;background-image:url('../images/close-icon.png');}
.modal-spinner{display:none;position:fixed;top:50%;left:50%;transform:translateY(-50%) translateX(-50%);padding:12px 16px;border-radius:5px;background-color:#111;height:20px}
.modal-spinner>div{border-radius:100px;background-color:#fff;height:20px;width:2px;margin:0 1px;display:inline-block;-webkit-animation:sk-stretchdelay 1.2s infinite ease-in-out;animation:sk-stretchdelay 1.2s infinite ease-in-out}
.modal-spinner .rect2{-webkit-animation-delay:-1.1s;animation-delay:-1.1s}
.modal-spinner .rect3{-webkit-animation-delay:-1s;animation-delay:-1s}
.modal-spinner .rect4{-webkit-animation-delay:-.9s;animation-delay:-.9s}
@-webkit-keyframes sk-stretchdelay {
0%,40%,100%{-webkit-transform:scaleY(0.5)}
20%{-webkit-transform:scaleY(1.0)}
}
@keyframes sk-stretchdelay {
0%,40%,100%{transform:scaleY(0.5);-webkit-transform:scaleY(0.5)}
20%{transform:scaleY(1.0);-webkit-transform:scaleY(1.0)}
}
/*Model css end*/

/*Wish modal css start*/
.wish-title-block{margin: 0; padding: 10px 0;}
.wish-title-block h3 {display: flex;align-items: center;justify-content: center;margin-bottom: 0; font-size: 22px; font-style: italic; color: #36BFC8; font-weight: 500;}
.wish-title-block h3 img {margin-right: 15px;max-width: 35px;}
.wish-card-block {max-height: 580px;overflow: auto;overflow-x: hidden;padding: 0 30px;}
.wish-card-list-block {margin-left: -15px;margin-right: -15px;display: flex;flex-wrap: wrap;}
.wish-card-item-block {width: calc(100% / 3);padding-left: 15px;padding-right: 15px;margin-bottom: 30px;margin-top: 80px;}
.wish-user-info-block {border-radius: 20px;padding: 0px;position: relative;background: #fff;border: 1px solid #fff;}
.wish-user-info-block::before {content: '';position: absolute; width: calc(100% - 7px);height: calc(100% - 6px);top: 3px;left: 3px;right: 0;bottom: 0;background: #fff;z-index: 0;border-radius: 18px;transform: scale(1.01);}
.hb-user-info-block{background: #36BFCA;background: linear-gradient(180deg, #36BFCA 0%, #57C592 100%);}
.hwa-user-info-block{background: #36BFCA;background: linear-gradient(180deg, #36BFCA 0%, #57C592 100%);}
.nj-user-info-block{background: #36BFCA;background: linear-gradient(180deg, #36BFCA 0%, #57C592 100%);}
.wish-user-info-block [class*="wish-"] {position: relative;z-index: 1;}
.wish-user-img-block {width: 128px;height: 128px;margin: -65px auto 20px;border-radius: 100px;padding: 8px;display: flex;align-items: center;justify-content: center;position: relative;top: 0;background: #ccc;}
.hb-user-info-block .wish-user-img-block {background: #36BFCA;background: linear-gradient(180deg, #36BFCA 0%, #57C592 100%);}
.hwa-user-info-block .wish-user-img-block {background: #36BFCA;background: linear-gradient(180deg, #36BFCA 0%, #57C592 100%);}
.nj-user-info-block .wish-user-img-block {background: #36BFCA;background: linear-gradient(180deg, #36BFCA 0%, #57C592 100%);}
.wish-user-img {width: 100%;height: 100%;background: #fff;border-radius: 100px;display: flex;align-items: center;justify-content: center;overflow: hidden;}
.wish-user-img img {width: 100%;height: 100%;object-fit: cover;}
.wish-user-info-list {padding: 0 50px;margin-bottom: 30px;}
.wish-user-info-list h4 {font-weight: 600;font-size: 20px;text-transform: uppercase;}
.wish-user-info-list h6 {font-weight: 600;font-size: 12px;color: #6a6a6a;}
.wish-date {display: flex;align-items: center;margin: 10px 0;font-weight: 600;font-size: 14px;}
.hb-user-info-block .wish-date {color: #36BFC8;}
.hwa-user-info-block .wish-date {color: #36BFC8;}
.nj-user-info-block .wish-date {color: #36BFC8;}
.wish-date img {margin-right: 10px;}
.wish-user-info {font-weight: 600;font-size: 13px;color: #000;margin-bottom: 5px;}
.wish-action-block {margin-top: 30px;margin-left: -15px;margin-right: -15px;}
.wish-action-block .btn {width: 100%;}
.wish-label-block{width: 75px; height: 80px; text-align: center;position: absolute !important;left: 0;top: 0;background: url('../images/card-corner.png') no-repeat; background-size: contain; background-position: center;}
.wish-corner-label {color: #fff;font-weight: 600;font-size: 14px;text-transform: uppercase;transform: rotate(-45deg);display: block;position: absolute !important;top: 16px;left: 2px;}
.wish-corner-label sup{font-size: 10px; font-weight: 400;}
.modal-content-block {padding: 40px 0;}
.info-tab-description h3 {color: #E96535;font-size: 16px;font-weight: 500;margin-bottom: 0;}
.venue-info h4 {font-weight: 500;font-size: 16px;font-weight: 500;margin-bottom: 0;}
.info-tab-description p {color: #000;font-size: 14px;font-weight: 400;margin-top: 5px;line-height: 1.5;}
.info-list-block {display: flex;align-items: center;margin-top: 40px;}
.info-list-block li{font-size: 14px; color: #000; font-weight: 500;display: flex;align-items: center;}
.info-list-block li:not(:last-child){margin-right: 60px;}
.info-list-block li .info-list-icon {margin-right: 5px;display: flex;}
/*Wish modal css end*/

/*Auth css start*/
.auth-header-section {padding: 20px 40px;background: #fff;box-shadow: -7px 3px 10px rgba(0,0,0,0.25);position: sticky;top: 0;z-index: 1;}
.auth-contact-info {display: flex;align-items: center;justify-content: flex-end;height: 100%;}
.auth-contact-info ul {display: flex;align-items: center;gap: 25px;}
.auth-contact {display: flex;align-items: center;line-height: 1;}
.auth-contact-icon img {width: 20px;margin-right: 6px;}
.auth-middle-section {background-repeat: no-repeat;background-size: cover;background-position: center;height: calc(100vh - 220px);min-height: 500px;display: flex;}
.auth-form-block {width: 80%;height: 100%;padding: 30px 40px;background: rgb(255,255,255);background: linear-gradient(90deg, rgba(255, 255, 255, 1) 0%, rgb(255 255 255 / 99%) 50%, rgba(226, 50, 56, 0) 100%);display: flex;align-items: center;}
.auth-form-content-block {padding: 20px 50px;max-width: 580px;}
.auth-company-logo {text-align: center;margin-bottom: 20px;}
.auth-company-logo img {max-width: 220px;}
.auth-form-content-block h3 {font-weight: 400;font-size: 2rem;font-family: 'Poppins', sans-serif;line-height: 1;}
.auth-form-content-block h3 strong {font-weight: 800;text-transform: uppercase;background: linear-gradient(90deg, rgba(56,191,199,1) 0%, rgba(88,197,145,1) 100%);-webkit-background-clip: text;background-clip: text;-webkit-text-fill-color: transparent;}
.auth-form-content-block p {font-weight: 400;font-size: .77rem;font-family: 'Poppins', sans-serif;max-width: initial;margin-bottom: 5px;margin-top: 5px;}

.auth-inputGroup {position: relative;margin-bottom: 25px;}
.auth-inputGroup input {font-size: 100%;padding: .65em 3em;outline: none;border: 2px solid #13B7C8;background-color: transparent;border-radius: 100px;width: 100%; font-family: 'Poppins', sans-serif; color: #000; font-size: .9rem;}
.auth-inputGroup label {position: absolute;left: 0;padding: .8em 2em;margin-left: 15px;pointer-events: none;transition: all 0.3s ease;color: #000; font-family: 'Poppins', sans-serif; font-size: .9rem;}
.auth-inputGroup :is(input:focus, input:valid)~label {transform: translateY(-50%) scale(.9);margin: 0em;margin-left: 2em;padding: 0.4em;background-color: #fff;}
.auth-inputGroup :is(input:focus, input:valid) {border-color: #13B7C8;}
.inputIcon {position: absolute;left: 20px;top: 13px;}
.inputIcon img {width: 12px;}
.auth-title {color: #35BFCD;font-size: 1.6rem;font-weight: 900;font-family: 'Poppins';margin-bottom: 20px;line-height: 1;margin-top: 15px;}
.toggle-password {position: absolute;cursor: pointer;top: 10px;right: 15px;font-size: 1.4rem;z-index: 1;}
.forgot-link {display: flex;align-items: center;justify-content: flex-end;padding-right: 15px;color: #000;font-family: 'Poppins', sans-serif;font-weight: 500;margin-top: -15px;}
.sign-in-btn {border: none;width: 100%;margin-top: 20px;font-size: 1rem;padding: 12px 15px;}
.auth-footer-section {position: sticky;bottom: 0;z-index: 1;}
.footer-app-info-block {background: #C5FFE8;display: flex;align-items: center;padding: 5px 40px;gap: 100px;}
.footer-app-info p {margin: 0;font-family: 'Poppins', sans-serif;font-size: .8rem;font-weight: 400;color: #000;}
.app-action-block {display: flex;gap: 10px;}
.app-action img {max-width: 130px;}
.footer-app-action-block h5 {margin-bottom: 0;font-family: 'Poppins', sans-serif;font-weight: 500;}
.footer-copyright-block {background: #4EBA8D;padding: 10px 40px;}
.footer-copyright {display: flex;align-items: center;justify-content: space-between;}
.footer-copyright p {margin: 0;color: #fff;font-family: 'Poppins';font-size: .8rem;font-weight: 500;}
/*Contact us modal css start*/
.jquery-modal.blocker::after {content: '';position: fixed;top: 0;left: 0;right: 0;bottom: 0;background: rgb(255 255 255 / 20%);backdrop-filter: blur(2px);}
.contactus-modal {max-width: 800px;padding: 0;}
.contactus-modal .modal-content-block{padding: 0;display: flex;justify-content: space-between;}
.modal-contact-info{width: 50%; padding: 50px;}
.modal-contact-img {width: 50%;border-radius: 30px;overflow: hidden;display: flex;}
.modal-contact-img img {width: 100%;height: 100%;object-fit: cover;}
.modal-contact-info h3 {font-size: 1.8rem;font-weight: 600;margin-bottom: 20px;font-family: 'Poppins', sans-serif;}
.modal-contact-info-list li {display: flex;align-items: center;gap: 15px;margin: 18px 0;}
.c-text {font-weight: 500;font-size: .9rem;font-family: 'Poppins', sans-serif;}
/*Contact us modal css end*/
/*Auth css end*/

/*Middle css end*/

/*Media css start*/
/* @media screen and (max-width:1519px){
    .user-info-graph-list{flex-wrap: nowrap;margin-left: 0;margin-right: 0;overflow-x: auto;overflow-y: hidden;}
    .user-info-graph-item {width: 100%;min-width: 220px; padding-left: 10px;padding-right: 10px;}
    .user-info-graph-list {scrollbar-width: thin;scrollbar-color: #35BFCD #F2FDFF;}  
    .user-info-graph-list::-webkit-scrollbar {height: 5px;width: 5px;}
    .user-info-graph-list::-webkit-scrollbar-track {border-radius: 0px;background-color: #f5f5f5;}
    .user-info-graph-list::-webkit-scrollbar-track:hover {background-color: #f1f1f1;}
    .user-info-graph-list::-webkit-scrollbar-track:active {background-color: #f1f1f1;}
    .user-info-graph-list::-webkit-scrollbar-thumb {border-radius: 3px;background-color: #35BFCD;}
    .user-info-graph-list::-webkit-scrollbar-thumb:hover {background-color: #DF602F;}
    .user-info-graph-list::-webkit-scrollbar-thumb:active {background-color: #DF602F;}
} */
@media screen and (max-width:1699px){
    .title-h2{font-size: 14px;}
    .month-summary-card-list {gap: 0 20px;min-height: 250px;margin-top: 20px;}
    .tabs{padding-left: 15px;padding-right: 15px;overflow-x: auto;flex-wrap: nowrap;display: flex;}
    .tabs_item{padding: 15px;}
    .employee-info-card-block .tabs_item {padding-top: 0;}
    .tabs li{margin-right: 2px;}
    .tabs a {font-size: 13px;padding: 8px 12px;min-width: initial;}
    .web-login-block{padding: 0 20px;}
    .wish-card-block {padding: 0 15px;}
    .as-card-list{gap: 10px;}
    .as-img img {max-width: 25px;}
    .as-info h5 {font-size: 11px;margin: 4px 0 0px;}
    .as-value {font-size: 13px;}
    .as-card-item{height: 100px;}
    .middle-left-block {width: 100%;max-width: 245px;}
    .middle-right-block{width: calc(100% - 245px);padding-left: 15px;}
    .attendance-info-text {font-weight: 500;font-size: 14px;margin-bottom: 5px;}
    .user-porfile-info{padding: 15px 0 15px;}
    .user-profile-pic{width: 80px;height: 80px;}
    .user-profile-title{font-size: 14px;}
    .user-profile-sub-title{font-size: 12px;font-weight: 400;}
    .user-profile-info-menu{padding-top: 8px;}
    .quick-links-list {padding: 10px;}
    .quick-links-item::before{top: 4px;}
    .gradient-btn{height: 50px;font-size: 14px;font-weight: 400;}
    .week .day.header{font-size: 14px;}
    .day span {width: 36px;height: 36px;line-height: 36px;font-size: 12px;}
    .attedance-summary-block{padding: 23px 20px;}
    .min-height-375 {min-height: 350px;}
    .selected-item{font-size: 13px;}
    .item{font-size: 12px;}
}
@media screen and (max-width:1600px){
    .clock{width: 115px;height: 115px;}
}
@media screen and (max-width:1519px){
    .wl-title{font-size: 14px;}
    .web-login-action-block {margin-top: 10px;}
    .web-login-action-block .btn {margin-right: 0px;padding: .5rem 1rem;}
    .employee-info-table .table tbody tr td{padding: 10px 5px;font-size: 12px;}
    .card-title-block{padding: 15px 10px;}
    .title-h2 {font-size: 12px;}
    .ms-dropdown .ms-select{max-width: 55px;font-size: 11px;}
    .auth-middle-section {min-height: 430px;}
}

@media screen and (max-width:1439px){
    .auth-header-section {padding: 5px 40px;}
    .auth-logo img {max-width: 100px;}
    .auth-middle-section {height: calc(100vh - 165px);}
    .auth-company-logo img {max-width: 160px;}
    .auth-form-content-block {max-width: 460px;}
    .auth-company-logo {margin-bottom: 20px;}
    .auth-form-content-block h3{font-size: 1.5rem;}
    .auth-form-content-block p{font-size: .8rem;margin-top: 6px;}
    .auth-title {font-size: 1rem;margin-bottom: 10px;}
    .auth-inputGroup {margin-bottom: 18px;}
    .auth-inputGroup input{padding: .6em 2.5em;font-size: .8rem;}
    .auth-inputGroup label{padding: .8em 2em;font-size: .8rem;margin-left: 10px;}
    .inputIcon {left: 18px;top: 10px;}
    .inputIcon img {width: 10px;}
    .sign-in-btn {margin-top: 15px;padding: 8px 10px;font-size: .85rem;}
    .footer-copyright-block {padding: 7px 40px;}
    .footer-app-info p, .footer-copyright p{font-size: .65rem;}
    .app-action img {max-width: 100px;}
    .toggle-password{top: 8px;font-size: 1.2rem;right: 15px;}
    .forgot-link{padding-right: 12px;}
    .forgot-link a {font-size: .8rem;}
}

@media screen and (max-width:1399px){
    .clock{width: 100px;height: 100px;}
    .second-hand{height: 38px;}
    .minute-hand{height: 34px;}
    .hour-hand{height: 22px;}
}
/*Media css end*/