/*============================
 [Table of CSS]

1. General
2. Table
3. Helper Class
4. Bootstrap Classes
5. Header
6. Sidebar
7. Content
8. Login
9. Dashboard
10. Activity
11. Select2
12. Nav tabs
13. Holidays
14. Edit Profile
15. Chat
16. Focus Label
17. Leave
18. Employee
19. Events
20. Profile
21. Notifications
22. Roles & Permissions
23. Chat Right Sidebar
24. Invoice
25. Doctors
26. Add Doctor
27. Payslip
28. Attendance
29. Inbox
30. Mail View
31. Blog
32. Blog View
33. UI Kit
34. Error
35. Lock Screen
36. Voice call
37. Video Call
38. Incoming call
39. Notification settings
40. Chat Sidebar
41. Gallery
42. Settings
43. Responsive

========================================*/

/*-----------------
	1. General
-----------------------*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
html {
	height: 100%;
}
body {
	font-family: "Open Sans", sans-serif;
	font-weight: 500;
	font-size: 14px;
	font-weight: normal;
	color: #333448;
	background: linear-gradient(#ffffffa1, #ffffffa1), url(../img/bg.png);
	overflow-x: hidden;
	height: 100%;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0;
}
h1,
.h1 {
	font-size: 2.25rem;
}
h2,
.h2 {
	font-size: 1.875rem;
}
h3,
.h3 {
	font-size: 1.5rem;
}
h4,
.h4 {
	font-size: 1.125rem;
}
h5,
.h5 {
	font-size: 0.875rem;
}
h6,
.h6 {
	font-size: 0.75rem;
}
/* a:hover,
a:active,
a:focus {
	text-decoration: none;
	color: #009ce7;
	outline: none;
} */
.form-control {
	box-shadow: none;
	padding: 10px 15px;
	font-size: 14px;
	min-height: 45px;
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
}
.form-control::placeholder {
	font-size: 13px;
}
.form-control:focus {
	border-color: #3a57e8;
	box-shadow: none;
	outline: 0 none;
}
a {
	color: #17a460;
	text-decoration: none;
}
input,
button,
a {
	transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease;
}
input,
button {
	outline: none;
}
input[type="file"] {
	height: auto;
	padding: 6px 0.75rem;
}
input[type=text],
input[type=password] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
textarea.form-control {
	resize: vertical;
}
.navbar-nav > li {
	float: left;
}
.input-block {
	margin-bottom: 20px;
}
.display-block {
	display: block;
}
.btn.rounded {
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}
.btn.focus,
.btn:focus {
	box-shadow: inherit !important;
}
.list-group-item {
	border: 1px solid #eaeaea;
}

/*-----------------
	2. Table
-----------------------*/

.table>:not(:first-child) {
	border: 0;
}
table.table td,table.table th {
	border-color: #dee2e6;
}
.table-bordered td, .table-bordered th {
    border: 1px solid #dee2e6;
}
.dataTables_length select {
    appearance: auto;
}
.table {
	color: #000;
	border: 1px solid #f0f0f0;
}
.table.table-white {
	background-color: #fff;
}
.table > tbody > tr > td {
	/* font-weight: 300; */
}
.table-striped > tbody > tr:nth-of-type(2n + 1) {
	background-color: #f6f6f6;
}
table.table td .avatar {
	margin: 0 5px 0 0;
}
table.table td h2 {
	display: inline-block;
	font-size: inherit;
	font-weight: 400;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}
table.table td h2 a {
	color: #757575;
}
table.table td h2 a:hover {
	color: #009efb;
}
table.table td h2 span {
	color: #9e9e9e;
	display: block;
	font-size: 12px;
	margin-top: 3px;
}
.table-nowrap td, .table-nowrap th {
    white-space: nowrap;
}
/*-----------------
	3. Helper Class
-----------------------*/

.m-r-5 {
	margin-right: 5px !important;
}
.m-r-10 {
	margin-right: 10px !important;
}
.m-l-5 {
	margin-left: 5px !important;
}
.m-t-0 {
	margin-top: 0 !important;
}
.m-t-10 {
	margin-top: 10px !important;
}
.m-t-20 {
	margin-top: 20px !important;
}
.m-t-30 {
	margin-top: 30px !important;
}
.m-t-50 {
	margin-top: 50px !important;
}
.m-b-10 {
	margin-bottom: 10px !important;
}
.m-b-20 {
	margin-bottom: 20px !important;
}
.m-b-30 {
	margin-bottom: 30px !important;
}
.w-40 {
	width: 40px;
}
.block {
	display: block !important;
}
.text-ellipsis {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.text-muted-light {
	color: #aaa;
}
.card-box {
	background-color: #fff;
	border-radius: 12px;
	margin-bottom: 30px;
	padding: 20px;
	position: relative;
}
.card-title {
	color: #333448;
	font-size: 16px;
	margin-bottom: 20px;
}
.page-title {
	color: #333448;
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 25px;
}
.page-sub-title {
	color: #565656;
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 20px;
}
.cal-icon:after {
	background: transparent url("../img/icons/calendar-icon.svg") no-repeat scroll 0 0;
	bottom: 0;
	content: "";
	display: block;
	height: 24px;
	margin: auto;
	position: absolute;
	right: 15px;
	top: 0;
	width: 24px;
	cursor: pointer;
}
.cal-icon {
	position: relative;
	width: 100%;
}
.time-icon:after {
	background: transparent url("../img/clock.png") no-repeat scroll 0 0;
	bottom: 0;
	content: "";
	display: block;
	height: 19px;
	margin: auto;
	position: absolute;
	right: 15px;
	top: 0;
	width: 19px;
}
.time-icon {
	position: relative;
	width: 100%;
}
.badge-success-border {
	border: 1px solid #55ce63;
	color: #55ce63;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}
.badge-danger-border {
	border: 1px solid #f62d51;
	color: #f62d51;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}
.badge-warning-border {
	border: 1px solid #ffbc34;
	color: #ffbc34;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}
.badge-info-border {
	border: 1px solid #009efb;
	color: #009efb;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}
.modal-footer.text-start {
	text-align: left;
}
.modal-footer.text-center {
	text-align: center;
}
.font-18 {
	font-size: 18px;
}
.border-right {
	border-right: 1px solid #e7e7e7;
}
.blur {
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	-o-filter: blur(3px);
	-ms-filter: blur(3px);
	filter: blur(3px);
}
.btn {
	font-size: 0.875rem;
}

/*-----------------
	4. Bootstrap Classes
-----------------------*/

.btn-white {
	background-color: #fff;
	border: 1px solid #ccc;
	color: #333;
}
.rounded,
.circle {
	border-radius: 500px;
}
.bg-primary,
.badge-primary {
	background-color: #009efb !important;
}
.bg-success,
.badge-success {
	/* background-color: #55ce63 !important; */
}
.bg-info,
.badge-info {
	background-color: #009efb !important;
}
.bg-warning,
.badge-warning {
	background-color: #ffbc34 !important;
}
.bg-danger,
.badge-danger {
	background-color: #f62d51 !important;
}
.bg-white {
	background-color: #fff;
}
.text-primary,
.dropdown-menu > li > a.text-primary {
	color: #3a57e8 !important;
}
.text-success,
.dropdown-menu > li > a.text-success {
	color: #55ce63;
}
.text-danger,
.dropdown-menu > li > a.text-danger {
	color: #f62d51;
}
.text-info,
.dropdown-menu > li > a.text-info {
	color: #009efb;
}
.text-warning,
.dropdown-menu > li > a.text-warning {
	color: #ffbc34;
}
.text-purple,
.dropdown-menu > li > a.text-purple {
	color: #7460ee;
}
.btn-primary {
	border-color: transparent;
	background-color: #3a57e8;
	border-radius: 8px;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary.active,
.btn-primary:active,
.open > .dropdown-toggle.btn-primary {
	background-color: #00d3c7;
	border: 1px solid #00d3c7;
	color: #fff;
}
.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary.focus:active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open > .dropdown-toggle.btn-primary.focus,
.open > .dropdown-toggle.btn-primary:focus,
.open > .dropdown-toggle.btn-primary:hover {
	background-color: #009efb;
	border: 1px solid #009efb;
}
.btn-primary.active:not(:disabled):not(.disabled),
.btn-primary:active:not(:disabled):not(.disabled),
.show > .btn-primary.dropdown-toggle {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}
.btn-outline-primary {
	border-color: #009efb;
	color: #009efb;
}
.btn-outline-primary:hover {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}
.btn-outline-primary.active:not(:disabled):not(.disabled),
.btn-outline-primary:active:not(:disabled):not(.disabled),
.show > .btn-outline-primary.dropdown-toggle {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}
.btn-success {
	background-color: #55ce63;
	border: 1px solid #55ce63
}
.btn-success:hover,
.btn-success:focus,
.btn-success.active,
.btn-success:active,
.open > .dropdown-toggle.btn-success {
	background: #4ab657;
	border: 1px solid #4ab657
}
.btn-success.active.focus,
.btn-success.active:focus,
.btn-success.active:hover,
.btn-success.focus:active,
.btn-success:active:focus,
.btn-success:active:hover,
.open > .dropdown-toggle.btn-success.focus,
.open > .dropdown-toggle.btn-success:focus,
.open > .dropdown-toggle.btn-success:hover {
	background: #4ab657;
	border: 1px solid #4ab657
}
.btn-info {
	background-color: #009efb;
	border: 1px solid #009efb
}
.btn-info:hover,
.btn-info:focus,
.btn-info.active,
.btn-info:active,
.open > .dropdown-toggle.btn-info {
	background-color: #028ee1;
	border: 1px solid #028ee1
}
.btn-info.active.focus,
.btn-info.active:focus,
.btn-info.active:hover,
.btn-info.focus:active,
.btn-info:active:focus,
.btn-info:active:hover,
.open > .dropdown-toggle.btn-info.focus,
.open > .dropdown-toggle.btn-info:focus,
.open > .dropdown-toggle.btn-info:hover {
	background-color: #028ee1;
	border: 1px solid #028ee1
}
.btn-warning {
	background: #ffbc34;
	border: 1px solid #ffbc34
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning.active,
.btn-warning:active,
.open > .dropdown-toggle.btn-warning {
	background: #e9ab2e;
	border: 1px solid #e9ab2e
}
.btn-warning.active.focus,
.btn-warning.active:focus,
.btn-warning.active:hover,
.btn-warning.focus:active,
.btn-warning:active:focus,
.btn-warning:active:hover,
.open > .dropdown-toggle.btn-warning.focus,
.open > .dropdown-toggle.btn-warning:focus,
.open > .dropdown-toggle.btn-warning:hover {
	background: #e9ab2e;
	border: 1px solid #e9ab2e
}
.btn-danger {
	background: #f62d51;
	border: 1px solid #f62d51
}
.btn-danger:hover,
.btn-danger:focus {
	background-color: #e6294b;
	border: 1px solid #e6294b
}
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
	background-color: #00d3c7;
	border-color: #00d3c7;
}
.pagination > li > a,
.pagination > li > span {
	color: #3a57e8;
	font-size: 14px;
    padding: 5px 15px !important;
}
.page-item.active .page-link {
	background-color: #3a57e8;
	border-color: #3a57e8;
}
.dropdown-menu {
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 3px;
	transform-origin: left top 0;
	box-shadow: inherit;
	background-color: #fff;
}
.navbar-nav .open .dropdown-menu {
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
}
.btn-group-xs > .btn,
.btn-xs {
	min-height: 22px;
	min-width: 22px;
}
.dropdown-menu {
	font-size: 13px;
}
.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
	box-shadow: none;
}
.btn-link {
	color: #333;
}
.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
	background-color: rgba(0, 0, 0, 0.2);
}
/* .card {
	margin-bottom: 25px;
	box-shadow: none;
	border: 0;
	border-radius: 12px;
	width: 100%;
} */
.card-title {
	margin-bottom: 1.125rem;
}
.dropdown-action .dropdown-toggle:after {
	display: none;
}
.badge.rounded-pill {
	border-radius: 10rem;
}
.badge-primary {
	color: #fff;
}
.btn.btn-rounded {
	border-radius: 50px;
}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
	background-color: #eee;
	border-color: transparent;
}
.nav-tabs .nav-link {
	border-radius: 0;
}
.table.dataTable {
	border-collapse: collapse !important;
}
textarea.form-control {
	height: auto;
}
.progress-example .progress {
	margin-bottom: 1.5rem;
}
.progress-xs {
	height: 4px;
}
.progress-sm {
	height: 15px;
}
.progress.progress-sm {
	height: 6px;
}
.progress.progress-md {
	height: 8px;
}
.progress.progress-lg {
	height: 18px;
}
.form-control.form-control-sm {
	padding: 0.25rem 0.5rem;
}
.card .card-header {
	background-color: rgba(255, 255, 255, 0.1);
	border: 0 none;
	font-size: 16px;
	line-height: 30px;
	padding: 15px;
}
.card .card-header .card-title {
	font-size: 18px;
	font-weight: 400;
	line-height: 20px;
	margin: 0;
	padding: 5px 0;
}
.table h5 {
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
	margin-bottom: 0;
	vertical-align: middle;
}
.table h5 + p {
	color: #9e9e9e;
	font-size: 14px;
	line-height: 18px;
	margin-bottom: 0;
}
.page-link:focus {
    box-shadow: unset;
}
.col-form-label {
	font-size: 14px;
	font-weight: 500;
}
.input-group-text {
	height: 45px;
}

/*-----------------
	5. Header
-----------------------*/

.header {
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 1039;
	height: 70px;
	background: #FFFFFF;
	box-shadow: 0px 0px 14px rgba(204, 204, 204, 0.25);
}
.header .header-left {
	float: left;
	height: 70px;
	padding: 0 20px;
	position: relative;
	text-align: center;
	width: 250px;
	z-index: 1;
}
.logo {
	align-items: center;
	display: flex;
	height: 70px;
	justify-content: start;
}
.logo span {
	color: #3a57e8;
	font-size: 20px;
	font-weight: 500;
	margin-left: 10px;
}
.header .navbar-nav .badge {
	position: absolute;
	right: 7px;
	top: 4px;
}
.header .dropdown-menu > li > a {
	position: relative;
}
.header .dropdown-toggle:after {
	display: none;
}
.page-title-box {
	border-radius: 0;
	height: 70px;
	margin-bottom: 0;
	padding: 14px 20px;
}
.page-title-box h3 {
	color: #fff;
	font-size: 18px;
	font-weight: 500;
	margin: 0;
}
.user-menu {
	margin: 0;
	position: relative;
	z-index: 99;
}
.user-menu.nav > li > a {
	color: #fff;
	font-size: 16px;
	line-height: 70px;
	padding: 0 5px;
	height: 70px;
}
.user-menu.nav > li > a:hover,
.user-menu.nav > li > a:focus {
	/* background-color: #eee; */
}
.user-img {
	display: inline-block;
	position: relative;
}
.header .user-img img {
	width: 40px;
	border-radius: 14px;
}
.user-img .status {
	border: 2px solid #fff;
	bottom: 0;
	height: 10px;
	position: absolute;
	right: 0;
	width: 10px;
}
.user-menu .user-img .status {
	bottom: 0px;
}
.user-menu .dropdown-menu {
	min-width: 145px;
	padding: 0;
	visibility: hidden;
    opacity: 0;
    display: block;
	transform: translate(0px, 100px);
}
.user-menu .dropdown-menu.show {
	visibility: visible;
    opacity: 1;
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.table .dropdown-item {
	padding: 7px 10px;
}
.user-menu .bg-primary {
	background-color: #009efb !important;
}
.status {
	background-color: #ccc;
	border-radius: 50%;
	display: inline-block;
	height: 10px;
	width: 10px;
}
.status.online {
	background-color: #55ce63;
}
.status.offline {
	background-color: #f62d51;
}
.status.away {
	background-color: #faa937;
}
.top-nav-search {
    float: left;
    margin-left: 22px;
}
.top-nav-search form {
    margin-top: 13px;
	position: relative;
    width: 270px;
}
.top-nav-search .form-control {
    background: rgb(58 87 232 / 6%);
    border-radius: 12px;
    border: 0;
    height: 40px;
    padding: 10px 15px 10px 30px;
}
.top-nav-search .btn {
    background-color: transparent;
    border-color: transparent;
    min-height: 45px;
    padding: 7px 10px;
    position: absolute;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    outline: none;
}
.top-nav-search .form-control::-webkit-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.top-nav-search .form-control::-moz-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.top-nav-search .form-control:-ms-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.top-nav-search .form-control::-ms-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.top-nav-search .form-control::placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.theme-set .form-control {
	line-height: 29px;
}
.user-profile-list .user-link {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    padding: 0px 10px !important;
}
.user-menu.nav li.user-profile-list a {
	line-height: 20px;
}
.user-names {
	padding-right: 0px;
	text-align: right;
}
.user-names h5 {
	color: #2c2c2c;
	font-size: 15px;
	font-weight: 400; 
	margin-bottom: 0;
}
.user-names span {
	color: rgba(46, 55, 164, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.user-menu.nav li {
	margin-right: 7px;
	position: relative;
}
.user-menu.nav li:last-child {
	margin-right: 12px;
	position: relative;
}
/*-----------------
	6. Sidebar
-----------------------*/

.sidebar {
	top: 90px;
	width: 250px;
	z-index: 1039;
	background-color: #fff;
	bottom: 0;
	margin-top: 0px;
	position: fixed;
	left: 0;
	transition: all 0.2s ease-in-out;
    border-top-right-radius: 40px;
	box-shadow: 5px 20px 14px rgba(58 87 232 / 6%);
    overflow-y: hidden;
	height: 100vh;
}
.sidebar.opened {
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.sidebar-inner {
	height: 100%;
	transition: all 0.2s ease-in-out 0s;
}
.sidebar-menu ul {
	font-size: 14px;
	list-style-type: none;
	margin: 0;
	padding: 0;
}
.sidebar-menu li a {
	color: #888;
	display: block;
	font-size: 14px;
	height: auto;
	padding: 0 20px;
}
.sidebar-menu li a:hover {
	color: #3a57e8;
}
.sidebar-menu ul li .active img {
    filter: invert(13%) sepia(85%) saturate(7478%) hue-rotate(266deg) brightness(50%) contrast(340%);
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.sidebar-menu li.active a {
	color: #3a57e8;
}
.menu-title {
	color: #333;
	font-size: 15px;
	font-weight: 500;
	padding: 12px 20px;
}
.menu-title > i {
	float: right;
	line-height: 40px;
}
.sidebar-menu li.menu-title a {
	color: #009efb;
	display: inline-block;
	float: right;
	padding: 0;
}
.sidebar-menu li.menu-title a.btn {
	color: #fff;
	display: block;
	float: none;
	font-size: 15px;
	line-height: inherit;
	margin-bottom: 15px;
}
.sidebar-menu ul .submenu .active {
	color: #3a57e8;
	font-weight: 500;
}
.sidebar-menu ul .submenu a.active {
	color: #fff;
	font-weight: 500;
	background: linear-gradient(90deg, #e3e7fa 0.07%, rgba(255, 255, 255, 0) 99.91%);
	border-radius: 18px;
	    background: linear-gradient(135deg, #61c797, #6a3ef6);
	box-shadow: 0 0px 25px rgb(37 99 235 / 5%), 0 0px 15px rgb(16 185 129 / 13%), inset 0 2px 4px rgb(255 255 255 / 56%), inset 0 -3px 8px rgb(255 255 255 / 18%);
	border: 2px solid #ffffffd9;
}
.sidebar-menu ul .submenu ul li a.active  {
	color: #3a57e8;
	font-weight: 500;
	background: unset;
    border-radius: unset;
}
.sidebar-menu ul li .active {
	color: #3a57e8;
	font-weight: 500;
}
.sidebar-menu ul .submenu ul .active {
	position: relative;
}
.sidebar-menu ul .submenu ul .active:before {
	/* background-image: url(../img/icons/right-icon.svg); */
	content: "";
	position: absolute;
	/* width: 10px; */
    /* height: 10px; */
    background-repeat: no-repeat;
	top: 50%;
    left: 35px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.sidebar-menu ul ul a.active {
	color: #3a57e8;
	font-weight: 500;
}
.mobile-user-menu {
	color: #fff;
	display: none;
	font-size: 24px;
	height: 70px;
	line-height: 70px;
	padding: 0 20px;
	position: absolute;
	right: 0;
	text-align: right;
	top: 0;
	width: 50px;
	z-index: 10;
}
.mobile-user-menu > a {
	color: #fff;
	padding: 0;
}
.mobile-user-menu > a:hover {
	color: #fff;
}
.mobile-user-menu > .dropdown-menu > a {
    line-height: 23px;
}
.profile-rightbar {
	display: none !important;
	color: #009efb;
	font-size: 26px;
	margin-left: 15px;
}
.fixed-sidebar-right {
	position: fixed;
	top: 60px;
	right: 0;
	width: 300px;
	margin-right: -300px;
	bottom: 0;
	z-index: 101;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.mobile_btn {
	display: none;
}
.sidebar .sidebar-menu > ul > li > a span {
	transition: all 0.2s ease-in-out 0s;
	margin-left: 10px;
	white-space: nowrap;
}
.sidebar .sidebar-menu > ul > li > a span.badge {
	color: #fff;
	margin-left: auto;
}
.sidebar-menu ul ul a {
	display: block;
	font-size: 14px;
	padding: 9px 10px 9px 60px;
	position: relative;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.75);
}
.sidebar-menu ul ul {
	display: none;
}
.sidebar-menu ul ul ul a {
	padding-left: 70px;
}
.sidebar-menu ul ul ul ul a {
	padding-left: 90px;
}
.sidebar-menu > ul > li {
	position: relative; 
    padding: 0 15px;
    border-radius: 18px;
}
.sidebar-menu .menu-arrow {
	-webkit-transition: -webkit-transform 0.15s;
	-o-transition: -o-transform 0.15s;
	transition: transform .15s;
	position: absolute;
	right: 25px;
	display: inline-block;
	font-family: 'FontAwesome';
	text-rendering: auto;
	line-height: 40px;
	font-size: 15px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0);
	line-height: 18px;
	    top: 20px;
}
.sidebar-menu .menu-arrow:before {
	content: "\f105";
}
.sidebar-menu li a.subdrop .menu-arrow {
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
}
.sidebar-menu ul ul a .menu-arrow {
	top: 6px;
}
.sidebar-menu a {
	transition: unset;
	-moz-transition: unset;
	-o-transition: unset;
	-ms-transition: unset;
	-webkit-transition: unset;
}
 
.sidebar-menu ul li a i {
	font-size: 18px;
	min-height: 24px;
	line-height: 18px;
	transition: all 0.2s ease-in-out 0s;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
	width: 40px;
	height: 40px;
	margin-left: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.sidebar-menu ul li a span.menu-side {
	font-size: 18px;
	min-height: 24px;
	line-height: 18px;
	transition: all 0.2s ease-in-out 0s;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
	width: 40px;
	height: 40px;
	margin-left: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.sidebar-menu ul .submenu .active img {
	filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.sidebar-menu li a:hover img {
   filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.sidebar-menu ul li.menu-title a i {
	font-size: 16px;
	margin-right: 0;
	text-align: right;
	width: auto;
}
.logout-btn {
	margin: 50px 0px;
}
.logout-btn a span.menu-side {
	font-size: 18px;
    min-height: 24px;
    line-height: 18px;
    transition: all 0.2s ease-in-out 0s;
    background: rgba(46, 55, 164, 0.05);
    border-radius: 8px;
    width: 40px;
    height: 40px;
    margin-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
	flex-shrink: 0;
}
.logout-btn a {
    padding: 12px 20px;
    align-items: center;
    display: flex;
    justify-content: flex-start;
    position: relative;
    transition: all 0.2s ease-in-out 0s;
    color: #3a57e8;
    font-weight: 500;
}
.logout-btn a span {
	margin-left: 10px;
}

/*-----------------
	7. Content
-----------------------*/

.page-wrapper {
	left: 0;
	margin-left: 250px;
	padding-top: 70px;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.page-wrapper > .content {
	padding: 32px;
	padding-bottom: 0;
}

/*-----------------
	12. Login
-----------------------*/

.login-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.login-wrapper .loginbox .login-right .login-right-wrap {
    max-width: 100%;
    flex: 0 0 100%;
}
.login-wrapper .loginbox .login-right .login-right-wrap .input-block {
	position: relative;
}
.login-wrapper .loginbox .login-right .login-right-wrap .input-block label {
	font-size: 12px;
	color: #333448;
	font-weight: 500;
	position: absolute;
    top: -10px;
    left: 10px;
    background: #fff;
    margin-bottom: 0;
	padding: 0px 5px;
}
.login-danger,
.star-red {
	color: #FF0000;
}
.account-subtitle {
    color: rgba(51, 52, 72, 0.5);
    font-size: 14px;
    margin-bottom: 0;
    text-align: left;
	font-weight: 500;
}
.account-subtitle a {
	color: #3a57e8;
}
.login-wrapper .loginbox .login-right h2 {
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 40px;
}
.login-wrapper .loginbox .login-right .forgotpass {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	margin-bottom: 40px;
}
.remember-me .custom_check {
	color: #333448;
	font-size: 13px;
	font-weight: 500;
}
.remember-me .custom_check .checkmark {
	width: 18px;
	height: 18px;
	top: 2px;
    left: 2px;
	border: 2px solid rgba(51, 52, 72, 0.2);
	border-radius: 4px;
	background-color: #fff;
}
.remember-me .custom_check .checkmark::after {
	left: 3px;
    top: 0px;
}
.login-wrapper .loginbox .login-right .forgotpass a {
	color: #00D3C7;
	font-size: 14px;
	font-weight: 500;
	margin-left: auto;
}
.login-wrapper .loginbox .login-right .forgotpass a:hover {
	color: #333;
	text-decoration: underline;
}
.login-wrapper .loginbox .login-right .dont-have {
	color: #a0a0a0;
	margin: 20px 0px;
}
.login-wrapper .loginbox .login-right .dont-have a {
	color: #18AEFA;
	font-weight: 500;
}
.login-wrapper .loginbox .login-right .dont-have a:hover {
	text-decoration: underline;
}
.social-login {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.social-login > span {
	color: #a0a0a0;
	margin-right: 8px;
}
.social-login > a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	height: 40px;
	margin-right: 6px;
	width: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.social-login > a:hover {
	background-color: #e6e6e8;
    color: #fff;
}
.social-login > a:last-child {
	margin-right: 0;
}
.btn-primary.primary-reset {
    background-color: #18AEFA;
    border-color: #18AEFA;
}
.btn-primary.primary-reset:hover {
    background-color: #3d5ee1;
    border: 1px solid #3d5ee1;
}
.profile-views {
    position: absolute;
    right: 17px;
    top: 50%;
    transform: translateY(-50%);
	color: rgba(51, 52, 72, 0.2);
	cursor: pointer;
}
.login-right .form-control {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
	height: 45px;
}
.login-right .form-control:focus {
	border: 2px solid rgb(74 83 199 / 80%);
}
.btn-block {
    width: 100%;
}
.account-logo {
	margin-bottom: 40px;
	text-align: left;
}
.account-logo img {
	width: 40%;
}
.login-right .btn-primary {
	background: linear-gradient(92.39deg, #4E57CD 1.86%, #3a57e8 100%);
	border-radius: 12px;
	font-size: 16px;
	padding: 10px 15px;
}
.login-right .btn-primary:hover {
	background: linear-gradient(92.39deg, #3a57e8 1.86%, #00318b 100%);
	border: 1px solid #00318b;
}
.next-sign {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.login-btn {
	margin-bottom: 40px;
}
.login-wrapper .login-right .user-lock-screen h2 {
	margin-bottom: 10px;
}
.user-lock-screen p {
	margin-bottom: 0;
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}
.user-lock-screen {
	margin-bottom: 30px;
}
.sucess-mail h4 {
	font-size: 26px;
	font-weight: 600;
	margin: 15px 0px 20px;
}
.sucess-mail p {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0px;
}

/*-----------------
	14. Login
-----------------------*/

.login-sec {
	text-align: center;
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
    height: auto;
}
.log-img img {
	margin: 0 auto;
}
.login-wrapper {
    width: 100%;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
}
.login-wrap {
	background-color: #3a57e8;
    top: 0;
    left: 0;
    position: fixed;
	height: 100vh;
	padding: 0px;
	border-radius: 0px 65px 65px 0px;
}
.login-wrap-bg {
	position: absolute;
	right: 0;
	padding: 15px 90px 15px;
	height: 100%;
}
.login-wrap .login-sec {
	position: absolute;
	background-image: url('../img/login-0l.png');
	background-repeat: no-repeat;
	background-position: top right;
	background-size: cover, auto;
	width: 100%;
}
.login-wrapper .loginbox {
	background: #FFFFFF;
	box-shadow: 0px 80px 80px rgba(46, 55, 164, 0.03);
	border-radius: 24px;
	display: flex;
	max-width: 830px;
	width: 100%;
}
.login-wrapper .loginbox .login-right {
	padding: 50px;
	width: 100%;
}

/*-----------------
	9. Dashboard
-----------------------*/

.dash-widget {
	background-color: #fff;
	border-radius: 12px;
	backdrop-filter: blur(2px);
	margin-bottom: 30px;
	padding: 20px;
	position: relative;
	height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.dash-boxs {
	background: rgba(46, 55, 164, 0.05);
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 12px;
	width: 50px;
	height: 50px;
	margin-bottom: 10px;
}
.dash-content h4 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 4px;
}
.dash-content h2 {
	color: #3a57e8;
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 20px;
}
.dash-content p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0px;
}
.dash-content p .negative-view {
	color: #FF3667;
}
.dash-content p .passive-view {
	color: #00D3C7;
}
.comman-flex-center {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.card-table.card-table-top .card-body {
	height: 175px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
.chart-title {
	margin-bottom: 25px;
}
.chart-title h4 {
	display: inline-block;
	font-size: 18px;
	font-weight: 600;
	line-height: 20px;
	margin: 0;
	color: #333;
}
.chart-title span {
	color: #009efb;
}
.card-title > a.btn {
	color: #fff;
}
ul.chat-user-total li {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: #333448;
	padding-right: 10px;
	font-size: 14px;
	font-weight: 500;
}
ul.chat-user-total li i.current-users {
	color: #3a57e8;
	padding-right: 5px;
	font-size: 8px;
}
ul.chat-user-total li i.low-users {
	color: #D5D7ED;
	padding-right: 5px;
	font-size: 8px;
}
ul.chat-user-total li i.old-users {
	color: #00D3C7;
	padding-right: 5px;
	font-size: 8px;
}
.new-patient-table {
	display: table;
}
.new-patient-table td, .new-patient-table th {
    vertical-align: middle;
}
.new-patient-table tr td img {
	margin-right: 5px;
}
.btn-primary-one {
	border: 1px solid #ffbc35;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}
.btn-primary-two {
	border: 1px solid #009efb;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}
.btn-primary-three {
	border: 1px solid #55ce63;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}
.btn-primary-four {
	border: 1px solid #ffbc35;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}
.bar-chart {
	position: relative;
	width: 100%;
	margin-top: 15px;
}
.bar-chart > .legend {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 40px;
	margin-bottom: -45px;
	border-top: 1px solid #000;
}
.bar-chart > .legend > .item {
	position: relative;
	display: inline-block;
	float: left;
	width: 25%;
}
.bar-chart > .legend > .item:before {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 1px;
	height: 8px;
	background-color: #000;
	margin-top: -8px;
}
.bar-chart > .legend > .item.text-end:before {
	right: 0;
	left: auto;
}
.bar-chart > .legend > .item h4 {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding-top: 5px;
}
.bar-chart > .chart {
	position: relative;
	width: 100%;
}
.bar-chart > .chart > .item {
	position: relative;
	width: 100%;
	height: 40px;
	margin-bottom: 10px;
	color: #fff;
	text-transform: uppercase;
}
.bar-chart > .chart > .item > .bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffbc35;
	z-index: 5;
}
.bar-chart > .chart > .item > .bar > .percent {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	height: 40px;
	line-height: 40px;
	padding-right: 12px;
	z-index: 15;
}
.bar-chart > .chart > .item > .bar > .item-progress {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background-color: #009efb;
	z-index: 10;
}
.bar-chart > .chart > .item > .bar > .item-progress > .title {
	display: block;
	position: absolute;
	height: 40px;
	line-height: 40px;
	padding-left: 12px;
	letter-spacing: 2px;
	z-index: 15;
}
.hospital-barchart h4 {
	display: inline-block;
	font-size: 18px;
	font-weight: 400;
	line-height: 20px;
	margin: 0;
	color: #333;
}
.custom-table tr {
	background-color: #fff;
	white-space: nowrap;
}
.table.custom-table > tbody > tr > td,
.table.custom-table > tbody > tr > th,
.table.custom-table > tfoot > tr > td,
.table.custom-table > tfoot > tr > th,
.table.custom-table > thead > tr > td,
.table.custom-table > thead > tr > th {
	padding: 10px 15px;
	vertical-align: middle;
}
.member-panel .contact-list > li:last-child {
	border-bottom: 0;
}
.member-panel .card-body {
	overflow-y: auto;
	height: 245px;
	-webkit-overflow-scrolling: touch;
	padding: 0;
}
.contact-list {
	list-style: none;
	padding-left: 0;
	margin: 0;
}
.contact-list > li {
	border-bottom: 1px solid #eaeaea;
	border-radius: inherit;
	padding: 10px;
	background-color:#fff;
}
.contact-cont {
	position: relative;
}
.contact-info {
	padding: 0 30px 0 50px;
}
.contact-date {
	color: #888;
	font-size: 12px;
}
.take-btn {
    min-width: 80px;
}
.good-morning-blk {
	background: #FFFFFF;
	border-radius: 12px;
	margin-bottom: 20px;
	position: relative;
	z-index: 9;
}
 
.morning-user {
	padding: 50px 0px 50px 35px;
}
.morning-user h2 {
	font-size: 28px;
	font-weight: 600;
}
.morning-user h2 span {
	color: #3a57e8;
}
.morning-user p {
	font-size: 15px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}
.morning-img img {
	position: absolute;
    bottom: 0;
}
.position-blk {
	position: relative;
}
.activity-top {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 20px;
}
.activity-boxs {
	background: rgba(46, 55, 164, 0.05);
	width: 45px;
	height: 45px;
	margin-right: 10px;
	border-radius: 50px;
}
.departments-list h4 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}
.departments-list p {
	font-size: 14px;
	font-weight: 600;
	color: rgba(51, 53, 72, 0.5);
	margin-bottom: 0;
}
.chart-user-icon {
	position: relative;
}
.chart-user-icon img {
    position: absolute;
    top: 65px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
table.dataTable thead .sorting:before, table.dataTable thead .sorting:after, 
table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_asc:after, 
table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_desc:after, 
table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead 
.sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:before, 
table.dataTable thead .sorting_desc_disabled:after {
	bottom: 15px;
}
.custom-table tbody tr {
    box-shadow: 0 0 3px #e5e5e5;
    border: 0;
}
.custom-table tbody tr td,
.custom-table thead tr th {
	border: 0;
}
.custom-table tbody tr td {
	font-size: 14px;
}
.custom-table thead tr th {
	font-size: 14px;
	color: rgba(51, 52, 72, 0.5);
}
.table-dash .dataTables_length,
.table-dash .dataTables_info,
.table-dash .pagination {
	display: none;
}
.table-image {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.table-image img {
	margin-right: 10px;
}
.patient-views {
	color: #3a57e8;
	font-size: 14px;
	font-weight: 500;
}
.appoint-doctor h2 {
	color: #3a57e8;
}
.appoint-time span {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
}
.appoint-time h6 {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.patient-visit {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.doctor-list-blk {
	background: #FFFFFF;
	border-radius: 16px;
	padding: 20px;
	margin-bottom: 25px;
}
.doctor-widget {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	position: relative;
}
.doctor-box-icon {
	width: 66px;
	height: 66px;
	background: #3a57e8;
	border-radius: 12px;
	margin-right: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.doctor-content {
	width: 100%;
}
.doctor-content h4 {
	font-size: 24px;
	color: #3a57e8;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-weight: 600;
}
.doctor-content h5 {
	font-size: 14px;
	margin-bottom: 0;
}
.doctor-content h4 span:nth-child(2) {
	font-size: 14px;
	color: rgb(51 52 72 / 20%);
}
.doctor-content h4 span:last-child {
	font-size: 10px;
	border-radius: 20px;
	margin: auto;
	padding: 5px;
}
.border-right-bg:before {
	content: "";
	position: absolute;
	background: rgba(46, 55, 164, 0.2);
	height: 44px;
	width: 2px;
	right: 0;
}
.income-value {
	text-align: center;
}
.income-value h3 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}
.income-value h3 span {
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
}
.income-value p {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}
.income-value p span {
	color: #00D3C7
}
.patient-structure h5 {
	font-size: 16px;
	font-weight: 500;
	color: #3a57e8;
	margin-bottom: 10px;
}
.struct-point {
	width: 100%;
}
.patient-structure h3 {
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.patient-structure h3 span {
	font-size: 12px;
	padding: 3px 7px;
	border-radius: 20px;
}
.check-point {
	border: 0;
	border-radius: 4px;
}
.card.wallet-widget {
	margin-bottom: 25px;
	padding: 15px;
	width: 100%;
}
.main-limit {
	text-align: center;
}
.main-limit p {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 10px;
}
.main-limit h4 {
	font-size: 24px;
	font-weight: 600;
	color: #3a57e8;
	margin-bottom: 0;
}
.wallet-widget .circle-bar {
    text-align: center;
}
.wallet-widget .circle-bar > div {
	display: inline-block;
	position: relative;
	text-align: center;
}
.wallet-widget .circle-bar > div b {
    left: 0;
    position: absolute;
    top: 50%;
    right: 0;
    text-align: center;
    margin: 0 auto;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    border-radius: 50px;
	background: rgba(0, 211, 199, 0.1);
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.wallet-widget .circle-bar > div canvas {
	width: 100px !important;
	height: 100px !important;
}
.teaching-card {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.steps-history {
	margin-bottom: 0;
	margin-right: 10px;
	align-items: baseline;
    display: inline-grid;
	padding: 0;
	width: 40px;
}
.steps-history li {
	margin-top: 5px;
	color: rgba(51, 53, 72, 0.5);
    font-weight: 500;
	list-style: none;
	font-size: 12px;
}
.activity-feed {
    list-style: none;
    margin-bottom: 0;
    margin-left: 5px;
    padding: 0;
	width: 100%;
	position: relative;
}
.activity-feed::after{
	position: absolute;
	content:"";
	background: #e4e8eb;
	width: 2px;
	height: 100%;
	left: -2px;
    top: 10px;
    z-index: 0;
}
.activity-feed .feed-item {
  
    padding-bottom: 20px;
    padding-left: 20px;
    position: relative;
}
.activity-feed .feed-item:last-child {
	padding-bottom: 0;
}
.activity-feed .feed-item:after {
	content: "";
    display: block;
    position: absolute;
    background-color: #333448;
    width: 7px;
    height: 7px;
	top: 10px;
    left: -4px;
    border-radius: 50px;
	z-index: 9;
}
.doctor-date-list {
	padding: 0;
}
.doctor-date-list li {
	list-style: none;
	color: #333548;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 15px;
}
.doctor-date-list li span {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	padding-left: 15px;
}
.doctor-date-list li i {
	font-size: 6px;
}
.dolor-activity {
	width: 100%;
}
.dolor-activity .stick-line {
	text-decoration: line-through;
	color: rgba(51, 53, 72, 0.5);
}
.active-doctor {
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 14px;
	padding: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.doctor-sub-list {
	padding: 10px;
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 14px;
	width: 100%;
	position: absolute;
	z-index: 99;
	display: none;
}
.ongoing-blk {
	position: relative;
}
.schedule-time li {
	width: 30px;
	height: 30px;
	border: 1px solid rgba(46, 55, 164, 0.2);
	border-radius: 5px;
}
.schedule-time li {
	margin-right: 5px;
	margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.schedule-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-top: 1px solid rgba(51, 52, 72, 0.2);
	padding-top: 10px;
	flex-wrap: wrap;
}
.appoint-start {
	font-size: 12px;
	border-radius: 10px;
	padding: 10px 20px;
}
.new-dot {
	padding: 3px 10px;
	font-size: 12px;
	margin-left: auto;
	border-radius: 8px;
}
.doctor-date-list .new-dot i {
	font-size: 5px;
}
.patient-new-list {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}
.average-health h5 {
	margin-bottom: 0;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
	padding: 6px 10px;
	font-size: 14px;
	font-weight: 500;
}
.average-health h5 span {
	color: rgba(46, 55, 164, 0.5);
	font-size: 10px;
}
.dash-content h5 {
	font-size: 24px;
	color: #3a57e8;
	font-weight: 600;
	margin-bottom: 20px;
}
.calendar header .month {
    font-size: 18px;
}
.dash-content h5 span {
	font-size: 16px;
	color: rgba(51, 52, 72, 0.5);
}
.report-blk {
	width: 100%;
}
.ongoing-drapt {
	position: relative;
	margin-left: auto;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.ongoing-drapt i {
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 6px;
	color: #3a57e8;
	width: 20px;
	height: 20px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.doctor-date-list li .ongoing-drapt i {
	font-size: 12px;
}
.active-doctor.dropdown-toggle::after {
	display: none;
}
.doctor-sub-list .dropdown-item {
	padding: 0;
}
.doctor-sub-list .dropdown-item:focus, 
.doctor-sub-list .dropdown-item:hover {
    background-color: transparent;
}
.active-doctor .active-circles {
	color: #00D3C7;
}
.doctor-date-list .active-doctor span {
	color: #3a57e8;
}
.doctor-date-list .active-doctor span.ongoing-drapt {
	color: rgba(51, 52, 72, 0.5);
}
.note-checkit .custom_check .checkmark {
	border: 2px solid rgba(46, 55, 164, 0.2);
	border-radius: 5px;
}
.note-checkit .custom_check input:checked ~ .checkmark {
    background-color: #3a57e8;
    border-color: #3a57e8;
}
.note-checkit .custom_check {
	color: #333548;
	font-size: 12px;
	font-weight: 600;
}
.wallet-widget.general-health {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-around;
	-webkit-justify-content: space-around;
	-ms-flex-pack: space-around;
	flex-direction: inherit;
}
.general-health .main-limit p {
	font-weight: 600;
}
.general-health.wallet-widget .circle-bar > div canvas {
    width: 135px;
    height: 135px;
}
.status-gray.re-shedule {
	color: #3a57e8;
	font-weight: 600;
	font-size: 12px;
}
.patient-table tbody tr td,
.patient-table tbody tr td h2 {
	font-weight: 500;
	color: #333448;
}
.patient-table tbody tr td:nth-child(3) {
	color: rgba(51, 52, 72, 0.5);
}
.treat-box {
	background: #FFFFFF;
	border-radius: 10px;
	padding: 15px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.user-imgs-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.user-imgs-blk img {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 50px;
	margin-right: 20px;
	border: 2px solid rgba(46, 55, 164, 0.2);
}
.active-user-detail h4 {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 5px;
}
.active-user-detail p {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}
.weight-blk .slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}
.weight-blk .slick-slide div {
	text-align: center;
}
.weight-blk .slick-slide span {
	opacity: 0;
}
.weight-blk .slick-slide h4 {
	margin-bottom: 0;
	font-size: 14px;
}
.weight-blk .slick-current span {
	opacity: 1;
	font-size: 12px;
}
.weight-blk .slick-active {
  opacity: .5;
}
.weight-blk .slick-current {
  opacity: 1;
}
.max-blk {
	width: 50%;
}
.weight-blk {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 14px;
	padding: 25px 0px 20px;
	position: relative;
}
.report-head h4 {
	margin-bottom: 0;
	font-size: 18px;
}
.report-head img {
	width: 40px;
	height: 40px;
}
.weight-blk:before {
	background-image: url(../img/icons/mass-icon.svg);
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    left: 50%;
    top: 0px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.weight-bar.progress {
	height: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 40px 0px 10px;
}
.weight-bar .progress-bar {
	width: 100px;
	background-color: #3a57e8;
	border-radius: 20px;
}
.weight-checkit {
	list-style: none;
	padding: 0;
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.pulse {
	display: block;
    position: absolute;
    top: 24px;
    right: 6px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #00d3c7;
}
.pulse:before {
	content: "";
    top: 0px;
    right: 0px;
    width: 10px;
    height: 10px;
    position: absolute;
    border-radius: 50%;
    background: rgb(0 211 199 / 50%);
    cursor: pointer;
    box-shadow: 0 0 0 rgb(0 211 199);
    animation: pulse 1s linear infinite;
    z-index: 1;
}
@keyframes pulse {
	100% {
		transform: scale(2.5);
	}
}

/*-----------------
	10. Activity
-----------------------*/

.activity-box {
	position: relative;
}
.activity-list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}
.activity .activity-list > li .activity-user {
	height: 32px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 12px;
	left: 8px;
	width: 32px;
}
.activity .activity-list > li .activity-content {
	margin: 0 0 0 40px;
	padding: 0;
	position: relative;
}
.activity-list > li {
	margin-bottom: 10px;
	padding: 10px;
	position: relative;
}
.activity-list > li:last-child .activity-content {
	margin-bottom: 0;
}
.activity-user .avatar {
	height: 32px;
	line-height: 32px;
	margin: 0;
	width: 32px;
}
.activity-list > li .activity-user {
	background: #fff;
	height: 32px;
	left: -7px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 3px;
	width: 32px;
}
.activity-list > li .activity-content {
	background-color: #fff;
	margin: 0 0 20px 40px;
	padding: 0;
	position: relative;
}
.activity-list > li .time {
	color: rgba(51, 52, 72, 0.5);
	display: block;
	font-size: 12px;
	line-height: 1.35;
}
.activity-delete {
	background-color: #ffe5e6;
	border: 1px solid #fe0000;
	color: #fe0000;
	display: none;
	font-size: 20px;
	height: 20px;
	line-height: 18px;
	position: absolute;
	right: 0;
	text-align: center;
	top: 0;
	width: 20px;
}
.activity-delete:hover {
	background-color: #fe0000;
	color: #fff;
}
.activity-list > li:hover .activity-delete {
	display: inline-block;
}
.activity-list::before {
    background: rgba(46, 55, 164, 0.1);
    bottom: 0;
    content: "";
    left: 23px;
    position: absolute;
    top: 8px;
    width: 2px;
}
.timeline-group {
	margin-right: 20px;
	min-width: 100px;
}
.timeline-group h4 {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 0;
}
.timeline-group-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.comman-activitys {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 0px 16px 16px 16px;
	padding: 20px;
	width: 100%;
}
.comman-activitys h3 {
	color: #3a57e8;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 5px;
}
.comman-activitys h3 span {
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}
.comman-activitys p {
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0px;
	font-size: 12px;
}
.activity-sub-list li {
	margin-right: 10px;
}
.activity-sub-list li img {
	border-radius: 8px;
}
.activity-maps {
	border-radius: 8px;
	border: 2px solid #fff;
}
.activity-maps iframe {
	width: 100%;
}

/*-----------------
	11. Select2
-----------------------*/

.select2-container .select2-selection--single {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
	height: 40px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 38px;
	right: 7px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
	left: 50%;
    margin-left: -10px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    border-top: 0;
    border-left: 0;
    border-bottom: 1px solid #171717;
    border-right: 1px solid #171717;
    content: '';
    height: 6px;
    display: inline-block;
    pointer-events: none;
    -webkit-transform-origin: 66% 66%;
    -ms-transform-origin: 66% 66%;
    transform-origin: 66% 66%;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
    width: 6px;
    vertical-align: 0px;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	 -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg);
	border-top: 0;
    border-left: 0;
    border-bottom: 1px solid #171717;
    border-right: 1px solid #171717;
}
.select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 30px;
	padding-left: 15px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #676767;
	font-size: 14px;
	font-weight: normal;
	line-height: 38px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: #3a57e8;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
	border: 1px solid #eaeaea;
	border-radius: 0;
}
.select2-container--default .select2-selection--multiple {
	border: 1px solid #eaeaea;
	border-radius: 0;
}
.select2-container .select2-selection--multiple {
	min-height: 40px;
}
.select2-results__option {
	font-size: 14px;
}

/*-----------------
	12. Nav tabs
-----------------------*/

.nav-tabs > li > a {
	margin-right: 0;
	color: #888;
	border-radius: 0;
}
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
	border-color: transparent;
	color: #333;
}
.nav-tabs.nav-justified > li > a {
	border-radius: 0;
	margin-bottom: 0;
}
.nav-tabs.nav-justified.nav-tabs-solid > li > a {
	border-color: transparent;
}
.nav-tabs.nav-tabs-solid > li > a {
	color: #333;
}
.nav-tabs.nav-tabs-solid > li > a.active,
.nav-tabs.nav-tabs-solid > li > a.active:hover,
.nav-tabs.nav-tabs-solid > li > a.active:focus {
	background-color: #3a57e8;
	border-color: #3a57e8;
	color: #fff;
}
.nav-tabs.nav-tabs-solid.nav-tabs-rounded {
	border-radius: 50px;
}
.nav-tabs.nav-tabs-solid.nav-tabs-rounded > li > a {
	border-radius: 50px;
}
.nav-tabs.nav-tabs-solid.nav-tabs-rounded > li > a.active,
.nav-tabs.nav-tabs-solid.nav-tabs-rounded > li > a.active:hover,
.nav-tabs.nav-tabs-solid.nav-tabs-rounded > li > a.active:focus {
	border-radius: 50px;
}
.nav-tabs-justified > li > a {
	border-radius: 0;
	margin-bottom: 0;
}
.nav-tabs-justified > li > a:hover,
.nav-tabs-justified > li > a:focus {
	border-bottom-color: #ddd;
}
.nav-tabs-justified.nav-tabs-solid > li > a {
	border-color: transparent;
}

/*-----------------
	13. Holidays
-----------------------*/

.custom-table tr.holiday-completed {
	color: #aaa;
}
.modal-header.bg-danger .modal-title {
	color: #fff;
}
.dropdown.action-label {
	display: inline-block;
}
.action-label > a {
	display: inline-block;
	min-width: 103px;
}
.action-label .btn-sm {
	padding: 5px;
}

/*-----------------
	14. Edit Profile
-----------------------*/

.profile-img-wrap {
	height: 120px;
	position: absolute;
	width: 120px;
	background: #fff;
	overflow: hidden;
}
.profile-basic {
	margin-left: 140px;
}
.profile-img-wrap img {
	width: 120px;
	height: 120px;
}
.fileupload.btn {
	position: absolute;
	right: 0;
	bottom: 0;
	background: rgba(33, 33, 33, 0.5);
	border-radius: 0;
	padding: 3px 10px;
	border: none;
}
.fileupload input.upload {
	cursor: pointer;
	filter: alpha(opacity=0);
	font-size: 20px;
	margin: 0;
	opacity: 0;
	padding: 0;
	position: absolute;
	right: -3px;
	top: -3px;
	padding: 5px;
}
.btn-text {
	color: #fff;
}

/*-----------------
	15. Chat
-----------------------*/

.media .avatar{
	min-width: 36px;
}
.avatar {
	background-color: #aaa;
	border-radius: 50%;
	color: #fff;
	align-items: center;
	display: flex;
	justify-content: center;
	font-weight: 500;
	height: 38px;
	line-height: 38px;
	margin: 0 10px 0 0;
	overflow: hidden;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	vertical-align: middle;
	width: 38px;
	position: relative;
	white-space: nowrap;
	font-size: 14px;
	background: #3a57e8;
}
.avatar:hover {
	color: #fff;
}
.avatar > img {
	width: 100%;
	display: block;
}
.card.chat-box {
	padding: 20px;
	border-radius: 8px;
	width: 100%;
}
.card.chat-box-clinic {
	padding: 0;
	border-radius: 8px;
	width: 100%;
}
.chat-box-clinic .chat-user-group,
.chat-box-clinic .chat-search {
	padding: 10px 20px;
}
.chat-box-clinic .chat-user-group,
.chat-box-clinic .chat-search {
	margin-bottom: 20px;
}
.chat-box-clinic .chat-user-group:hover {
	background: #3a57e8;
}
.chat-box-clinic .chat-user-group:hover .user-titles h5,
.chat-box-clinic .chat-user-group:hover .chat-user-time p {
    color: #FFFFFF;
}
.chat-box-clinic .chat-user-group:hover .user-text p {
	color: rgba(255, 255, 255, 0.5);
}
.chat-user-group:hover .chat-user-count span {
	background: #fff;
	color: #3a57e8;
}
.chat-user-group {
	margin-bottom: 30px;
}
.chat-user-group-head .img-users {
    margin-right: 10px;
}
.chat-user-group-head {
	padding: 20px;
}
.chat-user-group-head .user-titles h5 {
    color: #3a57e8;
}
.chat-users {
	width: 100%;
}
.chat-users.user-main {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.user-dot-list {
	width: 40px;
	height: 40px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.user-dot-list a {
	color: #171717;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.chat-user-time,
.chat-user-count {
	margin-left: auto;
}
.user-titles h5 {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 3px;
}
.chat-user-time p,
.user-text p {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
}
.chat-user-count span {
	background: #3a57e8;
	border-radius: 50px;
	width: 15px;
	height: 15px;
	font-size: 10px;
	color: #fff;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.chat-user-count .user-check {
	background: none;
	color: #838383;
	font-size: 14px;
}
.chat-user-group .img-users {
	width: 45px;
	height: 45px;
	margin-right: 10px;
}
.user-check.active {
	color: #399E8D;
}
.chat-user-group .active-users {
    width: 8px;
    height: 8px;
    right: 5px;
    top: 0px;
}
.img-users {
	position: relative;
}
.active-users {
	width: 10px;
	height: 10px;
	background: green;
	border-radius: 50px;
	position: absolute;
	right: 0;
	border: 1px solid #FFFFFF;
}
.call-user img {
	width: 45px;
	height: 45px;
	border-radius: 50px;
}
.call-list-add li a {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	width: 50px;
	height: 50px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}
.call-list-add li {
	list-style: none;
	margin-right: 10px;
}
.call-list-add li:first-child a {
	width: 67px;
}
.call-list-add {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 0;
}
.chat-search .input-block {
	position: relative;
	width: 100%;
}
.chat-search {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	margin-bottom: 30px;
}
.add-search a {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	color: #3a57e8;
}
.add-search a:hover {
	background: #223d9f;
}
.add-search a:hover i {
	color: #fff;
}
.top-liv-search.top-chat-search .btn {
	left: 0;
	right: inherit;
}
.top-liv-search.top-chat-search .form-control {
	padding-left: 40px;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	border: 0;
}
.top-liv-search.top-chat-search .form-control::placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-size: 12px;
}
.chat-search-group {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.chat-search-list ul {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	padding: 0;
	margin-bottom: 0;
}
.chat-search-list ul li {
	padding: 10px 0px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 0px 10px;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
}
.chat-search-list ul li:last-child {
	margin-right: 0;
}
.card.chat-message-box {
	padding: 20px;
}
.message-sub-box h4 {
	color: #000000;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 15px;
}
.message-sub-box p {
	font-size: 12px;
	font-weight: 400;
	background: rgba(51, 52, 72, 0.1);
	border-radius: 0px 10px 10px 10px;
	padding: 10px;
	margin-bottom: 5px;
	max-width: 270px;
}
.message-sub-box span {
	color: rgba(51, 53, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}
.media.sent .media-body {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: end;
	-webkit-justify-content: end;
	-ms-flex-pack: end;
}
.media.sent .message-sub-box {
	text-align: right;
}
.media.sent .message-sub-box p {
	background: rgba(46, 55, 164, 0.1);
	border-radius: 0px 15px 15px 15px;
	color: #3a57e8;
}
.msg-sub-list {
	margin-bottom: 0;
}
.msg-sub-list li {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
	margin-bottom: 5px;
	padding: 5px;
	max-width: 270px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-size: 12px;
}
.msg-sub-list li:last-child {
	margin-bottom: 0;
}
.footer-discussion {
    display: inline-flex;
    width: 100%;
}
.footer-discussion .inputgroups {
    width: 100%;
	margin-top: 30px;
	position: relative;
}
.inputgroups input[type="text"] {
    width: 100%;
    height: 52px;
    padding-left: 32px;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	border: 0;
}
.inputgroups input[type="text"]::placeholder {
	font-size: 12px;
	color: rgba(51, 52, 72, 0.3);
}
.chat-footer-box {
	border-top: 2px solid rgba(46, 55, 164, 0.05);
	border-radius: 0px 0px 10px 10px;
}
.position-icon {
	position: absolute;
}
.micro-text {
	top: 15px;
	left: 10px;
}
.send-chat {
	background: #234CE3;
	border-radius: 8px;
	width: 52px;
	height: 52px;
	top: 0;
	right: 0;
}
.comman-flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.symple-text ul {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	margin-bottom: 0;
}
.symple-text ul li {
	list-style: none;
}
.symple-text {
	top: 15px;
    right: 65px;
}
.chat-heading h3 {
	margin-bottom: 20px;
}
.chat-users.chat-user-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.comman-space-flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.chat-user-blk .user-titles p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.chat-user-blk .user-text {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.chat-user-icon {
	margin-left: 15px;
}
.call-all {
	margin-bottom: 25px;
}
.call-all h4 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.call-all h4 span { 
	background: #0DBF0A;
	border-radius: 50px;
	width: 20px;
	height: 20px;
	color: #fff;
	font-size: 10px;
	margin-left: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.call-all h5 {
	margin-bottom: 0;
}
.call-all h5 a {
	color: #3a57e8;
	font-size: 14px;
	font-weight: 600;
}
.voice-call-user {
	margin-bottom: 30px;
}
.voice-call-user img {
	width: 80px;
	height: 80px;
	border-radius: 50px;
	margin-bottom: 10px;
}
.voice-call-user h3 {
	color: #333448;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}
.voice-call-user p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 0;
}
.voice-time {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	max-width: 191px;
	margin: auto;
}
.voice-time h3 {
	font-size: 26px;
	color: #3a57e8;
	font-weight: 600;
	margin-bottom: 0;
	padding: 10px;
}
.voice-menu ul {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 30px 0px;
	padding: 0;
}
.voice-menu ul li {
	margin-right: 20px;
	list-style: none;
}
.voice-menu ul li:last-child {
	margin-right: 0px;
}
.voice-menu ul li:hover a {
	background: #3a57e8;
	border: 1px solid #3a57e8;
}
.voice-menu ul li:hover img {
	filter: invert(1) brightness(100);
}
.voice-menu ul li a {
	width: 50px;
	height: 50px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.end-call-voice .btn-primary {
	background: #FE3F51;
	border-radius: 8px;
	min-width: 136px;
	padding: 10px 15px;
	font-size: 16px;
	font-weight: 600;
}
.end-call-voice .btn-primary:hover {
	background: #234ce3;
	border: 1px solid #234ce3;
}
.video-call-blk.chat-user-group:hover {
	border-radius: 8px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
}
.video-call-blk.chat-user-group {
	padding: 10px;
	margin-bottom: 15px;
}
.chat-user-group .user-titles h5 {
	color: #333448;
}
.message-sub-box h5 {
	color: rgba(51, 52, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}
.video-chat-show .message-sub-box p {
    font-size: 12px;
}
.video-chat-show ul li {
	margin-bottom: 15px;
}
.video-chat-show ul {
	margin-bottom: 0px;
	padding: 0;
}
.video-chat-show ul li:last-child {
	margin-bottom: 0px;
}

.calling-income h4 {
	color: #35446F;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 30px;
}
.crypto-income-blk .voice-call-user h3 {
    color: #35446F;
    font-size: 20px;
    font-weight: 700;
	margin-bottom: 5px;
}
.crypto-income-blk .voice-call-user p {
    color: #3a57e8;
    font-size: 14px;
    font-weight: 600;
}
.voice-menu-income .btn-primary {
	width: 60px;
	height: 60px;
	border-radius: 12px;
}
.voice-menu-income .call-remove {
	background: #FE3F51;
}
.voice-menu-income .call-received {
	background: #0DBF0A;
}
.top-liv-search.top-chat-search .btn {
	left: 0;
	right: inherit;
}
.top-liv-search .btn {
    background-color: transparent;
    border-color: transparent;
    color: rgba(17, 17, 17, 0.32);
    min-height: 45px;
    padding: 7px 15px;
    position: absolute;
    right: 0;
    top: 0;
    margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

/*-----------------
	10. Join Call
-----------------------*/

.page-content {
	width: 100%;
}
.join-call {
	max-width: 950px;
    width: 100%;
    margin: 0 auto;
    padding-top: 50px;
}
.join-video {
	position: relative;
	margin-bottom: 30px;
}
.join-video img {
	border-radius: 10px;
    object-fit: cover;
}
.join-video.video-hide > img, .video-wrap.video-hide > video {
    display: none;
}
.video-avatar {
    color: #FFF;
    background: #5D5D5D;
    font-size: 50px;
    border-radius: 10px;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.video-avatar.active {
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
}
.video-avatar h4 {
	font-weight: 700;
	font-size: 24px;
	color: #FFFFFF;
}
.join-content {
	padding-bottom: 25px;
}
.join-content h3 {
	font-weight: 700;
	font-size: 22px;
	margin-bottom: 37px;
}
.join-content label {
	font-size: 20px;
	margin-bottom: 1.25rem;
}
.icon-mic {
	background: #31AA52;
    border-radius: 10px;
    width: 40px;
    height: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
}
.icon-mic i {
    color: #fff;	
}
.btn-join {
	font-weight: 700;
    font-size: 20px;
    padding: 14px 20px;
    min-width: 192px;
    border-radius: 10px;
}
.btn-infos {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.btn-infos .btn-join {
	margin-right: 18px;
}
.btn-infos .icon-mic {
	margin-right: 15px;
}
.btn-infos span {
	font-size: 18px;
	color: #808184;
}
.call-icons {
	text-align: center;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
}
.call-icons .call-items {
    border-radius: 5px;
    padding: 0;
    margin: 0;
    list-style: none;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
	position: absolute;
    bottom: 60px;
	left: 50%;
	transform: translate(-50%, 0);
}
.call-icons .call-items .call-item {
	display: inline-block;
	text-align: center;
	margin-right: 15px;
}
.call-icons .call-items .call-item:last-child {
	margin-right: 0;
}
.call-icons .call-items .call-item a {
    color: #FFF;
    border: 1px solid #FFF;
	background: rgba(255, 255, 255, 0.07);
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
    width: 60px;
    height: 60px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 20px;
	white-space: nowrap;
}
.call-icons .call-items .call-item a:hover {
	opacity: 0.8;
}
.call-icons .call-items .call-item .mute-video.stop,
.call-icons .call-items .call-item .mute-bt.stop {
	background: #EB4132;
	border: 1px solid #EB4132;
}
.set-icon {
	position: absolute;
	top: 30px;
	right: 30px;
	z-index: 1;
}
.vert-icon, a.vert-icon {
	width: 40px;
	height: 40px;
	background: #FFFFFF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
	font-size: 18px;
	color: #000;
}
.voice-sec1 {
	width: 100%;
	height: 100%;
	top: 0;
	position: absolute;
}
.voice-sec {
	position: absolute;
	top: 30px;
	left: 30px;
	z-index: 1;
}
.voice-icon, a.voice-icon {
	width: 40px;
	height: 40px;
	background: #31AA52;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	font-size: 18px;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
	color: #FFF;
}
.voice-icon:hover, a.voice-icon:hover,
.vert-icon:hover, a.vert-icon:hover {
	opacity: 0.8;
}

/*-----------------
	Meeting Call
-----------------------*/

.meet-icons {
	padding: 40px 0px 20px;    
	margin-top: 40px;
	border-top: 2px solid rgba(46, 55, 164, 0.05);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
    justify-content: center;
}
.meet-icons .meet-items, .action-items {
    padding: 0;
    margin: 0;
    list-style: none;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
}
.meet-icons .meet-items .meet-item, .action-items .action-item {
	display: inline-block;
	text-align: center;
	margin-right: 15px;
}
.meet-icons .meet-items .meet-item:last-child, 
.action-items .action-item:last-child {
	margin-right: 0;
}
.meet-icons .meet-items .meet-item > a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
    color: #636e8e;
	border-radius: 8px;
    width: 50px;
    height: 50px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 20px;
}
.meet-icons .meet-items .meet-item > a:hover img {
	filter: invert(1) brightness(100);
}
.meet-icons .meet-items .meet-item > a:hover,
.action-items .action-item a:hover {
	opacity: 0.8;
	background: #3a57e8;
}
.meet-icons .meet-items .meet-item > a.showChatList.active,	
.meet-icons .meet-items .meet-item > a.showInviteList.active,
 .meet-icons .meet-items .meet-item > a.hand-raise.active,
.action-items .action-item a.record-icon.active {	
    background: #3a57e8;
}
.meet-icons .meet-items .meet-item > a.mute-bt.stop, 
.meet-icons .meet-items .meet-item > a.mute-video.stop {
    background: #3a57e8;
}
.meet-icons .meet-items .meet-item > a.mute-video.stop .feather-video-off {
	filter: invert(1) brightness(100);
}
.meet-icons .meet-items .meet-item > a.show {
	background: #0074E0;
}
.action-items .action-item a {
	width: 80px;
	height: 50px;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 20px;	
	box-shadow: 0px 15px 15px rgba(229, 229, 229, 0.32);
	border-radius: 10px;
	color: #FFF;
}
.action-items .action-item a.share-icon {
	background: #EB4132;
}
.action-items .action-item a.callend-icon {
	background: #0074E0;
}
.action-items .action-item a.record-icon {
	background: #31AA52;
}
.end-calls {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
    justify-content: flex-end;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.action-icons {
	text-align: center;
}
.part-name {
	position: absolute;
	top: 20px;
	left: 20px;
	text-align: left;
}
.part-name h4 {
	font-weight: 600;
	font-size: 10px;
	color: #FFF; 
	margin-bottom: 0;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
	background: #35446F;
	opacity: 0.75;
	backdrop-filter: blur(2.5px);
	border-radius: 8px;
	padding: 10px;
	display: inline-block;
}
.more-icon {
	position: absolute;
	top: 20px;
	right: 20px;
}
.more-icon a {
	color: #FFF;
	background: #35446F;
	opacity: 0.75;
	border-radius: 8px;
	width: 38px;
	height: 38px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.single-user .more-icon a {
	width: 30px;
	height: 30px;
}
.more-icon a:first-child {
	padding-left: 0;	
}
.more-icon a:hover {
	opacity: 0.8;
}
.meeting .part-name {
	top: inherit;
    left: 15px;
	bottom: 15px
}
.meeting .more-icon {
	top: 15px;
    right: 15px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
.meeting-wrapper, .meeting {
	width: inherit;
	max-width: inherit;
}
.show-chat-list, .show-invite-list,
.show-chat-list .user-sidebar-right,
.show-invite-list .invite-sidebar-right {
    transition: all 0.8s ease;
}
.user-sidebar-right, .invite-sidebar-right {
    background: #dedede;
	border-radius: 10px;
    width: 410px;
    position: absolute;
    top: 105px;
    bottom: 117px;
    right: 0;
    margin-right: -410px;
    transition: all 0.8s ease;
    overflow: hidden;
    font-size: 13px;
	z-index: 3;
}
.join-contents {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	box-sizing: border-box;
	width: 100%;
	max-width: 950px;
	margin: 0 auto;
	overflow: hidden;
}
.join-contents.grid-view {
    align-content: center;
}
.ripple {
	width: 114px;
    height: 114px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.multigrid-view .text-box {
    height: 61px;
    width: 61px;
}
.multigrid-view .ripple {
	width: 80px;
    height: 80px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.meeting .join-video {
    margin: 0 5px 10px;	
	width: 100%;
	height: 309px;
}
.join-video.user-active {
	background: #415B6A;
    border-radius: 10px;
}
.join-video.single-user {
    width: 23%;	
	flex-grow: 1;
    box-sizing: border-box;
    margin: 0 5px 10px;
    -webkit-box-pack: justify;
	-ms-flex-pack: justify;
    justify-content: space-between;
    text-align: center;
	height: auto;
	background: #415B6A;
    border-radius: 10px;
	padding: 0;
}
.multigrid-view .join-video.single-user {
    width: calc(20% - 10px);
	flex-grow: 0;
}
.join-video.single-user img {
	height: auto;
}
.text-avatar h4 {
	color: #FFF;
}
.text-avatar {
	color: #FFF;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.text-box {
    height: 86px;
    width: 86px;	
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.2);
    font-size: 36px;
	font-weight: 700;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.settings-menu {
	background: #E4EEFF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.13);
	border-radius: 10px;
	padding: 0 15px;
}
.settings-menu li a {
	padding: 12px 0;
	border-bottom: 1px solid #FFFFFF;
	width: auto;
	height: auto;
	background: #E4EEFF;
	font-weight: 600;
	font-size: 14px;
    color: #000;
}
.settings-menu li a:focus, .settings-menu li a:hover {
    color: #000;
    background-color: #E4EEFF;
}
.settings-menu li:last-child a {
	border: 0;
}
.settings-menu .user-img {
	font-size: 18px;
}
.settings-menu .user-img img {
	width: 36px;
    border-radius: 10px;
}
.settings-menu.setting-list-menu li a {
	background: transparent;
}
.overlay-icon {
	background: rgba(0, 0, 0, 0.7);
	border-radius: 10px;
	width: 44px;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 42px;
    left: 15px;
	opacity: 0;
	transition: opacity .3s linear;
}
.overlay-icon a {
	color: #FFF;
    padding: 3px 0;
	font-size: 14px;
	text-align: center;
}
.overlay-icon a:hover {
	opacity: 0.8;
}
.join-video.single-user::before, .meeting .join-video::before  {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	content: "";
	border-radius: 10px;
	opacity: 0;
	transition: opacity .3s linear;
}
.join-video.single-user:hover::before, .meeting .join-video:hover::before  {
	opacity: 1;
}
.join-video.single-user:hover .overlay-icon, .join-video:hover .overlay-icon {
	opacity: 1;
}
.more-icon.mic-view .mic-off {
	display: block;
}
.grid-view .join-video.single-user {
    width: 48%;	
}
.join-contents.multigrid-view {
	max-width: 100%;
	padding: 25px 100px 0;
	justify-content: center;
}
.meeting-list {
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
	position: relative;
}
.user-active .more-icon .handraise-on.active {
	display: block;
	animation: mymove 5s;
}
.user-active .more-icon .handraise-on.active .meeting .join-video.user-active::before {
	animation: mymove 5s infinite;
	opacity: 1;
}
@keyframes mymove {
	from {color: #0074E0;}
	to {color: transparent;}
}
.join-contents.vertical-view {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	align-content: center;
	max-width: 1300px;
}
.join-contents.vertical-view .join-video.user-active {
	flex: 1;
	margin-bottom: 5px;;
}
.join-contents.vertical {
	flex-direction: column;
	height: 200px;
}
.join-contents.vertical-view .join-video.single-user {
    width: 97%;
    flex-grow: 1;
}
.meeting .join-contents.vertical .join-video.user-active {
	flex: 1 0 100%;
}
.meeting .join-contents.vertical .join-video.single-user {
	flex: 0;
}
.meeting .join-contents.vertical .join-video {
	width: auto;
}
.ptro-holder-wrapper {
	top: 80px !important;
	position: relative  !important;
	height: auto !important;
	bottom: 300px;
	z-index: 4;
}
.chat-footer .btn:hover {
	background: #0066c5;
	color: #FFF;
}
.person-view {
	width: 40px;
	height: 40px;
	background: #415B6A;
	border-radius: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
	margin-right: 16px;
	color: #FFF;
	font-weight: 700;
	font-size: 14px;
}
.end-call-chat .btn-primary {
	min-width: 136px;
	background: #FE3F51;
	border-radius: 8px;
	margin: 0px 20px;
	padding: 12px 15px;
	font-size: 16px;
}

/*-----------------
	Email
-----------------------*/

.compose-mail .btn-primary {
	font-size: 14px;
	font-weight: 500;
	min-width: 100%;
	padding: 10px 15px;
	margin-bottom: 30px;
}
.email-menu-blk ul {
	padding: 0;
}
.email-menu-blk ul li {
	list-style: none;
}
.email-menu-blk ul li a {
	color: rgba(51, 52, 72, 0.5);
	font-size: 15px;
	font-weight: 500;
	padding: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	border-radius: 8px;
	margin-bottom: 5px;
}
.email-menu-blk ul li a:hover {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}
.email-menu-blk ul li.active a {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}
.email-menu-blk ul li.active span {
	background: #00D3C7;
	border-radius: 20px;
	color: #fff;
	font-weight: 600;
}
.email-menu-blk ul li span {
	font-size: 14px;
	margin-left: auto;
	width: 45px;
	height: 26px;
}
.sub-mails {
	padding: 0;
	position: absolute;
    top: 13px;
    right: 20px;
}
.sub-mails li { 
	padding: 0px 5px;
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}
.summer-mail .card .card-header {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
}
.summer-mail .note-editor.note-frame {
    border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
}
.chat-user-group .user-titles.user-head-compse h5 {
    color: #3a57e8;
}
.label-blk {
	margin-bottom: 20px;
}
.label-blk h4 {
	margin-bottom: 0;
	color: #333448;
	font-size: 16px;
	font-weight: 600;
}
.label-add-list li .add-list-btn {
	width: 30px;
	height: 30px;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.label-add-list li .add-list-btn:hover {
	background: #234CE3;
	color: #fff;
}
.top-action-right ul li {
	margin-right: 20px;
}
.top-action-right ul li:last-child {
	margin-right: 0px;
}
.top-liv-search.top-action-search .form-control {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	border: 0;
}
.top-inbox-blk {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	width: 40px;
	height: 40px;
}
.top-inbox-blk .dropdown-menu {
	text-align: center;
	padding: 0;
	border: 0;
	background: linear-gradient(51.64deg, rgba(255, 255, 255, 0) 34.2%, rgba(255, 255, 255, 0.5) 97.35%, rgba(255, 255, 255, 0) 160.66%), rgba(255, 255, 255, 0.8);
	box-shadow: 0px 4px 9px #E1ECFF, inset 0px 0px 15px rgba(255, 255, 255, 0.35);
	backdrop-filter: blur(5px);
	border-radius: 5px;
}
.top-inbox-blk .dropdown-menu .dropdown-item {
	border-bottom: 1px solid #EBEBF6;
	font-size: 14px;
	font-weight: 600;
	color: #333448;
	padding: 10px;
}
.top-inbox-blk .dropdown-menu .dropdown-item:last-child {
	border-bottom: 0px;
}
.top-recheck .custom_check input {
	position: relative;
}
.top-check .form-check-input {
	border: 2px solid rgba(51, 52, 72, 0.2);
	border-radius: 4px;
	width: 18px;
	height: 18px;
}
.top-check .form-check-input:checked[type=checkbox] {
	background-color: #234ce3;
}
.form-check-input:checked {
    background-color: #3d59e9;
    border-color: #3d59e9;
}
.select-gender .form-check-input:focus {
	box-shadow: none;
}
.top-check .form-check-input:focus {
	box-shadow: none;
}
.email-content .table-inbox tr {
    background: #fff;
	border-radius: 5px;
}
.email-content .table-inbox tr td {
	vertical-align: middle;
	padding: 15px;
	color: #6586BF;
	white-space: nowrap;
}
.email-img img { 
	border-radius: 50px;
	width: 48px;
	height: 48px;
	margin-right: 10px;
}
.send-user h4 {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 5px;
}
.send-user p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.email-img-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.send-user h4 span {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 5px;
	margin-left: 10px;
	font-size: 10px;
	border-radius: 8px;
}
.send-user .email-market {
	background: rgba(0, 211, 199, 0.15);
	color: #00D3C7;
}
.email-office {
	background: rgba(13, 191, 10, 0.15);
	color: #0DBF0A;
}
.email-bills {
	background: rgba(254, 63, 81, 0.15);
	color: #FE3F51;
}
.email-work {
	background: rgba(255, 182, 39, 0.15);
	color: #FFB627;
}
.send-user h4 {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.compose-mail h3 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 30px;
}
.mail-send {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: end;
	-webkit-justify-content: end;
	-ms-flex-pack: end;
}
.mail-send .btn-primary {
	margin-bottom: 0;
	min-width: 111px;
	border-radius: 12px;
}
.mail-reports ul li .ford-angle {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	transform: matrix(-1, 0, 0, 1, 0, 0);
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	width: 40px;
	height: 40px;
}
.mail-reports ul li .ford-angle:hover {
	background: rgb(35 76 227 / 50%);
}
.mail-reports ul li .ford-angle:hover img,
.mail-reports ul li .ford-angle:hover i {
	filter: invert(1) brightness(100);
}
.mail-reports ul li {
	margin-right: 10px;
}
.mail-reports ul li:last-child {
	margin-right: 0px;
}
.mail-view-list {
	margin-bottom: 25px;
}
.mail-view-list li {
	margin-right: 10px;
}
.mailview-inner p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 13px;
	font-weight: 600;
}
.thank-mail {
	margin-bottom: 40px;
}
.thank-mail h5 {
	color: #35446F;
	font-size: 14px;
	margin-bottom: 0;
}
.thank-mail h4 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
}
.forward-send .btn-primary {
	padding: 10px 15px;
	padding: 7px 23px;
	margin-bottom: 0;
	border: 2px solid transparent;
	font-size: 14px;
}
div.dataTables_wrapper div.dataTables_info {
    padding-bottom: 0.85em;
}
div.dataTables_wrapper div.dataTables_paginate {
    padding-right: 15px;
}
.forward-send .forwrd-btn {
	background: transparent;
	border: 2px solid #234CE3;
	color: #234CE3;
	font-weight: 600;
}
.forward-send .forwrd-btn:hover {
	background: #234CE3;
	border: 2px solid #234CE3;
	color: #fff;
}
.forward-send .forwrd-btn:hover img {
	filter: invert(1) brightness(100);
}
.custom-file-upload {
    background: linear-gradient(51.64deg, rgba(255, 255, 255, 0) 34.2%, rgba(255, 255, 255, 0.2) 97.35%, rgba(255, 255, 255, 0) 160.66%), rgba(255, 255, 255, 0.2);
	border: 2px solid #FFFFFF;
	border-radius: 8px;
    display: inline-flex;
    transition: border-color .3s;
    width: 100%;
    font-size: 14px;
    cursor: pointer;
    margin-top: 0;
    height: 53px;
    color: #000;
    position: relative;
}
.custom-file-upload input {
    display: none;
}
.custom-file-upload .file-upload-text {
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    padding-left: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.change-user {
    padding: 10px 18px;
    background: #6586BF;
	border-radius: 8px;
    font-size: 16px;
    color: #FFF;
    position: absolute;
    right: 0;
	margin: 2px;
	min-width: 177px;
	text-align: center;
}
.sender-img img {
	width: 48px;
	height: 48px;
}
.send-user.send-user-name h4 {
	font-size: 15px;
}
.send-user.send-user-name h4 span {
	padding: 5px 15px;
}
.send-user p span {
	color: #333448;
	font-weight: 600;
}
.mail-reports ul li .ford-angle.star-bg {
	background: transparent;
	margin-right: 0;
}
.ford-angle.star-bg i {
	color: #FFB627;
}
.mail-attach .msg-sub-list li {
	max-width: 100%;
	margin-bottom: 0;
	margin-right: 10px;
}
.mail-attach .msg-sub-list li i {
	color: #FE3F51;
}
.mail-attach {
	margin-bottom: 40px;
}
.view-content-bottom {
	border-bottom: 2px solid #FFFFFF;
	padding-bottom: 40px;
	margin-bottom: 40px;
}
.mail-attach h2 {
	color: #35446F;
	font-size: 16px;
	font-weight: 600;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.mail-attach h2 a {
	color: #3a57e8;
	font-size: 14px;
}
.setting-title p {
	margin-bottom: 0;
}

/*-----------------
	16. Focus Label
-----------------------*/

.form-focus {
	display: flex;
	height: 50px;
	position: relative;
}
.form-focus .focus-label {
	font-size: 16px;
	font-weight: 400;
	opacity: 0.4;
	pointer-events: none;
	position: absolute;
	-webkit-transform: translate3d(0, 22px, 0) scale(1);
	-ms-transform: translate3d(0, 22px, 0) scale(1);
	-o-transform: translate3d(0, 22px, 0) scale(1);
	transform: translate3d(0, 22px, 0) scale(1);
	transform-origin: left top;
	transition: 240ms;
	left: 12px;
	top: -8px;
	z-index: 1;
	color: #888;
}
.form-focus.focused .focus-label {
	opacity: 1;
	font-weight: 300;
	top: -14px;
	font-size: 12px;
	z-index: 1;
}
.form-focus .form-control {
	height: 50px;
	padding: 21px 12px 6px;
}
.form-focus .form-control::-webkit-input-placeholder {
	color: transparent;
	transition: 240ms;
}
.form-focus .form-control:focus::-webkit-input-placeholder {
	transition: none;
}
.form-focus.focused .form-control::-webkit-input-placeholder {
	color: #bbb;
}
.profile-basic .cal-icon {
	width: 100%;
}
.form-focus .select2-container .select2-selection--single {
	border: 1px solid #ccc;
	height: 50px;
	border-radius: 0;
}
.form-focus .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 48px;
	right: 7px;
}
.form-focus .select2-container--default .select2-selection--single .select2-selection__arrow b {
	border-color: #ccc transparent transparent;
	border-style: solid;
	border-width: 6px 6px 0;
	height: 0;
	left: 50%;
	margin-left: -10px;
	margin-top: -2px;
	position: absolute;
	top: 50%;
	width: 0;
}
.form-focus .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	border-color: transparent transparent #ccc;
	border-width: 0 6px 6px;
}
.form-focus .select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 30px;
	padding-left: 12px;
	padding-top: 10px;
}
.form-focus .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #676767;
	font-size: 14px;
	font-weight: normal;
	line-height: 38px;
}
.form-focus .select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: #fc6075;
}
.file-size {
	color: #888;
}

/*-----------------
	17. Leave
-----------------------*/

.filter-row .btn {
	border-radius: 0;
	min-height: 50px;
	padding: 12px;
	text-transform: uppercase;
}
.form-focus.select-focus .focus-label {
	opacity: 1;
	font-weight: 300;
	top: -20px;
	font-size: 12px;
	z-index: 1;
}
.action-label .label {
	display: inline-block;
	min-width: 85px;
	padding: 0.5em 0.6em;
}
.action-label i {
	margin-right: 3px;
}
.action-label .dropdown-menu > li > a {
	padding: 3px 10px;
}

/*-----------------
	18. Employee
-----------------------*/

.action-icon {
	color: #777;
	font-size: 14px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	width: 31px;
	height: 31px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin-left: auto;
}
.table .dropdown-menu {
	font-size: 12px;
	padding: 0;
}
.profile-widget {
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
	margin-bottom: 30px;
	padding: 20px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.profile-widget .user-name > a {
	color: #333;
}
.dropdown.profile-action {
	position: absolute;
	right: 5px;
	text-align: right;
	top: 10px;
}
.profile-action .dropdown-toggle:after {
	display: none;
}
.profile-img {
	cursor: pointer;
	height: 80px;
	margin: 0 auto;
	position: relative;
	width: 80px;
}
.profile-img .avatar {
	font-size: 24px;
	height: 80px;
	line-height: 80px;
	margin: 0;
	width: 80px;
}
.mobile-no > a {
	color: #777;
	display: inline-block;
}
.staff-mail > a {
	color: #777;
	display: inline-block;
	margin-top: 5px;
}
.staff-action-btns {
	margin-top: 10px;
}
.staff-id {
	margin-top: 5px;
}
.view-icons {
	float: right;
	margin-right: 10px;
}
.view-icons .btn {
	color: #888;
	font-size: 18px;
	margin-right: 5px;
	padding: 4px;
}
.view-icons .btn.active {
	color: #333;
}
.attent-status {
	background: rgba(0, 211, 199, 0.15);
	border-radius: 6px;
	width: 26px;
	height: 26px;
	color: #00D3C7;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.present-table {
	background: rgba(0, 211, 199, 0.15);
	color: #00D3C7;
}
.absent-table {
	background: rgba(255, 54, 103, 0.1);
	color: #FF3667;
}
.month-table h5 {
	font-weight: 500;
	font-size: 14px;
}
.attent-table thead tr th:first-child {
	color: #333448;
}
.attent-table thead tr th {
	font-weight: 600;
	font-size: 14px;
	color: #3a57e8;
}
.attent-table .week-days {
	color: rgba(51, 52, 72, 0.2);
}

/*-----------------
	19. Events
-----------------------*/

.calendar {
	float: left;
	margin-bottom: 0;
}
.fc-view {
	margin-top: 10px;
}
a.fc-event:not([href]) {
    color: #fff;
}
.none-border .modal-footer {
	border-top: none;
}
.fc-toolbar h2 {
	font-size: 18px;
	font-weight: 600;
	font-family: 'Rubik', sans-serif;
	line-height: 30px;
	text-transform: uppercase;
}
.fc-day-grid-event .fc-time {
	font-family: 'Rubik', sans-serif;
}
.fc-day {
	background: #fff;
}
.fc-toolbar .fc-state-active,
.fc-toolbar .ui-state-active,
.fc-toolbar button:focus,
.fc-toolbar button:hover,
.fc-toolbar .ui-state-hover {
	z-index: 0;
}
.fc th.fc-widget-header {
	background: #eeeeee;
	font-size: 14px;
	line-height: 20px;
	padding: 10px 0;
	text-transform: uppercase;
}
.fc-unthemed th,
.fc-unthemed td,
.fc-unthemed thead,
.fc-unthemed tbody,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-row,
.fc-unthemed .fc-popover {
	border-color: #f3f3f3;
}
.fc-button {
	background: #f1f1f1;
	border: none;
	color: #797979;
	text-transform: capitalize;
	box-shadow: none !important;
	border-radius: 3px !important;
	margin: 0 3px !important;
	padding: 6px 12px !important;
	height: auto !important;
}
.fc-text-arrow {
	font-family: inherit;
	font-size: 16px;
}
.fc-state-hover {
	background: #f3f3f3;
}
.fc-state-highlight {
	background: #f0f0f0;
}
.fc-state-down,
.fc-state-active,
.fc-state-disabled {
	background-color: #00d3c7;
	color: #fff;
	text-shadow: none;
}
.fc-cell-overlay {
	background: #f0f0f0;
}
.fc-unthemed .fc-today {
	background: #fff;
}
.fc-event {
	border-radius: 2px;
	border: none;
	cursor: move;
	font-size: 13px;
	margin: 1px 7px;
	padding: 5px;
	text-align: center;
}
.fc-basic-view td.fc-week-number span {
	padding-right: 8px;
	font-weight: 700;
	font-family: 'Rubik', sans-serif;
}
.fc-basic-view td.fc-day-number {
	padding-right: 8px;
	font-weight: 700;
	font-family: 'Rubik', sans-serif;
}

/*-----------------
	20. Profile
-----------------------*/

.card-box.profile-header {
	margin: 0;
}
.profile-details {
	text-align: center;
}
.personal-info li .title {
	color: #515365;
	float: left;
	font-weight: 500;
	margin-right: 30px;
	width: 30%;
	font-size: 14px;
}
.personal-info li .text {
	color: #888da8;
	display: block;
	overflow: hidden;
	font-size: 14px;
}
.personal-info li {
	margin-bottom: 10px;
}
.personal-info {
	list-style: none;
	margin-bottom: 0;
	padding: 0;
}
.personal-info .text > a {
	color: #3a57e8;
	font-size: 14px;
}
.profile-view .profile-img-wrap {
	height: 150px;
	width: 150px;
}
.profile-view .profile-img {
	width: 150px;
	height: 150px;
}
.profile-view .profile-img .avatar {
	font-size: 24px;
	height: 150px;
	line-height: 150px;
	margin: 0;
	width: 150px;
}
.profile-view .profile-basic {
	margin-left: 170px;
}
.staff-msg {
	margin-top: 30px;
}
.experience-box {
	position: relative;
}
.experience-list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}
.experience-list:before {
	background: #ddd;
	bottom: 0;
	content: "";
	left: 8px;
	position: absolute;
	top: 8px;
	width: 2px;
}
.experience-list > li {
	position: relative;
}
.experience-list > li:last-child .experience-content {
	margin-bottom: 0;
}
.experience-user .avatar {
	height: 32px;
	line-height: 32px;
	margin: 0;
	width: 32px;
}
.experience-list > li .experience-user {
	background: #fff;
	height: 10px;
	left: 4px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 4px;
	width: 10px;
}
.experience-list > li .experience-content {
	background-color: #fff;
	margin: 0 0 20px 40px;
	padding: 0;
	position: relative;
}
.experience-list > li .experience-content .timeline-content {
	color: #9e9e9e;
}
.experience-list > li .experience-content .timeline-content a.name {
	color: #616161;
	font-weight: bold;
	font-size: 14px;
}
.experience-list > li .time {
	color: #bdbdbd;
	display: block;
	font-size: 12px;
	line-height: 1.35;
}
.before-circle {
	background-color: #ddd;
	border-radius: 50%;
	height: 10px;
	width: 10px;
}
.skills > span {
	border: 1px solid #ccc;
	border-radius: 500px;
	display: block;
	margin-bottom: 10px;
	padding: 6px 12px;
	text-align: center;
}
.profile-info-left {
	border-right: 2px dashed #ccc;
}
.profile-info-left h3 {
	font-size: 20px;
}
.profile-info-left .staff-id {
	font-size: 15px;
}
.profile-tabs .nav-tabs {
	background-color: #fff;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}
.alert {
	font-size: 14px;
}

/*-----------------
	21. Notifications
-----------------------*/

.notifications {
	padding: 0;
}
.notifications .drop-scroll {
	height: 290px;
	width: 400px;
}
.notifications.msg-noti .drop-scroll {
	width: 310px;
}
.notifications .notification-heading {
	margin: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.45;
	color: #616161;
}
.notifications .notification-time {
	font-size: 12px;
	line-height: 1.35;
	color: #bdbdbd;
}
.notification-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.notifications ul.notification-list > li {
	margin-top: 0;
	border-bottom: 1px solid #f5f5f5;
}
.notifications ul.notification-list > li:last-child {
	border-bottom: none;
}
.notifications ul.notification-list > li a {
	display: block;
	padding: 12px;
	border-radius: 2px;
}
.notifications ul.notification-list > li a:hover {
	background-color: #fafafa;
}
.drop-scroll {
	overflow-y: scroll;
	position: relative;
}
.topnav-dropdown-header {
	border-bottom: 1px solid #eee;
	text-align: center;
}
.topnav-dropdown-header,
.topnav-dropdown-footer {
	font-size: 12px;
	height: 32px;
	line-height: 32px;
	padding-left: 12px;
	padding-right: 12px;
}
.topnav-dropdown-footer a {
	display: block;
	text-align: center;
	color: #333;
}
.user-menu.nav > li > a .badge {
	color: #fff;
	font-size: 60%;
	font-weight: 700;
	position: absolute;
	right: 3px;
	top: 6px;
}
.user-menu.nav > li > a > i {
	font-size: 16px;
	line-height: 55px;
}
.noti-details {
	color: #989c9e;
	margin: 0;
}
.noti-time {
	margin: 0;
}
.noti-title {
	color: #333;
}

/*-----------------
	22. Roles & Permissions
-----------------------*/

.roles-menu {
	margin-top: 20px;
}
.roles-menu > ul {
	background-color: #fff;
	border: 1px solid #eaeaea;
	border-radius: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.roles-menu > ul > li {
	display: block;
	position: relative;
}
.roles-menu > ul > li > a {
	border-left: 3px solid transparent;
	color: #333;
	display: block;
	padding: 10px 15px;
	position: relative;
}
.roles-menu > ul > li.active > a {
	border-color: #009efb;
	color: #009efb;
}
.roles-menu > ul > li > a:hover {
	border-color: #009efb;
	background-color: #eee;
}
.material-switch > input[type="checkbox"] {
	display: none;
}
.material-switch > label {
	cursor: pointer;
	height: 0px;
	position: relative;
	width: 40px;
}
.material-switch > label:before {
	background: rgb(0, 0, 0);
	box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
	border-radius: 8px;
	content: '';
	height: 16px;
	margin-top: -8px;
	position: absolute;
	opacity: 0.3;
	transition: all 0.4s ease-in-out;
	width: 40px;
}
.material-switch > label:after {
	background: rgb(255, 255, 255);
	border-radius: 16px;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	content: '';
	height: 24px;
	left: -4px;
	margin-top: -8px;
	position: absolute;
	top: -4px;
	transition: all 0.3s ease-in-out;
	width: 24px;
}
.material-switch > input[type="checkbox"]:checked + label:before {
	background: inherit;
	opacity: 0.5;
}
.material-switch > input[type="checkbox"]:checked + label:after {
	background: inherit;
	left: 20px;
}
.role-action {
	display: none;
	float: right;
	position: absolute;
	right: 8px;
	top: 8px;
}
.roles-menu > ul > li:hover .role-action {
	display: block;
}
.slide-nav .sidebar {
	margin-left: 0;
}
.action-circle {
	background: transparent;
	border: 1px solid #ccc;
	border-radius: 100%;
	height: 20px;
	width: 20px;
	display: inline-block;
	text-align: center;
	cursor: pointer;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.action-circle .material-icons {
	color: #ccc;
	font-size: 18px;
	vertical-align: -3px;
}
.action-circle.completed {
	background: #35BA67;
	border: 1px solid #2fa65c;
}
.action-circle.completed .material-icons {
	color: #fff;
}
.action-circle.large {
	height: 24px;
	width: 24px;
}
.action-circle.large .material-icons {
	font-size: 16px;
	vertical-align: -4px;
}
.sidebar-overlay {
	display: none;
	position: fixed;
	z-index: 90;
	height: 100%;
	left: 0;
	top: 50px;
	width: 100%;
	z-index: 99;
	background-color: rgba(0, 0, 0, 0.6);
	overflow: hidden;
}
.menu-opened .sidebar-overlay {
	display: block;
}
.sidebar-menu.opened {
	opacity: 1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	-o-transform: translateX(0px);
	transform: translateX(0px);
	margin-left: 0;
}
html.menu-opened {
	overflow: hidden;
}
html.menu-opened body {
	overflow: hidden;
}
.chat-profile-view.opened {
	margin-right: 0;
}
.menu-opened .message-view.chat-view {
	width: 100%;
}

/*-----------------
	23. Chat Right Sidebar
-----------------------*/

.fixed-header .custom-menu {
	margin: 1px 0 0;
}
.topnav-dropdown-footer {
	border-top: 1px solid #eee;
}
.notification-box {
	bottom: 0;
	margin-right: -300px;
	position: fixed;
	right: 0;
	top: 70px;
	transition: all 0.4s ease 0s;
	width: 300px;
	z-index: 101;
	border-left: 1px solid #ddd;
}
.open-msg-box .notification-box {
	margin-right: 0;
}
.msg-sidebar {
	background-color: #fff;
}
.list-box {
	list-style: none;
	padding-left: 0;
}
.list-item.new-message {
	background-color: rgba(0, 0, 0, 0.2);
}
.list-item {
	border-bottom: 1px solid #eaeaea;
	padding: 10px;
	position: relative;
}
.list-left {
	height: 48px;
	position: absolute;
	width: 48px;
}
.files-icon {
	background-color: #f5f5f5;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-block;
	height: 38px;
	line-height: 38px;
	text-align: center;
	width: 38px;
}
.files-icon i {
	color: #777;
	font-size: 20px;
}
.list-body {
	padding: 0 0 0 50px;
}
.message-author {
	color: #333448;
	float: left;
	font-weight: bold;
	width: 175px;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 600;
}
.message-time {
	color: #888;
	float: right;
	font-size: 11px;
}
.message-content {
	color: #333;
	font-size: 11px;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/*-----------------
	24. Invoice
-----------------------*/

.invoice-details,
.invoice-payment-details > li span {
	float: right;
	text-align: right;
}
.attach-files > ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.attach-files li {
	display: inline-block;
	margin-right: 10px;
	position: relative;
}
.attach-files li img {
	width: 50px;
}
.file-remove {
	color: #f00;
	position: absolute;
	right: -6px;
	top: -7px;
}
.attach-files li:last-child {
	margin-right: 0;
}
.inv-logo {
	height: auto;
	margin-bottom: 20px;
	max-height: 100px;
	width: auto;
}
.form-amt {
	border: 1px solid #fff;
}
.page-title-icon {
	display:inline-flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    border-radius: 4px;
    text-align: center;
}

.invoices-links:last-child {
    margin-right: 0px;
}
.invoices-links {
    color: #1B2559;
    margin-right: 20px;
}
.invoice-inner-datepic {
    border: 0;
    padding-left: 0;
}
.invoice-inner-datepic {
    border: 0;
    padding-left: 0;
}
.invoices-form .inovices-month-info .form-control {
    height: 42px;
}
.app-listing {
    padding: 0;
    margin: 0 -15px;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.app-listing > li {
    width: 20%;
    padding-left: 10px;
    padding-right: 10px;
}
.multipleSelection {
    position: relative;
    margin-bottom: 20px;
}
.multipleSelection .selectBox, 
.SortBy .selectBoxes {
    position: relative;
    background: #fff;
    width: 100%;
    padding: 11px 10px;
    font-weight: 400;
    background: #FFFFFF;
	border: 2px solid rgba(46, 55, 164, 0.1);
    border-radius: 10px;
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}
.selectBox p {
    color: #1B2559;
    font-weight: 500;
	font-size: 14px;
}
.selectBox p .select-icon {
    color: #3a57e8;
    width: 20px;
    height: 20px;
}	
.multipleSelection #checkBoxes, .SortBy #checkBox {
    display: none;
    position: absolute;
    width: 300px;
    left: 0;
    z-index: 1;
    margin-top: 10px;
    padding: 20px;
    background: #FFFFFF;
    border: 1px solid #F2ECFF;
    box-shadow: 0px 4px 44px rgb(231 234 252 / 75%);
    border-radius: 6px;
}
.multipleSelection #checkBoxes::before, .SortBy #checkBox::before {
    border: 7px solid #F2ECFF;
    border-color: transparent transparent #ffffff #ffffff;
    box-shadow: -2px 2px 2px -1px rgb(0 0 0 / 10%);
    content: "";
    left: 30px;
    position: absolute;
    top: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}
.checkbox-title {
    font-weight: 600;
    font-size: 15px;
    color: #3a57e8;
    margin-bottom: 14px;
}
#checkBoxes .form-custom {
    margin-bottom: 14px;
}
.selectBox-cont {
    height: 220px;
    overflow-y: auto;
    padding: 5px;
}
#checkBoxes-one .btn-grey {
	background: #55ddff30;
	color: #1B2559;
	margin-top: 10px;
	border: none;
}
.custom_check {
    color: #1B2559;
    display: inline-block;
    position: relative;
    font-size: 13px;
    margin-bottom: 15px;
    padding-left: 30px;
    cursor: pointer;
    font-weight: 400;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.custom_check input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.custom_check .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    border: 1px solid #C4C4C4;
    background-color: transparent;
    border-radius: 0;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.custom_check input:checked ~ .checkmark:after {
    display: block;
}
.custom_check .checkmark::after {
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    display: none;
    left: 5px;
    top: 2px;
    color: #ffffff;
    font-size: 9px;
}
#checkBoxes .btn, #checkBox .btn {
    font-size: 13px;
    font-weight: 500;
    padding: 8px 0px;
}
#checkBoxes .btn-grey {
    background:#55ddff30;
    color: #1B2559;
    margin-top: 10px;
	border: none;
}
.feather {
    width: 18px;
    height: 18px;
}
.report-btn {
    margin-bottom: 20px;
}
.report-btn .btn {
    font-weight: 600;
    color:#3a57e8;
    background: #FFFFFF;
    border: 2px solid #3a57e8;
    border-radius: 8px;
    width: 100%;
    padding: 11px 0;
}
 
.selectBox-cont-one {
    overflow-y: inherit;
}
.date-picker {
    width: 50%;
    float: left;
    padding-right: 10px;
}
#checkBoxes .form-custom {
    margin-bottom: 14px;
}
#checkBoxes .date-picker .form-custom .form-control {
    padding-left: 10px;
}
.form-custom.cal-icon:after {
    font-size: 14px;
}
.date-list ul {
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}
.date-list ul li {
    width: 100%;
    padding: 0;
    padding-bottom: 5px;
}
#checkBoxes .btn, #checkBox .btn {
    font-size: 14px;
    font-weight: 500;
    padding: 8px 0px;
}
.date-list .date-btn {
    background: #fff;
    color: #1B2559;
    border: 1px solid #E7EAFC;
    border-radius: 4px;
    padding: 10px 0 !important;
    width: 100%;
}
.date-list .date-btn:hover {
    background: #00d3c7;
    color: #fff;
    border: 1px solid #E7EAFC;
}
.custom_check input:checked ~ .checkmark {
    background-color: #3a57e8;
    border-color: #3a57e8;
}
.invoices-tabs-card {
    background: transparent;
	box-shadow: none;
    border: 0;
}
.inovices-card .card-body {
    padding: 15px;
}
.invoices-main-tabs {
    border-bottom: 2px solid #F3F3F3;
    padding-bottom: 10px;
}
.invoices-tabs ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
.invoices-tabs ul li {
    position: relative;
    display: inline-block;
    margin-right: 36px;
}
.invoices-tabs ul li a.active {
    color: #3a57e8;
    border-bottom: 2px solid #3a57e8;
}
.invoices-settings-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: end;
    -webkit-justify-content: end;
    -ms-flex-pack: end;
}
.invoices-settings-icon {
    color: #3a57e8;
    margin-right: 20px;
}
.invoices-settings-btn .btn {
    font-weight: 600;
    color: #fff;
	background-color: #3a57e8;
    padding: 12px 0;
    min-width: 167px;
    border: 1px solid #3a57e8;
    border-radius: 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
}
.inovices-card {
    border-radius: 5px;
}
.inovices-widget-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
}
.inovices-widget-icon img {
    width: 50px;
}
.inovices-widget-header .inovices-amount {
    font-weight: 600;
    font-size: 20px;
    color: #3a57e8;
}
.inovices-all {
    font-weight: 500;
    color: #1B2559;
    margin-top: 16px;
}
.inovices-all span {
    font-size: 10px;
    margin-left: 15px;
}
.invoices-tabs ul li a {
    font-weight: 500;
    font-size: 15px;
    color: #1B2559;
    padding-bottom: 24px;
}
table .badge {
    border-radius: 6px;
    display: inline-block;
    font-size: 13px;
    min-width: 105px;
    padding: 8px 20px;
    font-weight: 500;
    text-align: center;
}
.bg-primary-light {
    background-color: rgba(17, 148, 247, 0.12) !important;
    color: #2196f3 !important;
}
.bg-success-light {
    background-color: rgba(15, 183, 107, 0.12) !important;
    color: #26af48 !important;
}
.bg-danger-light {
    background-color: rgb(255 218 218 / 49%) !important;
    color: #FF0000 !important;
}
.table .invoice-link {
    color: #009efb;
}
.invoices-links.active {
    color: #3a57e8;
}
.invoices-links:last-child {
    margin-right: 0px;
}
.invoices-links {
    color: #1B2559;
    margin-right: 20px;
}
.table .bg-success-dark {
    background: #008F64;
}
.table .bg-danger-dark {
    background: #FF0000;
}
.invoices-grid-card {
    background: #FFFFFF;
    box-shadow: 0px 4px 24px rgb(228 228 228 / 25%);
    border-radius: 10px;
    color: #1B2559;
}
.invoices-grid-card .card-header {
    padding: 20px;
    border: 0;
}
.invoice-grid-link {
    color: #1B2559;
	font-size: 14px;
}
.card-middle {
    padding: 20px;
    background: #55ddff30;
}
.card-middle-avatar {
    align-items: center;
    display: inline-flex;
    font-size: 15px;
    margin: 0;
}
.card-middle-avatar a {
    color: #1B2559;
}
.invoices-grid-card .card-body {
    padding: 20px;
}
.invoices-grid-card .card-body span {
   font-size: 14px;
}
.invoices-grid-card .card-footer {
    padding: 20px;
    border: 0;
}
.card-footer:last-child {
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}
.invoices-settings-btn .btn svg{
	margin-right: 10px;
}
.preclincs-title {
    margin: 0;
    padding: 10px;
	display: flex;
	align-items: center;
}
.report-btn .btn:hover {
    color: #FFFFFF;
    background: #3a57e8;
    border: 2px solid #3a57e8;
}
.report-btn .btn:hover img {
    filter: invert(0) brightness(100);
}
.invoices-settings-btn .btn:hover {
    background: #00d3c7;
    border: 1px solid #00d3c7;
}
.invoices-tabs> ul> li > a:hover {
    color: #3a57e8;
}
a.invoices-settings-icon:hover {
    color: #00d3c7;
}
a.btn.delete-invoice-btn:hover {
    background: #474d52;
}
a.btn.save-invoice-btn:hover {
    background: #00d3c7;
}
a.invoices-preview-link:hover {
    color: #00d3c7;
}
li.breadcrumb-item.invoices-breadcrumb-item:hover > a {
	color: #00d3c7;
}
li.breadcrumb-item.invoices-breadcrumb-item:hover > a i {
	background: #00d3c7;
}
.invoice-info > strong > a:hover {
    color: #00d3c7;
}
.invoice-inner-head span a:hover {
    color: #00d3c7;
}
.field-box > a:hover {
    background: #00d3c7;
}
.invoice-total-inner a:hover {
    color: #00d3c7;
}
h2.card-middle-avatar:hover > a {
    color: #00d3c7;
}
.upload-sign button:hover {
    background: #00d3c7;
}
.payment-details:hover {
    background: #00d3c7;
}
.invoices-upload-btn:hover .upload {
	background-color: #00d3c7;
}
.invoice-setting-btn .cancel-btn:hover {
	background-color:#474d52 ;
}
.invoice-setting-btn button:last-child:hover {
	background-color: #00d3c7;
}
.settings-btns button:nth-child(1):hover {
	background-color: #00d3c7;
}
.settings-btn:hover .upload {
	background-color: #00d3c7;
}
.nav-tabs.menu-tabs .nav-link:hover {
	background: #3a57e8;
	color: #fff;
}
.form-row.links-cont a:hover {
    background: #00d3c7;
}
.form-row.links-cont button:hover {
    background: #00d3c7;
}
a.btn.add-links:hover {
    background: #00d3c7;
}
.breadcrumb-item a:hover{
	color: #00d3c7;
}
.breadcrumb-item.active  {
	color: rgba(46, 55, 164, 0.5);
}
.breadcrumb-item+.breadcrumb-item::before {
	display: none;
}
.breadcrumb-item+.breadcrumb-item i {
	color: #3a57e8;
}

/*-----------------
	25. Doctors
-----------------------*/

.doctor-img {
	cursor: pointer;
	height: 80px;
	margin: 0 auto 15px;
	position: relative;
	width: 80px;
}
.doctor-img .avatar {
	font-size: 24px;
	height: 80px;
	line-height: 80px;
	margin: 0;
	width: 80px;
}
.doc-prof {
	color: #777;
	font-size: 12px;
	margin-bottom: 10px;
}
.doctor-name {
	margin: 0;
}
.doctor-name a {
	color: #333;
}
.see-all {
	margin-top: 30px;
	text-align: center;
}
.see-all .see-all-btn {
	border: 1px solid #e2e2e2;
	border-radius: 5px;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
	color: #777;
	display: inline-block;
	padding: 10px 20px;
}
.comman-table.custom-table thead tr th,
.comman-table.custom-table tbody tr td {
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}
.comman-table.custom-table thead tr th {
	font-weight: 600;
}
.show-entire .dataTables_length {
	display: none;
}
.doctor-table-blk h3 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}
.doctor-table-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}
.doctor-search-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}
.doctor-search-blk .top-nav-search {
	margin-left: 15px;
}
.doctor-search-blk .top-nav-search form {
	margin: 0px;
}
.add-group {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.add-group .btn-primary {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	color: #3a57e8;
	width: 40px;
	height: 40px;
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.add-group .btn-primary:hover { 
	border: 0;
	background: #3a57e8;
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.add-group .btn-primary:hover img { 
	filter: invert(1) brightness(100);
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.table.comman-table > thead > tr > th,
.table.comman-table > tbody > tr > td {
	padding: 15px 15px;
}
.card-table .card-body {
	padding: 0;
}
.page-table-header {
	padding: 15px 15px 0px 15px;
}
.card-table .dataTables_info {
	padding-left: 15px;
	font-size: 14px;
}
.profile-image a {
	color: #333448;
}
.profile-image a:hover {
	color: #3a57e8;
}

/*-----------------
	26. Add Doctor
-----------------------*/

.profile-upload {
	display: flex;
}
.upload-img {
	margin-right: 10px;
}
.upload-img img {
	border-radius: 4px;
	height: 40px;
	width: 40px;
}
.upload-input {
	width: 100%;
}
.gen-label {
	display: block;
	margin-bottom: 18px;
}
.submit-btn {
	border-radius: 50px;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	min-width: 200px;
	padding: 8px 20px;
	text-transform: uppercase;
}
.delete-modal .modal-body .btn {
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	width: 90px;
	color: #333;
}
.delete-modal .modal-body .btn.btn-danger {
	color: #fff;
}
.delete-modal .modal-body > h3 {
	font-size: 16px;
	font-weight: bold;
	margin: 15px 0 0;
}
.custom-badge {
	border-radius: 8px;
	display: inline-block;
	font-size: 12px;
	min-width: 115px;
	padding: 5px 15px;
	text-align: center;
	border: 0;
}
.status-red,
a.status-red {
	background-color: #ffe5e6;
	color: #fe0000;
}
.status-green,
a.status-green {
	background: rgba(0, 211, 199, 0.1);
	color: #00D3C7;
}
.status-orange,
a.status-orange {
	background-color: #fef5e4;
	color: #ff9b01;
}
.status-blue,
a.status-blue {
	background-color: #e5f3fe;
	color: #008cff;
}
.status-purple,
a.status-purple {
	background-color: #f3e7fd;
	color: #8f13fd;
}
.status-pink,
a.status-pink {
	background-color: #ffe5f6;
	color: #ff01a2;
}
.status-grey,
a.status-grey {
	background-color: #ddd;
	color: #818181;
}
.btn-grey {
	background-color: #b2b2b2;
	border: 1px solid #b2b2b2;
}
.modal-backdrop {
	background-color: #fff;
}
.modal-backdrop.show {
	opacity: 0.9;
}
.invoices-view {
	width: 70%;
	float: right;
}
.local-forms.input-block {
	position: relative;
	margin-bottom: 30px;
}
.local-forms label {
	font-size: 12px;
    color: #333448;
    font-weight: 500;
    position: absolute;
    top: -10px;
    left: 10px;
    background: #fff;
    margin-bottom: 0;
    padding: 0px 5px;
	z-index: 99;
}
.local-forms .select2-container .select2-selection--single {
	height: 45px;
}
.local-forms .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 45px;
}
.local-forms .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px;
}
.form-heading h4 {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 30px;
}
.select-gender .gen-label {
	margin-bottom: 5px;
	color: #333448;
	font-size: 12px;
	font-weight: 500;
}
.select-gender .form-check-label {
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
	font-size: 14px;
}
.select-gender .form-check-input {
    width: 12px;
    height: 12px;
    margin-right: 5px;
    vertical-align: middle;
	margin-top: 0;
}
.local-top-form {
	position: relative
}
.local-top-form .local-top {
    font-size: 12px;
    color: #333448;
    font-weight: 500;
    position: absolute;
    top: -10px;
    left: 10px;
    background: #fff;
    margin-bottom: 0;
    padding: 0px 5px;
    z-index: 99;
}
.settings-btn.upload-files-avator .upload {
	width: 148px;
	background: #F4F5FA;
	color: #3a57e8;
	font-size: 14px;
	font-weight: 500;
	right: -2px;
    top: -2px;
	height: 46px;
}
.settings-btn.upload-files-avator {
	min-height: 45px;
    border: 2px solid rgba(46, 55, 164, 0.1);
    border-radius: 10px;
}
.doctor-submit .btn-primary {
	min-width: 131px;
	font-size: 14px;
	font-weight: 500;
	border-radius: 12px;
	padding: 10px 15px;
}
.doctor-submit .cancel-form {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}
.doctor-submit .cancel-form:hover {
	background: #3a57e8;
	color: #fff;
	border: 1px solid #3a57e8;
}
.calendar-icon:after {
    color: #333448;
    content: '\f073';
    display: block;
    font-family: "Font Awesome 6 Free";
    font-size: 16px;
    font-weight: 600;
    margin: auto;
    position: absolute;
    right: 15px;
    bottom: 10px;
}
.top-nav-search.table-search-blk .btn {
	min-height: 45px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

/*-----------------
	Doctor Profile
-----------------------*/

.doctor-profile-head {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
}
.profile-bg-img img {
	width: 100%;
	border-radius: 10px;
}
.profile-user-box {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding-left: 30px;
}
.profile-user-img {
	margin-right: 20px;
	position: relative;
    top: -30px;
}
.profile-user-img img {
	border-radius: 50%;
	width: 141px;
}
.names-profiles h4 {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 3px;
}
.names-profiles h5 {
	font-size: 14px;
	font-weight: 500;
	color: #3a57e8;
	margin-bottom: 0;
}
.profile-edit-icon {
    position: absolute;
	border-radius: 50px;
	bottom: 0;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.profile-edit-icon img {
	width: 25px;
}
.follow-group {
	width: 100%;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.doctor-follows {
	text-align: center;
}
.doctor-follows h5 {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0;
}
.doctor-follows h4 {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 0;
}
.follow-btn-group {
	width: 100%;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.follow-btn-group .btn-info {
	min-width: 127px;
	font-size: 16px;
	font-weight: 500;
	color: #fff;
	border-radius: 10px;
	padding: 9px 15px;
}
.follow-btn-group .follow-btns {
	background: #3a57e8;
	border: 1px solid #3a57e8;
	margin-right: 15px;
}
.follow-btn-group .follow-btns:hover {
	background: #00D3C7;
	border: 1px solid #00D3C7;
}
.follow-btn-group .message-btns {
	background: #00D3C7;
	border: 1px solid #00D3C7;
}
.follow-btn-group .message-btns:hover {
	background: #3a57e8;
	border: 1px solid #3a57e8;
}
.personal-activity {
	margin-bottom: 20px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.views-personal {
	margin-left: 10px;
}
.views-personal h5 {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.views-personal h4 {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0;
}
.personal-icons {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	border-radius: 8px;
	width: 40px;
	height: 40px;
}
.personal-icons i {
	color: #3D5EE1;
}
.doctor-personals-grp .card {
	border-radius: 10px;
	box-shadow: none;
}
.heading-detail h4 {
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 25px;
}
.heading-detail p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
}
.hello-park h5 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
}
.hello-park p {
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.skills-head {
	margin-bottom: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.skills-head h5 {
	margin-bottom: 0;
	font-size: 15px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.skills-head p {
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
	font-size: 15px;
	font-weight: 500;
}
.skill-statistics {
	margin-bottom: 25px;
}
.skill-statistics .progress {
	height: 4px;
}
.bg-operations {
	background: #3a57e8;
}
.bg-statistics {
	background: #00D3C7;
}
.bg-haemoglobin {
	background: #FF3667;
}
.bg-endoscopic {
	background: #FFBF42;
}
.bg-visit {
	background: #333548;
}
.setting-form-blk .local-forms label {
	font-size: 12px;
    color: rgba(51, 52, 72, 0.5);
}
.setting-form-blk .local-forms .form-control::placeholder {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
}
.about-info h4 {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	font-size: 18px;
	font-weight: 500;
}
.about-info h4 i {
	color: #8C8C8C;
	background: rgba(51, 53, 72, 0.05);
	border-radius: 10px;
	width: 31px;
	height: 31px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.about-info {
	margin-bottom: 25px;
}
.doctor-up-files label {
	font-size: 15px;
    font-weight: 500;
}
.doctor-up-files label.file-upload.image-upbtn {
	background: #444;
    border: 1px solid #444;
    border-radius: 8px;
    color: #fff;
    padding: 6px 19px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}
.doctor-up-files label.file-upload.image-upbtn:hover {
	background: #000;
    border: 1px solid #000;
}
.doctor-up-files label.file-upload {
    position: relative;
    overflow: hidden;
}
.doctor-up-files label.file-upload input[type="file"] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}
.doctor-up-files.profile-edit-icon label.file-upload.profile-upbtn {
    cursor: pointer;
}
.list-space {
	padding: 0;
	margin: 0;
}
.about-me-list ul li {
	list-style: none;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 30px;
}
.about-me-list ul li:last-child {
	margin-bottom: 0;
}
.about-me-list ul li h4 {
	min-width: 50%;
	margin-bottom: 0;
	font-size: 15px;
	font-weight: 500;
}
.about-me-list ul li span {
	min-width: 50%;
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.tab-content-set {
	border-bottom : 4px solid rgba(46, 55, 164, 0.05);
    padding-bottom: 25px;
	margin-bottom: 25px;
}
.tab-content-set ul li a.active::after, 
.tab-content-set ul li a:hover::after {
    position: absolute;
    content: "";
    background: #3a57e8;
    width: 100%;
    height: 4px;
    left: 0;
    bottom: -29px;
}
.tab-content-set ul li a.active,
.tab-content-set ul li a:hover {
	color: #3a57e8;
}
.tab-content-set ul li a.active .set-about-icon,
.tab-content-set ul li a:hover .set-about-icon {
	background: rgba(46, 55, 164, 0.05);
}
.tab-content-set ul li a.active .set-about-icon img,
.tab-content-set ul li a:hover .set-about-icon img {
	filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
}
.tab-content-set li a {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: rgba(51, 53, 72, 0.5);
	font-size: 15px;
	font-weight: 600;
	position: relative;
}
.tab-content-set li {
	padding-right: 20px;
}
.set-about-icon {
	background: rgba(51, 53, 72, 0.05);
	border-radius: 8px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.detail-personal h2 {
	font-size: 15px;
	font-weight: 500;
}
.detail-personal h3 {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
	margin-bottom: 0;
}
.personal-list-out {
	margin-bottom: 30px;
}
.profile-table.custom-table thead tr th,
.profile-table.custom-table tbody tr td {
    font-size: 14px;
    color: #333548;
	font-weight: 500;
	padding: 10px;
}
.profile-table.custom-table thead tr th {
	color: #333548;
}
.profile-table.custom-table tbody tr td {
    color: rgba(51, 53, 72, 0.5);
}
.profile-table.custom-table tbody tr {
	box-shadow: none;
}
.profile-check-blk .remember-me {
	margin-bottom: 20px;
}
.profile-check-blk .custom_check input:checked ~ .checkmark {
    background-color: #3a57e8;
    border-color: #3a57e8;
}
.profile-check-blk .form-heading h4 {
	font-size: 16px;
}
.patient-profile-table tbody tr td:nth-child(4) {
    color: rgba(51, 52, 72, 0.5);
}

/*-----------------
	Staffs
-----------------------*/

.staff-search-table {
	padding: 0px 15px;
	margin-top: 30px;
}
.submit-list-form {
	width: 100%;
}
.status-staff {
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.1);
	box-shadow: 5px 5px 20px rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	padding: 0;
}
.status-staff .dropdown-item {
	border-bottom: 1px solid #EBEBF6;
	font-size: 12px;
	padding: 10px;
    text-align: center;
}
.status-staff .dropdown-item:last-child {
	border: 0;
}

/*-----------------
	27. Payslip
-----------------------*/

.payslip-title {
	margin-bottom: 20px;
	text-align: center;
	text-decoration: underline;
	text-transform: uppercase;
}
.pay-head-roll h5 {
	color: #3a57e8;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 20px;
}
.invoice-counts {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.payroll-head-clinic {
	margin-bottom: 20px;
}
.payrolss-counts {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.payrolss-counts h5 {
	margin-bottom: 0;
	font-weight: 600;
	font-size: 16px;
}
.payslip-head-roll h5 {
	font-weight: 600;
	font-size: 18px;
	margin-bottom: 20px;
}

/*-----------------
	28. Attendance
-----------------------*/

.half-day {
	width: 15px;
}

/*-----------------
	29. Inbox
-----------------------*/

.table-inbox input[type="radio"],
.table-inbox input[type="checkbox"] {
	cursor: pointer;
}
.mail-list {
	list-style: none;
	padding: 0;
}
.mail-list > li > a {
	color: #333;
	display: block;
	padding: 10px;
}
.mail-list > li.active > a {
	color: #009efb;
	font-weight: bold;
}
.unread .name,
.unread .subject,
.unread .mail-date {
	color: #000;
	font-weight: 600;
}
.table-inbox .starred.fa-star {
	color: #ffd200;
}
.table.table-inbox > tbody > tr > td,
.table.table-inbox > tbody > tr > th,
.table.table-inbox > tfoot > tr > td,
.table.table-inbox > tfoot > tr > th,
.table.table-inbox > thead > tr > td,
.table.table-inbox > thead > tr > th {
	border-bottom: 1px solid #f2f2f2;
	border-top: 0;
}
.table-inbox {
	font-size: 14px;
	margin-bottom: 0;
}
.note-editor.note-frame {
	border: 1px solid #ccc;
	box-shadow: inherit;
}
.note-editor.note-frame .note-statusbar {
	background-color: #fff;
}
.note-editor.note-frame.fullscreen {
	top: 60px;
}
.mail-title {
	font-weight: bold;
	text-transform: uppercase;
}
.form-control.search-message {
	border-radius: 4px;
	margin-left: 5px;
	width: 180px;
	padding: 0.375rem 0.75rem;
	min-height: 35px;
	margin-bottom: 5px;
}
.table-inbox tr {
	cursor: pointer;
}
table.table-inbox tbody tr.checked {
	background-color: #ffffcc;
}
.mail-label {
	margin-right: 5px;
}

/*-----------------
	29. Mail View
-----------------------*/

.attachments {
	list-style: none;
	margin: 0;
	padding: 0;
}
.attachments li {
	border: 1px solid #eee;
	float: left;
	margin-bottom: 10px;
	margin-right: 10px;
	width: 200px;
}
.attach-file {
	color: #777;
	font-size: 70px;
	padding: 10px;
	text-align: center;
	min-height: 153px;
}
.attach-file > i {
	line-height: 133px;
}
.attach-info {
	background-color: #f4f4f4;
	padding: 10px;
}
.attach-filename {
	color: #777;
	font-weight: bold;
}
.attach-filesize {
	color: #999;
	font-size: 12px;
}
.attach-file img {
	height: auto;
	max-width: 100%;
}
.mailview-header {
	border-bottom: 1px solid #ddd;
	margin-bottom: 20px;
	padding-bottom: 15px;
}
.mailview-footer {
	border-top: 1px solid #ddd;
	margin-top: 20px;
	padding-top: 15px;
}
.mailview-footer .btn-white {
	min-width: 102px;
}
.sender-name {
	display: block;
}
.receiver-name {
	color: #777;
}
.right-action {
	text-align: right;
}
.mail-view-title {
	font-weight: 500;
	font-size: 24px;
	margin: 0;
}
.mail-view-action {
	float: right;
}
.mail-sent-time {
	float: right;
}

/*-----------------
	31. Blog
-----------------------*/

.blog {
	position: relative;
	margin: 0 0 25px;
	background: #FFFFFF;
	border-radius: 12px;
	padding: 20px;
}
.blog-image {
	overflow: hidden;
}
.blog-image,
.blog-image > a,
.blog-image img {
	display: block;
	position: relative;
	width: 100%;
	height: auto;
}
.blog-image img {
	-moz-transform: scaleY(1);
	-webkit-transform: scaleY(1);
	-o-transform: scaleY(1);
	-ms-transform: scaleY(1);
	transform: scaleY(1);
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	-webkit-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
	border-radius: 16px;
}
.blog-image a:hover img {
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}
.blog-image {
	margin-bottom: 30px;
}
.blog-content {
	position: relative;
}
.blog-title {
	color: #000;
	font-weight: normal;
	margin: 0 0 20px;
}
.media {
    display: flex;
    align-items: center;
}
.blog-content p {
	color: rgba(51, 52, 72, 0.75);
	font-size: 14px;
	line-height: 25px;
	margin: 0 0 25px;
}
.read-more {
	color: #282628;
	display: inline-block;
	font-size: 14px;
	margin-bottom: 20px;
}
.read-more:hover {
	color: #009efb;
	margin-left: 10px;
	-moz-transition: all 0.2s linear 0s;
	-ms-transition: all 0.2s linear 0s;
	-o-transition: all 0.2s linear 0s;
	-webkit-transition: all 0.2s linear 0s;
	transition: all 0.2s linear 0s;
}
.read-more i {
	color: #3a57e8;
	font-size: 18px;
	margin-right: 3px;
}
.blog-info {
	border: 1px solid #eaeaea;
	color: #909090;
	font-size: 12px;
	margin-bottom: 0;
	padding: 12px 20px;
}
.blog-info a {
	color: #909090;
	margin-right: 5px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.blog-info a:last-child {
	margin-right: 0;
}
.blog-info a:hover {
	color: #00d3c7;
}
.blog-info i {
	color: rgba(51, 52, 72, 0.5);
	font-size: 18px;
	margin-right: 5px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.post-left {
	float: right;
}
.post-right {
	float: left;
}
.post-left ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.post-left ul li {
	float: left;
	margin-right: 20px;
}
.post-left ul li:last-child {
	margin-right: 0;
}
.video {
	position: relative;
	padding-bottom: 56%;
	height: 0;
	overflow: hidden;
}
.video iframe,
.video object,
.video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}
.widget {
	margin-bottom: 30px;
	background: #FFFFFF;
	border-radius: 10px;
	padding: 20px;
}
.widget h5 {
	color: #333548;
	font-size: 18px;
	font-weight: 500;
	margin: 0 0 20px;
}
.search-form .form-control {
	border: 1px solid #eaeaea;
	border-radius: 0;
	border-right: 0;
	box-shadow: inherit;
	height: 40px;
	color: #ababab;
}
.search-form .btn-primary {
	background-color: transparent;
	border-color: #eaeaea;
	border-left: none;
	color: #009efb;
	height: 40px;
	border-radius: 0;
}
.latest-posts {
	margin: 0;
	padding: 0;
}
.latest-posts li {
	display: table;
	width: 100%;
	padding-bottom: 15px;
	margin-bottom: 15px;
	border-bottom: 1px solid #eee;
}
.latest-posts li:last-child {
	padding-bottom: 0px;
	margin-bottom: 0px;
	border-bottom: none;
}
.post-thumb {
	width: 80px;
	float: left;
	overflow: hidden;
	border-radius: 16px;
}
.post-thumb a img {
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	border-radius: 16px;
}
.post-thumb a:hover img {
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}
.post-info {
	margin-left: 95px;
}
.post-info h4 {
	font-size: 14px;
	font-weight: normal;
	line-height: 18px;
	margin: 0 0 10px;
}
.post-info h4 a {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}
.post-info p {
	color: #3a57e8;
	font-size: 12px;
	margin: 0;
	font-weight: 500;
}
.post-info p i {
	color: #3a57e8;
	font-size: 16px;
	margin-right: 4px;
	position:relative;
	top: 2px;
}
.categories {
	list-style: none;
	margin: 0;
	padding: 0;
}
.categories li {
	padding: 12px 0;
	font-size: 16px;
	color: #333448;
	font-weight: 600;
}
.categories li:last-child {
	padding-bottom: 0px;
	border-bottom: none;
}
.categories li a {
	color: #656565;
	font-size: 14px;
}
.categories li a:hover {
	color: #009efb;
	margin-left: 10px;
	-moz-transition: all 0.2s linear 0s;
	-ms-transition: all 0.2s linear 0s;
	-o-transition: all 0.2s linear 0s;
	-webkit-transition: all 0.2s linear 0s;
	transition: all 0.2s linear 0s;
}
.categories > li > a > i {
	color: #009efb;
	font-size: 18px;
	margin-right: 10px;
}
.tags {
	list-style: none;
	margin: 0;
	overflow: hidden;
	padding: 0;
}
.tags li {
	float: left;
}
.tag {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	color: #333448;
	display: inline-block;
	padding: 5px 10px;
	position: relative;
	margin: 0 10px 10px 0;
	text-decoration: none;
	-moz-transition: color 0.2s;
	-ms-transition: color 0.2s;
	-o-transition: color 0.2s;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
	font-size: 12px;
	font-weight: 500;
}
.tag:hover {
	background-color: #3a57e8;
	color: #fff;
}
.comment-by {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	font-size: 14px;
	line-height: 21px;
	margin: 0 0 10px;
}
.comments-list .comment-block p {
	font-size: 12px;
	line-height: 20px;
	margin: 0;
	text-align: justify;
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
}
blockquote p {
	font-style: italic;
	font-weight: 400;
}
.grid-blog .blog-title {
	font-size: 16px;
	margin: 0 0 10px;
}
.grid-blog .blog-title a {
	color: #333448;
	font-size: 16px;
	font-weight: 500;
}
.grid-blog .blog-content p {
	font-size: 14px;
	margin: 0 0 15px;
	color: rgba(51, 52, 72, 0.5);
}
.grid-blog .blog-info {
	border: 0;
	border-top: 1px solid #eaeaea;
	margin-bottom: 0;
	padding: 12px 0;
}
.grid-blog .blog-image {
	margin-bottom: 20px;
	border-radius: 16px;
}
.grid-blog .read-more {
	font-size: 14px;
	margin-bottom: 0px;
	color: #3a57e8;
	font-weight: 500;
}
.product-thumbnail {
	position: relative;
	margin-bottom: 0;
	margin-top: 10px;
}
.product-remove {
	position: absolute;
	top: -10px;
	right: -6px;
	color: #f06060;
	cursor: pointer;
}
.bootstrap-tagsinput {
	width: 100%;
	height: auto;
	box-shadow: inherit;
	border-radius: 8px;
	line-height: 30px;
}
.bootstrap-tagsinput .badge [data-role="remove"]:hover {
	box-shadow: inherit;
	color: #f00;
}
.blog-views {
    position: absolute;
    top: 20px;
    left: 15px;
    background: #F5F6FA;
    border-radius: 6px;
    padding: 4px 10px;
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    font-size: 12px;
}
.blog-views h5 {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 600;
	margin-bottom: 0;
}
.view-blog-list.blog-views {
    bottom: 20px;
	top: inherit;
}
.blog-views li {
	color: #3a57e8;
	font-weight: 600;
}
.blog-views li:first-child {
	margin-right: 10px;
}
.blog-grp-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	margin-bottom: 25px;
}
.blog-img-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.content-blk-blog h4 a {
	font-size: 15px;
	font-weight: 600;
	color: #333448;
}
.content-blk-blog h4 {
	margin-bottom: 0;
}
.content-blk-blog h5 {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
}
.blog-grp-blk span {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 500;
}
.blog-grp-blk img {
	width: 40px;
	height: 40px;
	border-radius: 50px;
}

/*-----------------
	32. Blog View
-----------------------*/

.blog-view .blog-title {
	font-size: 18px;
	font-weight: 500;
}
.blog-view .blog-info {
	border: 0 none;
	margin-bottom: 20px;
	padding: 0;
}
.social-share {
	float: left;
	list-style: none;
	margin: 5px 0 0;
	padding: 0;
}
.social-share > li {
	display: inline-block;
	float: left;
	margin-left: 10px;
	text-align: center;
}
.social-share > li:first-child {
	margin-left: 0;
}
.social-share > li > a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	color: #009efb;
	font-size: 22px;
	height: 40px;
	width: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.social-share > li > a:hover {
	background-color: #3a57e8;
	border-color: #3a57e8;
}
.social-share > li > a:hover img {
	filter: invert(1) brightness(100);
}
.share-blogs a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	color: #009efb;
	font-size: 22px;
	height: 40px;
	width: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.blog-share {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.widget h3 {
	color: #333448;
	font-size: 18px;
	margin: 0 0 20px;
}
.blog-reply > a {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 500;
}
.blog-date {
	color: #999;
	font-size: 12px;
}
.comments-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.comments-list li {
	clear: both;
	padding: 10px 0 0 50px;
}
.comments-list li .comment {
	margin-bottom: 30px;
}
.comments-list li .comment-author {
	margin-left: -50px;
	position: absolute;
}
.comments-list li img.avatar {
	height: 40px;
	width: 40px;
	border-radius: 58px;
}
.blog-author-name {
	color: #009efb;
	font-size: 18px;
}
.text-red {
	color: #f00;
}
.new-comment label {
	font-size: 14px;
	font-weight: 500;
}
.new-comment .input-block {
	margin-bottom: 20px;
}
.comment-submit .btn {
	background-color: #009efb;
	border-color: #009efb;
	border-radius: 0;
	font-size: 18px;
	padding: 8px 26px;
	color: #fff;
}
.about-author-img {
	background-color: #fff;
	height: 120px;
	overflow: hidden;
	position: absolute;
	width: 120px;
}
.author-details {
	margin-left: 145px;
}
.about-author {
	min-height: 120px;
}
.author-details .blog-author-name {
	display: inline-block;
	margin-bottom: 10px;
}
.blog-navigation {
	text-align: right;
}
.read-blks a,
.date-blks li a{
	color: rgba(51, 52, 72, 0.5);
	font-weight: 600;
}
.authr-blog-group h2 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}
.authr-blog-group p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	margin-bottom: 20px;
}
.authr-blog-group span {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.social-blk {
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.social-blk li {
	padding: 0px 10px;
}
.social-blk li a:hover img {
	filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
}
.week-list {
	color: rgba(51, 53, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}
.week-group h5 {
	margin-bottom: 0;
	font-weight: 500;
	font-size: 14px;
}
.share-blogs span {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 600;
}
.list-add-blogs {
	margin-top: 25px;
}
.list-add-blogs ul li {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	padding: 5px 10px;
	margin-right: 10px;
	color: #333448;
	font-size: 12px;
	font-weight: 500;
}
.list-add-blogs ul li:hover {
	background: rgba(51, 52, 72, 0.3);
}
.list-add-blogs ul li:last-child {
	margin-right: 00px;
}
.relat-head {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-bottom: 2px solid rgba(46, 55, 164, 0.05);
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.relat-head h5 {
	margin-bottom: 0;
}
.relat-head a {
	font-weight: 500;
	font-size: 14px;
	color: #3a57e8;
}
.date-posts {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 10px;
}
.date-posts h5 {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	font-weight: 600;
	font-size: 10px;
	padding: 5px 10px;
	margin-bottom: 0;
}
.date-posts span {
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
	font-size: 12px;
}

/*-----------------
	33. UI Kit
-----------------------*/

.pagination-box .pagination {
	margin-top: 0;
}
.tab-content {
	padding-top: 20px;
}

/*-----------------
	34. Error
-----------------------*/

.error-pages {
	background: #fff;
}
.error-box {
	border-radius: 5px;
	line-height: 1;
	margin: 0 auto;
	max-width: 620px;
	padding: 50px 30px 55px;
	text-align: center;
	width: 100%;
}
.error-wrapper {
	margin: 0;
	color: #4F5155;
	-moz-box-align: center;
	-moz-box-pack: center;
	align-items: center;
	display: flex;
	justify-content: center;
	height: 100%;
}
.error-box h3 {
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 10px;
}
.error-box p {
	margin-bottom: 40px;
	color: rgba(51, 52, 72, 0.5);
}
.error-box img {
	margin-bottom: 50px;
}
.error-box .btn {
	text-transform: capitalize;
	min-width: 179px;
	padding: 10px 15px;
	border-radius: 12px;
}

/*-----------------
	35. Lock Screen
-----------------------*/

.lock-user {
	margin-bottom: 20px;
}
.lock-user img {
	margin-bottom: 15px;
	width: 100px;
}

/*-----------------
	36. Voice call
-----------------------*/

.voice-call-avatar {
	flex-direction: column;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 2;
}
.voice-call-avatar .call-avatar {
	margin: 15px;
	width: 150px;
	height: 150px;
	border-radius: 100%;
	border: 1px solid rgba(0, 0, 0, 0.1);
	padding: 3px;
	background-color: #fff;
}
.call-duration {
	display: inline-block;
	font-size: 30px;
	margin-top: 4px;
	position: absolute;
	left: 0;
}
.voice-call-avatar .call-timing-count {
	padding: 5px;
}
.voice-call-avatar .username {
	font-size: 18px;
	text-transform: uppercase;
}
.call-icons {
	text-align: center;
	position: relative;
}
.call-icons .call-items {
	border-radius: 5px;
	padding: 0;
	margin: 0;
	list-style: none;
	display: inline-block;
}
.call-icons .call-items .call-item {
	display: inline-block;
	text-align: center;
	margin-right: 5px;
}
.call-icons .call-items .call-item:last-child {
	margin-right: 0;
}
.call-icons .call-items .call-item a {
	color: #777;
	border: 1px solid #ddd;
	width: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 50px;
	display: inline-block;
	font-size: 20px;
}
.call-icons .call-items .call-item a i {
	width: 18px;
	height: 18px;
}
.user-video {
	bottom: 0;
	left: 0;
	overflow: auto;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 10;
}
.user-video img {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	display: block;
	margin: 0 auto;
}
.user-video video {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	display: block;
	margin: 0 auto;
}
.my-video {
	position: absolute;
	z-index: 99;
	bottom: 20px;
	right: 20px;
}
.my-video ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.my-video ul li {
	float: left;
	width: 120px;
	margin-right: 10px;
}
.my-video ul li img {
	border: 3px solid #fff;
	border-radius: 6px;
}
.end-call {
	position: absolute;
	top: 7px;
	right: 0;
}
.end-call a {
	color: #fff;
	border-radius: 50px;
	display: inline-block;
	background-color: #f06060;
	padding: 8px 25px;
	text-transform: uppercase;
}
.call-users {
	position: absolute;
	z-index: 99;
	bottom: 20px;
	right: 20px;
}
.call-users ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.call-users ul li {
	float: left;
	width: 80px;
	margin-left: 10px;
}
.call-users ul li img {
	border-radius: 6px;
	padding: 2px;
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
}
.call-mute {
	width: 80px;
	height: 80px;
	background-color: rgba(0, 0, 0, 0.5);
	position: absolute;
	display: inline-block;
	text-align: center;
	line-height: 80px;
	border-radius: 6px;
	font-size: 30px;
	color: #fff;
	display: none;
	top: 0;
	border: 3px solid transparent;
}
.download-grp {
    display: flex;
    flex-wrap: wrap;
}
.call-users ul li a:hover .call-mute {
	display: block;
}
.call-details {
	margin: 10px 0 0px;
	display: flex;
}
.call-info {
	margin-left: 10px;
	width: 100%;
}
.call-user-details,
.call-timing {
	display: block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.call-description {
	white-space: nowrap;
	vertical-align: bottom;
}
.call-timing {
	color: #a0a0a2;
	display: flex;
	font-size: 14px;
	margin-top: 1px;
	overflow: hidden;
	white-space: pre;
}

/*-----------------
	37. Video Call
-----------------------*/

.content-full {
	height: 100%;
	position: relative;
	width: 100%;
}
.video-window .fixed-header {
	padding: 0;
	border: 0;
}
.video-window .fixed-header .nav > li > a {
	padding: 19px 15px;
}

/*-----------------
	38. Incoming Call
-----------------------*/

.incoming-btns {
	margin-top: 20px;
}
.modal.custom-modal {
	background-color: rgba(0, 0, 0, 0.66);
}
.custom-modal .modal-content {
	border: 0;
	background-color: #fff;
}
.custom-modal .profile-widget {
	margin-bottom: 0;
}
.modal.custom-modal.modal-bg{
	background-color: rgba(0, 0, 0, 0.66);
}
.custom-modal.modal-bg .modal-content{
	background-color: #fff;
	text-align: center;
	border-radius: 10px;
}
.custom-modal .modal-body{
	padding: 30px;
}
.form-header {
    text-align: center;
    margin-bottom: 30px;
}
/*-----------------
	39. Notification settings
-----------------------*/

.notification-list .list-group-item {
	padding: 15px;
}
.notification-list .status-toggle {
	float: right;
}
.invoice-load-btn {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
}
.invoice-load-btn .btn {
    font-weight: 700;
    font-size: 14px;
    color: #009efb;
    min-width: 170px;
    padding: 10px 15px;
    background: #FFFFFF;
    border: 2px solid #009efb;
    border-radius: 6px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.invoice-load-btn .btn:hover span {
    border: 3px solid #ffffff7a;
    border-right-color: #fff;
}
.invoice-load-btn .btn:hover{
	background: #009efb;
	color: #fff;
}
.invoice-load-btn .btn span {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 8px;
    vertical-align: 0;
    border: 3px solid #9a55ff21;
    border-right-color: #009efb;
    border-radius: 50%;
    -webkit-animation: .75s linear infinite spinner-border;
    animation: .75s linear infinite spinner-border;
}
.invoices-grid-card .card-footer .badge {
    border-radius: 6px;
    font-size: 13px;
    font-weight: 400;
    padding: 7px 18px;
}
.invoices-grid-card .bg-success-dark {
    background: #008F64;
}
.invoices-grid-card .bg-success-dark {
	background: #008F64;
}
.invoices-grid-card .bg-danger-dark {
	background: #FF0000;
}
.invoices-grid-card .bg-secondary-dark {
	background: #009efb;
}
.invoices-grid-card .bg-primary-dark {
	background: #2196f3;
}
.invoices-grid-card .text-sm {
	font-size: 14px;
}
.invoices-page-header {
    background: #FFFFFF;
    border-radius: 10px;
    padding: 12px;
}
.page-header .breadcrumb {
    background-color: transparent;
    color: #6c757d;
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 0;
    padding: 0;
}
.invoices-page-header .invoices-breadcrumb-item i {
    color: #fff;
    border-radius: 50%;
    width: 20px;
    height: 20px;
	font-size: 10px;
    margin-right: 10px;
    background: #3a57e8;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
}
.invoices-create-btn .invoices-preview-link {
    font-weight: 500;
    color: #3a57e8;
    margin-right: 30px;
	font-size: 15px;
}
.invoices-create-btn .delete-invoice-btn {
    background: #6c757d;
    margin-right: 10px;
}
.invoices-create-btn .btn {
    font-weight: 500;
    font-size: 15px;
    color: #fff;
    border-radius: 8px;
    padding: 10px 0px;
    min-width: 160px;
	position: relative;
}
.check:checked + .checktoggle {
    background-color: #009efb;
    border: 1px solid #009efb;
}
.payment-details {
    width: 266px;
    border-radius: 4px;
    padding: 15px;
    background: #3a57e8;
    display: flex;
    justify-content: space-between;
    align-items: center;
}	
.payment-details p {
    color: #fff;
    max-width: 140px;
    font-weight: 400;
    margin-bottom: 0;
}
.invoices-create-btn .save-invoice-btn {
    background: #3a57e8;
}
.invoices-add-card {
    background: #FFFFFF;
    border-radius: 10px;
}
.invoices-main-form {
    padding-bottom: 15px;
    margin-bottom: 30px;
    border-bottom: 1px solid #E5E5E5;
}
.invoices-main-form label {
	font-size: 14px;
}
.multipleSelection {
    position: relative;
    margin-bottom: 20px;
}
.invoices-form .multipleSelection .selectBox {
    border: 2px solid #3a57e8;
    border-radius: 6px;
}
.multipleSelection #checkBoxes-one {
    display: none;
    position: absolute;
    width: 100%;
    left: 0;
    z-index: 1;
    margin-top: 10px;
    padding: 20px;
    background: #FFFFFF;
    border: 1px solid #F2ECFF;
    box-shadow: 0px 4px 44px rgb(231 234 252 / 75%);
    border-radius: 6px;
}
.invoice-details-title {
    font-weight: 500;
    font-size: 18px;
    color: #1B2559;
    margin-bottom: 0.5rem;
}
.invoice-details-box {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 10px;
}
.invoice-inner-head {
    padding: 26px;
    border-bottom: 1px solid #E5E5E5;
}
.invoice-inner-head span {
    color: #1B2559;
	font-size: 14px;
}
.invoice-inner-head span a {
    font-weight: 500;
    color: #3a57e8;
}
.invoice-inner-footer {
    padding: 0;
}
.invoice-inner-date {
    padding: 26px;
    border-right: 1px solid #E5E5E5;
}
.payment-details {
    width: 266px;
    border-radius: 4px;
    padding: 15px;
    background: #3a57e8;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.payment-details p {
    color: #fff;
    max-width: 140px;
    font-weight: 400;
    margin-bottom: 0;
}
.payment-details a {
    font-size: 26px;
    color: #fff;
}
.invoice-inner-footer .form-control {
    position: absolute;
    color: #009efb;
    background: transparent;
    border: 0;
    display: inline-block;
    width: auto;
    height: auto;
    padding: 0 10px;
}
.invoice-inner-footer span {
    font-weight: 500;
    color: #1B2559;
    position: relative;
}
.invoice-inner-datepic {
    border: 0;
    padding-left: 0;
}
.invoices-form .form-control {
    height: 50px;
    border: 1px solid #E5E5E5;
    border-radius: 6px;
}
.invoice-info {
    margin-bottom: 20px;
}
.invoice-item .customer-text {
    font-size: 18px;
    color: #000;
    font-weight: 600;
    margin-bottom: 16px;
    display: block;
}
.invoice-item .customer-text a {
    font-size: 14px;
    color: #009efb;
    margin-left: 12px;
}
.invoice-item .invoice-details-two {
    text-align: left;
    color: #000;
	float: left;
}
.invoice-add-table h4 {
    font-weight: 600;
    font-size: 18px;
    color: #3a57e8;
    margin-bottom: 30px;
}
.invoice-add-table .add-btns {
    color: #3a57e8;
}
.invoice-add-table .copy-btn {
    color: #C4C4C4;
}
.invoice-add-table .remove-btn {
    color: #FF0000;
}
.invoice-fields .field-title {
    font-weight: 600;
    font-size: 16px;
    color: #1B2559;
    margin-bottom: 15px;
}
.field-box {
    padding: 15px;
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
}
.field-box p {
    font-weight: 500;
    font-size: 14px;
    color: #1B2559;
    margin-bottom: 10px;
}
.field-box .btn {
    min-width: 266px;
    border-radius: 4px;
    padding: 30px 0;
}
.invoice-faq .faq-tab {
    padding-top: 10px;
}
.faq-tab .panel-title {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
    padding: 10px 20px;
    margin-bottom: 0px;
    position: relative;
	font-size: 14px;
}
.faq-tab .panel-title a {
    color: #C4C4C4;
}
.faq-tab .panel-title a.collapsed::after {
    content: '\f067';
    font-family: 'Font Awesome 5 Free';
    position: absolute;
    right: 20px;
    top: 10px;
    color: #f09e9e;
    font-weight: 600;
    font-size: 14px;
}
.faq-tab .panel-title a:not(.collapsed)::after {
    color: #FF0000;
}
.invoice-total-card .invoice-total-title {
    font-weight: 600;
    font-size: 16px;
    color: #1B2559;
    margin-bottom: 15px;
}
.invoice-total-box {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
}
.invoice-total-inner {
    padding: 15px;
}
.invoice-total-box p {
    color: #1B2559;
    margin-bottom: 20px;
    position: relative;
	text-align: initial;
	font-size: 14px;
}
.invoice-total-box p span {
    float: right;
}
.invoice-total-box .add-links {
    font-weight: 500;
    color: #009efb;
    margin-bottom: 20px;
    display: block;
}
.invoice-total-box .service-trash-one {
    margin-top: 10px;
    color: #1B2559;
}
.invoice-total-footer {
    border-top: 1px solid #E5E5E5;
    padding: 15px;
}
.invoice-total-footer h4 {
    font-size: 16px;
    margin-bottom: 0;
    color: #3a57e8;
	text-align: initial;
}
.invoice-total-footer h4 span {
    float: right;
}
.upload-sign {
    float: right;
    margin-top: 20px;
}
.service-upload {
    border: 2px dashed #E5E5E5;
    text-align: center;
    padding: 30px 0;
    background-color: #fff;
    position: relative;
    width: 330px;
}
.service-upload span {
    font-size: 15px;
    color: #858585;
    display: block;
}
.service-upload input[type="file"] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
.upload-sign .btn {
    border-radius: 8px;
    min-width: 198px;
    padding: 10px 0;
}
.invoice-total-box .service-amount {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
}
.invoice-total-box .service-trash,.invoice-total-box .service-trash1 {
    margin-bottom: 10px;
    color: #1B2559;
}
#show-invoices {
    display: none;
}
.invoice-total-box .service-trash i {
    color: #EC1361;
}
.check:checked + .checktoggles {
    background-color: #009efb;
    border: 1px solid #009efb;
}
.check:checked + .checktoggles:after {
    background-color: #fff;
    left: 100%;
    transform: translate(calc(-100% - 5px), -50%);
}
.checktoggles:after {
    content: ' ';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(5px, -50%);
    width: 8px;
    height: 8px;
    background-color: #fff;
    border-radius: 50%;
    transition: left 300ms ease, transform 300ms ease;
}
.checktoggles {
    background-color: #C4C4C4;
    border: 1px solid #C4C4C4;
    border-radius: 12px;
    cursor: pointer;
    font-size: 0;
    height: 15px;
    margin-left: 10px;
    top: 3px;
    margin-bottom: 0;
    position: absolute;
    width: 30px;
    display: inline-block;
}
.invoice-total-box .add-links1 ,.add-links-one {
    font-weight: 500;
    color: #3a57e8;
    margin-bottom: 20px;
    display: block;
	font-size: 14px;
}
.invoice-add-table th {
    background: #F8F9FA;
	padding: 15px;
	font-size: 14px;
}
.table>:not(:first-child) {
    border-top: 0;
}
td.add-remove {
    padding: 20px;
}
.add-remove i {
    font-size: 18px;
    cursor: pointer;
}
.bank-details .modal-content {
    border: 1px solid #F2ECFF;
    border-radius: 6px;
}
.bank-details .modal-header {
    border: 0;
    justify-content: space-between;
    padding: 30px;
    align-items: center;
    display: flex;
    border-bottom: 1px solid #E5E5E5;
}
.bank-details .close {
    background: transparent;
    border: 0;
    color: #1B2559;
    font-size: 28px;
    line-height: normal;
    top: 20px;
    width: auto;
    height: auto;
    right: 20px;
}
.bank-details .modal-body {
    padding-bottom: 10px;
    border-bottom: 1px solid #E5E5E5;
}
.bank-details .bank-inner-details .form-control {
    height: 50px;
}
.bank-details .modal-footer {
    justify-content: end;
    padding: 30px;
}
.bank-details .modal-footer>* {
    margin: 0;
}
.bank-details-btn .bank-cancel-btn {
    background: #1B2559;
}
.bank-details-btn .bank-save-btn {
    background: #3a57e8;
}
.bank-details-btn .btn {
    min-width: 160px;
    border-radius: 8px;
    padding: 10px 0;
    color: #fff;
}
.invoice-inner-footer .form-control {
    position: relative;
    color: #009efb;
    background: transparent;
    border: 0;
    display: inline-block;
    width: 120px;
    height: auto;
    padding: 0 10px;
}
.invoice-inner-footer span {
    font-weight: 500;
    color: #1B2559;
    position: relative;
	display: flex;
	align-items: center;
	font-size: 13px;
}
.invoice-inner-date {
	padding: 8px 15px;
    border-right: 1px solid #E5E5E5;
}
.invoice-info-card {
    border-radius: 14px;
}
.invoice-item-one {
    border-bottom: 1px solid rgba(231, 234, 252, 0.75);
}
.faq-tab .panel-title a:hover {
    color: #1B2559;
}
.faq-tab .panel-title a:not(.collapsed)::after {
    color: #FF0000;
}
.faq-tab .panel-title a::after {
    content: '\f068';
    font-family: 'Font Awesome 5 Free';
    position: absolute;
    right: 20px;
    top: 10px;
    color: #f09e9e;
    font-weight: 600;
    font-size: 14px;
}
.faq-tab .panel-body textarea {
    min-height: 100px;
    border: 0;
    border-radius: 0 0 4px 4px;
}
.faq-tab .panel-body {
    padding: 10px 20px;
    border: 1px solid #E5E5E5;
}
.inovices-month-info {
    padding-top: 50px;
}
.invoice-add-table {
    padding-top: 20px;
    padding-bottom: 30px;
}
.invoice-item .invoice-logo {
    margin-bottom: 30px;
}
.invoice-item .invoice-logo img {
    width: auto;
    max-height: 52px;
}
.invoice-item .invoice-text h2 {
	color:#272b41;
	font-size:36px;
	font-weight:600;
}
.invoice-item .invoice-details {
	text-align: right;
	font-weight: 400
}
.invoice-item .invoice-details strong {
	color:#272b41;
}
.invoice-item .invoice-details-two {
	text-align: left;
	color: #000;
	font-size: 13px;
}
.invoice-item .invoice-text {
	padding-top:42px;
	padding-bottom:36px
}
.invoice-item .invoice-text h2 {
	font-weight:400
}
.invoice-info {
	margin-bottom: 20px;
}
.invoice-info p {
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
}
.invoice-info.invoice-info2 {
    text-align: right;
}
.invoice-item .customer-text {
	font-size: 20px;
	color: #000;
	font-weight: 600;
	margin-bottom: 16px;
	display: block
}
.invoice-item .customer-text a {
	font-size: 14px;
	color: #3a57e8;
	margin-left: 12px;
}
.invoice-table tr th,
.invoice-table tr td,
.invoice-table-two tr th,
.invoice-table-two tr td {
	color: #272b41;
	font-weight: 600;
	padding: 15px 20px;
	line-height: inherit
}
.invoice-table tr td,
.invoice-table-two tr td {
	font-weight: 500;
}
.invoice-table-two {
	margin-bottom:0
}
.invoice-table-two tr th,
.invoice-table-two tr td {
	border-top: 0;
}
.invoice-table-two tr td {
	text-align: right
}
.invoice-info h5 {
    font-size: 16px;
    font-weight: 500;
}
.other-info {
    margin-top: 10px;
}
.file {
	visibility: hidden;
	position: absolute;
}
.btn-group,
.btn-group-vertical {
	position: relative;
	display: -inline-flexbox;
	display: inline-flex;
	vertical-align: middle; 
}
.font-size-14 {
	font-size: 14px;
}
.invoice-info-card {
	border-radius: 14px;
}
.invoice-item-one {
	border-bottom: 1px solid rgba(231, 234, 252, 0.75);
}
.invoice-item-one .invoice-info {
	margin-bottom: 30px;
	text-align: right;
}
.customer-text-one {
	font-size: 16px;
	color: #1B2559;
	font-weight: 600;
    display: block;
	margin-bottom: 10px;
}
.invoice-name {
	color: #1B2559;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 10px;
}
.invoice-item-one .invoice-details {
	color: #1B2559;
	font-weight: 400;
}
.invoice-head h2 {
	font-weight: 600;
	font-size: 22px;
	color: #1B2559;
	text-transform: uppercase;
	margin-bottom: 0;
}
.invoice-head {
	margin-bottom: 30px;
}
.invoice-head p {
	font-weight: 400;
	font-size: 16px;
	color: #1B2559;	
	margin-bottom: 0;
}
.invoice-item-two {
	padding-top: 30px;
	padding-bottom: 30px;
}
.invoice-item-two .invoice-details {
	color: #1B2559;
	font-weight: 400;
	width: 100%;
}
.invoice-item-box {
	background: #55ddff30;
    border-radius: 5px;
    padding: 15px;
    width: 200px;
    float: right;
    margin-top: 20px;
}
.invoice-item-box p {
	color: #1B2559;
	font-weight: 400;
	margin-bottom: 10px;
}
.invoice-issues-box {
	background: #3a57e8;
	border-radius: 10px;
	text-align: center;
	padding: 10px;
	margin-bottom: 30px;
}
.invoice-issues-date {
	padding-top: 20px;
	padding-bottom: 20px;
}
.invoice-issues-date p {
	font-weight: 600;
	font-size: 14px;
	color: #FFFFFF;
	margin-bottom: 0;
}
.invoice-table-wrap {
	margin-bottom: 30px;
}
.invoice-table > thead > tr > th {
	background: #F5F7FF;
    border-top: 0;
    font-weight: 500;
	font-size: 14px;
	color: #1B2559;
}
.invoice-table > tbody > tr > td {
    font-weight: 400;
	color: #1B2559;
	padding: 15px 20px;
	font-size: 14px;
}
.invoice-terms {
	margin-bottom: 30px;
}
.invoice-total-inner input[type="checkbox"]{
	display: none;
}
.invoice-terms h6 {
	font-weight: 500;
	font-size: 15px;
	color: #1B2559;
	margin-bottom: 6px;
}
.invoice-terms p {
	font-weight: 400;
	font-size: 14px;
	color: #8F9BBA;
}
.invoice-sign {
	padding-top: 30px;
}
.invoice-sign span {
	color: #1B2559;
	margin-top: 18px;
}
.invoice-item-bg {
	background: #3a57e8;
	border-radius: 10px;
	margin-top: 30px;
	margin-bottom: 30px;
}
.invoice-circle-img {
	position: relative;
}
.invoice-circle-img .invoice-circle1 {
	position: absolute;
	left: 0;
	opacity: 0.1;
}
.invoice-circle-img .invoice-circle2 {
	position: absolute;
	right: 0;
	opacity: 0.1;
}
.invoice-item-bg .invoice-info {
    border-right: 1px solid #fff;
    padding: 30px;
    margin-top: 20px;
	text-align: initial;
	display: flow-root;
}
.invoice-payment-box{
	text-align: left;
}
.invoice-item-bg .customer-text-one {
	color: #fff;
}
.invoice-item-bg .invoice-name {
	color: #fff;
}
.invoice-item-bg .invoice-details-two {
	color: #fff;
}
.invoice-item-bg .invoice-info-one p {
	color: #fff;
	margin-bottom: 10px;
}
.invoice-sign-box {
	margin-top: 30px;
	text-align: initial;
}
.invoice-payment-box h4 {
	font-weight: 600;
	font-size: 16px;
	color: #1B2559;
	margin-bottom: 16px;
}
.invoice-payment-box .payment-details {
	background: transparent;
	border: 2px dashed #009efb;
}
.invoice-payment-box .payment-details p {
	font-weight: 600;
	font-size: 15px;
	color: #1B2559;
}
.invoices-preview .modal-body {
	padding: 0;
}
.settings-menu {
    margin-bottom: 30px;
}
.settings-menu ul {
    display: block;
    padding: 0;
	list-style: none;
	margin-bottom: 0;
}
.settings-menu ul li a.active {
    color: #3a57e8 !important;
    border: 0;
}
.settings-menu ul li{
	margin-bottom: 15px;
}
.settings-menu ul li:last-child{
	margin-bottom: 0;
}
.settings-menu ul li a {
    color: #1B2559;
    padding: 0;
    border: 0 !important;
    display: inline-block;
}
.invoices-upload-btn {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    color: #000000;
    cursor: pointer;
    font-weight: 400;
    padding: 15px 15px;
    position: relative;
    width: 100%;
    height: 50px;
}
.invoices-upload-btn .upload {
    position: absolute;
    background: #3a57e8;
    border-radius: 4px;
    right: 6px;
    top: 8px;
    width: 136px;
    height: 32px;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}
.invoices-upload-btn .hide-input {
    position: relative;
    z-index: 1;
    cursor: pointer;
    min-height: auto;
    padding-left: 4px;
    padding-top: 0;
    line-height: 10px;
    width: 100%;
    opacity: 0;
}
 .invoice-setting-btn .cancel-btn {
    background: #6c757d;
}

.invoice-setting-btn .btn {
    min-width: 160px;
    padding: 10px 0;
    color: #fff;
    border-radius: 8px;
	border: 0;
}
.invoice-setting-btn {
    display: flex;
    align-items: center;
    justify-content: end;
}
.paid-continue-btn {
    background-color: #3a57e8;
    border: 1px solid #3a57e8;
    border-radius: 5px;
    color: #fff;
    display: block;
    font-size: 18px;
    font-weight: 400;
    padding: 10px 20px;
    text-align: center;
}
.paid-cancel-btn {
    background-color: #fff;
    border: 1px solid #3a57e8;
    border-radius: 5px;
    color: #3a57e8;
    display: block;
    font-size: 18px;
    font-weight: 400;
    padding: 10px 20px;
    text-align: center;
}
.invoices-page-header .invoices-breadcrumb-item a {
    font-weight: 500;
    color: #3a57e8;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
}
.page-header {
    margin-bottom: 1.875rem;
}
.invoices-table.custom-table tbody tr {
    box-shadow: none;
}
.invoices-table.custom-table tbody tr td {
   vertical-align: middle;
}
.invoices-table.custom-table thead tr th {
	color: #333448;
}
.add-table-invoice {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.add-table-invoice i {
	color: #3a57e8;
}
.grand-totals tr td:first-child {
	width: 75%;
}
.custom-table .bold-total td {
	font-weight: 600;
}
.custom-table .bold-total .form-control {
	font-weight: 600;
}
.invoice-clinic li {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
}
.invoice-details h3 {
	font-size: 14px;
	font-weight: 700;
}
.invoice-details h4 {
	font-size: 14px;
	font-weight: 600;
}
.invoice-details h4 span {
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.bold-total-invoice h5 {
	font-size: 22px;
	color: #333448;
	font-weight: 600;
}
.total-fonts tr td {
	color: rgba(51, 53, 72, 0.5);
	font-weight: 500;
}
.invoice-head-clinic {
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.invoice-counts h4 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}
.invoice-counts h4 span {
	font-size: 15px;
	font-weight: 500;
	color: rgb(51 53 72 / 50%);
}
.invoice-counts a {
	padding: 3px 23px;
    font-size: 15px;
	border-radius: 8px;
	margin-left: 15px;
}

/*-----------------
	40. Chat Sidebar
-----------------------*/

.chat-sidebar {
	background-color: #fff;
	border-left: 1px solid #eaeaea;
	width: 300px;
}
.chat-sidebar .chat-contents {
	background-color: #fff;
}
.chat-sidebar .chat-left .chat-content {
	border: 0;
	padding: 0;
	border-radius: 0 !important;
	background-color: transparent;
	max-width: 100%;
}
.chat-sidebar .chat-left .chat-body {
	margin-left: 50px;
	padding-right: 0;
}
.chat-sidebar .chat-date {
	background-color: #fff;
}
.chat-sidebar .chats {
	padding: 15px 15px 30px;
}
.chat-sidebar .avatar {
	width: 30px;
	height: 30px;
	line-height: 30px;
}
.chat-sidebar .chat.chat-left {
	margin-bottom: 20px;
}
.chat-sidebar .chat.chat-left:last-child {
	margin-bottom: 0;
}
.chat-sidebar .chat-left .chat-time {
	color: #888;
	display: inline-block;
	font-size: 11px;
}
.chat-sidebar .chat-content > p {
	font-size: 13px;
	margin-bottom: 0;
}
.chat-sidebar.opened {
	margin-right: 0;
}

/*-----------------
	41. Gallery
-----------------------*/

.lg-backdrop {
	z-index: 1041;
}
#lightgallery .img-thumbnail {
	box-shadow: 0 6px 15px rgba(36, 37, 38, 0.08);
}
/*-----------------
   42. Settings
-----------------------*/

.settings-menu-links .nav-tabs.menu-tabs {
    border: none;
    margin-bottom: 20px;
	margin-top: 20px;
}
.nav-tabs.menu-tabs .nav-item {
    padding-right: 10px;
    margin-bottom: 10px;
    display: inline-block;
}
.nav-tabs.menu-tabs .nav-item.active .nav-link {
    color: #fff;
    background: #3a57e8;
}
.nav-tabs.menu-tabs .nav-link {
    position: relative;
    border: none;
    outline: none;
    display: inline-flex;
    align-items: center;
    background: transparent;
    font-weight: 400;
    font-size: 14px;
    padding: 10px 20px;
    border-radius: 5px;
    color: #fff;
   background: rgb(46 55 164 / 53%);
}
.card .card-header .card-title {
    margin-bottom: 0;
	font-size:16px;
	font-weight: 600;
}
.settings-form {
    margin-top: 20px;
}
.settings-label {
    margin-bottom: 10px;
	font-size: 13px;
}
.settings-btn {
    border: 1px solid #D7D7D7;
    border-radius: 5px;
    color: #000000;
    cursor: pointer;
    font-weight: 400;
    padding: 15px 15px;
    position: relative;
    width: 100%;
    height: 46px;
}
.settings-btn .hide-input {
    position: relative;
    z-index: 1;
    cursor: pointer;
    min-height: auto;
    padding-left: 4px;
    padding-top: 0;
    line-height: 10px;
    width: 100%;
    opacity: 0;
}
.settings-btn .upload {
    position: absolute;
    z-index: 11;
    background: #3a57e8;
    border-radius: 5px;
    right: 2px;
    top: 1.5px;
    width: 41px;
    height: 41px;
    font-size: 20px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}
.settings-size {
    font-size: 13px;
    color: #131523;
    font-style: italic;
    margin-top: 10px;
    margin-bottom: 0;
}
.settings-size span {
    font-weight: 700;
}
.upload-images {
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid #E4E4E4;
    border-radius: 5px;
    display: flex;
    margin-top: 30px;
    width: 196px;
    height: 78px;
    justify-content: space-around;
    align-items: center;
    position: relative;
	margin-bottom: 24px;
}
.upload-images img {
    max-height: 45px;
    width: auto;
}
.upload-images .btn-icon {
    color: #00d3c7;
    font-size: 16px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    position: absolute;
    padding: 0;
    width: 20px;
    height: 20px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    right: 0px;
    top: 0px;
    justify-content: center;
    -webkit-justify-content: center;
}
.invoice-load-btn {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
}
.invoice-load-btn .btn {
    font-weight: 700;
    font-size: 14px;
    color: #00d3c7;
    min-width: 170px;
    padding: 10px 15px;
    background: #FFFFFF;
    border: 2px solid #00d3c7;
    border-radius: 6px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.invoice-load-btn .btn span {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 8px;
    vertical-align: 0;
	border: 3px solid rgb(0 211 199 / 57%);
    border-right-color: #00d3c7;
    border-radius: 50%;
    -webkit-animation: .75s linear infinite spinner-border;
    animation: .75s linear infinite spinner-border;
}
.upload-size {
    width: 82px;
    height: 82px;
}
.check {
    display: block;
    margin: 0;
    padding: 0;
    width: 0;
    height: 0;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    position: absolute;
}
.checktoggle {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.25);
    border-radius: 12px;
    cursor: pointer;
    display: block;
    font-size: 0 !important;
    height: 24px;
    margin-bottom: 0;
    position: relative;
    width: 48px;
}
.checktoggle:after {
    content: ' ';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(5px, -50%);
    width: 16px;
    height: 16px;
    background-color: rgba(0, 0, 0, 0.25);
    border-radius: 50%;
    transition: left 300ms ease, transform 300ms ease;
}
.check:checked + .checktoggle {
    background-color: #3a57e8;
    border: 1px solid #3a57e8;
}
.star-red {
    color: #ff0000;
}
form .btn-gradient-primary {
    font-size: 14px;
    padding: 8px 40px;
    color: #fff;
}
form .btn-secondary {
    font-size: 14px;
    padding: 7px 30px;
    color: #fff;
}
.check:checked + .checktoggle:after {
    background-color: #fff;
    left: 100%;
    transform: translate(calc(-100% - 5px), -50%);
}
.card-header{
	padding: 15px;
}
.settings-form .custom_radio {
    color: #000;
    display: inline-block;
    position: relative;
    font-size: 14px;
    font-size: 0.9375rem;
    padding-left: 30px;
    margin-bottom: 0px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.custom_radio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.settings-form .custom_radio .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border: 1px solid #3a57e8;
    border-radius: 50%;
}
.custom_radio input:checked ~ .checkmark::after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    visibility: visible;
}

.settings-form .custom_radio .checkmark:after {
    display: block;
    content: "";
    position: absolute;
    opacity: 0;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #3a57e8;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.settings-form .social-icon {
    width: 50px;
    height: 42px;
    margin-right: 6px;
    color: #fff;
    background: #3a57e8;
    border: 1px solid #3a57e8;
    border-radius: 5px;
    font-size: 20px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: relative;
    padding: 4px;
}
.settings-form .links-cont .social-icon::after {
    content: "";
    border-top: 0.2em solid;
    border-right: 0.2em solid transparent;
    border-bottom: 0;
    border-left: 0.2em solid transparent;
    margin-left: 4px;
}
.settings-form .trash {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 42px;
    width: 46px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    background-color: #3a57e8;
    color: #fff;
    position: relative;
    font-size: 16px;
	margin-left: 6px;
}
.add-links {
    background-color: #3a57e8;
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 26px;
    border-radius: 4px;
}
.bootstrap-tagsinput input {
    border: none;
    box-shadow: none;
    outline: none;
    background-color: transparent;
    padding: 0 6px;
    margin: 0;
    width: auto;
    max-width: inherit;
}
.bootstrap-tagsinput input::placeholder {
	font-size: 14px;
}
.settings-form .bootstrap-tagsinput .tag {
    margin-right: 5px;
    margin-bottom: 0px;
    color: #000000;
    background: #E4E4E4 !important;
    border-radius: 0px;
    font-size: 14px;
    font-weight: 500;
    padding: 7px 15px;
}
.settings-form .bootstrap-tagsinput {
    display: block;
    color: #333;
    background: #FFFFFF;
    border: 1px solid #D7D7D7;
    box-shadow: unset;
    min-height: 46px;
    padding-top: 4px;
    padding-left: 5px;
    padding-right: 10px;
    padding-bottom: 4px;
}

 .form-row.links-cont {
    margin-bottom: 0px;
}
textarea.form-control {
    resize: vertical;
}

textarea.form-control {
    height: auto;
}
.settings-form .input-block label {
    margin-bottom: 10px;
	font-size: 13px;
}
.card.invoices-grid-card .card-footer {
    background-color: #fff;
}
.card-block tr th,
.card-block tr td {
	font-size: 14px;
}
.modal-body label {
	font-size: 13px;
}

.avatar {
	width: 34px;
	height: 34px;
}
.avatar-xs {
    width: 1.65rem;
    height: 1.65rem;
}
.avatar-sm {
	width: 2.5rem;
	height: 2.5rem;
}
.avatar-xs {
	width: 1.65rem;
	height: 1.65rem;
}
.avatar-xxl {
    width: 8rem;
    height: 8rem;
}
.avatar-xl {
	width: 5rem;
	height: 5rem;
}
.avatar-lg {
    width: 3.75rem;
    height: 3.75rem;
}
.avatar.shape {
	border-radius: 6px;
}
.avatar.shape img {
	border-radius: 6px;
}
.avatar.avatar-online::before {
    width: 25%;
    height: 25%;
    border-radius: 50%;
    content: "";
    border: 2px solid #ffffff;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #55ce63;
}
.avatar.avatar-offline::before {
    width: 25%;
    height: 25%;
    border-radius: 50%;
    content: "";
    border: 2px solid #ffffff;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #f62d51;
}
.avatar.avatar-away::before {
    width: 25%;
    height: 25%;
    border-radius: 50%;
    content: "";
    border: 2px solid #ffffff;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #ffbc34;
}
.avatar-group .avatar {
	margin-right: 0;
	margin-left: -10px;
}
.avatar-group .avatar:first-child {
	margin-right: 0;
	margin-left: 0;
}
.note-editor.note-frame .note-statusbar {
    border-top: 0;
}
.bootstrap-datetimepicker-widget {
    font-size: 13px;
}
.bootstrap-datetimepicker-widget table td.today:before {
    border-bottom-color: #7638ff;
}
.bg-primary-light {
    background-color: rgba(17, 148, 247, 0.12) !important;
    color: #2196f3 !important;
}
.bg-danger-light {
    background-color: rgb(255 218 218 / 49%) !important;
    color: #FF0000 !important;
}
.bg-purple-light {
    background-color: rgba(197, 128, 255, 0.12) !important;
    color: #c580ff !important;
}
.bg-default-light {
    background-color: rgba(40, 52, 71, 0.12) !important;
    color: #283447 !important;
}
.card-two {
    border: 1px solid #DBDFEA;
    border-radius: 5px;
}
.badge-soft-primary {
    color: #405189;
    background-color: rgba(64,81,137,.1);
}
.badge-soft-secondary {
    color: #3577f1;
    background-color: rgba(53,119,241,.1);
}
.badge-soft-success {
    color: #0ab39c;
    background-color: rgba(10,179,156,.1);
}
.badge-soft-info {
    color: #299cdb;
    background-color: rgba(41,156,219,.1);
}
.badge-soft-warning {
    color: #f7b84b;
    background-color: rgba(247,184,75,.1);
}
.badge-soft-danger {
    color: #f06548;
    background-color: rgba(240,101,72,.1);
}
.badge-soft-dark {
    color: #212529;
    background-color: rgba(33,37,41,.1);
}
.badge-soft-light {
    color: #f3f6f9;
    background-color: rgba(243,246,249,.1);
}
.badge-outline-primary {
    color: #405189;
    border: 1px solid #405189;
    background-color: transparent;
}
.badge-outline-secondary {
    color: #3577f1;
    border: 1px solid #3577f1;
    background-color: transparent;
}
.badge-outline-success {
    color: #0ab39c;
    border: 1px solid #0ab39c;
    background-color: transparent;
}
.badge-outline-info {
    color: #299cdb;
    border: 1px solid #299cdb;
    background-color: transparent;
}
.badge-outline-warning {
    color: #f7b84b;
    border: 1px solid #f7b84b;
    background-color: transparent;
}
.badge-outline-danger {
    color: #f06548;
    border: 1px solid #f06548;
    background-color: transparent;
}
.badge-outline-dark {
    color: #212529;
    border: 1px solid #212529;
    background-color: transparent;
}
.badge-outline-light {
    color: #f3f6f9;
    border: 1px solid #f3f6f9;
    background-color: transparent;
}
.badge-gray-outline {
    background-color: #fff;
    border: 1px solid blue;
    color: gray;
}
.badge-gradient-primary {
    background: linear-gradient(135deg,#405189 0,#0ab39c 100%);
}
.badge-gradient-secondary {
    background: linear-gradient(135deg,#3577f1 0,#299cdb 100%);
}
.badge-gradient-success {
    background: linear-gradient(135deg,#0ab39c 0,#f7b84b 100%);
}
.badge-gradient-danger {
    background: linear-gradient(135deg,#f06548 0,#3577f1 100%);
}
.badge-gradient-warning {
    background: linear-gradient(135deg,#f7b84b 0,#eb990a 100%);
}
.badge-gradient-info {
    background: linear-gradient(135deg,#299cdb 0,#0ab39c 100%);
}
.badge-gradient-dark {
    background: linear-gradient(135deg,#212529 0,#405189 100%);
}
.breadcrumb.breadcrumb-colored {
	padding: 15px;
	border-radius: 5px;
}
.breadcrumb.breadcrumb-colored.bg-primary {
	background: #3a57e8 !important;
}
.breadcrumb.breadcrumb-colored.bg-primary li {
	color: #fff;
}
.breadcrumb.breadcrumb-colored.bg-primary li a{
	color: #fff;
}
.breadcrumb.breadcrumb-colored.bg-secondary {
	background: #00D3C7 !important;
}
.irs--flat .irs-bar,.irs--flat .irs-from, .irs--flat .irs-to, .irs--flat .irs-single {
	background: #3a57e8;
}
.irs--flat .irs-handle>i:first-child {
	background: #3a57e8;
}
.irs--sharp .irs-handle,.irs--sharp .irs-from, .irs--sharp .irs-to, .irs--sharp .irs-single,.irs--sharp .irs-min, .irs--sharp .irs-max {
	background: #00D3C7;
}
.irs--sharp .irs-handle>i:first-child {
	border-top-color: #00D3C7;
}
.ribbon-primary {
	background: #3a57e8;
  }
  .ribbon-primary.ribbon-corner:before {
	border-top-color: #3a57e8;
	border-left-color: #3a57e8;
  }
  .ribbon-primary.ribbon-corner.ribbon-right:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
  }
  .ribbon-primary.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3a57e8;
  }
  .ribbon-primary.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #43f;
	border-right-color: #43f;
  }
  .ribbon-primary.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #43f;
	border-left-color: #43f;
  }
  .ribbon-primary.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #43f;
	border-right-color: #43f;
  }
  .ribbon-primary.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #43f;
	border-right-color: transparent;
	border-left-color: #43f;
  }
  
  .ribbon-bookmark.ribbon-primary:before {
	border-color: #3a57e8;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-primary:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-secondary:before {
	border-right-color: #f73164;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-success:before {
	border-right-color: #51bb25;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-danger:before {
	border-right-color: #dc3545;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-info:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-light:before {
	border-right-color: #f4f4f4;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-dark:before {
	border-right-color: #2c323f;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-warning:before {
	border-right-color: #f8d62b;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-secondary:before {
	border-color: #f73164;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-success:before {
	border-color: #51bb25;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-danger:before {
	border-color: #dc3545;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-info:before {
	border-color: #3a57e8;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-light:before {
	border-color: #f4f4f4;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-dark:before {
	border-color: #2c323f;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-warning:before {
	border-color: #f8d62b;
	border-right-color: transparent;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-primary:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-primary:before {
	border-right-color: #3a57e8;
	border-bottom-color: transparent;
  }
  
  .ribbon-secondary {
	background: #f73164;
	background: #f73164;
  }
  .ribbon-secondary.ribbon-corner:before {
	border-top-color: #f73164;
	border-left-color: #f73164;
  }
  .ribbon-secondary.ribbon-corner.ribbon-right:before {
	border-right-color: #f73164;
	border-left-color: transparent;
  }
  .ribbon-secondary.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f73164;
  }
  .ribbon-secondary.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #ec0944;
	border-right-color: #ec0944;
  }
  .ribbon-secondary.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #ec0944;
	border-left-color: #ec0944;
  }
  .ribbon-secondary.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #ec0944;
	border-right-color: #ec0944;
  }
  .ribbon-secondary.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #ec0944;
	border-right-color: transparent;
	border-left-color: #ec0944;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-secondary:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-secondary:before {
	border-right-color: #f73164;
	border-bottom-color: transparent;
  }
  
  .ribbon-success {
	background: #51bb25;
	background: #51bb25;
  }
  .ribbon-success.ribbon-corner:before {
	border-top-color: #51bb25;
	border-left-color: #51bb25;
  }
  .ribbon-success.ribbon-corner.ribbon-right:before {
	border-right-color: #51bb25;
	border-left-color: transparent;
  }
  .ribbon-success.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #51bb25;
  }
  .ribbon-success.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #3f901d;
	border-right-color: #3f901d;
  }
  .ribbon-success.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #3f901d;
	border-left-color: #3f901d;
  }
  .ribbon-success.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3f901d;
	border-right-color: #3f901d;
  }
  .ribbon-success.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #3f901d;
	border-right-color: transparent;
	border-left-color: #3f901d;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-success:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-success:before {
	border-right-color: #51bb25;
	border-bottom-color: transparent;
  }
  
  .ribbon-danger {
	background: #dc3545;
	background: #dc3545;
  }
  .ribbon-danger.ribbon-corner:before {
	border-top-color: #dc3545;
	border-left-color: #dc3545;
  }
  .ribbon-danger.ribbon-corner.ribbon-right:before {
	border-right-color: #dc3545;
	border-left-color: transparent;
  }
  .ribbon-danger.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #dc3545;
  }
  .ribbon-danger.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #bd2130;
	border-right-color: #bd2130;
  }
  .ribbon-danger.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #bd2130;
	border-left-color: #bd2130;
  }
  .ribbon-danger.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #bd2130;
	border-right-color: #bd2130;
  }
  .ribbon-danger.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #bd2130;
	border-right-color: transparent;
	border-left-color: #bd2130;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-danger:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-danger:before {
	border-right-color: #dc3545;
	border-bottom-color: transparent;
  }
  
  .ribbon-info {
	background: #3a57e8;
	background: #3a57e8;
  }
  .ribbon-info.ribbon-corner:before {
	border-top-color: #3a57e8;
	border-left-color: #3a57e8;
  }
  .ribbon-info.ribbon-corner.ribbon-right:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
  }
  .ribbon-info.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3a57e8;
  }
  .ribbon-info.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #9106e7;
	border-right-color: #9106e7;
  }
  .ribbon-info.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #9106e7;
	border-left-color: #9106e7;
  }
  .ribbon-info.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #9106e7;
	border-right-color: #9106e7;
  }
  .ribbon-info.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #9106e7;
	border-right-color: transparent;
	border-left-color: #9106e7;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-info:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-info:before {
	border-right-color: #3a57e8;
	border-bottom-color: transparent;
  }
  
  .ribbon-light {
	background: #f4f4f4;
	background: #f4f4f4;
  }
  .ribbon-light.ribbon-corner:before {
	border-top-color: #f4f4f4;
	border-left-color: #f4f4f4;
  }
  .ribbon-light.ribbon-corner.ribbon-right:before {
	border-right-color: #f4f4f4;
	border-left-color: transparent;
  }
  .ribbon-light.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f4f4f4;
  }
  .ribbon-light.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #dbdbdb;
	border-right-color: #dbdbdb;
  }
  .ribbon-light.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #dbdbdb;
	border-left-color: #dbdbdb;
  }
  .ribbon-light.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #dbdbdb;
	border-right-color: #dbdbdb;
  }
  .ribbon-light.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #dbdbdb;
	border-right-color: transparent;
	border-left-color: #dbdbdb;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-light:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-light:before {
	border-right-color: #f4f4f4;
	border-bottom-color: transparent;
  }
  
  .ribbon-dark {
	background: #2c323f;
	background: #2c323f;
  }
  .ribbon-dark.ribbon-corner:before {
	border-top-color: #2c323f;
	border-left-color: #2c323f;
  }
  .ribbon-dark.ribbon-corner.ribbon-right:before {
	border-right-color: #2c323f;
	border-left-color: transparent;
  }
  .ribbon-dark.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #2c323f;
  }
  .ribbon-dark.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #171a21;
	border-right-color: #171a21;
  }
  .ribbon-dark.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #171a21;
	border-left-color: #171a21;
  }
  .ribbon-dark.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #171a21;
	border-right-color: #171a21;
  }
  .ribbon-dark.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #171a21;
	border-right-color: transparent;
	border-left-color: #171a21;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-dark:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-dark:before {
	border-right-color: #2c323f;
	border-bottom-color: transparent;
  }
  
  .ribbon-warning {
	background: #f8d62b;
	background: #f8d62b;
  }
  .ribbon-warning.ribbon-corner:before {
	border-top-color: #f8d62b;
	border-left-color: #f8d62b;
  }
  .ribbon-warning.ribbon-corner.ribbon-right:before {
	border-right-color: #f8d62b;
	border-left-color: transparent;
  }
  .ribbon-warning.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f8d62b;
  }
  .ribbon-warning.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #e8c308;
	border-right-color: #e8c308;
  }
  .ribbon-warning.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #e8c308;
	border-left-color: #e8c308;
  }
  .ribbon-warning.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #e8c308;
	border-right-color: #e8c308;
  }
  .ribbon-warning.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #e8c308;
	border-right-color: transparent;
	border-left-color: #e8c308;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-warning:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-warning:before {
	border-right-color: #f8d62b;
	border-bottom-color: transparent;
  }
  
  .ribbon-wrapper {
	position: relative;
	padding-top: 40px;
  }
  
  .ribbon-wrapper .card-body,
  .ribbon-vertical-left-wrapper .card-body,
  .ribbon-vertical-right-wrapper .card-body {
	position: unset;
  }
  
  .ribbon {
	padding: 0 20px;
	height: 30px;
	line-height: 30px;
	clear: left;
	position: absolute;
	top: 12px;
	left: 0px;
	color: #fff;
	z-index: 1;
  }
  .ribbon-right {
	left: auto;
	right: -2px;
  }
  .ribbon-vertical-left-wrapper {
	padding-left: 40px;
	position: relative;
  }
  .ribbon-vertical-left {
	clear: none;
	padding: 0 5px;
	height: 70px;
	width: 30px;
	line-height: 70px;
	text-align: center;
	left: 12px;
	top: -2px;
  }
  
  .ribbon-vertical-right-wrapper {
	padding-right: 40px;
  }
  
  .ribbon-vertical-right {
	clear: none;
	padding: 0 5px;
	height: 70px;
	width: 30px;
	line-height: 70px;
	text-align: center;
	top: -2px;
	left: auto;
	right: 12px;
  }
  
  .timeline {
	position: relative;
	padding: 20px 0 20px;
	list-style: none;
	max-width: 1200px;
	margin: 0 auto;
  }
  .timeline:before {
	content: " ";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 3px;
	margin-left: -1.5px;
	background-color: #e9ecef;
  }
  .timeline > li {
	position: relative;
	margin-bottom: 20px;
  }
  .timeline > li:after {
	clear: both;
	clear: both;
  }
  .timeline > li > .timeline-panel {
	float: left;
	position: relative;
	width: 46%;
	padding: 20px;
	border: 1px solid #e9ecef;
	border-radius: 0.25rem;
	-webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
  }
  .timeline > li > .timeline-panel:before {
	content: " ";
	display: inline-block;
	position: absolute;
	top: 26px;
	right: -8px;
	border-top: 8px solid transparent;
	border-right: 0 solid #e9ecef;
	border-bottom: 8px solid transparent;
	border-left: 8px solid #e9ecef;
  }
  .timeline > li > .timeline-panel:after {
	content: " ";
	display: inline-block;
	position: absolute;
	top: 27px;
	right: -7px;
	border-top: 7px solid transparent;
	border-right: 0 solid #fff;
	border-bottom: 7px solid transparent;
	border-left: 7px solid #fff;
  }
  .timeline > li > .timeline-badge {
	z-index: 1;
	position: absolute;
	top: 16px;
	left: 50%;
	width: 50px;
	height: 50px;
	margin-left: -25px;
	border-radius: 50% 50% 50% 50%;
	text-align: center;
	font-size: 1.4em;
	line-height: 50px;
	color: #fff;
	overflow: hidden;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
	float: right;
  }
  .timeline > li.timeline-inverted > .timeline-panel:before {
	right: auto;
	left: -8px;
	border-right-width: 8px;
	border-left-width: 0;
  }
  .timeline > li.timeline-inverted > .timeline-panel:after {
	right: auto;
	left: -7px;
	border-right-width: 7px;
	border-left-width: 0;
  }
  
  .timeline > li:before,
  .timeline > li:after {
	content: " ";
	display: table;
	content: " ";
	display: table;
  }
  
  .timeline-badge.primary {
	background-color: #fb9678;
  }
  .timeline-badge.success {
	background-color: #00c292;
  }
  .timeline-badge.warning {
	background-color: #fec107;
  }
  .timeline-badge.danger {
	background-color: #e46a76;
  }
  .timeline-badge.info {
	background-color: #03a9f3;
  }
  
  .timeline-title {
	margin-top: 0;
	color: inherit;
	font-weight: 400;
  }
  
  .timeline-body > p,
  .timeline-body > ul {
	margin-bottom: 0;
  }
  
  .timeline-body > p + p {
	margin-top: 5px;
  }
  
  .cd-horizontal-timeline {
	opacity: 0;
	margin: 2em auto;
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	transition: opacity 0.2s;
  }
  .cd-horizontal-timeline .events {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 30px;
	height: 2px;
	background: #dfdfdf;
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
  }
  .cd-horizontal-timeline .events a {
	padding-bottom: 6px;
	color: #3a57e8;
	position: absolute;
	bottom: 0;
	z-index: 2;
	text-align: center;
	font-size: 14px;
	padding-bottom: 15px;
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
  }
  .cd-horizontal-timeline .events a.selected {
	pointer-events: none;
  }
  .cd-horizontal-timeline .events a.selected::after {
	border-color: #3a57e8;
	background-color: #3a57e8;
	border-color: #3a57e8;
  }
  .cd-horizontal-timeline .events a::after {
	content: "";
	position: absolute;
	left: 50%;
	right: auto;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	bottom: -5px;
	height: 12px;
	width: 12px;
	border-radius: 50%;
	border: 2px solid #dfdfdf;
	background-color: #f8f8f8;
	-webkit-transition: background-color 0.3s, border-color 0.3s;
	-moz-transition: background-color 0.3s, border-color 0.3s;
	transition: background-color 0.3s, border-color 0.3s;
  }
  .cd-horizontal-timeline .events a.older-event::after {
	border-color: #3a57e8;
  }
  .cd-horizontal-timeline .m-t-40 {
	margin-top: 25px !important;
  }
  .cd-horizontal-timeline table {
	border-collapse: collapse;
	border-spacing: 0;
  }
  .cd-horizontal-timeline::before {
	content: "mobile";
	display: none;
  }
  .cd-horizontal-timeline.loaded {
	opacity: 1;
  }
  .cd-horizontal-timeline .timeline {
	position: relative;
	height: 100px;
	width: 90%;
	max-width: 800px;
	margin: 0 auto;
  }
  .cd-horizontal-timeline .timeline:before {
	content: " ";
	display: none;
	bottom: 0;
	left: 0%;
	width: 0px;
	margin-left: -1.5px;
	background-color: #eeeeee;
  }
  .cd-horizontal-timeline .events-wrapper {
	position: relative;
	height: 100%;
	margin: 0 40px;
	overflow: hidden;
  }
  .cd-horizontal-timeline .events-wrapper::before {
	left: 0;
  }
  .cd-horizontal-timeline .events-wrapper::after {
	right: 0;
  }
  .cd-horizontal-timeline .filling-line {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	background-color: #3a57e8;
	-webkit-transform: scaleX(0);
	-moz-transform: scaleX(0);
	-ms-transform: scaleX(0);
	-o-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-ms-transform-origin: left center;
	-o-transform-origin: left center;
	transform-origin: left center;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
  }
  .cd-horizontal-timeline .events-content {
	position: relative;
	width: 100%;
	margin: 2em 0;
	overflow: hidden;
	-webkit-transition: height 0.4s;
	-moz-transition: height 0.4s;
	transition: height 0.4s;
  }
  .cd-horizontal-timeline .events-content li {
	position: absolute;
	z-index: 1;
	width: 100%;
	left: 0;
	top: 0;
	-webkit-transform: translateX(-100%);
	-moz-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	transform: translateX(-100%);
	padding: 0 5%;
	opacity: 0;
	-webkit-animation-duration: 0.4s;
	-moz-animation-duration: 0.4s;
	animation-duration: 0.4s;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
  }
  .cd-horizontal-timeline .events-content li.selected {
	position: relative;
	opacity: 1;
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
  }
  .cd-horizontal-timeline .events-content li > * {
	max-width: 800px;
	margin: 0 auto;
  }
  .cd-horizontal-timeline .events-content h2 {
	font-weight: 600;
	margin-bottom: 0px;
  }
  .cd-horizontal-timeline .events-content em {
	display: block;
	font-style: italic;
	margin: 10px auto;
  }
  .cd-horizontal-timeline .events-content em::before {
	content: "- ";
  }
  .cd-horizontal-timeline .events-content p {
	font-size: 16px;
  }
  
  .cd-horizontal-timeline .filling-line,
  .cd-horizontal-timeline .events a.selected::after {
	background: #3a57e8;
  }
  
  .cd-horizontal-timeline ol,
  .cd-horizontal-timeline ul {
	list-style: none;
  }
  
  .cd-timeline-navigation a:hover,
  .cd-timeline-navigation a:focus {
	border-color: #3a57e8;
  }
  
  .cd-horizontal-timeline a,
  .cd-horizontal-timeline a:hover,
  .cd-horizontal-timeline a:focus {
	color: #3a57e8;
  }
  
  .cd-horizontal-timeline blockquote,
  .cd-horizontal-timeline q {
	quotes: none;
  }
  
  .cd-horizontal-timeline blockquote:before,
  .cd-horizontal-timeline blockquote:after,
  .cd-horizontal-timeline q:before,
  .cd-horizontal-timeline q:after {
	content: "";
	content: none;
  }
  
  .cd-horizontal-timeline .events-wrapper::after,
  .cd-horizontal-timeline .events-wrapper::before {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	height: 100%;
	width: 20px;
  }
  
  .no-touch .cd-horizontal-timeline .events a:hover::after {
	background-color: #3a57e8;
	border-color: #3a57e8;
  }
  .no-touch .cd-timeline-navigation a:hover {
	border-color: #7b9d6f;
  }
  .no-touch .cd-timeline-navigation a.inactive:hover {
	border-color: #dfdfdf;
  }
  
  .cd-timeline-navigation a {
	position: absolute;
	z-index: 1;
	top: 50%;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	height: 34px;
	width: 34px;
	border-radius: 50%;
	border: 2px solid #dfdfdf;
	overflow: hidden;
	color: transparent;
	text-indent: 100%;
	white-space: nowrap;
	-webkit-transition: border-color 0.3s;
	-moz-transition: border-color 0.3s;
	transition: border-color 0.3s;
  }
  .cd-timeline-navigation a::after {
	content: "";
	position: absolute;
	height: 16px;
	width: 16px;
	left: 50%;
	top: 50%;
	bottom: auto;
	right: auto;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	background: url(../img/arrow.svg) no-repeat 0 0;
  }
  .cd-timeline-navigation a.prev {
	left: 0;
	-webkit-transform: translateY(-50%) rotate(180deg);
	-moz-transform: translateY(-50%) rotate(180deg);
	-ms-transform: translateY(-50%) rotate(180deg);
	-o-transform: translateY(-50%) rotate(180deg);
	transform: translateY(-50%) rotate(180deg);
  }
  .cd-timeline-navigation a.next {
	right: 0;
  }
  .cd-timeline-navigation a.inactive {
	cursor: not-allowed;
  }
  .cd-timeline-navigation a.inactive::after {
	background-position: 0 -16px;
  }
  
  .cd-horizontal-timeline .events-content li.enter-right,
  .cd-horizontal-timeline .events-content li.leave-right {
	-webkit-animation-name: cd-enter-right;
	-moz-animation-name: cd-enter-right;
	animation-name: cd-enter-right;
  }
  
  .cd-horizontal-timeline .events-content li.enter-left,
  .cd-horizontal-timeline .events-content li.leave-left {
	-webkit-animation-name: cd-enter-left;
	-moz-animation-name: cd-enter-left;
	animation-name: cd-enter-left;
  }
  
  .cd-horizontal-timeline .events-content li.leave-right,
  .cd-horizontal-timeline .events-content li.leave-left {
	-webkit-animation-direction: reverse;
	-moz-animation-direction: reverse;
	animation-direction: reverse;
  }
  
  .cd-horizontal-timeline .events-content em,
  .cd-horizontal-timeline .events-content p {
	line-height: 30px;
  }
  
  .h-250 {
	height: 250px;
  }
  
  .icons-list {
	padding: 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
  }
  .icons-list li {
	display: block;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 18px;
	border-radius: 50px;
	box-shadow: 0px 2px 3px rgb(215, 197, 255);
	border: 1px solid #e6ebf1;
	color: #3a57e8;
	margin: 5px;
  }
  
  .custom-file-container {
	box-sizing: border-box;
	position: relative;
	display: block;
  }
  .custom-file-container label {
	color: #3a57e8;
  }
  
  .custom-file-container__custom-file {
	box-sizing: border-box;
	position: relative;
	display: inline-block;
	width: 100%;
	height: calc(2.25rem + 2px);
	margin-bottom: 0;
	margin-top: 5px;
  }
  .custom-file-container__custom-file:hover {
	cursor: pointer;
  }
  
  .custom-file-container__custom-file__custom-file-input {
	box-sizing: border-box;
	min-width: 14rem;
	max-width: 100%;
	height: calc(2.25rem + 2px);
	margin: 0;
	opacity: 0;
  }
  .custom-file-container__custom-file__custom-file-input:focus ~ span {
	outline: 1px dotted #dddde0;
	outline: 0px auto -webkit-focus-ring-color;
  }
  
  .custom-file-container__custom-file__custom-file-control {
	box-sizing: border-box;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1;
	height: auto;
	overflow: hidden;
	line-height: 1.5;
	user-select: none;
	background-clip: padding-box;
	border-radius: 0.25rem;
	height: auto;
	border: 1px solid #f1f2f3;
	color: #3b3f5c;
	font-size: 15px;
	padding: 8px 10px;
	letter-spacing: 1px;
	background-color: #f1f2f3;
  }
  
  .custom-file-container__custom-file__custom-file-control__button {
	box-sizing: border-box;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 6;
	display: block;
	height: auto;
	padding: 10px 16px;
	line-height: 1.25;
	background-color: #bdbdbd;
	color: #ffffff;
	border-left: 1px solid #e0e6ed;
	box-sizing: border-box;
  }
  
  .custom-file-container__image-preview {
	box-sizing: border-box;
	margin-top: 54px;
	margin-bottom: 40px;
	height: 250px;
	width: 100%;
	border-radius: 4px;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #ffffff;
	overflow: auto;
	padding: 15px;
	-webkit-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
  }
  
  .custom-file-container__image-multi-preview {
	position: relative;
	box-sizing: border-box;
	border-radius: 6px;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	float: left;
	margin: 1.858736%;
	width: 29.615861214%;
	height: 90px;
	box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.25);
	-webkit-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
  }
  
  .custom-file-container__image-multi-preview__single-image-clear {
	background: #ffffff;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	text-align: center;
	margin-top: -6px;
	border-radius: 50%;
	box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.25);
	position: absolute;
	left: -6px;
  }
  .custom-file-container__image-multi-preview__single-image-clear:hover {
	background: #cbcbbd;
	cursor: pointer;
  }
  
  .custom-file-container__image-multi-preview__single-image-clear__icon {
	color: #3a57e8;
	display: block;
	margin-top: -2px;
  }
  .note-editor.card {
	padding: 0.5rem;
	margin-bottom: 0;
  }
  
  .note-toolbar.card-header {
	padding: 0;
	padding-bottom: 0.5rem;
  }
.nav-pills .nav-link{
	background: rgba(46, 55, 164, 0.05);
	color: #3a57e8;
	    border-radius: 50px;
		    padding: 12px;
}
.nav-pills .nav-link.active {
	background: #3a57e8;
	color: #fff;
}
.navtab-bg li {
	margin-right: 5px;
}
.btn-outline-light,.btn:disabled{
    color: #ababab;
    border-color: #e6e6e6;
}
.card-buttons .btn.btn-secondary {
	background: #00d3c7 !important;
	border-color: #00d3c7;
}
.note-editor.note-frame .note-statusbar .note-resizebar{
	padding-top: 0;
	height: 0;
	width: 100%;
	cursor: ns-resize;
	background: transparent;
	border: 0;
}
.wizard .nav-tabs {
    position: relative;
    margin-top: 20px;
    border: 0;
	margin-bottom: 30px;
}
.wizard .nav-item {
    position: relative;
}
.wizard .nav-item .nav-link {
    width: 56px;
    height: 56px;
    content: "";
    position: absolute;
    background: #fff;
    left: 50%;
    color: #5156be;
    top: 50%;
    font-size: 20px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    border: 1px solid rgba(81, 86, 190, 0.2);
}
.wizard .nav-tabs li:first-child::after {
	display: none;
}
.wizard .nav-item .nav-link.active {
    background: #e9e9ef;
    color: #5156be;
    border: 1px solid rgba(81, 86, 190, 0.2);
}
.wizard .nav-tabs li:after {
    content: "";
    width: 75%;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    background: #e9e9ef;
    height: 2px;
    left: -30%;
    top: 38%;
    z-index: 1;
}
.alertify .ajs-footer {
  border-top: 1px solid #eee;
}
.alertify .ajs-footer .ajs-buttons .ajs-button {
  font-weight: 500;
  background-color: transparent;
  color: #000;
  border: 0;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
}
.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
  color: #3a57e8;
}
.alertify .ajs-footer .ajs-buttons.ajs-primary {
  text-align: right;
}
.alertify .ajs-body .ajs-content .ajs-input {
  display: block;
  width: 100%;
  padding: 8px;
  margin: 4px;
  border-radius: 2px;
  border: 1px solid #ccc;
}
.alertify .ajs-body .ajs-content .ajs-input:focus-visible {
  outline: 0;
}
.alertify .ajs-commands {
  right: 4px;
  left: auto;
  margin: -14px 0 0 24px;
}
.alertify .ajs-header {
  border-bottom: 1px solid #eee;
}

.alertify-notifier .ajs-message {
  background-color: #3a57e8;
  border-color: #3a57e8;
  color: #ffffff;
  text-shadow: none !important;
}
.alertify-notifier .ajs-message.ajs-success {
  background-color: #26af48;
  border-color: #26af48;
}
.alertify-notifier .ajs-message.ajs-error {
  background-color: #3a57e8;
  border-color: #3a57e8;
}
.alertify-notifier .ajs-message.ajs-warning {
  background-color: #ffbf53;
  border-color: #ffbf53;
}
.alertify-notifier.ajs-right {
  right: 10px;
  left: auto;
}
.alertify-notifier.ajs-right .ajs-message {
  right: -320px;
  left: auto;
}
.alertify-notifier.ajs-right .ajs-message.ajs-visible {
  right: 290px;
  left: auto;
}
.alertify-notifier.ajs-left {
  left: 10px;
  right: auto;
}
.alertify-notifier.ajs-left .ajs-message {
  left: -300px;
  right: auto;
}
.alertify-notifier.ajs-left .ajs-message.ajs-visible {
  left: 0;
  right: auto;
}

body[data-layout-mode=dark] .alertify .ajs-dialog {
  background-color: #313533;
}
body[data-layout-mode=dark] .alertify .ajs-body {
  color: #adb5bd;
}
body[data-layout-mode=dark] .alertify .ajs-body .ajs-content .ajs-input {
  color: #adb5bd;
  background-color: #363a38;
  border: 1px solid #3b403d;
}
body[data-layout-mode=dark] .alertify .ajs-footer .ajs-buttons .ajs-button {
  color: #adb5bd;
}
body[data-layout-mode=dark] .alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
  color: #3a57e8;
}

body[data-layout-mode=dark] .alertify .ajs-footer,
body[data-layout-mode=dark] .alertify .ajs-header {
  color: #ced4da;
  background-color: #313533;
  border-color: #3b403d;
}

.swal2-actions button {
  margin-right: 10px;
}
.select2-container {
    min-width: 100% !important;
    width: auto !important;
}
.breadcrumb {
	position: relative;
}
.card-buttons .breadcrumb .breadcrumb-item {
	position: relative;
}
.card-buttons .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    float: left;
    padding-right: 0.5rem;
    color: #6c757d;
    content: "/";
	display: block;
	padding-right: 5px;
}
.card-buttons .breadcrumb.breadcrumb-dot .breadcrumb-item + .breadcrumb-item::before {
	content: ".";
	font-size: 25px;
	position: relative;
	top: -13px;
}
.card-buttons .breadcrumb {
    background-color: transparent;
    color: #6c757d;
    font-size: 16px;
    font-weight: 500;
    margin: 0;
    padding: 0;
}
.card-buttons .breadcrumb-colored {
    margin: 0 0 10px;
    padding: 12px 16px;
    border-radius: 4px;
}
.btn-primary span {
	color: #fff;
}
.btn.btn-primary:disabled {
	color: #fff;
}
.swal2-header .swal2-title {
	font-size: 22px;
}
.auth-logo {
	display: flex;
	justify-content: center;
}
.modal-dialog.modal-bottom {
	display: flex;
    align-items: end;
    height: 90%;
}
.modal-dialog.modal-right {
	margin-right: 50px;
}
.sidebar .logout-btn {
	margin-top: 0;
}
table.dataTable>thead>tr>th, table.dataTable>thead>tr>td {
	border-bottom: 1px solid #fff;
}
.dataTables_paginate .paginate_button {
	background: #e9ecef !important;
}
.dataTables_paginate .paginate_button.previous {
	border-radius: 5px 0 0 5px;
}
.dataTables_paginate .paginate_button.next {
	border-radius: 0 5px 5px 0;
}
#DataTables_Table_0_wrapper .dt-layout-row:first-child {
	display: none;
}
#DataTables_Table_0_wrapper .dt-layout-row:last-child {
	padding: 0 20px;
}
#DataTables_Table_1_wrapper .dt-layout-row:first-child {
	display: none;
}
#DataTables_Table_1_wrapper .dt-layout-row:last-child {
	padding: 0 20px;
}
div.dt-container.dt-empty-footer tbody>tr:last-child>* {
	border-bottom: unset;
}
.dt-paging-button.disabled.first, .dt-paging-button.disabled.last {
	display: none !important;
}
.dt-paging-button.previous {
	background: #e9ecef !important;
	padding: 5px 15px;
	font-size: 14px;
	border-radius: 5px 0 0 5px !important;
	margin: 0 !important;
}
.dt-paging-button.next {
	background: #e9ecef !important;
	padding: 5px 15px;
	font-size: 14px;
	margin: 0 !important;
	border-radius: 0 5px 5px 0 !important;
}
div.dt-container .dt-paging .dt-paging-button.current {
	background: #3a57e8 !important;
	border-color: #3a57e8 !important;
	padding: 0;
	color: #fff !important;
	padding: 5px 15px !important;
	margin: 0 !important;
}
div.dt-container .dt-paging .dt-paging-button.current:hover {
	background: #00d3c7 !important;
	border-color: #00d3c7 !important;
	color: #fff !important;
}
.datatable tr th:hover {
	outline: 0  !important;
}
#DataTables_Table_0_info {
	font-size: 14px;
}
.swal2-actions .swal2-confirm.btn:active {
    background-color: #3a57e8;
    border-color: #3a57e8;
}
.swal2-confirm{
    margin-right: 5px;
}
button.swal2-confirm {
    background: #3a57e8;
    border: 1px solid #3a57e8;
    color: #fff;
    border-radius: 5px;
    padding: 0.5rem 0.85rem;
    font-size: 14px;
    transition: all 0.5s;
    font-weight: 500;
}
button.swal2-cancel {
    background: #E70D0D;
    border: 1px solid #E70D0D;
    color: #fff;
    border-radius: 5px;
    padding: 0.5rem 0.85rem;
    font-size: 14px;
    transition: all 0.5s;
    font-weight: 500;
}


ul.nav.nav-pills.navtab-bg.nav-justified {
    width: 40%;
    margin: 0 auto;
}


.attendance-circle-progress.attendance-progress {
    width: 150px;
    height: 150px !important;
    background: #FFF;
    border-radius: 50%;
}
h3.fs-m {
    font-size: 20px;
}

.center-right-contant.ddashboard .card {
    margin-bottom: 0;
    /* border: 1px solid #d1d1d1; */
    background: #fff;
    padding: 20px;
    border-radius: 18px;
    box-shadow: 4px 1px 20px rgb(184 230 208 / 38%);
}

.tracks img {
    width: 180px;
}

.tracks {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 40px;
}

.user-profile1 {
    display: flex;
    align-items: center;
    gap: 14px;
    justify-content: left;
    padding: 10px 22px;
}
.mini-sidebar .user-profile1 {
    padding: 8px 10px;
	    height: 80px;
}

.user-profile1 img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
}

.profile-name h4 {
    font-size: 15px;
    font-weight: 600;
    color: #212121;
    margin-bottom: 0;
}

.profile-name span {
    font-size: 13px;
    color: #898b8a;
}
img.settings {
    width: 25px;
}
.user-profile {
    margin-bottom: 10px;
}
.user-names h5 i {
    font-size: 13px;
}
.punch-in {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    font-size: 14px;
    font-weight: 600;
	line-height: 20px;
}
.punch-in i {
    font-size: 13px;
}

a.dropdown-item.dr-head {
    padding: 15px !important;
    color: #3a57e8;
    border-bottom: 1px solid #d6d6d6;
}

.footer-links ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    list-style-type: none;
    padding-bottom: 0;
    padding-top: 25px;
}

.footer-links ul li {
    position: relative;
	    font-size: 13px;
}



/****kanchan***/



.right-view 
 {
    text-align: end;
    margin-top: -11px;
}
h1.text-secondary-500.pb-1\.5x {
    font-size: 24px; 
}
.text-secondary-500 
 { 
    color: #394657;
}

.pb-1\.5x {
    padding-bottom: 15px;
}
.text-black-2 
 {
    color: #3b4452;
}

.uppercase {
    text-transform: uppercase;
}
.text-base {
    font-size: 1rem;
    line-height: 1.5rem;
}
.text-secondary-400 
 { 
    color:#5a6a7c;
}
.slides-2 p {
    margin: 0;
    margin-bottom: 6px;
    font-size: 15px;
}
.author-inserted{
    font-size: 14px;
}


.center-right-contant .quote {
      font-size: 15px;
      color: #2d2d2d;
      line-height: 22px;
      margin-bottom: 10px;
    }
    .center-right-contant .quote span {
      font-size: 13px;
      color: #666;
    }
    .center-right-contant .banner {
      background: linear-gradient(90deg, #f2efff, #edf1fd);
      padding: 20px;
      border-radius: 10px;
      margin-bottom: 20px;
    }
    .center-right-contant .banner h1 {
      margin: 0;
      font-size: 16px;
      font-weight: 600;
      color: #3b3b3b;
    }
    .center-right-contant .banner h1 span {
      color: #888;
    }
    .center-right-contant .banner p {
      font-size: 13px;
      color: #555;
      margin-top: 8px;
    }
    .center-right-contant .banner p span {
      color: #c433cc;
      font-weight: 500;
    }
    .center-right-contant .explore-btn {
      background: #3a57e8;
      color: #fff;
      border: none;
      padding: 8px 20px;
      border-radius: 6px;
      font-size: 13px;
      cursor: pointer;
    }
    .center-right-contant .grid {
      display: flex;
      gap: 20px;
    }
    .center-right-contant .column {
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
     
    .center-right-contant .card h2 {
      font-size: 15px;
      line-height: 1.25rem;
      font-weight: 600;
      color: #3d3d3d;
      font-weight: 600;
    }
    .center-right-contant .card p,
    .center-right-contant .card li,
    .center-right-contant .card div {
      font-size: 14px;
      color: #131313;
    }
    .center-right-contant .card ul {
      padding-left: 6px;
      margin: 0;
    }
    .center-right-contant .card .note {
      font-size: 11px;
      color: #999;
      margin-top: 8px;
    }
    .center-right-contant .payslip-graph {
      text-align: center;
      padding: 20px 0;
    }
    .center-right-contant .payslip-label {
      font-size: 14px;
      font-weight: 500;
      margin-top: 10px;
    }
    .center-right-contant .payslip-days {
      font-size: 12px;
      color: #777;
    }
    .center-right-contant .payslip-amounts {
      font-size: 13px;
      line-height: 22px;
      padding-left: 10px;
    }
    .center-right-contant .payslip-links a {
      color: #397af6;
      font-size: 13px;
      text-decoration: none;
    }
    .center-right-contant .card {
      width: 100%;
      background: white;
      border-radius: 12px;
      /* box-shadow: 0 2px 10px rgba(0,0,0,0.1); */
      padding: 20px;
      position: relative;
    }

    .center-right-contant .card h4 {
      color: #4f4f4f;
    font-size: 15px;
    margin: 0 0 10px;
    }
.fs-14{
font-size:14px !important;
}
    .center-right-contant .arrow {
      position: absolute;
      right: 20px;
      top: 20px;
      font-size: 16px;
      color: #666;
    }

    .center-right-contant .chart-container {
         width: 160px;
         height: 160px;
         /* margin: 0 auto; */
         position: relative;
         margin-top: 20px;
    }

    .center-right-contant .pay-info {
      text-align: right;
      margin-top: 10px;
    }

    .center-right-contant .pay-info .month {
      font-weight: 600;
      font-size: 14px;
      line-height: 1.25rem;
      margin-bottom: 2px;
    }
	.center-right-contant .pay-info .month span {
    font-weight: 400;
}

    .center-right-contant .pay-info .days {
      color: #464646;
    font-size: 13px;
    }

    .center-right-contant .legend {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 10px;
    }

    .center-right-contant .legend-item {
      display: flex;
      align-items: center;
      font-size: 14px;
      margin-top: 11px;
    }

    .center-right-contant .legend-color {
      width: 4px;
      height: 20px;
      border-radius: 2px;
      margin-right: 10px;
    }

    .center-right-contant .legend-item span {
      margin-left: auto;
      font-weight: bold;
      letter-spacing: 2px;
    }

    .center-right-contant .legend .gross .legend-color { background: #343434; }
    .center-right-contant .legend .deduction .legend-color { background: #3a57e852; }
    .center-right-contant .legend .net .legend-color { background: #3a57e8; }

    .center-right-contant .actions {
      display: flex;
      justify-content: space-between;
      margin-top: 26px;
      font-size: 14px;
      border-top: 1px solid #e3e6e9;
      padding-top: 16px;
    }

    .center-right-contant .actions a {
      text-decoration: none;
      color: #3a57e8;
      font-weight: 500;
    }
    .center-right-contant {
        /* width: 88%;
        margin: auto; */
        /* margin-bottom: 60px; */
    }
    .btn.btn-icon {
        background: #3a57e8;
        color: #fff;
    }
    .review-a.text-center img {margin: 20px 0;}
    .review-a.text-center p {
    font-size: .875rem;
    line-height: 1.25rem;
    color: #3d4854;
    }
    .arrow-flex 
 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* margin-bottom: 17px; */
    border-bottom: 1px solid #5a6a7c2b;
    padding-bottom: 6px;
}
    .center-right-contant .leave-cal li {
    list-style: none;
    margin-top: 18px;
    color: #3d3d3d !important;
}
.chart-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 20px 0;
}
.it-declaration 
 {
    display: flex;
    align-items: self-start;
    margin-top: 20px;
    gap: 15px;
}
.banner-container {
      max-width: 800px;
      margin: 20px auto;
      border-radius: 10px;
      background: linear-gradient(to right, #faf6f4, #b36d3917);
      border: 1px solid #eee;
      display: flex;
      align-items: center;
      gap: 40px;
      padding: 10px 15px;
    }
    .banner-left {
      flex: 1;
      display: flex;
      align-items: center;
    }
    .banner-title {
      margin-right: 15px;
    }
    .banner-title span:first-child {
      font-weight: 600;
      color: #444;
    }
    .banner-title span:last-child {
      color: #777;
    }
    .banner-middle {
      flex: 3;
      display: flex;
      align-items: center;
      background: #ffffffa8;
      border-radius: 6px;
      border: 1px solid #e0e0e0;
      padding: 8px 12px;
    }
    .banner-icon {
      border-radius: 50%;
      margin-right: 12px;
    }
    .banner-text-title {
      font-weight: 600;
      color: #333;
      font-size: 16px;
      margin-bottom: 5px;
    }
    .banner-text-subtitle {
      font-size: 15px;
      color: #666;
    }
    .highlight {
      color: #3a57e8;
      font-weight: 500;
    }
    .banner-right {
      flex: 0 0 auto;
      margin-left: 15px;
    }
    .explore-btn {
      background: #5273ec;
      color: white;
      border: none;
      border-radius: 5px;
      padding: 6px 14px;
      font-size: 14px;
      font-weight: 500;
      cursor: pointer;
    }
    .center-right-contant .grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

/* leave apply page */
.leave-apply .info-box {
      background: #fffbe6;
      padding: 15px;
      font-size: 12px;
      color: #666;
      margin-bottom: 20px;
      border-radius: 4px;
    }
    
    .leave-apply .form-group {
      margin-bottom: 15px;
    }
    .leave-apply .form-label {
      display: block;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 6px;
      color: #000;
    }
    .leave-apply .form-control,
    .leave-apply .form-select,
    .leave-apply textarea {
      width: 100%;
      border: 1px solid #ccc;
      border-radius: 6px;
      color: #404854;
      border-color: #cbd5e1;
      font-size: 14px;
      padding: 10px; 
      font-weight: 600;
    }
    .leave-apply .form-row {
      display: flex;
      gap: 20px;
      /* margin-bottom: 20px; */
    }
 	
    .leave-apply .btn-cancel {
      color: #3a57e8;
    background: #fff;
    /* border: 1px solid #3a57e8; */
    font-weight: 500;
    border-radius: 18px;
    padding: 12px 30px;
    background: linear-gradient(135deg, #dbf5e9, #e8e1ff);
    }
    .leave-apply .file-types {
      font-size: 12px;
      color: #999;
      margin-top: 4px;
    }

   .leave-apply .side-tab {
    display: grid;
    gap: 10px;
    margin-top: 55px;
}

.leave-apply .tab-container {
    display: grid;
    grid-template-columns: 17% 78%;
    align-items: flex-start;
}
.side-tab a {
    line-height: 1.25rem;
    padding-left: 7px;
    color: #7f8fa4;
    font-size: 12px;
    font-weight: 500;
}
.top-tab {
    display: flex;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    /* border-radius: 8px; */
    /* overflow: hidden; */
    /* width: fit-content; */
    margin-bottom: 20px;
    /* margin: auto; */
    margin-bottom: -1px;
}

.top-tab a {
    padding: 11px 35px;
    background: #ffffff;
    border: none;
    /* border-right: 1px solid #e0e0e0; */
    cursor: pointer;
    font-weight: 500;
    color: #394657;
    position: relative;
}
a.top-tab-active {
    background: #3a57e8;
    color: #fff;
}
a.side-tab-active {
    border-left: 2px solid #000000;
    color: #000;
    font-weight: 500;
}
.holiday-group{
    display: flex;
    align-items: center;
    margin: 30px 0; 
}
.holiday-group-border{
    border-left: 1px solid #CBD5E1;
    padding-left: 10px;
}
.text-secondary, .label-style {
    color: #7f8fa4 !important;
}
/* .form-select-2{
    padding: 10px 12px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    min-width: 200px;
    max-width: 245px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #3b4452;
    border-color: #cbd5e1;
    font-size: 14px;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: 600;
} */
 
    .adding-dropdown .label-header {
      margin-left: 20px;
      margin-top: 10px;
      font-size: 14px;
    }
    .adding-dropdown .label-header div:first-child {
      font-size: 12px;
      color: #555;
    }
    .adding-dropdown .label-header span {
      color: #aaa;
      font-weight: bold;
    }
    .adding-dropdown .dropdown-container {
      width: 250px;
      border: 1px solid #ccc;
      border-radius: 6px;
      padding: 10px;
      background-color: white;
      position: absolute;
      display: none;
      z-index: 10;
    }
    .adding-dropdown .dropdown-header {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      margin-bottom: 5px;
    }
    .adding-dropdown .close-icon {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      border: 2px solid #3fa6f4;
      color: #3fa6f4;
      text-align: center;
      line-height: 18px;
      cursor: pointer;
      font-weight: bold;
      font-size: 14px;
    }
    .adding-dropdown .search-box {
      width: 100%;
      margin-bottom: 10px;
      position: relative;
    }
    .adding-dropdown .search-box input {
      width: 100%;
      padding: 6px 8px;
      border: 1px solid #ccc;
      border-radius: 4px;
      font-size: 13px;
    }
    .adding-dropdown .user-list {
      max-height: 150px;
      overflow-y: auto;
    }
    .adding-dropdown .user-item {
      display: flex;
      align-items: center;
      margin-bottom: 16px;
    }
    .adding-dropdown .user-item img {
      width: 35px;
      height: 35px;
      margin-right: 8px;
      /* border: 1px solid #000; */
      border-radius: 50%;
    }
    .adding-dropdown .user-info {
      display: flex;
      flex-direction: column;
      font-size: 13px;
    }
    .adding-dropdown .user-info span:first-child {
      font-weight: bold;
    }
    .adding-dropdown .user-info span:last-child {
      color: #777;
      font-size: 12px;
    }
    .adding-dropdown .user-item input {
      margin-right: 6px;
    }
    button.plus-btn {
    border: none;
    background: none;
}
   button.plus-btn-2 {
    border: none;
    background: none;
}

button.plus-btn i {
    border: 1px solid #cbd5e1;
    padding: 5px;
    border-radius: 50%;
    font-size: 20px;
    color: #98a2ad;
    margin-right: 10px;
    width: 35px;
    height: 35px;
    line-height: 24px;
}

.upload-link 
 {
    position: relative; 
} 
.update-flie {
    position: absolute;
    opacity: 0;
    z-index: 0;
    width: 100%;
    cursor: pointer;
    left: 0; 
}
button.trigger-button {
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 2px;
    color: #7f8fa4;
}
.leave-table-container {
      width: 100%;
      border: 1px solid #ddd;
      overflow-y: auto;
      max-height: 300px; /* adjust height as needed */
      margin-bottom: 28px;
    }
    .leave-table {
      width: 100%;
      border-collapse: collapse;
    }
    .leave-table thead {
      background-color: #fbfcff;
      text-align: left;
      position: sticky;
      top: 0;
      z-index: 1;
    }
    .leave-table th,
    .leave-table td {
      padding: 10px;
      border-top: 1px solid #ddd;
      vertical-align: top;
      font-size: 13px;
    }
	.leave-table th {
      font-size: 13px;
	  font-weight: 700;
    }
    .leave-type {
      font-weight: bold;
    }
    .subtext {
      color: #888;
      font-size: 13px;
    }
    .radio-cell {
      width: 5%;
    }
 
.pending-sec-box {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    padding: 25px;
    margin: 0 auto;
    margin-bottom: 40px;
     margin-top: 40px;
    width: 80%;
}
 .leave-accordion .accordion {
      background: #fff;
      border-radius: 6px;
      margin-bottom: 12px;
      box-shadow: 0 0 4px rgba(0, 0, 0, 0.05);
      overflow: hidden;
      border: 1px solid #ddd;
    }

    .leave-accordion .accordion-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 15px 20px;
      cursor: pointer;
    }

    .leave-accordion .accordion-header > .col {
      flex: 1;
      font-size: 14px;
      font-weight: 600;
      color: #666;
    }

    .leave-accordion .accordion-header .status {
      color: #5bc67e;
      font-weight: 400;
      text-transform: uppercase;
      vertical-align: sub;
      letter-spacing: .05rem;
    }

    .leave-accordion .accordion-header .arrow {
      /* width: 24px; */
      text-align: center;
      /* font-size: 16px; */
      /* transition: transform 0.3s ease; */
      /* flex-shrink: 0; */
      border: 1px solid #CBD5E1;
      border-radius: 50%;
      border-color: #a3b2c7;
      height: 26px;
      width: 26px;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 4px;
    }

    .leave-accordion .accordion-header.active .arrow {
      transform: rotate(180deg);
    }

    .leave-accordion .accordion-body {
      display: none;
      padding: 0;
      font-size: 14px;
      border-top: 1px solid #eee;
      background-color: #fefeff;
    }

    .leave-accordion .accordion-body div {
      /* margin-bottom: 6px; */
    }

    .leave-accordion .accordion-body .applied {
      /* margin-top: 10px; */
      font-weight: 500;
      padding: 20px;
      border-top: 1px solid #CBD5E1;
    }

    .leave-accordion .accordion-body a {
      float: right;
      color: #007bff;
      text-decoration: none;
      font-weight: 500;
    }
    .history-sec {
    margin: 0 auto;
    margin-bottom: 40px;
    margin-top: 40px;
    width: 80%;
}
.col strong {
    font-size: 12px;
    font-weight: 600;
    color: #7f8fa4;
}
.duration {
    padding: 20px 20px;
}
 .balence-sec .top-controls {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 10px;
      margin-bottom: 20px;
    }

    .balence-sec .top-controls button,
    .balence-sec .top-controls select {
      padding: 6px 12px;
      font-size: 14px;
      border: 1px solid #ccc;
      border-radius: 4px;
      background: #fff;
      cursor: pointer;
    }

    .balence-sec .top-controls .apply-btn {
      background-color: #007bff;
      color: white;
      border: none;
    }

    .balence-sec .top-controls .download-btn {
      background-color: #00aaff;
      color: white;
      border: none;
    }

    .balence-sec .grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 15px;
    }

    .balence-sec .card {
      background: white;
      border: 1px solid #e0e0e0;
      border-radius: 4px;
      padding: 15px;
      text-align: center;
    }

    .balence-sec .card h4 {
      margin: 0;
      font-size: 14px;
      color: #444;
    }

    .balence-sec .card .granted {
      font-size: 12px;
      color: #888;
      margin-bottom: 10px;
    }

    .balence-sec .card .balance {
      font-size: 24px;
      font-weight: bold;
      color: #444;
    }

    .balence-sec .card .label {
      font-size: 13px;
      color: #888;
      margin-bottom: 10px;
    }

    .balence-sec .view-details {
      font-size: 13px;
      color: #007bff;
      cursor: pointer;
      margin-bottom: 5px;
      display: inline-block;
    }

   .balence-sec .progress-bar-container {
      width: 100%;
      height: 5px;
      background: #e0e0e0;
      border-radius: 10px;
      overflow: hidden;
      margin-top: 5px;
    }

   .balence-sec .progress-bar {
      height: 100%;
      background: #00aaff;
      width: 0%;
    }
 
    .balence-sec .earned-leave .progress-bar {
      width: 96.6%;
    }

    .balence-sec .casual-leave .progress-bar {
      width: 100%;
    }

   .balence-sec .restricted-holiday .progress-bar {
      width: 0%;
      background: #ccc;
    }

    .balence-sec .card .consumed-text {
      font-size: 11px;
      color: #666;
    }
    .bg-vectors {
    position: absolute;
    bottom: -20px;
    z-index: 0;
    opacity: 0.1;
}
.bg-vectors img{
    width: 100%;
}

 #app 
 {
    /* text-align: center; */
    font-size: 28px;
    font-weight: 600;
    margin-left: 8px;
    margin-bottom: 4px;
    background-image: linear-gradient(-225deg, #3b4452 0%, #3b4452 29%, #3b4452 67%, #3b4452 100%);
    background-clip: border-box;
    text-fill-color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    animation: textclip 2s linear infinite;
}

@keyframes textclip {
  to {
    background-position: 200% center;
  }
}
.banner-section{
    background-position: right, right;
    background-size: cover;
    background-repeat: no-repeat;
    background-color: #fff !important;
    padding: 16px 20px 25px;
    position: relative;
    border-radius: 20px;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}
/* .salary-card{
    background-image: url(../images/phone.png);
} */
 .image-home-noon img {
    position: absolute;
        right: 170px;
    bottom: 0;
}
a.btn.btn-2 {
    outline: none;
    color: #646bbc;
}
.bg-vectors-review {
    left: 50%;
    transform: translate(-50%, -21px);
}
.review-a.text-center.mt-110 {
    margin-top: 110px;
}
.holiday-flex img {
    width: 60px;
}

.holiday-flex {
    /* display: flex; */
    justify-content: space-between;
    /* align-items: center; */
}


.donut-wrapper {
    width: 150px;
    margin: auto;
    position: relative;
    margin-top: 10px;
    margin-bottom: 20px;
}

    .donut-center-label {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-weight: bold;
      font-size: 16px;
      color: #666;
	      width: 100%;
    }
	.timing-info {
    text-align: left;
}



.flip-card {
  background-color: transparent;
  /* width: 300px; */
  height: 327px;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}
 
/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: #ffffff;
  border-radius: 20px;
  color: black;
}

/* Style the back side */
.flip-card-back {
  background-color: #fff;
  color: white;
  transform: rotateY(180deg);
  border-radius: 20px;
}
li.att-info {
    display: flex;
    justify-content: space-between;
}


li.att-info {
    font-size: 11px !important;
}
li.att-info span 
 {
    font-size: 14px !important;
}
.Employ-Mint{font-size: 28px;}
.mini-sidebar .Employ-Mint{font-size: 14px;}
.timing-info-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 11px;
}

.timing-info-flex p {
    margin: 0;
}
 .year-select {
      border: 1px solid #ccc;
      padding: 3px 10px;
      border-radius: 5px;
      background: #f9f9f9;
      font-size: 14px;
    }

    .stats {
      display: grid;
          grid-template-columns: repeat(6, 1fr);
      gap: 10px 10px;
      font-size: 14px;
      /* margin-bottom: 20px; */
      text-align: left;
      margin-top: 12px;
    }

    .stat-item {
      display: flex;
      flex-direction: column;
      /* align-items: center; */
      text-align: left;
      min-width: 80px;
      padding: 12px;
      background: rgb(58 87 232 / 6%);
      border-radius: 8px;
    }

    .stat-item span:first-child {
     font-size: 16px;
    font-weight: 600;
    }

    /* .purple { color: #7c3aed; }
    .green { color: #16a34a; }
    .lightgreen { color: #22c55e; }
    .red { color: #dc2626; }
    .blue { color: #3b82f6; }
    .skyblue { color: #0ea5e9; } */

    .apply-btn {
      background-color: #4661e9;
      color: white;
      padding: 9px 20px;
      border: none;
      border-radius: 6px;
      font-weight: 500;
      cursor: pointer;
      font-size: 13px;
    }

    .apply-btn:hover {
      background-color: #4661e9;
    }
	.pay-slip-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.stat-item {
    color: #3d3d3d !important;
    font-size: 11px !important;
    font-weight: 400;
    text-align: center;
}
  /* .pay-slip-flex .chart-container {
      width: 400px;
      height: 400px;
      position: relative;
    }
    canvas {
      width: 100%;
      height: 100%;
    } */
	 .holiday-group-border span {
    font-size: 14px;
}
a.top-tab-active:before 
 {
    border-left: 11px solid transparent;
    border-right: 11px solid transparent;
    border-top: 7px solid #3a57e8;
    bottom: -7px;
    content: "";
    height: 0;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 0;
}
.sidebar-menu ul ul a:before {
    position: absolute;
    content: "";
    width: 8px;
    height: 2px;
    background: #3a57ecb8;
    top: 49%;
    left: 43px;
}
.total-work-hours.text-center.w-100 span {
    font-size: 12px;
	    font-weight: 500;
}
.card.flex-fill.border-primary.attendance-bg {
    background: #f3f5fe;
	border: 1px solid grey;
}
.form-select:focus { 
    box-shadow:none;
}
 
.position-relative.border.card.rounded-2.level-tab:hover{
	    border: 1px solid #3a57e8 !important;
		transition:.3s all ease;

}
span.avatar.rounded-circle svg { 
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(248deg) brightness(108%) contrast(101%);
}

.accordion-body .applied {
    color: #333333;
}

.accordion-body .duration {
    color: #333333;
	    font-size: 13px;
}

.card-body-1 {
    padding: 9px 0;
}
.level-tab-active {
    border: 1px solid #ffffff !important;
    color: white;
    background: linear-gradient(135deg, #61c797, #6a3ef6);
    box-shadow: 0 0px 25px rgb(37 99 235 / 5%), 0 0px 15px rgb(16 185 129 / 13%), inset 0 2px 4px rgb(255 255 255 / 56%), inset 0 -3px 8px rgb(255 255 255 / 18%);
}
.level-tab p{
	font-weight: 500;
}
.leave-accordion .accordion-header.active {
    background: #f3f5fe;
}

a.logo img {
    width: 115px;
}



/*****kanchan***/




 .main-box1 {
      display: flex;
      gap: 20px;
      background: #fff;
      padding: 30px 25px;
      border-radius: 8px;
      /* box-shadow: 0 0 8px rgba(0,0,0,0.05); */
      border: 1px solid #ddd;
    }
    .left-panel1 {
      flex: 2;
      border-right: 1px solid #e0e0e0;
      padding-right: 20px;
    }
    .right-panel1 {
      flex: 1;
    }
    .approved1 {
      color: #28a745;
      font-weight: 600;
      float: right;
    }
    .approver1 {
      font-weight: 700;
      margin-top: 5px;
    }
    .yellow-box1 {
      display: flex;
      background: #fefedc;
      border: 1px solid #eee;
      padding: 10px;
      margin: 20px 0;
      text-align: center;
      border-radius: 6px;
    }
    .yellow-box1 div {
      flex: 1;
      border-right: 1px solid #ccc;
    }
    .yellow-box1 div:last-child {
      border-right: none;
    }
    .yellow-box1 strong {
      display: block;
      font-size: 16px;
      margin-bottom: 4px;
      color: #333;
    }
    .yellow-box1 span {
      font-size: 13px;
          color: #474747;
		      font-weight: 500;
    }
    .balance1 {
      font-size: 14px;
      color: #333;
      margin-bottom: 20px;
    border-bottom: 1px solid #cccccc;
    padding-bottom: 12px;
    }
    .details-box {
      font-size: 14px;
    }
    .details-box p {
      margin: 6px 0;
      color: #333;
    }
    .details-box span {
      font-weight: 600;
      margin-right: 8px;
      color: #777;
    }
    .timeline-box {
      border: 1px solid #ddd;
      border-radius: 6px;
      padding: 15px;
      background: #fff;
    }
    .timeline-box h4 {
      font-size: 15px;
      color: #444;
      margin-bottom: 20px;
    }
    .timeline-item {
      position: relative;
      margin-bottom: 20px;
      padding-left: 20px;
    }
    .timeline-item::before {
      content: "";
      position: absolute;
      left: 0;
      top: 5px;
      width: 10px;
      height: 10px;
      background: #527cc7;
      border-radius: 50%;
    }
    .timeline-item:last-child::after {
      content: "";
      position: absolute;
      left: 4px;
      top: 15px;
      width: 2px;
      height: calc(100% - 15px);
      background: #ccc;
    }
    .timeline-item:last-child::after {
      display: none;
    }
    .timeline-item .label {
      font-weight: 600;
      font-size: 13px;
    }
    .timeline-item .sub {
      font-size: 12px;
      color: #666;
    }
	
	.details-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.detail-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  font-size: 14px;
  color: #333;
}
.detail-row label {
  font-weight: 600;
  color: #777;
}
.detail-row div {
  color: #333;
}




.bg-black-le {
    background-image: url(../img/bg/bg-black-le.svg);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: contain;
}
.remain-balance{
	font-size: 13px;
    font-weight: 600;
    padding: 5px 12px;
	display: block;
}

.text-start.leaves p{
	font-weight:500;
}

.leave-balance .card-body {
    padding: 18px;
}
.leave-balance {
    height: 210px;
}

.leave-balance .text-center a{
	font-weight:600;
}
.custom-datatable-filter.border.tbl1 {
    padding: 0;
}
.leave-count {
    text-align: center;
}

.leave-table-body tr td span {
    font-size: 13px;
    color: grey;
}
span.fc-icon.fc-icon-chevron-left {
    line-height: 19px;
}
span.fc-icon.fc-icon-chevron-right {
    line-height: 19px;
}
.table-responsive.br-0 {
    border-radius: 0;
}


    .calendar-container {
      background: white;
      border-radius: 6px;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
      padding: 1rem;
    }
    
    .fc-daygrid-day-frame {
      position: relative;
    }
    .cell-tag {
      position: absolute;
      bottom: 4px;
      right: 4px;
      font-size: 10px;
      padding: 2px 4px;
      background: #e3f2fd;
      color: #1976d2;
      border-radius: 4px;
    }
    .fc-daygrid-day.fc-day-today {
      background-color: #e0f7fa !important;
    }

.mt-1x {
    margin-top: 10px;
}


.emp-bubble {
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 2px solid black;
}
.emp-bubble-periwinkle-gray {
       border-color: #3a57e8b3;
}


.emp-bubble-brandy {
    border-color: #e0b19d;
}

.mr-0\.5x {
    margin-right: 5px;
}

.employees-list-item {
    list-style-type: none;
}
.mini-logo{
	display:none;
}
.mini-sidebar .mini-logo{
	display:block;
}
.mini-sidebar .main-logo{
	display:none;
}
.mini-logo {
    width: 30px !important;
    margin-left: 8px;
}
.tracks.leave img {
    width: 70px;
}

.month-holiday-list-item {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}
.holiday {
    margin-right: 30px;
    flex: 0 0 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.holiday-date {
    font-size: 16px;
    line-height: 24px;
    color: #7f8fa4;
    font-weight: 600;
}

ul.month-holiday-list {
    padding-left: 0;
    margin-top: 12px;
    margin-bottom: 0;
}
span.holiday-weekday {
    font-size: 13px;
}


.leave-balance.holiday-calendar {
    height: 260px;
}

ul.month-holiday-list {
    height: 180px;
    overflow-y: auto;
}



.calendar-container {
    width: 100%; /* Adjust width as needed */
    background-color: #fff;
    border-radius: 8px;
    /* box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); */
    overflow: hidden;
}

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 10px;
    background-color: #fff;
    border-bottom: 1px solid #cbd5e1;
    font-size: 1.2em;
    font-weight: bold;
    color: #333;
}

.nav-arrow {
        color: #151515;
    cursor: pointer;
    font-weight: normal;
    font-size: 14px;
}

.month-year {
    color: #333;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px; /* To create the subtle grid lines */
    background-color: #fff; /* Grid line color */
    padding-top: 1px; /* Top grid line */
}

.day-name {
    background-color: #ffffff;
    padding: 12px 0;
    text-align: center;
    font-weight: bold;
    color: #666;
    font-size: 0.9em;
    border-bottom: 1px solid #cbd5e1; /* Separator for day names */
}

.calendar-day {
    background-color: #fff;
    min-height: 100px; /* Adjust height for cells */
    padding: 8px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    border-right: 1px solid #cbd5e1;
    border-bottom: 1px solid #cbd5e1;
    box-sizing: border-box; /* Include padding and border in the element's total width and height */
}

.calendar-day:nth-child(7n) { /* Remove right border for Saturday */
    border-right: none;
}

/* Remove bottom border for the last row */
.calendar-grid > *:nth-last-child(-n + 7) {
    border-bottom: none;
}


.date {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
    margin-bottom: 5px; /* Space between date and indicators */
}

.indicator-p {
    font-size:14px;
        color: #515151; /* Blue for P */
    margin-top: auto; /* Push to bottom */
    align-self: flex-end; /* Align to the right */
    padding-right: 5px;
	text-align: center;
    width: 100%;
	font-weight: 500;
}

.indicator-o {
    font-size: 14px;
        color: #515151;
    align-items: center;
    padding-right: 5px;
    text-align: center;
    width: 100%;
    margin-top: 10px;	
    font-weight: 500;
}

.indicator-gl {
    font-size: 0.8em;
    color: #aaa; /* Lighter grey for GL */
    margin-top: auto;
    align-self: flex-end;
    padding-right: 5px;
}

/* Specific day styles */
.prev-month,
.next-month {
    background-color: #f8f8f8;
    color: #bbb; /* Lighter color for dates not in current month */
}
.prev-month .date,
.next-month .date {
    color: #bbb;
}

.available {
    background-color: #e6ffe6; /* Light green */
}

.booked {
    background: rgb(252, 229, 192); /* Light orange/peach */
}

.weekend {
    background-color: #f8f8f8; /* Lighter background for weekends */
}

.weekend .date {
    color: #666;
}

.current-day {
    border: 2px solid #007bff; /* Blue border for the current day */
    background-color: #e6f2ff; /* Light blue background for current day */
    box-sizing: border-box; /* Ensure border is included in dimensions */
}

/* The selected "start" days (14 and 21) */
.current-month-selected-start {
    background-color: #e6ffe6; /* Match available light green */
    position: relative;
    /* Optional: add a subtle indicator if needed to show it's a "start" */
}

.icon-camera {
    position: absolute;
    top: 8px;
    right: 8px;
    /* width: 20px; */
    /* height: 16px; */
    /* background-color: #ccc;  */
    /* border-radius: 3px; */
    /* box-shadow: 0 0 0 1px #999 inset; */
}

.icon-camera::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    /* transform: translate(-50%, -50%); */
    /* width: 8px; */
    /* height: 8px; */
    /* background-color: #666; */
    /* border-radius: 50%; */
}

.icon-camera::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 2px;
    /* width: 4px; */
    /* height: 2px; */
    /* background-color: #eee; */
    /* border-radius: 1px; */
}


.text-5, .label-style {
    font-size: 12px;
    margin-top: 0;
    margin-bottom: 0;
}

.insights {
    display: flex;
    align-items: center;
    height: 100%;
}
.insights a {
    font-weight:600;
}

a.bt-grid {
    border-radius: 0;
}
a.bt-list {
    border-radius: 0;
	background:white !important;
}
a.bt-list i {
	color:blue;
}
.btn-icon.btn-sm {
    width: 1.75rem;
    height: 1.75rem;
    font-size: 12px;
}





.table-section.-side-status {
    /* display: block; */
}

.cell.border-none {
    border: none !important;
}

.container-side-status {
    
    border-radius: 8px;
    /* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); */
    width: 100%; /* Adjust width as needed */
    /* overflow: hidden; */
    position: relative; /* For the scrollbar styling */
     /* Subtle border around the whole container */
	 
}

/* Header Section */
.header-section-side-status {
    display: flex;
    align-items: center;
    padding: 15px 15px;
    background-color: #fdfdfd;
    border-bottom: 1px solid #e0e0e0;
	 border-radius: 8px 8px 0 0;
}

.date-box {
    background-color: #e6f2ff; /* Light blue background */
    border: 1px solid #9acafc; /* Slightly darker blue border */
    border-radius: 4px;
    padding: 8px 15px;
    text-align: center;
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    min-width: 60px; /* Ensure consistent width */
}

.date-box .date {
    font-size: 20px;
    color: #007bff; /* Blue color for the date */
    line-height: 1;
}

.date-box .day {
    font-size: 0.9em;
    color: #666;
    margin-top: 2px;
}

 

.shift-info .shift-name {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
    margin-bottom: 3px;
}

.shift-info .shift-time {
    font-size: 0.9em;
    color: #666;
}

.attendance-scheme {
    text-align: right;
}

.attendance-scheme .scheme-name {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
    margin-bottom: 3px;
}

.attendance-scheme .scheme-type {
    font-size: 0.9em;
    color: #666;
}

/* Processed On */
.processed-on {
    background-color: #f8f8f8;
    padding: 10px 20px;
    font-size: 0.85em;
    color: #777;
    border: 1px solid #e0e0e0;
    border-top: none;
}

/* Table Sections */
.table-section.-side-status {
    margin-bottom: 20px;
    border: 1px solid #e0e0e0;
	    border-top: none;
     border-radius: 0px 0px 4px 4px;
    overflow: hidden;
    margin: 0px 0px 15px;
	    overflow-x: scroll;
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); /* Subtle shadow for tables */
}

.section-title-side-status {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
    padding: 7px 20px;
    margin-bottom: 10px;
    background: white;
    /* padding-bottom: 5px; */
    margin-bottom: 0;
	    border: 1px solid #e0e0e0;
	 border-radius: 4px 4px 0 0;
}

.table-header-side-status {
    /* display: flex; */
    background-color: #f0f8ff; /* Light blue header for tables */
    font-weight: bold;
    color: #333;
	
    border-bottom: 1px solid #cce0ff; /* Darker blue border for header */
}

.table-row {
    /* display: flex; */
    background-color: #fff;
    border-bottom: 1px solid #eee;
}

.table-row:last-child {
    border-bottom: none; /* No border for the last row */
}

.table-header-side-status .cell,
.table-row .cell {
    padding: 12px 10px;
        text-align: left;
    flex: 1; /* Distribute space evenly */
     /* Allow cells to shrink */
    white-space: nowrap; /* Prevent text wrapping for headers */
    
	font-size: 13px;
    font-weight: 400;
    border-right: 1px solid #eee; /* Vertical dividers */
}

.table-header-side-status .cell:last-child,
.table-row .cell:last-child {
    border-right: none;
}

/* Specific column widths for the first table */
.table-section.-side-status:nth-of-type(2) .table-header-side-status .cell,
.table-section.-side-status:nth-of-type(2) .table-row .cell {
    flex: 1; /* Default flex for all */
}

/* Adjust column widths for "Status Details" table */
.status-col {
    flex: 0.3 !important; /* Smaller column for Status */
}

.remarks-col {
    flex: 0.7 !important; /* Larger column for Remarks */
    text-align: left !important;
}

/* Adjust column widths for "Session Details" table */
.session-col {
    flex: 0.25 !important;
}

.session-timing-col {
    flex: 0.35 !important;
}

.first-in-col,
.last-out-col {
    flex: 0.2 !important;
}


/* Scrollbar styling (if content overflows) */
.container-side-status::-webkit-scrollbar {
    width: 8px;
}

.container-side-status::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.container-side-status::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.container-side-status::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Optional: Windows Activation Overlay (if you want to simulate it, though it's likely unwanted) */
/*
.windows-activation-overlay {
    position: fixed;
    bottom: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.95);
    border: 1px solid #ccc;
    padding: 10px;
    font-size: 13px;
    color: #333;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    z-index: 1000;
}

.windows-activation-overlay span {
    display: block;
    font-size: 11px;
    color: #666;
    margin-top: 5px;
}
*/




td.cell.border-none span {
    color: grey;
    font-size: 11px;
}



.legends-container {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    /* Adjust width as needed to match your layout */
    overflow: hidden;
    border: 1px solid #ddd;
}

.legends-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background-color: #fdfdfd;
    border-bottom: 1px solid #e0e0e0;
}

.legends-title {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
}

.toggle-icon {
    font-size: 0.8em;
    color: #007bff;
    background-color: #e6f2ff;
    border: 1px solid #9acafc;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-weight: bold;
}

.legends-content {
    padding: 15px 20px !important;
}

.legend-grid {
    display: grid;
    /* 5 columns, each min 100px and then takes equal space */
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 15px 10px; /* Row gap, Column gap */
        margin-bottom: 12px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 8px; /* Space between code/icon and text */
	justify-content: center;
}

/* Common styling for the code/color box */
.legend-code,
.legend-color-box {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 28px; /* Fixed width to make them consistent squares/rectangles */
    height: 22px; /* Fixed height */
    border-radius: 3px;
        font-size: 11.5px;
    font-weight: 500;
    box-sizing: border-box; /* Include padding and border in element's total width and height */
    padding: 0 4px; /* Slight horizontal padding */
}

.legend-color-box {
    border: 1px solid transparent; /* Placeholder border to align with legend-code */
}

/* Specific background and text colors for legend codes */
.legend-p { background-color: #e6ffe6; color: #339933; border: 1px solid #99cc99; } /* Light green, dark green */
.legend-a { background-color: #ffe6e6; color: #cc3333; border: 1px solid #ff9999; } /* Light red, dark red */
.legend-o { background-color: #f0f0f0; color: #666666; border: 1px solid #cccccc; } /* Light grey, dark grey */
.legend-r { background-color: #f0f0f0; color: #666666; border: 1px solid #cccccc; } /* Light grey, dark grey */
.legend-l { background-color: #f5e6ff; color: #9933cc; border: 1px solid #cc99e6; } /* Light purple, dark purple */
.legend-od { background-color: #fff2e6; color: #e69900; border: 1px solid #ffcc99; } /* Light orange, dark orange */
.legend-h { background-color: #e6f2ff; color: #007bff; border: 1px solid #9acafc; } /* Light blue, dark blue */

.legend-alert-deduction { background-color: #ffdab9; border: 1px solid #ffb366; } /* Peach/Orange */
.legend-deduction { background-color: #ffcce6; border: 1px solid #ff99cc; } /* Light pink */
.legend-status-unknown { background-color: #f8f8f8; color: #888888; border: 1px solid #e0e0e0; } /* Very light grey, grey */


.legend-text {
    font-size: 0.9em;
    color: #555;
    /* white-space: nowrap;  */
	/* Prevent text from wrapping */
}

/* Icon styling */
.legend-icon {
    font-size: 1.1em;
    color: #666; /* Default icon color */
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 28px;
    height: 22px;
    box-sizing: border-box;
    position: relative; /* For pseudo-elements */
}

/* Specific icon adjustments */
.icon-overtime, .icon-override, .icon-rest-day, .icon-holiday-type {
    /* Use direct unicode characters in HTML for these, simple styling */
}

/* Custom CSS icons */
.icon-ignored {
    color: transparent; /* Hide the character if any */
}
.icon-ignored::before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-top: 16px solid transparent;
    /* border-bottom: 7px solid transparent; */
    border-left: 16px solid #555;
    /* transform: rotate(-30deg); */
    left: 10px;
    top: 3px;
}

.icon-grace {
    color: transparent;
}
.icon-grace::before {
	content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-top: 16px solid transparent;
    /* border-bottom: 7px solid transparent; */
    border-left: 16px solid #007bff;
    /* transform: rotate(-30deg); */
    left: 10px;
    top: 3px;
}

.icon-off-day { /* Simple TV icon */
    color: transparent;
    border: 1.5px solid #666;
    width: 20px;
    height: 14px;
    border-radius: 2px;
    position: relative;
}
.icon-off-day::before {
    content: '';
    position: absolute;
    width: 2px;
    height: 2px;
    background-color: #666;
    border-radius: 50%;
    bottom: 2px;
    left: 3px;
}
.icon-off-day::after {
    content: '';
    position: absolute;
    width: 4px;
    height: 1.5px;
    background-color: #666;
    bottom: -1.5px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 1px;
}


.icon-half-day { /* Half-circle icon */
    color: transparent;
    width: 16px;
    height: 16px;
    border: 1.5px solid #666;
    border-radius: 50%;
    position: relative;
    overflow: hidden;
}
.icon-half-day::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background-color: #666;
}

.icon-plant-shutdown { /* X or cross icon */
    color: transparent;
    width: 18px;
    height: 18px;
    position: relative;
}
.icon-plant-shutdown::before,
.icon-plant-shutdown::after {
    content: '';
    position: absolute;
    background-color: #666;
    height: 2px;
    border-radius: 1px;
}
.icon-plant-shutdown::before {
    width: 100%;
    top: 50%;
    left: 0;
    transform: translateY(-50%) rotate(45deg);
}
.icon-plant-shutdown::after {
    width: 100%;
    top: 50%;
    left: 0;
    transform: translateY(-50%) rotate(-45deg);
}


/* Subheader for Day Type */
.legends-subheader {
    font-size: 1em;
    font-weight: bold;
    color: #333;
    padding: 10px 0;
    margin-top: 15px;
    margin-bottom: 8px;
    border-top: 1px solid #e0e0e0; /* Separator line */
}



.leave-accordion .legends-header.accordion-header .arrow {
    height: 22px;
    width: 22px;
}
.leave-accordion .legends-header.accordion-header .arrow i {
    font-size:12px;
}

.leave-accordion .section-title-side-status.accordion-header .arrow {
    height: 22px;
    width: 22px;
}
.leave-accordion .section-title-side-status.accordion-header .arrow i {
    font-size:12px;
}

span.legend-icon.icon-overtime {
    min-width: fit-content;
}
span.legend-icon.icon-override {
    min-width: fit-content;
}

span.legend-icon.iconrest-day {
    min-width: fit-content;
}
span.legend-icon.iconoff-day {
    min-width: fit-content;
}
span.legend-icon.iconholiday-type {
    min-width: fit-content;
}
span.legend-icon.iconhalf-day {
    min-width: fit-content;
}
span.legend-icon.iconplant-shutdown {
    min-width: fit-content;
}
.legends-content.accordion-body span.legend-icon i {
    font-size: 14px;
}



.gt-alert {
    min-height: 30px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 8px 12px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
	    width: fit-content;
    justify-content: center;
}


.gt-alert-icon {
    display: inline-block;
    
    margin-right: 6px;
    font-size: 16px;
    color: #f66;
}
.avg-wrk {
    text-align: center;
}

.avg-wrk span {
    color: grey;
    font-size: 11px;
}

.avg-wrk span b {
    color: green;
	font-weight: 500;
}
.accordion.border-none {
    border: none;
}

.emp-bubble span {
    line-height: 16px;
}


.stat-item.review a span {
    font-size: 15px;
    font-weight: 500;
}

.leave-accordion .accordion-header > .col.manager {
    font-size: 14px;
    font-weight: 600;
    color: #212121;
}
.leave-accordion .accordion-header > .col.manager img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
}

.leave-accordion .accordion-header > .col.manager {
    display: flex;
    align-items: center;
    gap: 8px;
}
.leave-review span.fullday {
    display: block;
    font-size: 10px;
    color: #616161;
}

.leave-review .applied {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.leave-review .applied  a {
    float: unset; 
}


.leave-review .applied  button.btn.btn-outline-light.border.me-2 {
    border-color: #304fdc !important;
    color: #304fdc !important;
	margin-left:8px;
}


.leave-review .applied .btn {
    padding: 5px 28px;
}

.select-search-employe {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-check-input.review {
    width: 18px;
    height: 18px;
}

.form-check-label.review{
	margin-top: 2px;
}
.leave-review .es-icon-search {
    padding-top: 32px;
    background-image: url(../img/search-icon.svg);
    background-repeat: no-repeat;
    background-position: right;
    height: 14px;
    width: 14px;
    padding-left: 32px;
	position: absolute;
    right: 14px;
    top: 7px;
}

textarea.form-control.leave-review {
    height: auto;
    height: 48px;
}

.left-panel.down {
    margin-top: 30px;
    background: white;
    padding: 30px 25px;
    border-radius: 8px;
    border: 1px solid #ddd;
	    width: 700px;
}
.stat-item.detail {
    width: fit-content;
}
.leave-review-table tr td span{
	 font-size: 12px;
    color: grey;
}
.applied.footer-btn {
    background: white;
    padding: 30px;
    position: sticky;
    width: 100%;
    bottom: 0;
    right: 0;
	display: flex;
	align-items:center;
    justify-content: right;
    gap: 15px;
}

.search-att-info .accordion.leave-review {
    background: unset;
    box-shadow: unset;
    border: none;
    width: fit-content;
}

.search-att-info .accordion-header {
    background: white;
    border-radius: 30px;
    padding: 10px !important;
}



button#sidefilterBtn i {
    font-size: 16px;
}









.summary {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      background-color: #fff5f5;
      color: #e53935;
      padding: 0.75rem 1rem;
      border-radius: 6px;
      width: max-content;
      font-weight: 500;
      margin-bottom: 1rem;
    }


:root{
        /* Palette tuned to the screenshot */
        --app-bg: #f5f7fb;
        --card-bg: #ffffff;
        --text-strong: #1f2937;
        --text: #344054;
        --muted: #98a2b3;
        --border: #e6e7eb;
        --brand: #21b3c2;        /* teal accent */
        --brand-600: #189aa7;
        --kudos-bg: #ffeef4;     /* pastel pink tile */
        --kudos-bd: #ffa0c2;
        --polls-bg: #e9fbf7;     /* pastel teal tile */
        --polls-bd: #9ce3d1;
        --radius-card: 6px;
        --shadow-1: 0 1px 2px rgba(16,24,40,.08), 0 6px 12px rgba(16,24,40,.05);
      }
  
      /* Layout */
      .app-engage{
        display:flex;
        min-height:100vh;
        gap:0;
        overflow:hidden;
      }
      
      .avatar-initials{
        width:40px;height:40px;border-radius:50%;
        background:#e6f7f9;color:#0b7285;
        display:grid;place-items:center;
        font-weight:600;
      }
      .menu .nav-link{
        color:#475467;
        border-radius: 8px;
        padding:.5rem .625rem;
        display:flex; align-items:center; gap:.5rem;
      }
      .menu .nav-link:hover{
        background: #f3f4f6;
        color:#1f2937;
      }
      .menu .nav-link.active{
        background:#eefafb;
        color:#0b7285;
        font-weight:600;
        border:1px solid #d7f1f4;
      }
      .menu .bi{
        width:20px; text-align:center; color:#98a2b3;
      }

      .main-engage{
        flex:1;
        padding: 0px;
        
      }

      /* Cards */
      .card-lite{
        background: var(--card-bg);
        border:1px solid var(--border);
        border-radius: var(--radius-card);
        /* box-shadow: var(--shadow-1); */
      }
 
      /* Header welcome card */
      .welcome-card .initial{
        width:56px;height:56px;border-radius:50%;
            background: #3d59e9;
    color: #ffffff;display:grid;place-items:center;
        font-weight:700;
      }
      .action-tile{
        border:1px solid var(--border);
        border-radius: 10px;
        padding: 14px 16px;
        display:flex; align-items:center; gap:10px;
        font-weight:600;
        cursor:pointer;
        user-select:none;
        transition: .15s ease;
      }
      .action-tile .bi{ font-size:20px; }
      .action-kudos{ background: var(--kudos-bg); border-color: var(--kudos-bd); color:#c2255c; }
      .action-kudos:hover{ filter: brightness(.98); }
      .action-polls{ background: var(--polls-bg); border-color: var(--polls-bd); color:#0b7285; }
      .action-polls:hover{ filter: brightness(.98); }

      /* Section header with accent bar */
      .section-title{
        position:relative; padding-left:16px;
      }
      .section-title:before{
        content:""; position:absolute; left:0; top:.25rem; bottom:.25rem; width:3px; background: var(--brand);
        border-radius: 2px;
      }

      /* Filters panel */
      .filters .form-check{
		}
	  .filters .form-check label {
      cursor: pointer;
       width:100%;
        }
      .filters .form-check:hover{
        background: #f7f7f7; 
      }
	  .filters .form-check.active{
      }
      .filters .search-wrap{
        position:relative;
      }
      .filters .search-wrap .bi{
        position:absolute; right:12px; top:50%; transform:translateY(-50%); color:#98a2b3;
      }
      .filters .accordion-button{
        background:#fff !important; border-radius:10px !important;font-size: 14px;
      }
	  .filters .accordion-button:after {
          background-size: 16px !important;
	  }

      /* Feed */
      .feed-card .logo{
        width:56px; height:56px; border-radius:8px; object-fit:cover;
        border:1px solid var(--border);
      }
      .feed-card .meta{
        color: var(--muted);
        font-size: .875rem;
      }
      .feed-card .divider{
        height:1px; background: var(--border);
      }
      .feed-card .reaction{
        color:#475467; font-weight:500; cursor:pointer;
      }
      .feed-empty{
        color:#98a2b3;
        text-align:center; padding:40px 0;
      }
      /* Footer small row */
      .app-footer{
        color:#98a2b3; font-size:.875rem;
      }
      /* Utilities */
      .small-muted{ color: var(--muted); }
      .rounded-10{ border-radius:10px !important; }
      .rounded-12{ border-radius:12px !important; }

button.accordion-button.px-0:focus:not(:focus-visible) {
    box-shadow: none;
}
 
 

.es-search .es-employee-photo {
    background-image: url(../img/default-emp-icon.svg);
}

.logo-engage .logo1 {
    width: 130px;
    margin-bottom: 5px;
}

















/*-----------------
	43. Responsive
-----------------------*/


@media only screen and (min-width: 991px) {
	#toggle_btn {
		color: #fff;
		float: left;
		font-size: 20px;
		line-height: 70px;
		padding: 0 10px;
		filter: brightness(0) saturate(100%) invert(47%) sepia(93%) saturate(6754%) hue-rotate(229deg) brightness(98%) contrast(86%);
	}
	.user-active .call-imgs {
		width: 100%;
	}
	.join-video.user-active {
		height: auto;
	}
	.single-user .call-imgs {
		width: 100%;
	}
	.mini-sidebar .header-left .logo span {
		display: none;
	}
	.mini-sidebar .header .header-left {
		padding: 0 5px;
		width: 60px;
	}
	.mini-sidebar .sidebar {
		width: 60px;
	}
	.mini-sidebar.expand-menu .sidebar {
		width: 230px;
	}
	.mini-sidebar .menu-title {
		visibility: hidden;
		white-space: nowrap;
	}
	.mini-sidebar.expand-menu .menu-title {
		visibility: visible;
	}
	.modal-open .mini-sidebar .sidebar {
		z-index: 1051;
	}
	.mini-sidebar .sidebar .sidebar-menu ul > li > a span {
		display: none;
		transition: all 0.2s ease-in-out;
		opacity: 0;
	}
	.mini-sidebar.expand-menu .sidebar .sidebar-menu ul > li > a span {
		display: inline;
		opacity: 1;
	}
	.mini-sidebar .page-wrapper {
		margin-left: 60px;
	}
	.mini-sidebar .sidebar .sidebar-menu ul > li > a span.menu-side {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		opacity: 1;
	}
	.mini-sidebar .sidebar-menu > ul > li > a {
		padding: 12px 10px;
	}
	.mini-sidebar.expand-menu .sidebar-menu > ul > li > a {
		padding: 12px 20px;
	}
	.mini-sidebar .sidebar-menu .logout-btn a {
		padding: 12px 10px;
	}
	.mini-sidebar.expand-menu .sidebar-menu .logout-btn a { 
		padding: 12px 20px;
	}
}
@media only screen and (min-width: 768px) {
	
	/* .main-box1 { */
        /* flex-direction: column; */
      /* } */
      /* .left-panel1 { */
        /* border-right: none; */
        /* padding-right: 0; */
        /* border-bottom: 1px solid #eee; */
        /* margin-bottom: 20px; */
      /* } */
	
	.modal-md {
		width: 500px;
	}
	.nav-tabs.nav-justified.nav-tabs-top {
		border-bottom: 1px solid #ddd;
	}
	.nav-tabs.nav-justified.nav-tabs-top > li > a,
	.nav-tabs.nav-justified.nav-tabs-top > li > a:hover,
	.nav-tabs.nav-justified.nav-tabs-top > li > a:focus {
		border-width: 2px 0 0 0;
	}
	.nav-tabs.nav-tabs-top > li {
		margin-bottom: 0;
	}
	.nav-tabs.nav-tabs-top > li > a,
	.nav-tabs.nav-tabs-top > li > a:hover,
	.nav-tabs.nav-tabs-top > li > a:focus {
		border-width: 2px 0 0 0;
	}
	.nav-tabs.nav-tabs-top > li + li > a {
		margin-left: 1px;
	}
	.nav-tabs.nav-tabs-top > li > a.active,
	.nav-tabs.nav-tabs-top > li > a.active:hover,
	.nav-tabs.nav-tabs-top > li > a.active:focus {
		border-top-color: #3a57e8;
	}
	.nav-tabs.nav-tabs-bottom > li {
		margin-bottom: -1px;
	}
	.nav-tabs.nav-tabs-bottom > li > a.active,
	.nav-tabs.nav-tabs-bottom > li > a.active:hover,
	.nav-tabs.nav-tabs-bottom > li > a.active:focus {
		border-bottom-width: 2px;
		border-color: transparent;
		border-bottom-color: #009efb;
		background-color: transparent;
		transition: none 0s ease 0s;
		-moz-transition: none 0s ease 0s;
		-o-transition: none 0s ease 0s;
		-ms-transition: none 0s ease 0s;
		-webkit-transition: none 0s ease 0s;
	}
	.nav-tabs.nav-tabs-bottom > li {
		margin-bottom: -1px;
	}
	.nav-tabs.nav-tabs-bottom > li > a.active,
	.nav-tabs.nav-tabs-bottom > li > a.active:hover,
	.nav-tabs.nav-tabs-bottom > li > a.active:focus {
		border-bottom-width: 2px;
		border-color: transparent;
		border-bottom-color: #3a57e8;
		background-color: transparent;
		transition: none 0s ease 0s;
		-moz-transition: none 0s ease 0s;
		-o-transition: none 0s ease 0s;
		-ms-transition: none 0s ease 0s;
		-webkit-transition: none 0s ease 0s;
	}
	.nav-tabs.nav-tabs-solid {
		background-color: #fafafa;
		border: 0;
	}
	.nav-tabs.nav-tabs-solid > li {
		margin-bottom: 0;
	}
	.nav-tabs.nav-tabs-solid > li > a {
		border-color: transparent;
	}
	.nav-tabs.nav-tabs-solid > li > a:hover,
	.nav-tabs.nav-tabs-solid > li > a:focus {
		background-color: #f5f5f5;
	}
	.nav-tabs.nav-tabs-solid > .open:not(.active) > a {
		background-color: #f5f5f5;
		border-color: transparent;
	}
	.nav-tabs-justified.nav-tabs-top {
		border-bottom: 1px solid #ddd;
	}
	.nav-tabs-justified.nav-tabs-top > li > a,
	.nav-tabs-justified.nav-tabs-top > li > a:hover,
	.nav-tabs-justified.nav-tabs-top > li > a:focus {
		border-width: 2px 0 0 0;
	}
}
@media only screen and (max-width: 1199.98px) {
	.profile-user-img img {
		width: 90px;
	}
	.profile-edit-icon img {
		width: 25px;
	}
	.follow-btn-group .btn-info {
		min-width: auto;
	}
	.profile-table.custom-table thead tr th, .profile-table.custom-table tbody tr td {
		padding: 10px;
	}
	.invoices-view {
		width: 90%;
		float: right;
	}
	.invoices-tabs ul li {
		margin-right: 10px;
	}
	.invoices-tabs ul li a {
		font-size: 14px;
	}
	.login-wrap-bg {
		padding: 15px 50px 15px;
	}
	.login-wrapper .loginbox .login-right {
		padding: 30px;
	}
	.morning-user {
		padding: 30px 0px 30px 30px;
	}
	.morning-user h2 {
		font-size: 28px;
		font-weight: 600;
	}
	.border-right-bg:before {
		display: none;
	}
	.border-right-bg {
		margin-bottom: 10px;
	}
	.wallet-widget .circle-bar > div canvas {
		width: 140px !important;
		height: 140px !important;
	}
	.meeting .join-video {
		height: 320px;
	}
	.join-video.single-user {
		height: auto;
	}
}
@media only screen and (max-width: 991.98px) {
	.profile-rightbar {
		display: inline-block !important;
	}
	div.dataTables_wrapper div.dataTables_info {
		padding-bottom: 0.85em;
	}
	.chat-profile-view {
		display: none;
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
		right: 0;
		transform: translateX(0px);
		z-index: 1041;
		width: 300px;
		position: fixed;
		margin-right: -300px;
		display: table-cell;
		top: 0;
		padding-bottom: 60px;
		margin-top: 50px;
	}
	.message-view.chat-view {
		width: 100%;
	}
	.slide-nav .page-wrapper {
		left: 225px;
		margin-left: 0;
	}
	.chat-main-row {
		left: 0;
	}
	.header .header-left {
		position: absolute;
		width: 100%;
	}
	.mobile_btn {
		display: block;
	}
	.page-title-box {
		display: none;
	}
	.sidebar {
		margin-left: -225px;
		width: 225px;
	}
	.page-wrapper {
		margin-left: 0;
		padding-left: 0;
		padding-right: 0;
	}
	.slide-nav .sidebar {
		margin-left: 0;
	}
	a.mobile_btn {
		color: #fff;
		font-size: 24px;
		height: 70px;
		left: 0;
		line-height: 70px;
		padding: 0 20px;
		position: absolute;
		top: 0;
		width: 60px;
		z-index: 10;
	}
	.slide-nav .page-wrapper {
		left: 225px;
		margin-left: 0;
	}
	.invoices-view {
		width: 100%;
		float: none;
	}
	#toggle_btn {
		display: none;
	}
	.sidebar {
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
	}
	.page-wrapper {
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
	}
	/* invoice */
	.app-listing li {
		width: 49%;
		display: inline-block;
	}
	.app-listing {
		display: inline-block;
	}
	.multipleSelection #checkBoxes, 
	.SortBy #checkBox {
		width: 100%;
	}
	.inovices-month-info {
		padding-top: 20px;
	}
	.invoice-inner-date {
		padding:  10px;
	}
	.invoice-inner-date.invoice-inner-datepic {
		padding: 10px 0;
	}
	.field-box .btn {
		min-width: auto;
		border-radius: 4px;
		padding: 10px;
	}
	.invoice-inner-head {
		padding: 10px;
		border-bottom: 1px solid #E5E5E5;
	}
	.invoice-circle-img {
		display: none;
	}
	.invoice-item-bg .invoice-info {
		border-right: 1px solid #fff;
		padding: 10px 30px;
		margin-top: 20px;
	}
	.invoice-item-bg .invoice-info {
		border-right: 1px solid #fff;
		padding: 10px 30px;
		margin-top: 0;
	}
	.invoice-info {
		margin-bottom: 0;
	}
	.payment-details {
		width: auto;
	}
	.invoices-preview .modal-dialog {
		max-width: 700px;
	}
	.invoice-item-one .invoice-info {
		text-align: left;
	}
	.invoice-head h2 {
		font-size: 16px;
	}
	.invoice-head p {
		font-size: 14px;
	}
	.invoice-payment-box .payment-details {
		margin-bottom: 20px;
	}
	.invoice-faq .faq-tab {
		padding-bottom: 10px;
	}
	.service-upload {
		padding: 30px 0;
		width: auto;
	}
	.invoice-inner-date.invoice-inner-datepic {
		padding: 10px;
	}
	.bank-details-btn .btn {
		min-width: auto;
		padding: 10px;
	}
	.invoice-info-card .invoice-item-one .invoice-info {
		text-align: right;
	}
	.login-wrap {
		display: none;
	}
	.account-logo,
	.login-wrapper .loginbox .login-right h2,
	.login-wrapper .loginbox .login-right .forgotpass,
	.login-btn	{
		margin-bottom: 25px;
	}
	.login-wrapper .loginbox .login-right h2 {
		font-size: 20px;
	}
	.error-box h3 {
		font-size: 26px;
	}
	.mob-view {
		display: none;
	}
	.logo {
		justify-content: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
	}
	.morning-user {
		padding: 25px 0px 25px 25px;
	}
	.morning-user h2 {
		font-size: 26px;
	}
	.user-menu.nav li {
		margin-right: 6px;
	}
	.profile-user-img img {
		width: 60px;
	}
	.profile-edit-icon img {
		width: 15px;
	}
	.names-profiles h4 {
		font-size: 14px;
	}
	.names-profiles h5 {
		font-size: 12px;
	}
	.doctor-follows h5 {
		font-size: 12px;
	}
	.doctor-follows h4 {
		font-size: 16px;
	}
	.follow-btn-group .btn-info {
		min-width: 90px;
		font-size: 12px;
		padding: 4px 15px;
	}
	.meeting .join-video {
		height: 320px;
	}
	.join-video.single-user {
		height: auto;
	}
	.feather-chevron-right:before {
		top: 2px;
		position: relative;
	}
}
@media only screen and (max-width: 767.98px) {
	.table .invoice-link{
		font-size: 14px;
	}
	div.dataTables_wrapper div.dataTables_paginate ul.pagination {
		padding-bottom: 15px;
		justify-content:center;
	}
	.profile-info-left {
		border-right: none;
		border-bottom: 2px dashed #ccc;
		margin-bottom: 20px;
		padding-bottom: 20px;
	}
	.navbar-nav .open .dropdown-menu {
		float: left;
		position: absolute;
	}
	.notifications {
		right: -48px;
	}
	.notifications:before,
	.notifications:after {
		right: 60px;
	}
	.modal-body.card-box {
		background-color: #fff;
		border: none;
		border-radius: inherit;
		box-shadow: unset;
		margin-bottom: 0;
		padding: 15px;
	}
	.roles-menu {
		margin-bottom: 20px;
	}
	.left-action {
		text-align: center;
		margin-bottom: 15px;
	}
	.right-action {
		text-align: center;
	}
	.top-action-left .float-left {
		float: none !important;
	}
	.top-action-left .btn-group {
		margin-bottom: 15px;
	}
	.top-action-right {
		text-align: center;
	}
	.top-action-right a.btn.btn-white {
		margin-bottom: 15px;
	}
	.mail-sent-time {
		float: left;
		margin-top: 10px;
		width: 100%;
	}
	.nav-tabs.nav-justified {
		border-bottom: 1px solid #ddd;
	}
	.nav-tabs.nav-justified > li > a.active,
	.nav-tabs.nav-justified > li > a.active:hover,
	.nav-tabs.nav-justified > li > a.active:focus {
		border-color: transparent transparent transparent #009efb;
		border-left-width: 2px;
	}
	.nav-tabs {
		border-bottom: 0;
		position: relative;
		background-color: #fff;
		padding: 5px 0;
		border: 1px solid #ddd;
		border-radius: 3px;
	}
	.nav-tabs .nav-item {
		margin-bottom: 0;
	}
	.nav-tabs > li > a {
		border-width: 2px;
		border-left-color: transparent;
	}
	.nav-tabs .nav-link {
		border-width: 2px;
	}
	.nav-tabs > li > a:hover,
	.nav-tabs > li > a:focus {
		background-color: #fafafa;
	}
	.nav-tabs .nav-item.show .nav-link,
	.nav-tabs .nav-link.active,
	.nav-tabs > li > a.active,
	.nav-tabs > li > a.active:hover,
	.nav-tabs > li > a.active:focus {
		background-color: #f5f5f5;
		border-color: transparent transparent transparent #009efb;
		border-left-width: 2px;
	}
	.nav-tabs > li.open:not(.active) > a,
	.nav-tabs > li.open:not(.active) > a:hover,
	.nav-tabs > li.open:not(.active) > a:focus {
		background-color: #fafafa;
	}
	.nav-tabs.nav-tabs-solid {
		padding: 5px;
	}
	.nav-tabs.nav-tabs-solid.nav-tabs-rounded {
		border-radius: 5px;
	}
	.nav-tabs.nav-tabs-solid > li > a {
		border-left-width: 0!important;
	}
	.nav-tabs-justified {
		border-bottom: 1px solid #ddd;
	}
	.nav-tabs-justified > li > a.active,
	.nav-tabs-justified > li > a.active:hover,
	.nav-tabs-justified > li > a.active:focus {
		border-width: 0 0 0 2px;
		border-left-color: #009efb;
	}
	h1 {
		font-size: 2em;
	}
	h2 {
		font-size: 1.5em;
	}
	h3 {
		font-size: 1.17em;
	}
	h4 {
		font-size: 1.12em;
	}
	h5 {
		font-size: .83em;
	}
	h6 {
		font-size: .75em;
	}
	.page-title {
		font-size: 1.2em;
		padding-top: 10px;
	}
	.card-title {
		font-size: 1.12em;
	}
	.blog-view .blog-title {
		font-size: 18px;
	}
	.widget h3 {
		font-size: 18px;
	}
	.my-video ul li {
		width: 80px;
	}
	.voice-call-avatar .call-avatar {
		width: 120px;
		height: 120px;
	}
	.table-responsive {
		display: block;
		width: 100%;
		overflow-x: auto;
		-ms-overflow-style: -ms-autohiding-scrollbar;
	}
	.header .has-arrow .dropdown-toggle > span:nth-child(2) {
		display: none;
	}
	.header .has-arrow .dropdown-toggle:after {
		display: none;
	}
	.btn-white {
		margin: 0px;
	}
	.login-wrapper .loginbox .login-right .forgotpass,
	.next-sign 	{
		display: block;
	}
	.remember-me {
		margin-bottom: 10px;
	}
	.login-right .btn-primary {
		font-size: 14px;
		padding: 7px 15px;
	}
	.account-subtitle {
		margin-bottom: 15px;
	}
	.login-wrap-bg {
		padding: 15px 20px 15px;
	}
	.login-wrapper .loginbox .login-right {
		padding: 20px;
	}
	.error-box h3 {
		font-size: 18px;
	}
	.error-box p {
		font-size: 14px;
	}
	.error-box img {
		margin-bottom: 25px;
	}
	.sucess-mail h4 {
		font-size: 22px;
	}
	.mobile-user-menu > a {
		color: #3a57e8;
	}
	.morning-img img {
		position: relative;
		width: 100%;
	}
	 
	.morning-user {
		padding: 0;
	}
	.good-morning-blk {
		padding: 20px;
	}
	.morning-user h2 {
		font-size: 20px;
	}
	.morning-user p {
		font-size: 14px;
	}
	.page-header .breadcrumb {
		font-size: 14px;
	}
	.dash-content h4 {
		font-size: 14px;
		margin-bottom: 15px;
	}
	.dash-content h2 {
		font-size: 28px;
		margin-bottom: 15px;
	}
	.patient-visit {
		flex-wrap: wrap;
	}
	.chat-user-total {
		margin: 10px 0px;
	}
	.wallet-widget .circle-bar > div canvas {
		width: 100px !important;
		height: 100px !important;
	}
	.steps-history li,
	.doctor-date-list li {
		font-size: 12px;
	}
	.doctor-date-list li span {
		padding-left: 5px;
	}
	.border-right-bg:before {
		display: none;
	}
	.border-right-bg {
		margin-bottom: 10px;
	}
	.active-doctor {
		display: block;
	}
	.weight-blk {
		margin-bottom: 5px;
	}
	.treat-box {
		display: block;
	}
	.user-imgs-blk {
		margin-bottom: 10px;
	}
	.user-imgs-blk img {
		margin-right: 8px;
	}
	.profile-user-img img {
		width: 90px;
	}
	.profile-edit-icon img {
		width: 25px;
	}
	.doctor-follows h5 {
		font-size: 12px;
	}
	.doctor-follows h4 {
		font-size: 16px;
	}
	.follow-group {
		padding: 0px 15px;
	}
	.follow-btn-group .btn-info {
		font-size: 14px;
		padding: 6px 15px;
	}
	.follow-btn-group {
		margin: 15px 0px;
	}
	.names-profiles h4,
	.tab-content-set li a	{
		font-size: 16px;
	}
	.tab-content-set ul li a.active::after, 
	.tab-content-set ul li a:hover::after {
		display: none;
	}
	.tab-content-set li {
		margin-bottom: 15px;
	}
	.tab-content-set {
		padding: 0;
	}
	.detail-personal {
		margin-bottom: 15px;
	}
	.doctor-submit .btn-primary {
		min-width: 125px;
		font-size: 12px;
		border-radius: 12px;
		padding: 7px 15px;
		margin-bottom: 8px;
		margin-right: 0px !important;
	}
	.invoice-counts h4 {
		display: inline-block;
	}
	.activity-list::before {
		display: none;
	}
	.timeline-group-blk {
		display: block;
	}
	.comman-activitys {
		padding: 12px;
		margin-top: 5px;
	}
	.activity-sub-list li {
		margin-bottom: 10px;
	}
	.latest-posts-act .post-thumb {
		float: inherit;
		margin-bottom: 15px;
	}
	.latest-posts-act .post-info {
		margin-left: 0;
	}
	.blog-grp-blk {
		flex-wrap: wrap;
	}
	.blog-img-blk {
		margin-bottom: 5px;
	}
	.blog-grp-blk span {
		margin-left: auto;
	}
	.grid-blog .blog-title a {
		font-size: 15px;
	}
	.chat-search-group {
		display: block;
	}
	.chat-search-list ul {
		margin-top: 10px;
	}
	.chat-search-list ul li:first-child {
		margin-left: 0;
	}
	.inputgroups input[type="text"] {
		padding-right: 125px;
	}
	.settings-btn.upload-files-avator .upload {
		width: 120px;
		font-size: 12px;
	}
	.mailview-header, .send-user.send-user-name h4 {
		display: block;
	}
	.sender-info {
		margin-bottom: 10px;
	}
	.send-user.send-user-name h4 span {
		display: inline-block;
		margin: 0;
	}
	.mail-attach .msg-sub-list li {
		margin-bottom: 10px;
	}
	.forward-send .btn-primary {
		margin-bottom: 10px;
		width: 100%;
	}
	.chat-user-group.clinic-user {
		display: block !important;
	}
	.call-list-add {
		padding: 0;
	}
	.meeting .join-video {
		height: 116px;
	}
	.join-video.single-user {
		width: 100%;
	}
	.join-video.single-user {
		height: auto;
	}
	.meet-icons .meet-items .meet-item > a {
		width: 35px;
		height: 35px;
	}
	.end-call-chat .btn-primary {
		min-width: 90px;
		margin: 0px 5px;
		padding: 6px 13px;
		font-size: 14px;
	}
	.meet-icons .meet-items .meet-item, .action-items .action-item {
		margin-right: 5px;
	}
	.card {
		width: 100%;
	}
	.patient-structure h3 {
		font-size: 32px;
	}
}
@media only screen and (max-width: 575.98px) {
	.app-listing li {
		width: 100%;
	}
	.download-grp {
		margin-top: 10px;
	}
	.invoices-tabs ul li {
		margin-right: 0;
		display: block;
		margin-bottom: 14px;
	}
	.schedule-time{
		margin-bottom: 10px;
	}
	.invoices-tabs ul li a{
		padding-bottom: 0;
	}
	.invoices-settings-btn{
		justify-content: start;
	}
	.invoices-create-btn .btn {
		font-size: 14px;
		padding: 10px;
		min-width: auto;
	}
	.invoice-info-card .invoice-item-one .invoice-info {
		text-align: left;
	}
	.invoice-item .invoice-details {
		text-align: left;
		float: left;
	}
	.invoice-info.invoice-info2 {
		text-align: left;
	}
	.invoice-total-footer h4 {
		font-size: 14px;
	}
	.nav-tabs.menu-tabs .nav-link{
		padding: 10px;
	}
	ul.nav.nav-tabs.menu-tabs {
		padding: 10px;
	}
	.invoice-setting-btn .btn {
		min-width: auto;
		padding: 10px;
	}
	.contact-cat {
		padding-right: 70px;
	}
	.user-menu {
		display: none;
	}
	.mobile-user-menu {
		display: block;
	}
	.search-box {
		display: none;
	}
	.filter-row {
		margin-bottom: 15px;
	}
	.page-wrapper > .content {
		padding: 15px;
	}
	.profile-view .profile-basic {
		margin-left: 0;
	}
	.profile-img-wrap {
		position: relative;
		margin: 0 auto;
	}
	.profile-view .profile-img-wrap {
		margin: 0 auto 10px;
		height: 100px;
		width: 100px;
	}
	.profile-view .profile-img {
		height: 100px;
		width: 100px;
	}
	.profile-view .profile-img .avatar {
		font-size: 24px;
		height: 100px;
		line-height: 100px;
		margin: 0;
		width: 100px;
	}
	.profile-info-left {
		text-align: center;
	}
	.profile-basic {
		margin-left: 0;
		margin-top: 15px;
	}
	.page-title {
		font-size: 18px;
	}
	.fc-toolbar .fc-right {
		display: inline-block;
		float: none;
		margin: 10px auto 0;
		width: 200px;
		clear: both;
	}
	.fc-toolbar .fc-left {
		float: none;
		margin: 0 auto;
		width: 200px;
	}
	.upload-text {
		font-size: 18px;
	}
	.call-duration {
		display: block;
		margin-top: 0;
		margin-bottom: 10px;
		position: inherit;
	}
	.end-call {
		margin-top: 10px;
		position: inherit;
	}
	.chat-right .chat-content {
		max-width: 90%;
	}
	.chat-right .chat-body {
		padding-left: 0;
		padding-right: 0;
	}
	.chat-left .chat-content {
		max-width: 90%;
	}
	.chat-left .chat-body {
		padding-left: 0;
		padding-right: 0;
	}
	.chat-avatar .avatar {
		height: 20px;
		line-height: 20px;
		width: 20px;
	}
	.account-box {
		width: 100%;
		margin-bottom: 20px;
	}
	.content {
		padding: 0 50px;
	}
	.custom-menu.navbar-nav > li > a {
		margin-left: 10px;
	}
	.error-box h1 {
		font-size: 50px;
	}
	.submit-btn {
		min-width: 150px;
	}
	.ui-kit-wrapper button {
		margin-bottom: 5px;
	}
	.pagination > li > a,
	.pagination > li > span {
		padding: .5rem !important;
	}
	.invoice-item-box{
		float: left;
	}
	.wizard .nav-tabs li:after {
		display: none;
	}
}
@media only screen and (max-width: 479px) {
	.compose-btn button {
		padding: 0.365rem 0.5rem;
	}
	.doctor-search-blk .add-group{
		margin-top: 10px;
	}
	.doctor-search-blk .top-nav-search {
		margin-left: 0;
	}
	.attachments li {
		float: none;
		text-align: center;
		margin: 0 auto;
		margin-bottom: 10px;
	}
	.meeting .join-video {
		height: 100%;
	}
	.follow-btn-group .btn-info {
		min-width: auto;
	}
}


/* ============================
   SVG DONUT CHART
============================ */

.ps-donut-chart{
    width:170px;
    height:170px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.ps-donut-svg{
    width:170px;
    height:170px;
    transform:rotate(-90deg);
}

.ps-track{
    fill:none;
    stroke:#edf1fb;
    stroke-width:14;
}

.ps-arc{
    fill:none;
    stroke-width:14;
    stroke-linecap:round;
}

.ps-arc-purple{
    stroke:url(#psGradientPurple);
    stroke-dasharray:178 377;
    stroke-dashoffset:0;
}

.ps-arc-blue{
    stroke:url(#psGradientBlue);
    stroke-dasharray:92 377;
    stroke-dashoffset:-188;
}

.ps-arc-green{
    stroke:url(#psGradientGreen);
    stroke-dasharray:54 377;
    stroke-dashoffset:-290;
}

/* ============================
   CENTER TEXT
============================ */

.ps-donut-center{
    position:absolute;
    width:106px;
    height:106px;
    background:#ffffff;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    box-shadow:0 8px 20px rgba(96,111,161,.08);
}

.ps-donut-center span{
    font-size:15px;
    font-weight:500;
    color:#7d879c;
    line-height:1;
}

.ps-donut-center strong{
    margin-top:6px;
    font-size:22px;
    font-weight:700;
    color:#222b45;
    line-height:1;
}

/* ============================
   DIVIDER
============================ */

.ps-divider{
    width:100%;
    height:1px;
    background:#eef2f7;
    margin:22px 0 18px;
}

/* ============================
   FOOTER
============================ */

.ps-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.ps-paid-days{
    display:flex;
    align-items:center;
    gap:10px;
}

.ps-paid-days i{
    color:#6a5cff;
    font-size:16px;
}

.ps-paid-days span{
    font-size:14px;
    font-weight:500;
    color:#6b7485;
}

.ps-status{
    display:flex;
    align-items:center;
    gap:10px;
}

.ps-status-label{
    font-size:14px;
    color:#6b7485;
}

.ps-status-badge{
    background:#e8f9ef;
    color:#2db36b;
    border-radius:30px;
    padding:6px 16px;
    font-size:13px;
    font-weight:700;
    line-height:1;
}

/* ============================
   DOWNLOAD BUTTON
============================ */

.ps-download-btn{
    width:100%;
    height:54px;
    border:none;
    outline:none;
    border-radius:16px;
    background:#f4f2ff;
    color:#695cff;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    font-size:15px;
    font-weight:600;
    cursor:pointer;
    transition:.25s ease;
}

.ps-download-btn:hover{
    background:#ede8ff;
}

.ps-download-btn i{
    font-size:16px;
}

/* ============================
   HOVER CARD
============================ */

psx-card{
width:320px;
background:#fff;
border-radius:18px;
padding:18px;
box-shadow:
0 15px 45px rgba(35,55,80,.08),
0 2px 8px rgba(0,0,0,.05);
}

.psx-header{display: flex;justify-content: space-between;align-items: center;border-bottom: 1px solid #00000012;padding-bottom: 12px;margin-bottom: 15px;}

.psx-title{font-size: 15px;font-weight:700;color:#2f3445;}

.psx-month{
font-size:12px;
color:#7d8698;
}

.psx-top{display:flex;gap: 8px;align-items:center;}

.psx-chart-wrap{
width:130px;
height:130px;
position:relative;
}

.psx-center{
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
text-align:center;
pointer-events:none;
}

.psx-center h4{
font-size:16px;
font-weight:700;
color:#31384a;
}

.psx-center span{
font-size:13px;
color:#777;
}

.psx-info{flex:1;display:flex;flex-direction:column;gap: 8px;}

.psx-box{background:#fff;border:1px solid #edf0f6;border-radius:14px;padding:10px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 6px 18px rgba(0,0,0,.04);}

.psx-left{
display:flex;
gap:10px;
align-items:center;
}

.psx-icon{
width:28px;
height:28px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:15px;
font-weight:700;
}

.psx-purple{
background:#efe7ff;
color:#6d3eff;
}

.psx-red{
background:#ffecec;
color:#ff3d3d;
}

.psx-green{
background:#eaf9ef;
color:#17b44c;
}

.psx-label{
font-size:12px;
color:#777;
}

.psx-value{
font-size:15px;
font-weight:700;
margin-top:2px;
color:#20242d;
}

.psx-bottom{
margin-top:18px;
display:flex;
justify-content:space-between;
align-items:center;
}

.psx-days{
display:flex;
align-items:center;
gap:8px;
font-size:13px;
color:#000;
    font-weight: 600;
}

.psx-status{
text-align:right;
    display: flex;
    align-items: center;
    gap: 10px;
}

.psx-status small{
display:block;
color: #000;
    font-weight: 600;
margin-bottom:4px;
font-size:12px;
}

.psx-pill{
background:#dff7e7;
color:#28a745;
padding:5px 7px;
border-radius:20px;
font-size:10px;
font-weight:600;
}

.psx-download{
margin-top:18px;
height:46px;
background:linear-gradient(90deg,#eff9f1,#f7faf9);
border-radius:12px;
display:flex;
align-items:center;
padding:0 16px;
gap:10px;
font-weight:600;
color:#17a44a;
cursor:pointer;
transition:.3s;
}

.psx-download:hover{
transform:translateY(-2px);
}
.psx-card {
    background: #fff;
    padding: 24px;
    border-radius: 18px;
    box-shadow: 4px 1px 20px rgb(184 230 208 / 38%);
}
.slides-2.container h1 {
    color: #3b4452;
    font-weight: 600;
    font-size: 22px;
}

.qaPanelWrapX9{
    background:#fff;
    border-radius:18px;
    padding: 24px;
    box-shadow: 4px 1px 20px rgb(184 230 208 / 38%);
    margin-top: 16px;
}

.qaPanelTitleX9{
    font-size: 15px;
    font-weight: 700;
    color: #2f3445;
    border-bottom: 1px solid #00000012;
    padding-bottom: 12px;
    margin-bottom: 16px;
}

.qaGridBoxX9{display:grid;grid-template-columns: repeat(3,1fr);gap: 9px;}

.qaCardItemX9{background:#f9fbff;border:1px solid #edf1f7;border-radius:14px;padding: 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer;transition:.3s;}

.qaCardItemX9:hover{

    transform:translateY(-4px);
    background:#fff;
    box-shadow:0 10px 20px rgba(20,35,90,.08);
}

.qaCardItemX9 i{

    font-size:28px;
}

.qaCardItemX9 span{margin-top:12px;font-size: 10px;font-weight:600;color:#374151;line-height:18px;}

/* Icon Colors */

.qaIconGreenX9{
    color: #008000;
}

.qaIconOrangeX9{
    color:#f97316;
}

.qaIconBlueX9{
    color:#2563eb;
}

.qaIconPurpleX9{
    color:#4f46e5;
}

/* Responsive */

@media(max-width:600px){

.qaPanelWrapX9{
    width:100%;
}

.qaGridBoxX9{
    grid-template-columns:repeat(2,1fr);
}

}
.card.leave-card {
    background: #fff;
    border-radius: 18px;
    padding: 22px;
    box-shadow: 4px 1px 20px rgb(230 211 245);
}
.leave-text {
  font-size: 15px;
    font-weight: 700;
    color: #2f3445; 
}

 
.empPromoBtn{
	width: 44% !important;}
h3.empPromoTitle {
    font-size: 20px;
    font-weight: 500;
}
.uholiday-card{ 
    background:#fff;
    border-radius:18px;
    box-shadow:0 10px 35px rgba(27,39,94,.08);
    overflow:hidden;
}

.uholiday-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    padding: 20px 20px 10px;
    border-bottom:1px solid #edf0f7;
}

.uholiday-title{
    display:flex;
    align-items:center;
    gap:10px;
}

.uholiday-title h3{
    font-size: 15px;
    color:#25324b;
    font-weight:600;
}

.uholiday-icon{
    width:28px;
    height:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#eef2ff;
    border-radius:8px;
}

.uholiday-header a{
    text-decoration:none;
    color: #17a44a;
    font-size: 13px;
    font-weight:600;
}

.uholiday-item{
    display: grid;
    grid-template-columns: 21% 47% 21%;
    gap: 15px;
    align-items: end;
    padding:18px 20px;
    border-bottom:1px solid #edf0f7;
}

.uholiday-item:last-child{
    border-bottom:none;
}

.uholiday-date{
    width: 68px;
    height: 68px;
    background:#f8f9fd;
    border-radius:14px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    flex-shrink:0;
}

.uholiday-date h2{
    font-size: 21px;
    color:#1f2940;
    line-height:1;
    font-weight:700;
    margin-bottom: 3px;
}

.uholiday-date span{
    font-size:12px;
    color:#6b7280;
    letter-spacing:1px;
    margin-top:4px;
    font-weight:600;
}

.uholiday-content{
}

.uholiday-content h4{
    font-size: 14px;
    color:#1f2940;
    margin-bottom:6px;
    font-weight:600;
}

.uholiday-content p{
    color:#7d879c;
    font-size:14px;
}

.uholiday-image{
    width: 66px;
    text-align:right;
}

.uholiday-image img{
    width: 100%;
    /* height: 68px; */
    object-fit:contain;
}

@media(max-width:480px){

    .uholiday-card{
        width:100%;
        margin:15px;
    }

    .uholiday-image{
        width:70px;
    }

    .uholiday-image img{
        height:55px;
    }

    .uholiday-content h4{
        font-size:14px;
    }

}
.leave-1{background: #e0f8e5;}
.leave-2{background: #ffeaea;}
.leave-3{background: #edf2fd;}
.leave-4{background: #eeebfe;}
.leave-5{background: #f6ecfc;}
.leave-6{background: #faf3e6;}
 
/*============================
 [Table of CSS]

1. General
2. Table
3. Helper Class
4. Bootstrap Classes
5. Header
6. Sidebar
7. Content
8. Login
9. Dashboard
10. Activity
11. Select2
12. Nav tabs
13. Holidays
14. Edit Profile
15. Chat
16. Focus Label
17. Leave
18. Employee
19. Events
20. Profile
21. Notifications
22. Roles & Permissions
23. Chat Right Sidebar
24. Invoice
25. Doctors
26. Add Doctor
27. Payslip
28. Attendance
29. Inbox
30. Mail View
31. Blog
32. Blog View
33. UI Kit
34. Error
35. Lock Screen
36. Voice call
37. Video Call
38. Incoming call
39. Notification settings
40. Chat Sidebar
41. Gallery
42. Settings
43. Responsive

========================================*/

/*-----------------
	1. General
-----------------------*/

@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');
html {
	height: 100%;
}
body {
	font-family: "Open Sans", sans-serif;
	font-weight: 500;
	font-size: 14px;
	font-weight: normal;
	color: #333448;
	background: linear-gradient(#ffffffa1, #ffffffa1), url(../img/bg.png);
	overflow-x: hidden;
	height: 100%;
}
h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0;
}
h1,
.h1 {
	font-size: 2.25rem;
}
h2,
.h2 {
	font-size: 1.875rem;
}
h3,
.h3 {
	font-size: 1.5rem;
}
h4,
.h4 {
	font-size: 1.125rem;
}
h5,
.h5 {
	font-size: 0.875rem;
}
h6,
.h6 {
	font-size: 0.75rem;
}
/* a:hover,
a:active,
a:focus {
	text-decoration: none;
	color: #009ce7;
	outline: none;
} */
.form-control {
	box-shadow: none;
	padding: 10px 15px;
	font-size: 14px;
	min-height: 45px;
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
}
.form-control::placeholder {
	font-size: 13px;
}
.form-control:focus {
	border-color: #3a57e8;
	box-shadow: none;
	outline: 0 none;
}
a {
	color: #17a460;
	text-decoration: none;
}
input,
button,
a {
	transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease;
}
input,
button {
	outline: none;
}
input[type="file"] {
	height: auto;
	padding: 6px 0.75rem;
}
input[type=text],
input[type=password] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}
textarea.form-control {
	resize: vertical;
}
.navbar-nav > li {
	float: left;
}
.input-block {
	margin-bottom: 20px;
}
.display-block {
	display: block;
}
.btn.rounded {
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}
.btn.focus,
.btn:focus {
	box-shadow: inherit !important;
}
.list-group-item {
	border: 1px solid #eaeaea;
}

/*-----------------
	2. Table
-----------------------*/

.table>:not(:first-child) {
	border: 0;
}
table.table td,table.table th {
	border-color: #dee2e6;
}
.table-bordered td, .table-bordered th {
    border: 1px solid #dee2e6;
}
.dataTables_length select {
    appearance: auto;
}
.table {
	color: #000;
	border: 1px solid #f0f0f0;
}
.table.table-white {
	background-color: #fff;
}
.table > tbody > tr > td {
	/* font-weight: 300; */
}
.table-striped > tbody > tr:nth-of-type(2n + 1) {
	background-color: #f6f6f6;
}
table.table td .avatar {
	margin: 0 5px 0 0;
}
table.table td h2 {
	display: inline-block;
	font-size: inherit;
	font-weight: 400;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}
table.table td h2 a {
	color: #757575;
}
table.table td h2 a:hover {
	color: #009efb;
}
table.table td h2 span {
	color: #9e9e9e;
	display: block;
	font-size: 12px;
	margin-top: 3px;
}
.table-nowrap td, .table-nowrap th {
    white-space: nowrap;
}
/*-----------------
	3. Helper Class
-----------------------*/

.m-r-5 {
	margin-right: 5px !important;
}
.m-r-10 {
	margin-right: 10px !important;
}
.m-l-5 {
	margin-left: 5px !important;
}
.m-t-0 {
	margin-top: 0 !important;
}
.m-t-10 {
	margin-top: 10px !important;
}
.m-t-20 {
	margin-top: 20px !important;
}
.m-t-30 {
	margin-top: 30px !important;
}
.m-t-50 {
	margin-top: 50px !important;
}
.m-b-10 {
	margin-bottom: 10px !important;
}
.m-b-20 {
	margin-bottom: 20px !important;
}
.m-b-30 {
	margin-bottom: 30px !important;
}
.w-40 {
	width: 40px;
}
.block {
	display: block !important;
}
.text-ellipsis {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.text-muted-light {
	color: #aaa;
}
.card-box {
	background-color: #fff;
	border-radius: 12px;
	margin-bottom: 30px;
	padding: 20px;
	position: relative;
}
.card-title {
	color: #333448;
	font-size: 16px;
	margin-bottom: 20px;
}
.page-title {
	color: #333448;
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 25px;
}
.page-sub-title {
	color: #565656;
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 20px;
}
.cal-icon:after {
	background: transparent url("../img/icons/calendar-icon.svg") no-repeat scroll 0 0;
	bottom: 0;
	content: "";
	display: block;
	height: 24px;
	margin: auto;
	position: absolute;
	right: 15px;
	top: 0;
	width: 24px;
	cursor: pointer;
}
.cal-icon {
	position: relative;
	width: 100%;
}
.time-icon:after {
	background: transparent url("../img/clock.png") no-repeat scroll 0 0;
	bottom: 0;
	content: "";
	display: block;
	height: 19px;
	margin: auto;
	position: absolute;
	right: 15px;
	top: 0;
	width: 19px;
}
.time-icon {
	position: relative;
	width: 100%;
}
.badge-success-border {
	border: 1px solid #55ce63;
	color: #55ce63;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}
.badge-danger-border {
	border: 1px solid #f62d51;
	color: #f62d51;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}
.badge-warning-border {
	border: 1px solid #ffbc34;
	color: #ffbc34;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}
.badge-info-border {
	border: 1px solid #009efb;
	color: #009efb;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}
.modal-footer.text-start {
	text-align: left;
}
.modal-footer.text-center {
	text-align: center;
}
.font-18 {
	font-size: 18px;
}
.border-right {
	border-right: 1px solid #e7e7e7;
}
.blur {
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	-o-filter: blur(3px);
	-ms-filter: blur(3px);
	filter: blur(3px);
}
.btn {
	font-size: 0.875rem;
}

/*-----------------
	4. Bootstrap Classes
-----------------------*/

.btn-white {
	background-color: #fff;
	border: 1px solid #ccc;
	color: #333;
}
.rounded,
.circle {
	border-radius: 500px;
}
.bg-primary,
.badge-primary {
	background-color: #009efb !important;
}
.bg-success,
.badge-success {
	/* background-color: #55ce63 !important; */
}
.bg-info,
.badge-info {
	background-color: #009efb !important;
}
.bg-warning,
.badge-warning {
	background-color: #ffbc34 !important;
}
.bg-danger,
.badge-danger {
	background-color: #f62d51 !important;
}
.bg-white {
	background-color: #fff;
}
.text-primary,
.dropdown-menu > li > a.text-primary {
	color: #3a57e8 !important;
}
.text-success,
.dropdown-menu > li > a.text-success {
	color: #55ce63;
}
.text-danger,
.dropdown-menu > li > a.text-danger {
	color: #f62d51;
}
.text-info,
.dropdown-menu > li > a.text-info {
	color: #009efb;
}
.text-warning,
.dropdown-menu > li > a.text-warning {
	color: #ffbc34;
}
.text-purple,
.dropdown-menu > li > a.text-purple {
	color: #7460ee;
}
.btn-primary {
	border-color: transparent;
	background-color: #3a57e8;
	border-radius: 18px;
}
.btn-primary:hover,
.btn-primary:focus,       
.btn-primary.active,
.btn-primary:active,
.open > .dropdown-toggle.btn-primary {
	background-color: #00d3c7;
	border: 1px solid #00d3c7;
	color: #fff;
}
.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary.focus:active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open > .dropdown-toggle.btn-primary.focus,
.open > .dropdown-toggle.btn-primary:focus,
.open > .dropdown-toggle.btn-primary:hover {
	background-color: #009efb;
	border: 1px solid #009efb;
}
.btn-primary.active:not(:disabled):not(.disabled),
.btn-primary:active:not(:disabled):not(.disabled),
.show > .btn-primary.dropdown-toggle {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}
.btn-outline-primary {
	border-color: #009efb;
	color: #009efb;
}
.btn-outline-primary:hover {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}
.btn-outline-primary.active:not(:disabled):not(.disabled),
.btn-outline-primary:active:not(:disabled):not(.disabled),
.show > .btn-outline-primary.dropdown-toggle {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}
.btn-success {
	background-color: #55ce63;
	border: 1px solid #55ce63
}
.btn-success:hover,
.btn-success:focus,
.btn-success.active,
.btn-success:active,
.open > .dropdown-toggle.btn-success {
	background: #4ab657;
	border: 1px solid #4ab657
}
.btn-success.active.focus,
.btn-success.active:focus,
.btn-success.active:hover,
.btn-success.focus:active,
.btn-success:active:focus,
.btn-success:active:hover,
.open > .dropdown-toggle.btn-success.focus,
.open > .dropdown-toggle.btn-success:focus,
.open > .dropdown-toggle.btn-success:hover {
	background: #4ab657;
	border: 1px solid #4ab657
}
.btn-info {
	background-color: #009efb;
	border: 1px solid #009efb
}
.btn-info:hover,
.btn-info:focus,
.btn-info.active,
.btn-info:active,
.open > .dropdown-toggle.btn-info {
	background-color: #028ee1;
	border: 1px solid #028ee1
}
.btn-info.active.focus,
.btn-info.active:focus,
.btn-info.active:hover,
.btn-info.focus:active,
.btn-info:active:focus,
.btn-info:active:hover,
.open > .dropdown-toggle.btn-info.focus,
.open > .dropdown-toggle.btn-info:focus,
.open > .dropdown-toggle.btn-info:hover {
	background-color: #028ee1;
	border: 1px solid #028ee1
}
.btn-warning {
	background: #ffbc34;
	border: 1px solid #ffbc34
}
.btn-warning:hover,
.btn-warning:focus,
.btn-warning.active,
.btn-warning:active,
.open > .dropdown-toggle.btn-warning {
	background: #e9ab2e;
	border: 1px solid #e9ab2e
}
.btn-warning.active.focus,
.btn-warning.active:focus,
.btn-warning.active:hover,
.btn-warning.focus:active,
.btn-warning:active:focus,
.btn-warning:active:hover,
.open > .dropdown-toggle.btn-warning.focus,
.open > .dropdown-toggle.btn-warning:focus,
.open > .dropdown-toggle.btn-warning:hover {
	background: #e9ab2e;
	border: 1px solid #e9ab2e
}
.btn-danger {
	background: #f62d51;
	border: 1px solid #f62d51
}
.btn-danger:hover,
.btn-danger:focus {
	background-color: #e6294b;
	border: 1px solid #e6294b
}
.pagination > .active > a,
.pagination > .active > a:focus,
.pagination > .active > a:hover,
.pagination > .active > span,
.pagination > .active > span:focus,
.pagination > .active > span:hover {
	background-color: #00d3c7;
	border-color: #00d3c7;
}
.pagination > li > a,
.pagination > li > span {
	color: #3a57e8;
	font-size: 14px;
    padding: 5px 15px !important;
}
.page-item.active .page-link {
	background-color: #3a57e8;
	border-color: #3a57e8;
}
.dropdown-menu {
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 3px;
	transform-origin: left top 0;
	box-shadow: inherit;
	background-color: #fff;
}
.navbar-nav .open .dropdown-menu {
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
}
.btn-group-xs > .btn,
.btn-xs {
	min-height: 22px;
	min-width: 22px;
}
.dropdown-menu {
	font-size: 13px;
}
.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
	box-shadow: none;
}
.btn-link {
	color: #333;
}
.nav .open > a,
.nav .open > a:focus,
.nav .open > a:hover {
	background-color: rgba(0, 0, 0, 0.2);
}
/* .card {
	margin-bottom: 25px;
	box-shadow: none;
	border: 0;
	border-radius: 12px;
	width: 100%;
} */
.card-title {
	margin-bottom: 1.125rem;
}
.dropdown-action .dropdown-toggle:after {
	display: none;
}
.badge.rounded-pill {
	border-radius: 10rem;
}
.badge-primary {
	color: #fff;
}
.btn.btn-rounded {
	border-radius: 50px;
}
.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
	background-color: #eee;
	border-color: transparent;
}
.nav-tabs .nav-link {
	border-radius: 0;
}
.table.dataTable {
	border-collapse: collapse !important;
}
textarea.form-control {
	height: auto;
}
.progress-example .progress {
	margin-bottom: 1.5rem;
}
.progress-xs {
	height: 4px;
}
.progress-sm {
	height: 15px;
}
.progress.progress-sm {
	height: 6px;
}
.progress.progress-md {
	height: 8px;
}
.progress.progress-lg {
	height: 18px;
}
.form-control.form-control-sm {
	padding: 0.25rem 0.5rem;
}
.card .card-header {
	background-color: rgba(255, 255, 255, 0.1);
	border: 0 none;
	font-size: 16px;
	line-height: 30px;
	padding: 15px;
}
.card .card-header .card-title {
	font-size: 18px;
	font-weight: 400;
	line-height: 20px;
	margin: 0;
	padding: 5px 0;
}
.table h5 {
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
	margin-bottom: 0;
	vertical-align: middle;
}
.table h5 + p {
	color: #9e9e9e;
	font-size: 14px;
	line-height: 18px;
	margin-bottom: 0;
}
.page-link:focus {
    box-shadow: unset;
}
.col-form-label {
	font-size: 14px;
	font-weight: 500;
}
.input-group-text {
	height: 45px;
}

/*-----------------
	5. Header
-----------------------*/

.header {
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 999;
	height: 64px;
	background: #FFFFFF;
	box-shadow: 0px 0px 14px rgba(204, 204, 204, 0.25);
}
.header .header-left {
	float: left;
	height: 70px;
	padding: 0 20px;
	position: relative;
	text-align: center;
	width: 240px;
	z-index: 1;
}
.logo {
	align-items: center;
	display: flex;
	height: 70px;
	justify-content: start;
}
.logo span {
	color: #3a57e8;
	font-size: 20px;
	font-weight: 500;
	margin-left: 10px;
}
.header .navbar-nav .badge {
	position: absolute;
	right: 7px;
	top: 4px;
}
.header .dropdown-menu > li > a {
	position: relative;
}
.header .dropdown-toggle:after {
	display: none;
}
.page-title-box {
	border-radius: 0;
	height: 70px;
	margin-bottom: 0;
	padding: 14px 20px;
}
.page-title-box h3 {
	color: #fff;
	font-size: 18px;
	font-weight: 500;
	margin: 0;
}
.user-menu {
	margin: 0;
	position: relative;
	z-index: 99;
}
.user-menu.nav > li > a {
	color: #fff;
	font-size: 16px;
	line-height: 70px;
	padding: 0 5px;
	height: 70px;
}
.user-menu.nav > li > a:hover,
.user-menu.nav > li > a:focus {
	/* background-color: #eee; */
}
.user-img {
	display: inline-block;
	position: relative;
}
.header .user-img img {
	width: 40px;
	border-radius: 14px;
}
.user-img .status {
	border: 2px solid #fff;
	bottom: 0;
	height: 10px;
	position: absolute;
	right: 0;
	width: 10px;
}
.user-menu .user-img .status {
	bottom: 0px;
}
.user-menu .dropdown-menu {
	min-width: 145px;
	padding: 0;
	visibility: hidden;
    opacity: 0;
    display: block;
	transform: translate(0px, 100px);
}
.user-menu .dropdown-menu.show {
	visibility: visible;
    opacity: 1;
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.table .dropdown-item {
	padding: 7px 10px;
}
.user-menu .bg-primary {
	background-color: #009efb !important;
}
.status {
	background-color: #ccc;
	border-radius: 50%;
	display: inline-block;
	height: 10px;
	width: 10px;
}
.status.online {
	background-color: #55ce63;
}
.status.offline {
	background-color: #f62d51;
}
.status.away {
	background-color: #faa937;
}
.top-nav-search {
    float: left;
    margin-left: 22px;
}
.top-nav-search form {
    margin-top: 13px;
	position: relative;
    width: 270px;
}
.top-nav-search .form-control {
    background: rgb(58 87 232 / 6%);
    border-radius: 12px;
    border: 0;
    height: 40px;
    padding: 10px 15px 10px 30px;
}
.top-nav-search .btn {
    background-color: transparent;
    border-color: transparent;
    min-height: 45px;
    padding: 7px 10px;
    position: absolute;
    left: 0;
    top: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    outline: none;
}
.top-nav-search .form-control::-webkit-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.top-nav-search .form-control::-moz-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.top-nav-search .form-control:-ms-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.top-nav-search .form-control::-ms-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.top-nav-search .form-control::placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}
.theme-set .form-control {
	line-height: 29px;
}
.user-profile-list .user-link {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
    padding: 0px 10px !important;
}
.user-menu.nav li.user-profile-list a {
	line-height: 20px;
}
.user-names {
	padding-right: 0px;
	text-align: right;
}
.user-names h5 {
	color: #2c2c2c;
	font-size: 15px;
	font-weight: 400; 
	margin-bottom: 0;
}
.user-names span {
	color: rgba(46, 55, 164, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.user-menu.nav li {
	margin-right: 7px;
	position: relative;
}
.user-menu.nav li:last-child {
	margin-right: 12px;
	position: relative;
}
/*-----------------
	6. Sidebar
-----------------------*/

.sidebar {
    top: 62px;
    width: 250px;
    z-index: 1000;
    background-color: #fff;
    bottom: 0;
    margin-top: 0px;
    position: fixed;
    left: 0;
    transition: all 0.2s ease-in-out;
    border-top-right-radius: 0;
    box-shadow: 5px 20px 14px rgba(46, 55, 164, 0.05);
    overflow-y: hidden;
    height: 100vh;
}
.sidebar.opened {
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.sidebar-inner {
	height: 100%;
	transition: all 0.2s ease-in-out 0s;
}
.sidebar-menu ul {
	font-size: 14px;
	list-style-type: none;
	margin: 0;
	padding: 0;
	/* margin-bottom: 50px; */
}
.sidebar-menu li a {
	color: #888;
	display: block;
	font-size: 15px;
	height: auto;
	padding: 0 20px;
	z-index: 999;
}
.sidebar-menu li a:hover {
	color: #3a57e8;
}
.sidebar-menu ul li .active img {
    filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.sidebar-menu li.active a {
	color: #3a57e8;
}
.menu-title {
	color: #333;
	font-size: 15px;
	font-weight: 500;
	padding: 12px 20px;
}
.menu-title > i {
	float: right;
	line-height: 40px;
}
.sidebar-menu li.menu-title a {
	color: #009efb;
	display: inline-block;
	float: right;
	padding: 0;
}
.sidebar-menu li.menu-title a.btn {
	color: #fff;
	display: block;
	float: none;
	font-size: 15px;
	line-height: inherit;
	margin-bottom: 15px;
}
.sidebar-menu ul .submenu .active {
	color: #fff;
	font-weight: 500;
}
.sidebar-menu ul li .active {
	color: #3a57e8;
	font-weight: 500;
}
.sidebar-menu ul .submenu ul .active {
	position: relative;
}
.sidebar-menu ul .submenu ul .active:before {
	/* background-image: url(../img/icons/right-icon.svg); */
	content: "";
	position: absolute;
	width: 10px;
    height: 10px;
    background-repeat: no-repeat;
	top: 50%;
    left: 35px;
    -webkit-transform: translate(0, -50%);
    -ms-transform: translate(0, -50%);
    transform: translate(0, -50%);
}
.sidebar-menu ul ul a.active {
	color: #3a57e8;
	font-weight: 500;
}
.mobile-user-menu {
	color: #fff;
	display: none;
	font-size: 24px;
	height: 70px;
	line-height: 70px;
	padding: 0 20px;
	position: absolute;
	right: 0;
	text-align: right;
	top: 0;
	width: 50px;
	z-index: 10;
}
.mobile-user-menu > a {
	color: #fff;
	padding: 0;
}
.mobile-user-menu > a:hover {
	color: #fff;
}
.mobile-user-menu > .dropdown-menu > a {
    line-height: 23px;
}
.profile-rightbar {
	display: none !important;
	color: #009efb;
	font-size: 26px;
	margin-left: 15px;
}
.fixed-sidebar-right {
	position: fixed;
	top: 60px;
	right: 0;
	width: 300px;
	margin-right: -300px;
	bottom: 0;
	z-index: 101;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.mobile_btn {
	display: none;
}
.sidebar .sidebar-menu > ul > li > a span {
	transition: all 0.2s ease-in-out 0s;
	margin-left: 10px;
	white-space: nowrap;
}
.sidebar .sidebar-menu > ul > li > a span.badge {
	color: #fff;
	margin-left: auto;
}
.sidebar-menu ul ul a {
	display: block;
	font-size: 14px;
	padding: 9px 10px 9px 60px;
	position: relative;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.75);
}
.sidebar-menu ul ul {
	display: none;
}
.sidebar-menu ul ul ul a {
	padding-left: 70px;
}
.sidebar-menu ul ul ul ul a {
	padding-left: 90px;
}
.sidebar-menu > ul > li {
	position: relative;
}
.sidebar-menu .menu-arrow {
	-webkit-transition: -webkit-transform 0.15s;
	-o-transition: -o-transform 0.15s;
	transition: transform .15s;
	position: absolute;
	right: 25px;
	display: inline-block;
	font-family: 'FontAwesome';
	text-rendering: auto;
	line-height: 40px;
	font-size: 15px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0);
	line-height: 18px;
	    top: 20px;
}
.sidebar-menu .menu-arrow:before {
	content: "\f105";
}
.sidebar-menu li a.subdrop .menu-arrow {
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
}
.sidebar-menu ul ul a .menu-arrow {
	top: 6px;
}
.sidebar-menu a {
	transition: unset;
	-moz-transition: unset;
	-o-transition: unset;
	-ms-transition: unset;
	-webkit-transition: unset;
}
.sidebar-menu > ul > li > a {
	padding: 10px; 
	align-items: center;
	display: flex;
	justify-content: flex-start;
	position: relative;
	/* transition: all 0.2s ease-in-out 0s; */
	color: #1c1c1e;
	font-weight: 500;
	border:2px solid transparent;
	border-radius: 18px;
}
.sidebar-menu ul li a i {
	font-size: 18px;
	min-height: 24px;
	line-height: 18px;
	transition: all 0.2s ease-in-out 0s;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
	width: 40px;
	height: 40px;
	margin-left: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.sidebar-menu ul li a span.menu-side {
	font-size: 18px;
	min-height: 24px;
	line-height: 18px;
	transition: all 0.2s ease-in-out 0s;
	background: #fff;
	border-radius: 12px;
	width: 40px;
	height: 40px;
	margin-left: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.sidebar-menu ul .submenu .active img {
	filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.sidebar-menu li a img {
    filter: brightness(0) saturate(100%);
}
.sidebar-menu li a:hover img {
   filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
    transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.sidebar-menu ul li.menu-title a i {
	font-size: 16px;
	margin-right: 0;
	text-align: right;
	width: auto;
}
.logout-btn {
	margin: 50px 0px;
}
.logout-btn a span.menu-side {
	font-size: 18px;
    min-height: 24px;
    line-height: 18px;
    transition: all 0.2s ease-in-out 0s;
    background: rgba(46, 55, 164, 0.05);
    border-radius: 8px;
    width: 40px;
    height: 40px;
    margin-left: 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
	flex-shrink: 0;
}
.logout-btn a {
    padding: 12px 20px;
    align-items: center;
    display: flex;
    justify-content: flex-start;
    position: relative;
    transition: all 0.2s ease-in-out 0s;
    color: #3a57e8;
    font-weight: 500;
}
.logout-btn a span {
	margin-left: 10px;
}

/*-----------------
	7. Content
-----------------------*/

.page-wrapper {
	left: 0;
	margin-left: 250px;
	padding-top: 70px;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}
.page-wrapper > .content {
	padding: 22px;
	padding-bottom: 0;
}

/*-----------------
	12. Login
-----------------------*/

.login-body {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.login-wrapper .loginbox .login-right .login-right-wrap {
    max-width: 100%;
    flex: 0 0 100%;
}
.login-wrapper .loginbox .login-right .login-right-wrap .input-block {
	position: relative;
}
.login-wrapper .loginbox .login-right .login-right-wrap .input-block label {
	font-size: 12px;
	color: #333448;
	font-weight: 500;
	position: absolute;
    top: -10px;
    left: 10px;
    background: #fff;
    margin-bottom: 0;
	padding: 0px 5px;
}
.login-danger,
.star-red {
	color: #FF0000;
}
.account-subtitle {
    color: rgba(51, 52, 72, 0.5);
    font-size: 14px;
    margin-bottom: 0;
    text-align: left;
	font-weight: 500;
}
.account-subtitle a {
	color: #3a57e8;
}
.login-wrapper .loginbox .login-right h2 {
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 40px;
}
.login-wrapper .loginbox .login-right .forgotpass {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	margin-bottom: 40px;
}
.remember-me .custom_check {
	color: #333448;
	font-size: 13px;
	font-weight: 500;
}
.remember-me .custom_check .checkmark {
	width: 18px;
	height: 18px;
	top: 2px;
    left: 2px;
	border: 2px solid rgba(51, 52, 72, 0.2);
	border-radius: 4px;
	background-color: #fff;
}
.remember-me .custom_check .checkmark::after {
	left: 3px;
    top: 0px;
}
.login-wrapper .loginbox .login-right .forgotpass a {
	color: #00D3C7;
	font-size: 14px;
	font-weight: 500;
	margin-left: auto;
}
.login-wrapper .loginbox .login-right .forgotpass a:hover {
	color: #333;
	text-decoration: underline;
}
.login-wrapper .loginbox .login-right .dont-have {
	color: #a0a0a0;
	margin: 20px 0px;
}
.login-wrapper .loginbox .login-right .dont-have a {
	color: #18AEFA;
	font-weight: 500;
}
.login-wrapper .loginbox .login-right .dont-have a:hover {
	text-decoration: underline;
}
.social-login {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.social-login > span {
	color: #a0a0a0;
	margin-right: 8px;
}
.social-login > a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	height: 40px;
	margin-right: 6px;
	width: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.social-login > a:hover {
	background-color: #e6e6e8;
    color: #fff;
}
.social-login > a:last-child {
	margin-right: 0;
}
.btn-primary.primary-reset {
    background-color: #18AEFA;
    border-color: #18AEFA;
}
.btn-primary.primary-reset:hover {
    background-color: #3d5ee1;
    border: 1px solid #3d5ee1;
}
.profile-views {
    position: absolute;
    right: 17px;
    top: 50%;
    transform: translateY(-50%);
	color: rgba(51, 52, 72, 0.2);
	cursor: pointer;
}
.login-right .form-control {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
	height: 45px;
}
.login-right .form-control:focus {
	border: 2px solid rgb(74 83 199 / 80%);
}
.btn-block {
    width: 100%;
}
.account-logo {
	margin-bottom: 40px;
	text-align: left;
}
.account-logo img {
	width: 40%;
}
.login-right .btn-primary {
	background: linear-gradient(92.39deg, #4E57CD 1.86%, #3a57e8 100%);
	border-radius: 12px;
	font-size: 16px;
	padding: 10px 15px;
}
.login-right .btn-primary:hover {
	background: linear-gradient(92.39deg, #3a57e8 1.86%, #00318b 100%);
	border: 1px solid #00318b;
}
.next-sign {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.login-btn {
	margin-bottom: 40px;
}
.login-wrapper .login-right .user-lock-screen h2 {
	margin-bottom: 10px;
}
.user-lock-screen p {
	margin-bottom: 0;
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}
.user-lock-screen {
	margin-bottom: 30px;
}
.sucess-mail h4 {
	font-size: 26px;
	font-weight: 600;
	margin: 15px 0px 20px;
}
.sucess-mail p {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0px;
}

/*-----------------
	14. Login
-----------------------*/

.login-sec {
	text-align: center;
	display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: end;
    height: auto;
}
.log-img img {
	margin: 0 auto;
}
.login-wrapper {
    width: 100%;
    height: 100%;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    display: -ms-flexbox;
    display: flex;
    flex-wrap: wrap;
    -webkit-flex-wrap: wrap;
}
.login-wrap {
	background-color: #3a57e8;
    top: 0;
    left: 0;
    position: fixed;
	height: 100vh;
	padding: 0px;
	border-radius: 0px 65px 65px 0px;
}
.login-wrap-bg {
	position: absolute;
	right: 0;
	padding: 15px 90px 15px;
	height: 100%;
}
.login-wrap .login-sec {
	position: absolute;
	background-image: url('../img/login-0l.png');
	background-repeat: no-repeat;
	background-position: top right;
	background-size: cover, auto;
	width: 100%;
}
.login-wrapper .loginbox {
	background: #FFFFFF;
	box-shadow: 0px 80px 80px rgba(46, 55, 164, 0.03);
	border-radius: 24px;
	display: flex;
	max-width: 830px;
	width: 100%;
}
.login-wrapper .loginbox .login-right {
	padding: 50px;
	width: 100%;
}

/*-----------------
	9. Dashboard
-----------------------*/

.dash-widget {
	background-color: #fff;
	border-radius: 12px;
	backdrop-filter: blur(2px);
	margin-bottom: 30px;
	padding: 20px;
	position: relative;
	height: 180px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}
.dash-boxs {
	background: rgba(46, 55, 164, 0.05);
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 12px;
	width: 50px;
	height: 50px;
	margin-bottom: 10px;
}
.dash-content h4 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 4px;
}
.dash-content h2 {
	color: #3a57e8;
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 20px;
}
.dash-content p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0px;
}
.dash-content p .negative-view {
	color: #FF3667;
}
.dash-content p .passive-view {
	color: #00D3C7;
}
.comman-flex-center {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.card-table.card-table-top .card-body {
	height: 175px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
.chart-title {
	margin-bottom: 25px;
}
.chart-title h4 {
	display: inline-block;
	font-size: 18px;
	font-weight: 600;
	line-height: 20px;
	margin: 0;
	color: #333;
}
.chart-title span {
	color: #009efb;
}
.card-title > a.btn {
	color: #fff;
}
ul.chat-user-total li {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: #333448;
	padding-right: 10px;
	font-size: 14px;
	font-weight: 500;
}
ul.chat-user-total li i.current-users {
	color: #3a57e8;
	padding-right: 5px;
	font-size: 8px;
}
ul.chat-user-total li i.low-users {
	color: #D5D7ED;
	padding-right: 5px;
	font-size: 8px;
}
ul.chat-user-total li i.old-users {
	color: #00D3C7;
	padding-right: 5px;
	font-size: 8px;
}
.new-patient-table {
	display: table;
}
.new-patient-table td, .new-patient-table th {
    vertical-align: middle;
}
.new-patient-table tr td img {
	margin-right: 5px;
}
.btn-primary-one {
	border: 1px solid #ffbc35;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}
.btn-primary-two {
	border: 1px solid #009efb;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}
.btn-primary-three {
	border: 1px solid #55ce63;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}
.btn-primary-four {
	border: 1px solid #ffbc35;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}
.bar-chart {
	position: relative;
	width: 100%;
	margin-top: 15px;
}
.bar-chart > .legend {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 40px;
	margin-bottom: -45px;
	border-top: 1px solid #000;
}
.bar-chart > .legend > .item {
	position: relative;
	display: inline-block;
	float: left;
	width: 25%;
}
.bar-chart > .legend > .item:before {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 1px;
	height: 8px;
	background-color: #000;
	margin-top: -8px;
}
.bar-chart > .legend > .item.text-end:before {
	right: 0;
	left: auto;
}
.bar-chart > .legend > .item h4 {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding-top: 5px;
}
.bar-chart > .chart {
	position: relative;
	width: 100%;
}
.bar-chart > .chart > .item {
	position: relative;
	width: 100%;
	height: 40px;
	margin-bottom: 10px;
	color: #fff;
	text-transform: uppercase;
}
.bar-chart > .chart > .item > .bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffbc35;
	z-index: 5;
}
.bar-chart > .chart > .item > .bar > .percent {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	height: 40px;
	line-height: 40px;
	padding-right: 12px;
	z-index: 15;
}
.bar-chart > .chart > .item > .bar > .item-progress {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background-color: #009efb;
	z-index: 10;
}
.bar-chart > .chart > .item > .bar > .item-progress > .title {
	display: block;
	position: absolute;
	height: 40px;
	line-height: 40px;
	padding-left: 12px;
	letter-spacing: 2px;
	z-index: 15;
}
.hospital-barchart h4 {
	display: inline-block;
	font-size: 18px;
	font-weight: 400;
	line-height: 20px;
	margin: 0;
	color: #333;
}
.custom-table tr {
	background-color: #fff;
	white-space: nowrap;
}
.table.custom-table > tbody > tr > td,
.table.custom-table > tbody > tr > th,
.table.custom-table > tfoot > tr > td,
.table.custom-table > tfoot > tr > th,
.table.custom-table > thead > tr > td,
.table.custom-table > thead > tr > th {
	padding: 10px 15px;
	vertical-align: middle;
}
.member-panel .contact-list > li:last-child {
	border-bottom: 0;
}
.member-panel .card-body {
	overflow-y: auto;
	height: 245px;
	-webkit-overflow-scrolling: touch;
	padding: 0;
}
.contact-list {
	list-style: none;
	padding-left: 0;
	margin: 0;
}
.contact-list > li {
	border-bottom: 1px solid #eaeaea;
	border-radius: inherit;
	padding: 10px;
	background-color:#fff;
}
.contact-cont {
	position: relative;
}
.contact-info {
	padding: 0 30px 0 50px;
}
.contact-date {
	color: #888;
	font-size: 12px;
}
.take-btn {
    min-width: 80px;
}
.good-morning-blk {
	background: #FFFFFF;
	border-radius: 12px;
	margin-bottom: 20px;
	position: relative;
	z-index: 9;
}
 
.morning-user {
	padding: 50px 0px 50px 35px;
}
.morning-user h2 {
	font-size: 28px;
	font-weight: 600;
}
.morning-user h2 span {
	color: #3a57e8;
}
.morning-user p {
	font-size: 15px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}
.morning-img img {
	position: absolute;
    bottom: 0;
}
.position-blk {
	position: relative;
}
.activity-top {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 20px;
}
.activity-boxs {
	background: rgba(46, 55, 164, 0.05);
	width: 45px;
	height: 45px;
	margin-right: 10px;
	border-radius: 50px;
}
.departments-list h4 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}
.departments-list p {
	font-size: 14px;
	font-weight: 600;
	color: rgba(51, 53, 72, 0.5);
	margin-bottom: 0;
}
.chart-user-icon {
	position: relative;
}
.chart-user-icon img {
    position: absolute;
    top: 65px;
    left: 50%;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
table.dataTable thead .sorting:before, table.dataTable thead .sorting:after, 
table.dataTable thead .sorting_asc:before, table.dataTable thead .sorting_asc:after, 
table.dataTable thead .sorting_desc:before, table.dataTable thead .sorting_desc:after, 
table.dataTable thead .sorting_asc_disabled:before, table.dataTable thead 
.sorting_asc_disabled:after, table.dataTable thead .sorting_desc_disabled:before, 
table.dataTable thead .sorting_desc_disabled:after {
	bottom: 15px;
}
.custom-table tbody tr {
    box-shadow: 0 0 3px #e5e5e5;
    border: 0;
}
.custom-table tbody tr td,
.custom-table thead tr th {
	border: 0;
}
.custom-table tbody tr td {
	font-size: 14px;
}
.custom-table thead tr th {
	font-size: 14px;
	color: rgba(51, 52, 72, 0.5);
}
.table-dash .dataTables_length,
.table-dash .dataTables_info,
.table-dash .pagination {
	display: none;
}
.table-image {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.table-image img {
	margin-right: 10px;
}
.patient-views {
	color: #3a57e8;
	font-size: 14px;
	font-weight: 500;
}
.appoint-doctor h2 {
	color: #3a57e8;
}
.appoint-time span {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
}
.appoint-time h6 {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.patient-visit {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.doctor-list-blk {
	background: #FFFFFF;
	border-radius: 16px;
	padding: 20px;
	margin-bottom: 25px;
}
.doctor-widget {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	position: relative;
}
.doctor-box-icon {
	width: 66px;
	height: 66px;
	background: #3a57e8;
	border-radius: 12px;
	margin-right: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.doctor-content {
	width: 100%;
}
.doctor-content h4 {
	font-size: 24px;
	color: #3a57e8;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-weight: 600;
}
.doctor-content h5 {
	font-size: 14px;
	margin-bottom: 0;
}
.doctor-content h4 span:nth-child(2) {
	font-size: 14px;
	color: rgb(51 52 72 / 20%);
}
.doctor-content h4 span:last-child {
	font-size: 10px;
	border-radius: 20px;
	margin: auto;
	padding: 5px;
}
.border-right-bg:before {
	content: "";
	position: absolute;
	background: rgba(46, 55, 164, 0.2);
	height: 44px;
	width: 2px;
	right: 0;
}
.income-value {
	text-align: center;
}
.income-value h3 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}
.income-value h3 span {
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
}
.income-value p {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}
.income-value p span {
	color: #00D3C7
}
.patient-structure h5 {
	font-size: 16px;
	font-weight: 500;
	color: #3a57e8;
	margin-bottom: 10px;
}
.struct-point {
	width: 100%;
}
.patient-structure h3 {
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.patient-structure h3 span {
	font-size: 12px;
	padding: 3px 7px;
	border-radius: 20px;
}
.check-point {
	border: 0;
	border-radius: 4px;
}
.card.wallet-widget {
	margin-bottom: 25px;
	padding: 15px;
	width: 100%;
}
.main-limit {
	text-align: center;
}
.main-limit p {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 10px;
}
.main-limit h4 {
	font-size: 24px;
	font-weight: 600;
	color: #3a57e8;
	margin-bottom: 0;
}
.wallet-widget .circle-bar {
    text-align: center;
}
.wallet-widget .circle-bar > div {
	display: inline-block;
	position: relative;
	text-align: center;
}
.wallet-widget .circle-bar > div b {
    left: 0;
    position: absolute;
    top: 50%;
    right: 0;
    text-align: center;
    margin: 0 auto;
    transform: translateY(-50%);
    width: 60px;
    height: 60px;
    border-radius: 50px;
	background: rgba(0, 211, 199, 0.1);
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.wallet-widget .circle-bar > div canvas {
	width: 100px !important;
	height: 100px !important;
}
.teaching-card {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.steps-history {
	margin-bottom: 0;
	margin-right: 10px;
	align-items: baseline;
    display: inline-grid;
	padding: 0;
	width: 40px;
}
.steps-history li {
	margin-top: 5px;
	color: rgba(51, 53, 72, 0.5);
    font-weight: 500;
	list-style: none;
	font-size: 12px;
}
.activity-feed {
    list-style: none;
    margin-bottom: 0;
    margin-left: 5px;
    padding: 0;
	width: 100%;
	position: relative;
}
.activity-feed::after{
	position: absolute;
	content:"";
	background: #e4e8eb;
	width: 2px;
	height: 100%;
	left: -2px;
    top: 10px;
    z-index: 0;
}
.activity-feed .feed-item {
  
    padding-bottom: 20px;
    padding-left: 20px;
    position: relative;
}
.activity-feed .feed-item:last-child {
	padding-bottom: 0;
}
.activity-feed .feed-item:after {
	content: "";
    display: block;
    position: absolute;
    background-color: #333448;
    width: 7px;
    height: 7px;
	top: 10px;
    left: -4px;
    border-radius: 50px;
	z-index: 9;
}
.doctor-date-list {
	padding: 0;
}
.doctor-date-list li {
	list-style: none;
	color: #333548;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 15px;
}
.doctor-date-list li span {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	padding-left: 15px;
}
.doctor-date-list li i {
	font-size: 6px;
}
.dolor-activity {
	width: 100%;
}
.dolor-activity .stick-line {
	text-decoration: line-through;
	color: rgba(51, 53, 72, 0.5);
}
.active-doctor {
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 14px;
	padding: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.doctor-sub-list {
	padding: 10px;
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 14px;
	width: 100%;
	position: absolute;
	z-index: 99;
	display: none;
}
.ongoing-blk {
	position: relative;
}
.schedule-time li {
	width: 30px;
	height: 30px;
	border: 1px solid rgba(46, 55, 164, 0.2);
	border-radius: 5px;
}
.schedule-time li {
	margin-right: 5px;
	margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.schedule-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-top: 1px solid rgba(51, 52, 72, 0.2);
	padding-top: 10px;
	flex-wrap: wrap;
}
.appoint-start {
	font-size: 12px;
	border-radius: 10px;
	padding: 10px 20px;
}
.new-dot {
	padding: 3px 10px;
	font-size: 12px;
	margin-left: auto;
	border-radius: 8px;
}
.doctor-date-list .new-dot i {
	font-size: 5px;
}
.patient-new-list {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}
.average-health h5 {
	margin-bottom: 0;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
	padding: 6px 10px;
	font-size: 14px;
	font-weight: 500;
}
.average-health h5 span {
	color: rgba(46, 55, 164, 0.5);
	font-size: 10px;
}
.dash-content h5 {
	font-size: 24px;
	color: #3a57e8;
	font-weight: 600;
	margin-bottom: 20px;
}
.calendar header .month {
    font-size: 18px;
}
.dash-content h5 span {
	font-size: 16px;
	color: rgba(51, 52, 72, 0.5);
}
.report-blk {
	width: 100%;
}
.ongoing-drapt {
	position: relative;
	margin-left: auto;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.ongoing-drapt i {
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 6px;
	color: #3a57e8;
	width: 20px;
	height: 20px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.doctor-date-list li .ongoing-drapt i {
	font-size: 12px;
}
.active-doctor.dropdown-toggle::after {
	display: none;
}
.doctor-sub-list .dropdown-item {
	padding: 0;
}
.doctor-sub-list .dropdown-item:focus, 
.doctor-sub-list .dropdown-item:hover {
    background-color: transparent;
}
.active-doctor .active-circles {
	color: #00D3C7;
}
.doctor-date-list .active-doctor span {
	color: #3a57e8;
}
.doctor-date-list .active-doctor span.ongoing-drapt {
	color: rgba(51, 52, 72, 0.5);
}
.note-checkit .custom_check .checkmark {
	border: 2px solid rgba(46, 55, 164, 0.2);
	border-radius: 5px;
}
.note-checkit .custom_check input:checked ~ .checkmark {
    background-color: #3a57e8;
    border-color: #3a57e8;
}
.note-checkit .custom_check {
	color: #333548;
	font-size: 12px;
	font-weight: 600;
}
.wallet-widget.general-health {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-around;
	-webkit-justify-content: space-around;
	-ms-flex-pack: space-around;
	flex-direction: inherit;
}
.general-health .main-limit p {
	font-weight: 600;
}
.general-health.wallet-widget .circle-bar > div canvas {
    width: 135px;
    height: 135px;
}
.status-gray.re-shedule {
	color: #3a57e8;
	font-weight: 600;
	font-size: 12px;
}
.patient-table tbody tr td,
.patient-table tbody tr td h2 {
	font-weight: 500;
	color: #333448;
}
.patient-table tbody tr td:nth-child(3) {
	color: rgba(51, 52, 72, 0.5);
}
.treat-box {
	background: #FFFFFF;
	border-radius: 10px;
	padding: 15px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.user-imgs-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.user-imgs-blk img {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 50px;
	margin-right: 20px;
	border: 2px solid rgba(46, 55, 164, 0.2);
}
.active-user-detail h4 {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 5px;
}
.active-user-detail p {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}
.weight-blk .slick-slide {
  transition: all ease-in-out .3s;
  opacity: .2;
}
.weight-blk .slick-slide div {
	text-align: center;
}
.weight-blk .slick-slide span {
	opacity: 0;
}
.weight-blk .slick-slide h4 {
	margin-bottom: 0;
	font-size: 14px;
}
.weight-blk .slick-current span {
	opacity: 1;
	font-size: 12px;
}
.weight-blk .slick-active {
  opacity: .5;
}
.weight-blk .slick-current {
  opacity: 1;
}
.max-blk {
	width: 50%;
}
.weight-blk {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 14px;
	padding: 25px 0px 20px;
	position: relative;
}
.report-head h4 {
	margin-bottom: 0;
	font-size: 18px;
}
.report-head img {
	width: 40px;
	height: 40px;
}
.weight-blk:before {
	background-image: url(../img/icons/mass-icon.svg);
    content: "";
    position: absolute;
    width: 20px;
    height: 20px;
    background-repeat: no-repeat;
    left: 50%;
    top: 0px;
    -webkit-transform: translate(-50%, 0);
    -ms-transform: translate(-50%, 0);
    transform: translate(-50%, 0);
}
.weight-bar.progress {
	height: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 40px 0px 10px;
}
.weight-bar .progress-bar {
	width: 100px;
	background-color: #3a57e8;
	border-radius: 20px;
}
.weight-checkit {
	list-style: none;
	padding: 0;
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.pulse {
	display: block;
    position: absolute;
    top: 24px;
    right: 6px;
    width: 10px;
    height: 10px;
    border-radius: 50%;
    background: #00d3c7;
}
.pulse:before {
	content: "";
    top: 0px;
    right: 0px;
    width: 10px;
    height: 10px;
    position: absolute;
    border-radius: 50%;
    background: rgb(0 211 199 / 50%);
    cursor: pointer;
    box-shadow: 0 0 0 rgb(0 211 199);
    animation: pulse 1s linear infinite;
    z-index: 1;
}
@keyframes pulse {
	100% {
		transform: scale(2.5);
	}
}

/*-----------------
	10. Activity
-----------------------*/

.activity-box {
	position: relative;
}
.activity-list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}
.activity .activity-list > li .activity-user {
	height: 32px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 12px;
	left: 8px;
	width: 32px;
}
.activity .activity-list > li .activity-content {
	margin: 0 0 0 40px;
	padding: 0;
	position: relative;
}
.activity-list > li {
	margin-bottom: 10px;
	padding: 10px;
	position: relative;
}
.activity-list > li:last-child .activity-content {
	margin-bottom: 0;
}
.activity-user .avatar {
	height: 32px;
	line-height: 32px;
	margin: 0;
	width: 32px;
}
.activity-list > li .activity-user {
	background: #fff;
	height: 32px;
	left: -7px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 3px;
	width: 32px;
}
.activity-list > li .activity-content {
	background-color: #fff;
	margin: 0 0 20px 40px;
	padding: 0;
	position: relative;
}
.activity-list > li .time {
	color: rgba(51, 52, 72, 0.5);
	display: block;
	font-size: 12px;
	line-height: 1.35;
}
.activity-delete {
	background-color: #ffe5e6;
	border: 1px solid #fe0000;
	color: #fe0000;
	display: none;
	font-size: 20px;
	height: 20px;
	line-height: 18px;
	position: absolute;
	right: 0;
	text-align: center;
	top: 0;
	width: 20px;
}
.activity-delete:hover {
	background-color: #fe0000;
	color: #fff;
}
.activity-list > li:hover .activity-delete {
	display: inline-block;
}
.activity-list::before {
    background: rgba(46, 55, 164, 0.1);
    bottom: 0;
    content: "";
    left: 23px;
    position: absolute;
    top: 8px;
    width: 2px;
}
.timeline-group {
	margin-right: 20px;
	min-width: 100px;
}
.timeline-group h4 {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 0;
}
.timeline-group-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.comman-activitys {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 0px 16px 16px 16px;
	padding: 20px;
	width: 100%;
}
.comman-activitys h3 {
	color: #3a57e8;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 5px;
}
.comman-activitys h3 span {
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}
.comman-activitys p {
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0px;
	font-size: 12px;
}
.activity-sub-list li {
	margin-right: 10px;
}
.activity-sub-list li img {
	border-radius: 8px;
}
.activity-maps {
	border-radius: 8px;
	border: 2px solid #fff;
}
.activity-maps iframe {
	width: 100%;
}

/*-----------------
	11. Select2
-----------------------*/

.select2-container .select2-selection--single {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
	height: 40px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 38px;
	right: 7px;
}
.select2-container--default .select2-selection--single .select2-selection__arrow b {
	left: 50%;
    margin-left: -10px;
    margin-top: -2px;
    position: absolute;
    top: 50%;
    border-top: 0;
    border-left: 0;
    border-bottom: 1px solid #171717;
    border-right: 1px solid #171717;
    content: '';
    height: 6px;
    display: inline-block;
    pointer-events: none;
    -webkit-transform-origin: 66% 66%;
    -ms-transform-origin: 66% 66%;
    transform-origin: 66% 66%;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
    -webkit-transition: all 0.15s ease-in-out;
    transition: all 0.15s ease-in-out;
    width: 6px;
    vertical-align: 0px;
}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	 -webkit-transform: rotate(-135deg);
    -ms-transform: rotate(-135deg);
    transform: rotate(-135deg);
	border-top: 0;
    border-left: 0;
    border-bottom: 1px solid #171717;
    border-right: 1px solid #171717;
}
.select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 30px;
	padding-left: 15px;
}
.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #676767;
	font-size: 14px;
	font-weight: normal;
	line-height: 38px;
}
.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: #3a57e8;
}
.select2-container--default.select2-container--focus .select2-selection--multiple {
	border: 1px solid #eaeaea;
	border-radius: 0;
}
.select2-container--default .select2-selection--multiple {
	border: 1px solid #eaeaea;
	border-radius: 0;
}
.select2-container .select2-selection--multiple {
	min-height: 40px;
}
.select2-results__option {
	font-size: 14px;
}

/*-----------------
	12. Nav tabs
-----------------------*/

.nav-tabs > li > a {
	margin-right: 0;
	color: #888;
	border-radius: 0;
}
.nav-tabs > li > a:hover,
.nav-tabs > li > a:focus {
	border-color: transparent;
	color: #333;
}
.nav-tabs.nav-justified > li > a {
	border-radius: 0;
	margin-bottom: 0;
}
.nav-tabs.nav-justified.nav-tabs-solid > li > a {
	border-color: transparent;
}
.nav-tabs.nav-tabs-solid > li > a {
	color: #333;
}
.nav-tabs.nav-tabs-solid > li > a.active,
.nav-tabs.nav-tabs-solid > li > a.active:hover,
.nav-tabs.nav-tabs-solid > li > a.active:focus {
	background-color: #3a57e8;
	border-color: #3a57e8;
	color: #fff;
}
.nav-tabs.nav-tabs-solid.nav-tabs-rounded {
	border-radius: 50px;
}
.nav-tabs.nav-tabs-solid.nav-tabs-rounded > li > a {
	border-radius: 50px;
}
.nav-tabs.nav-tabs-solid.nav-tabs-rounded > li > a.active,
.nav-tabs.nav-tabs-solid.nav-tabs-rounded > li > a.active:hover,
.nav-tabs.nav-tabs-solid.nav-tabs-rounded > li > a.active:focus {
	border-radius: 50px;
}
.nav-tabs-justified > li > a {
	border-radius: 0;
	margin-bottom: 0;
}
.nav-tabs-justified > li > a:hover,
.nav-tabs-justified > li > a:focus {
	border-bottom-color: #ddd;
}
.nav-tabs-justified.nav-tabs-solid > li > a {
	border-color: transparent;
}

/*-----------------
	13. Holidays
-----------------------*/

.custom-table tr.holiday-completed {
	color: #aaa;
}
.modal-header.bg-danger .modal-title {
	color: #fff;
}
.dropdown.action-label {
	display: inline-block;
}
.action-label > a {
	display: inline-block;
	min-width: 103px;
}
.action-label .btn-sm {
	padding: 5px;
}

/*-----------------
	14. Edit Profile
-----------------------*/

.profile-img-wrap {
	height: 120px;
	position: absolute;
	width: 120px;
	background: #fff;
	overflow: hidden;
}
.profile-basic {
	margin-left: 140px;
}
.profile-img-wrap img {
	width: 120px;
	height: 120px;
}
.fileupload.btn {
	position: absolute;
	right: 0;
	bottom: 0;
	background: rgba(33, 33, 33, 0.5);
	border-radius: 0;
	padding: 3px 10px;
	border: none;
}
.fileupload input.upload {
	cursor: pointer;
	filter: alpha(opacity=0);
	font-size: 20px;
	margin: 0;
	opacity: 0;
	padding: 0;
	position: absolute;
	right: -3px;
	top: -3px;
	padding: 5px;
}
.btn-text {
	color: #fff;
}

/*-----------------
	15. Chat
-----------------------*/

.media .avatar{
	min-width: 36px;
}
.avatar {
	background-color: #aaa;
	border-radius: 50%;
	color: #fff;
	align-items: center;
	display: flex;
	justify-content: center;
	font-weight: 500;
	height: 38px;
	line-height: 38px;
	margin: 0 10px 0 0;
	overflow: hidden;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	vertical-align: middle;
	width: 38px;
	position: relative;
	white-space: nowrap;
	font-size: 14px;
	background: #3a57e8;
}
.avatar:hover {
	color: #fff;
}
.avatar > img {
	width: 100%;
	display: block;
}
.card.chat-box {
	padding: 20px;
	border-radius: 8px;
	width: 100%;
}
.card.chat-box-clinic {
	padding: 0;
	border-radius: 8px;
	width: 100%;
}
.chat-box-clinic .chat-user-group,
.chat-box-clinic .chat-search {
	padding: 10px 20px;
}
.chat-box-clinic .chat-user-group,
.chat-box-clinic .chat-search {
	margin-bottom: 20px;
}
.chat-box-clinic .chat-user-group:hover {
	background: #3a57e8;
}
.chat-box-clinic .chat-user-group:hover .user-titles h5,
.chat-box-clinic .chat-user-group:hover .chat-user-time p {
    color: #FFFFFF;
}
.chat-box-clinic .chat-user-group:hover .user-text p {
	color: rgba(255, 255, 255, 0.5);
}
.chat-user-group:hover .chat-user-count span {
	background: #fff;
	color: #3a57e8;
}
.chat-user-group {
	margin-bottom: 30px;
}
.chat-user-group-head .img-users {
    margin-right: 10px;
}
.chat-user-group-head {
	padding: 20px;
}
.chat-user-group-head .user-titles h5 {
    color: #3a57e8;
}
.chat-users {
	width: 100%;
}
.chat-users.user-main {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.user-dot-list {
	width: 40px;
	height: 40px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.user-dot-list a {
	color: #171717;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.chat-user-time,
.chat-user-count {
	margin-left: auto;
}
.user-titles h5 {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 3px;
}
.chat-user-time p,
.user-text p {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
}
.chat-user-count span {
	background: #3a57e8;
	border-radius: 50px;
	width: 15px;
	height: 15px;
	font-size: 10px;
	color: #fff;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.chat-user-count .user-check {
	background: none;
	color: #838383;
	font-size: 14px;
}
.chat-user-group .img-users {
	width: 45px;
	height: 45px;
	margin-right: 10px;
}
.user-check.active {
	color: #399E8D;
}
.chat-user-group .active-users {
    width: 8px;
    height: 8px;
    right: 5px;
    top: 0px;
}
.img-users {
	position: relative;
}
.active-users {
	width: 10px;
	height: 10px;
	background: green;
	border-radius: 50px;
	position: absolute;
	right: 0;
	border: 1px solid #FFFFFF;
}
.call-user img {
	width: 45px;
	height: 45px;
	border-radius: 50px;
}
.call-list-add li a {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	width: 50px;
	height: 50px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}
.call-list-add li {
	list-style: none;
	margin-right: 10px;
}
.call-list-add li:first-child a {
	width: 67px;
}
.call-list-add {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 0;
}
.chat-search .input-block {
	position: relative;
	width: 100%;
}
.chat-search {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	margin-bottom: 30px;
}
.add-search a {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	color: #3a57e8;
}
.add-search a:hover {
	background: #223d9f;
}
.add-search a:hover i {
	color: #fff;
}
.top-liv-search.top-chat-search .btn {
	left: 0;
	right: inherit;
}
.top-liv-search.top-chat-search .form-control {
	padding-left: 40px;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	border: 0;
}
.top-liv-search.top-chat-search .form-control::placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-size: 12px;
}
.chat-search-group {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.chat-search-list ul {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	padding: 0;
	margin-bottom: 0;
}
.chat-search-list ul li {
	padding: 10px 0px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 0px 10px;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
}
.chat-search-list ul li:last-child {
	margin-right: 0;
}
.card.chat-message-box {
	padding: 20px;
}
.message-sub-box h4 {
	color: #000000;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 15px;
}
.message-sub-box p {
	font-size: 12px;
	font-weight: 400;
	background: rgba(51, 52, 72, 0.1);
	border-radius: 0px 10px 10px 10px;
	padding: 10px;
	margin-bottom: 5px;
	max-width: 270px;
}
.message-sub-box span {
	color: rgba(51, 53, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}
.media.sent .media-body {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: end;
	-webkit-justify-content: end;
	-ms-flex-pack: end;
}
.media.sent .message-sub-box {
	text-align: right;
}
.media.sent .message-sub-box p {
	background: rgba(46, 55, 164, 0.1);
	border-radius: 0px 15px 15px 15px;
	color: #3a57e8;
}
.msg-sub-list {
	margin-bottom: 0;
}
.msg-sub-list li {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 8px;
	margin-bottom: 5px;
	padding: 5px;
	max-width: 270px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-size: 12px;
}
.msg-sub-list li:last-child {
	margin-bottom: 0;
}
.footer-discussion {
    display: inline-flex;
    width: 100%;
}
.footer-discussion .inputgroups {
    width: 100%;
	margin-top: 30px;
	position: relative;
}
.inputgroups input[type="text"] {
    width: 100%;
    height: 52px;
    padding-left: 32px;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	border: 0;
}
.inputgroups input[type="text"]::placeholder {
	font-size: 12px;
	color: rgba(51, 52, 72, 0.3);
}
.chat-footer-box {
	border-top: 2px solid rgba(46, 55, 164, 0.05);
	border-radius: 0px 0px 10px 10px;
}
.position-icon {
	position: absolute;
}
.micro-text {
	top: 15px;
	left: 10px;
}
.send-chat {
	background: #234CE3;
	border-radius: 8px;
	width: 52px;
	height: 52px;
	top: 0;
	right: 0;
}
.comman-flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.symple-text ul {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	margin-bottom: 0;
}
.symple-text ul li {
	list-style: none;
}
.symple-text {
	top: 15px;
    right: 65px;
}
.chat-heading h3 {
	margin-bottom: 20px;
}
.chat-users.chat-user-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.comman-space-flex {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.chat-user-blk .user-titles p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.chat-user-blk .user-text {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.chat-user-icon {
	margin-left: 15px;
}
.call-all {
	margin-bottom: 25px;
}
.call-all h4 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.call-all h4 span { 
	background: #0DBF0A;
	border-radius: 50px;
	width: 20px;
	height: 20px;
	color: #fff;
	font-size: 10px;
	margin-left: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.call-all h5 {
	margin-bottom: 0;
}
.call-all h5 a {
	color: #3a57e8;
	font-size: 14px;
	font-weight: 600;
}
.voice-call-user {
	margin-bottom: 30px;
}
.voice-call-user img {
	width: 80px;
	height: 80px;
	border-radius: 50px;
	margin-bottom: 10px;
}
.voice-call-user h3 {
	color: #333448;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}
.voice-call-user p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 0;
}
.voice-time {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	max-width: 191px;
	margin: auto;
}
.voice-time h3 {
	font-size: 26px;
	color: #3a57e8;
	font-weight: 600;
	margin-bottom: 0;
	padding: 10px;
}
.voice-menu ul {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 30px 0px;
	padding: 0;
}
.voice-menu ul li {
	margin-right: 20px;
	list-style: none;
}
.voice-menu ul li:last-child {
	margin-right: 0px;
}
.voice-menu ul li:hover a {
	background: #3a57e8;
	border: 1px solid #3a57e8;
}
.voice-menu ul li:hover img {
	filter: invert(1) brightness(100);
}
.voice-menu ul li a {
	width: 50px;
	height: 50px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.end-call-voice .btn-primary {
	background: #FE3F51;
	border-radius: 8px;
	min-width: 136px;
	padding: 10px 15px;
	font-size: 16px;
	font-weight: 600;
}
.end-call-voice .btn-primary:hover {
	background: #234ce3;
	border: 1px solid #234ce3;
}
.video-call-blk.chat-user-group:hover {
	border-radius: 8px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
}
.video-call-blk.chat-user-group {
	padding: 10px;
	margin-bottom: 15px;
}
.chat-user-group .user-titles h5 {
	color: #333448;
}
.message-sub-box h5 {
	color: rgba(51, 52, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}
.video-chat-show .message-sub-box p {
    font-size: 12px;
}
.video-chat-show ul li {
	margin-bottom: 15px;
}
.video-chat-show ul {
	margin-bottom: 0px;
	padding: 0;
}
.video-chat-show ul li:last-child {
	margin-bottom: 0px;
}

.calling-income h4 {
	color: #35446F;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 30px;
}
.crypto-income-blk .voice-call-user h3 {
    color: #35446F;
    font-size: 20px;
    font-weight: 700;
	margin-bottom: 5px;
}
.crypto-income-blk .voice-call-user p {
    color: #3a57e8;
    font-size: 14px;
    font-weight: 600;
}
.voice-menu-income .btn-primary {
	width: 60px;
	height: 60px;
	border-radius: 12px;
}
.voice-menu-income .call-remove {
	background: #FE3F51;
}
.voice-menu-income .call-received {
	background: #0DBF0A;
}
.top-liv-search.top-chat-search .btn {
	left: 0;
	right: inherit;
}
.top-liv-search .btn {
    background-color: transparent;
    border-color: transparent;
    color: rgba(17, 17, 17, 0.32);
    min-height: 45px;
    padding: 7px 15px;
    position: absolute;
    right: 0;
    top: 0;
    margin-bottom: 0;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

/*-----------------
	10. Join Call
-----------------------*/

.page-content {
	width: 100%;
}
.join-call {
	max-width: 950px;
    width: 100%;
    margin: 0 auto;
    padding-top: 50px;
}
.join-video {
	position: relative;
	margin-bottom: 30px;
}
.join-video img {
	border-radius: 10px;
    object-fit: cover;
}
.join-video.video-hide > img, .video-wrap.video-hide > video {
    display: none;
}
.video-avatar {
    color: #FFF;
    background: #5D5D5D;
    font-size: 50px;
    border-radius: 10px;
    height: 100%;
    width: 100%;
    position: absolute;
    top: 0;
    left: 0;
    display: none;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.video-avatar.active {
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
}
.video-avatar h4 {
	font-weight: 700;
	font-size: 24px;
	color: #FFFFFF;
}
.join-content {
	padding-bottom: 25px;
}
.join-content h3 {
	font-weight: 700;
	font-size: 22px;
	margin-bottom: 37px;
}
.join-content label {
	font-size: 20px;
	margin-bottom: 1.25rem;
}
.icon-mic {
	background: #31AA52;
    border-radius: 10px;
    width: 40px;
    height: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    color: #fff;
}
.icon-mic i {
    color: #fff;	
}
.btn-join {
	font-weight: 700;
    font-size: 20px;
    padding: 14px 20px;
    min-width: 192px;
    border-radius: 10px;
}
.btn-infos {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.btn-infos .btn-join {
	margin-right: 18px;
}
.btn-infos .icon-mic {
	margin-right: 15px;
}
.btn-infos span {
	font-size: 18px;
	color: #808184;
}
.call-icons {
	text-align: center;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
}
.call-icons .call-items {
    border-radius: 5px;
    padding: 0;
    margin: 0;
    list-style: none;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
	position: absolute;
    bottom: 60px;
	left: 50%;
	transform: translate(-50%, 0);
}
.call-icons .call-items .call-item {
	display: inline-block;
	text-align: center;
	margin-right: 15px;
}
.call-icons .call-items .call-item:last-child {
	margin-right: 0;
}
.call-icons .call-items .call-item a {
    color: #FFF;
    border: 1px solid #FFF;
	background: rgba(255, 255, 255, 0.07);
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
    width: 60px;
    height: 60px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 20px;
	white-space: nowrap;
}
.call-icons .call-items .call-item a:hover {
	opacity: 0.8;
}
.call-icons .call-items .call-item .mute-video.stop,
.call-icons .call-items .call-item .mute-bt.stop {
	background: #EB4132;
	border: 1px solid #EB4132;
}
.set-icon {
	position: absolute;
	top: 30px;
	right: 30px;
	z-index: 1;
}
.vert-icon, a.vert-icon {
	width: 40px;
	height: 40px;
	background: #FFFFFF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
	font-size: 18px;
	color: #000;
}
.voice-sec1 {
	width: 100%;
	height: 100%;
	top: 0;
	position: absolute;
}
.voice-sec {
	position: absolute;
	top: 30px;
	left: 30px;
	z-index: 1;
}
.voice-icon, a.voice-icon {
	width: 40px;
	height: 40px;
	background: #31AA52;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	font-size: 18px;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
	color: #FFF;
}
.voice-icon:hover, a.voice-icon:hover,
.vert-icon:hover, a.vert-icon:hover {
	opacity: 0.8;
}

/*-----------------
	Meeting Call
-----------------------*/

.meet-icons {
	padding: 40px 0px 20px;    
	margin-top: 40px;
	border-top: 2px solid rgba(46, 55, 164, 0.05);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
    justify-content: center;
}
.meet-icons .meet-items, .action-items {
    padding: 0;
    margin: 0;
    list-style: none;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
}
.meet-icons .meet-items .meet-item, .action-items .action-item {
	display: inline-block;
	text-align: center;
	margin-right: 15px;
}
.meet-icons .meet-items .meet-item:last-child, 
.action-items .action-item:last-child {
	margin-right: 0;
}
.meet-icons .meet-items .meet-item > a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
    color: #636e8e;
	border-radius: 8px;
    width: 50px;
    height: 50px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 20px;
}
.meet-icons .meet-items .meet-item > a:hover img {
	filter: invert(1) brightness(100);
}
.meet-icons .meet-items .meet-item > a:hover,
.action-items .action-item a:hover {
	opacity: 0.8;
	background: #3a57e8;
}
.meet-icons .meet-items .meet-item > a.showChatList.active,	
.meet-icons .meet-items .meet-item > a.showInviteList.active,
 .meet-icons .meet-items .meet-item > a.hand-raise.active,
.action-items .action-item a.record-icon.active {	
    background: #3a57e8;
}
.meet-icons .meet-items .meet-item > a.mute-bt.stop, 
.meet-icons .meet-items .meet-item > a.mute-video.stop {
    background: #3a57e8;
}
.meet-icons .meet-items .meet-item > a.mute-video.stop .feather-video-off {
	filter: invert(1) brightness(100);
}
.meet-icons .meet-items .meet-item > a.show {
	background: #0074E0;
}
.action-items .action-item a {
	width: 80px;
	height: 50px;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    display: -webkit-inline-box;
	display: -ms-inline-flexbox;
    display: inline-flex;
    font-size: 20px;	
	box-shadow: 0px 15px 15px rgba(229, 229, 229, 0.32);
	border-radius: 10px;
	color: #FFF;
}
.action-items .action-item a.share-icon {
	background: #EB4132;
}
.action-items .action-item a.callend-icon {
	background: #0074E0;
}
.action-items .action-item a.record-icon {
	background: #31AA52;
}
.end-calls {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
    justify-content: flex-end;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}
.action-icons {
	text-align: center;
}
.part-name {
	position: absolute;
	top: 20px;
	left: 20px;
	text-align: left;
}
.part-name h4 {
	font-weight: 600;
	font-size: 10px;
	color: #FFF; 
	margin-bottom: 0;
	overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
	background: #35446F;
	opacity: 0.75;
	backdrop-filter: blur(2.5px);
	border-radius: 8px;
	padding: 10px;
	display: inline-block;
}
.more-icon {
	position: absolute;
	top: 20px;
	right: 20px;
}
.more-icon a {
	color: #FFF;
	background: #35446F;
	opacity: 0.75;
	border-radius: 8px;
	width: 38px;
	height: 38px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.single-user .more-icon a {
	width: 30px;
	height: 30px;
}
.more-icon a:first-child {
	padding-left: 0;	
}
.more-icon a:hover {
	opacity: 0.8;
}
.meeting .part-name {
	top: inherit;
    left: 15px;
	bottom: 15px
}
.meeting .more-icon {
	top: 15px;
    right: 15px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}
.meeting-wrapper, .meeting {
	width: inherit;
	max-width: inherit;
}
.show-chat-list, .show-invite-list,
.show-chat-list .user-sidebar-right,
.show-invite-list .invite-sidebar-right {
    transition: all 0.8s ease;
}
.user-sidebar-right, .invite-sidebar-right {
    background: #dedede;
	border-radius: 10px;
    width: 410px;
    position: absolute;
    top: 105px;
    bottom: 117px;
    right: 0;
    margin-right: -410px;
    transition: all 0.8s ease;
    overflow: hidden;
    font-size: 13px;
	z-index: 3;
}
.join-contents {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	box-sizing: border-box;
	width: 100%;
	max-width: 950px;
	margin: 0 auto;
	overflow: hidden;
}
.join-contents.grid-view {
    align-content: center;
}
.ripple {
	width: 114px;
    height: 114px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.multigrid-view .text-box {
    height: 61px;
    width: 61px;
}
.multigrid-view .ripple {
	width: 80px;
    height: 80px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.meeting .join-video {
    margin: 0 5px 10px;	
	width: 100%;
	height: 309px;
}
.join-video.user-active {
	background: #415B6A;
    border-radius: 10px;
}
.join-video.single-user {
    width: 23%;	
	flex-grow: 1;
    box-sizing: border-box;
    margin: 0 5px 10px;
    -webkit-box-pack: justify;
	-ms-flex-pack: justify;
    justify-content: space-between;
    text-align: center;
	height: auto;
	background: #415B6A;
    border-radius: 10px;
	padding: 0;
}
.multigrid-view .join-video.single-user {
    width: calc(20% - 10px);
	flex-grow: 0;
}
.join-video.single-user img {
	height: auto;
}
.text-avatar h4 {
	color: #FFF;
}
.text-avatar {
	color: #FFF;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
}
.text-box {
    height: 86px;
    width: 86px;	
    border-radius: 50%;
    background-color: rgba(0, 0, 0, 0.2);
    font-size: 36px;
	font-weight: 700;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}
.settings-menu {
	background: #E4EEFF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.13);
	border-radius: 10px;
	padding: 0 15px;
}
.settings-menu li a {
	padding: 12px 0;
	border-bottom: 1px solid #FFFFFF;
	width: auto;
	height: auto;
	background: #E4EEFF;
	font-weight: 600;
	font-size: 14px;
    color: #000;
}
.settings-menu li a:focus, .settings-menu li a:hover {
    color: #000;
    background-color: #E4EEFF;
}
.settings-menu li:last-child a {
	border: 0;
}
.settings-menu .user-img {
	font-size: 18px;
}
.settings-menu .user-img img {
	width: 36px;
    border-radius: 10px;
}
.settings-menu.setting-list-menu li a {
	background: transparent;
}
.overlay-icon {
	background: rgba(0, 0, 0, 0.7);
	border-radius: 10px;
	width: 44px;
	display: -webkit-box;
	display: -ms-flexbox;
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 42px;
    left: 15px;
	opacity: 0;
	transition: opacity .3s linear;
}
.overlay-icon a {
	color: #FFF;
    padding: 3px 0;
	font-size: 14px;
	text-align: center;
}
.overlay-icon a:hover {
	opacity: 0.8;
}
.join-video.single-user::before, .meeting .join-video::before  {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	content: "";
	border-radius: 10px;
	opacity: 0;
	transition: opacity .3s linear;
}
.join-video.single-user:hover::before, .meeting .join-video:hover::before  {
	opacity: 1;
}
.join-video.single-user:hover .overlay-icon, .join-video:hover .overlay-icon {
	opacity: 1;
}
.more-icon.mic-view .mic-off {
	display: block;
}
.grid-view .join-video.single-user {
    width: 48%;	
}
.join-contents.multigrid-view {
	max-width: 100%;
	padding: 25px 100px 0;
	justify-content: center;
}
.meeting-list {
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
	position: relative;
}
.user-active .more-icon .handraise-on.active {
	display: block;
	animation: mymove 5s;
}
.user-active .more-icon .handraise-on.active .meeting .join-video.user-active::before {
	animation: mymove 5s infinite;
	opacity: 1;
}
@keyframes mymove {
	from {color: #0074E0;}
	to {color: transparent;}
}
.join-contents.vertical-view {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
	align-content: center;
	max-width: 1300px;
}
.join-contents.vertical-view .join-video.user-active {
	flex: 1;
	margin-bottom: 5px;;
}
.join-contents.vertical {
	flex-direction: column;
	height: 200px;
}
.join-contents.vertical-view .join-video.single-user {
    width: 97%;
    flex-grow: 1;
}
.meeting .join-contents.vertical .join-video.user-active {
	flex: 1 0 100%;
}
.meeting .join-contents.vertical .join-video.single-user {
	flex: 0;
}
.meeting .join-contents.vertical .join-video {
	width: auto;
}
.ptro-holder-wrapper {
	top: 80px !important;
	position: relative  !important;
	height: auto !important;
	bottom: 300px;
	z-index: 4;
}
.chat-footer .btn:hover {
	background: #0066c5;
	color: #FFF;
}
.person-view {
	width: 40px;
	height: 40px;
	background: #415B6A;
	border-radius: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
	margin-right: 16px;
	color: #FFF;
	font-weight: 700;
	font-size: 14px;
}
.end-call-chat .btn-primary {
	min-width: 136px;
	background: #FE3F51;
	border-radius: 8px;
	margin: 0px 20px;
	padding: 12px 15px;
	font-size: 16px;
}

/*-----------------
	Email
-----------------------*/

.compose-mail .btn-primary {
	font-size: 14px;
	font-weight: 500;
	min-width: 100%;
	padding: 10px 15px;
	margin-bottom: 30px;
}
.email-menu-blk ul {
	padding: 0;
}
.email-menu-blk ul li {
	list-style: none;
}
.email-menu-blk ul li a {
	color: rgba(51, 52, 72, 0.5);
	font-size: 15px;
	font-weight: 500;
	padding: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	border-radius: 8px;
	margin-bottom: 5px;
}
.email-menu-blk ul li a:hover {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}
.email-menu-blk ul li.active a {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}
.email-menu-blk ul li.active span {
	background: #00D3C7;
	border-radius: 20px;
	color: #fff;
	font-weight: 600;
}
.email-menu-blk ul li span {
	font-size: 14px;
	margin-left: auto;
	width: 45px;
	height: 26px;
}
.sub-mails {
	padding: 0;
	position: absolute;
    top: 13px;
    right: 20px;
}
.sub-mails li { 
	padding: 0px 5px;
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}
.summer-mail .card .card-header {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
}
.summer-mail .note-editor.note-frame {
    border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
}
.chat-user-group .user-titles.user-head-compse h5 {
    color: #3a57e8;
}
.label-blk {
	margin-bottom: 20px;
}
.label-blk h4 {
	margin-bottom: 0;
	color: #333448;
	font-size: 16px;
	font-weight: 600;
}
.label-add-list li .add-list-btn {
	width: 30px;
	height: 30px;
	background: rgba(46, 55, 164, 0.05);
	border-radius: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.label-add-list li .add-list-btn:hover {
	background: #234CE3;
	color: #fff;
}
.top-action-right ul li {
	margin-right: 20px;
}
.top-action-right ul li:last-child {
	margin-right: 0px;
}
.top-liv-search.top-action-search .form-control {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	border: 0;
}
.top-inbox-blk {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	width: 40px;
	height: 40px;
}
.top-inbox-blk .dropdown-menu {
	text-align: center;
	padding: 0;
	border: 0;
	background: linear-gradient(51.64deg, rgba(255, 255, 255, 0) 34.2%, rgba(255, 255, 255, 0.5) 97.35%, rgba(255, 255, 255, 0) 160.66%), rgba(255, 255, 255, 0.8);
	box-shadow: 0px 4px 9px #E1ECFF, inset 0px 0px 15px rgba(255, 255, 255, 0.35);
	backdrop-filter: blur(5px);
	border-radius: 5px;
}
.top-inbox-blk .dropdown-menu .dropdown-item {
	border-bottom: 1px solid #EBEBF6;
	font-size: 14px;
	font-weight: 600;
	color: #333448;
	padding: 10px;
}
.top-inbox-blk .dropdown-menu .dropdown-item:last-child {
	border-bottom: 0px;
}
.top-recheck .custom_check input {
	position: relative;
}
.top-check .form-check-input {
	border: 2px solid rgba(51, 52, 72, 0.2);
	border-radius: 4px;
	width: 18px;
	height: 18px;
}
.top-check .form-check-input:checked[type=checkbox] {
	background-color: #234ce3;
}
.form-check-input:checked {
    background-color: #3d59e9;
    border-color: #3d59e9;
}
.select-gender .form-check-input:focus {
	box-shadow: none;
}
.top-check .form-check-input:focus {
	box-shadow: none;
}
.email-content .table-inbox tr {
    background: #fff;
	border-radius: 5px;
}
.email-content .table-inbox tr td {
	vertical-align: middle;
	padding: 15px;
	color: #6586BF;
	white-space: nowrap;
}
.email-img img { 
	border-radius: 50px;
	width: 48px;
	height: 48px;
	margin-right: 10px;
}
.send-user h4 {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 5px;
}
.send-user p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.email-img-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.send-user h4 span {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 5px;
	margin-left: 10px;
	font-size: 10px;
	border-radius: 8px;
}
.send-user .email-market {
	background: rgba(0, 211, 199, 0.15);
	color: #00D3C7;
}
.email-office {
	background: rgba(13, 191, 10, 0.15);
	color: #0DBF0A;
}
.email-bills {
	background: rgba(254, 63, 81, 0.15);
	color: #FE3F51;
}
.email-work {
	background: rgba(255, 182, 39, 0.15);
	color: #FFB627;
}
.send-user h4 {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.compose-mail h3 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 30px;
}
.mail-send {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: end;
	-webkit-justify-content: end;
	-ms-flex-pack: end;
}
.mail-send .btn-primary {
	margin-bottom: 0;
	min-width: 111px;
	border-radius: 12px;
}
.mail-reports ul li .ford-angle {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	transform: matrix(-1, 0, 0, 1, 0, 0);
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	width: 40px;
	height: 40px;
}
.mail-reports ul li .ford-angle:hover {
	background: rgb(35 76 227 / 50%);
}
.mail-reports ul li .ford-angle:hover img,
.mail-reports ul li .ford-angle:hover i {
	filter: invert(1) brightness(100);
}
.mail-reports ul li {
	margin-right: 10px;
}
.mail-reports ul li:last-child {
	margin-right: 0px;
}
.mail-view-list {
	margin-bottom: 25px;
}
.mail-view-list li {
	margin-right: 10px;
}
.mailview-inner p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 13px;
	font-weight: 600;
}
.thank-mail {
	margin-bottom: 40px;
}
.thank-mail h5 {
	color: #35446F;
	font-size: 14px;
	margin-bottom: 0;
}
.thank-mail h4 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
}
.forward-send .btn-primary {
	padding: 10px 15px;
	padding: 7px 23px;
	margin-bottom: 0;
	border: 2px solid transparent;
	font-size: 14px;
}
div.dataTables_wrapper div.dataTables_info {
    padding-bottom: 0.85em;
}
div.dataTables_wrapper div.dataTables_paginate {
    padding-right: 15px;
}
.forward-send .forwrd-btn {
	background: transparent;
	border: 2px solid #234CE3;
	color: #234CE3;
	font-weight: 600;
}
.forward-send .forwrd-btn:hover {
	background: #234CE3;
	border: 2px solid #234CE3;
	color: #fff;
}
.forward-send .forwrd-btn:hover img {
	filter: invert(1) brightness(100);
}
.custom-file-upload {
    background: linear-gradient(51.64deg, rgba(255, 255, 255, 0) 34.2%, rgba(255, 255, 255, 0.2) 97.35%, rgba(255, 255, 255, 0) 160.66%), rgba(255, 255, 255, 0.2);
	border: 2px solid #FFFFFF;
	border-radius: 8px;
    display: inline-flex;
    transition: border-color .3s;
    width: 100%;
    font-size: 14px;
    cursor: pointer;
    margin-top: 0;
    height: 53px;
    color: #000;
    position: relative;
}
.custom-file-upload input {
    display: none;
}
.custom-file-upload .file-upload-text {
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    padding-left: 15px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.change-user {
    padding: 10px 18px;
    background: #6586BF;
	border-radius: 8px;
    font-size: 16px;
    color: #FFF;
    position: absolute;
    right: 0;
	margin: 2px;
	min-width: 177px;
	text-align: center;
}
.sender-img img {
	width: 48px;
	height: 48px;
}
.send-user.send-user-name h4 {
	font-size: 15px;
}
.send-user.send-user-name h4 span {
	padding: 5px 15px;
}
.send-user p span {
	color: #333448;
	font-weight: 600;
}
.mail-reports ul li .ford-angle.star-bg {
	background: transparent;
	margin-right: 0;
}
.ford-angle.star-bg i {
	color: #FFB627;
}
.mail-attach .msg-sub-list li {
	max-width: 100%;
	margin-bottom: 0;
	margin-right: 10px;
}
.mail-attach .msg-sub-list li i {
	color: #FE3F51;
}
.mail-attach {
	margin-bottom: 40px;
}
.view-content-bottom {
	border-bottom: 2px solid #FFFFFF;
	padding-bottom: 40px;
	margin-bottom: 40px;
}
.mail-attach h2 {
	color: #35446F;
	font-size: 16px;
	font-weight: 600;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.mail-attach h2 a {
	color: #3a57e8;
	font-size: 14px;
}
.setting-title p {
	margin-bottom: 0;
}

/*-----------------
	16. Focus Label
-----------------------*/

.form-focus {
	display: flex;
	height: 50px;
	position: relative;
}
.form-focus .focus-label {
	font-size: 16px;
	font-weight: 400;
	opacity: 0.4;
	pointer-events: none;
	position: absolute;
	-webkit-transform: translate3d(0, 22px, 0) scale(1);
	-ms-transform: translate3d(0, 22px, 0) scale(1);
	-o-transform: translate3d(0, 22px, 0) scale(1);
	transform: translate3d(0, 22px, 0) scale(1);
	transform-origin: left top;
	transition: 240ms;
	left: 12px;
	top: -8px;
	z-index: 1;
	color: #888;
}
.form-focus.focused .focus-label {
	opacity: 1;
	font-weight: 300;
	top: -14px;
	font-size: 12px;
	z-index: 1;
}
.form-focus .form-control {
	height: 50px;
	padding: 21px 12px 6px;
}
.form-focus .form-control::-webkit-input-placeholder {
	color: transparent;
	transition: 240ms;
}
.form-focus .form-control:focus::-webkit-input-placeholder {
	transition: none;
}
.form-focus.focused .form-control::-webkit-input-placeholder {
	color: #bbb;
}
.profile-basic .cal-icon {
	width: 100%;
}
.form-focus .select2-container .select2-selection--single {
	border: 1px solid #ccc;
	height: 50px;
	border-radius: 0;
}
.form-focus .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 48px;
	right: 7px;
}
.form-focus .select2-container--default .select2-selection--single .select2-selection__arrow b {
	border-color: #ccc transparent transparent;
	border-style: solid;
	border-width: 6px 6px 0;
	height: 0;
	left: 50%;
	margin-left: -10px;
	margin-top: -2px;
	position: absolute;
	top: 50%;
	width: 0;
}
.form-focus .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	border-color: transparent transparent #ccc;
	border-width: 0 6px 6px;
}
.form-focus .select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 30px;
	padding-left: 12px;
	padding-top: 10px;
}
.form-focus .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #676767;
	font-size: 14px;
	font-weight: normal;
	line-height: 38px;
}
.form-focus .select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: #fc6075;
}
.file-size {
	color: #888;
}

/*-----------------
	17. Leave
-----------------------*/

.filter-row .btn {
	border-radius: 0;
	min-height: 50px;
	padding: 12px;
	text-transform: uppercase;
}
.form-focus.select-focus .focus-label {
	opacity: 1;
	font-weight: 300;
	top: -20px;
	font-size: 12px;
	z-index: 1;
}
.action-label .label {
	display: inline-block;
	min-width: 85px;
	padding: 0.5em 0.6em;
}
.action-label i {
	margin-right: 3px;
}
.action-label .dropdown-menu > li > a {
	padding: 3px 10px;
}

/*-----------------
	18. Employee
-----------------------*/

.action-icon {
	color: #777;
	font-size: 14px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	width: 31px;
	height: 31px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin-left: auto;
}
.table .dropdown-menu {
	font-size: 12px;
	padding: 0;
}
.profile-widget {
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
	margin-bottom: 30px;
	padding: 20px;
	text-align: center;
	position: relative;
	overflow: hidden;
}
.profile-widget .user-name > a {
	color: #333;
}
.dropdown.profile-action {
	position: absolute;
	right: 5px;
	text-align: right;
	top: 10px;
}
.profile-action .dropdown-toggle:after {
	display: none;
}
.profile-img {
	cursor: pointer;
	height: 80px;
	margin: 0 auto;
	position: relative;
	width: 80px;
}
.profile-img .avatar {
	font-size: 24px;
	height: 80px;
	line-height: 80px;
	margin: 0;
	width: 80px;
}
.mobile-no > a {
	color: #777;
	display: inline-block;
}
.staff-mail > a {
	color: #777;
	display: inline-block;
	margin-top: 5px;
}
.staff-action-btns {
	margin-top: 10px;
}
.staff-id {
	margin-top: 5px;
}
.view-icons {
	float: right;
	margin-right: 10px;
}
.view-icons .btn {
	color: #888;
	font-size: 18px;
	margin-right: 5px;
	padding: 4px;
}
.view-icons .btn.active {
	color: #333;
}
.attent-status {
	background: rgba(0, 211, 199, 0.15);
	border-radius: 6px;
	width: 26px;
	height: 26px;
	color: #00D3C7;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.present-table {
	background: rgba(0, 211, 199, 0.15);
	color: #00D3C7;
}
.absent-table {
	background: rgba(255, 54, 103, 0.1);
	color: #FF3667;
}
.month-table h5 {
	font-weight: 500;
	font-size: 14px;
}
.attent-table thead tr th:first-child {
	color: #333448;
}
.attent-table thead tr th {
	font-weight: 600;
	font-size: 14px;
	color: #3a57e8;
}
.attent-table .week-days {
	color: rgba(51, 52, 72, 0.2);
}

/*-----------------
	19. Events
-----------------------*/

.calendar {
	float: left;
	margin-bottom: 0;
}
.fc-view {
	margin-top: 10px;
}
a.fc-event:not([href]) {
    color: #fff;
}
.none-border .modal-footer {
	border-top: none;
}
.fc-toolbar h2 {
	font-size: 18px;
	font-weight: 600;
	font-family: 'Rubik', sans-serif;
	line-height: 30px;
	text-transform: uppercase;
}
.fc-day-grid-event .fc-time {
	font-family: 'Rubik', sans-serif;
}
.fc-day {
	background: #fff;
}
.fc-toolbar .fc-state-active,
.fc-toolbar .ui-state-active,
.fc-toolbar button:focus,
.fc-toolbar button:hover,
.fc-toolbar .ui-state-hover {
	z-index: 0;
}
.fc th.fc-widget-header {
	background: #eeeeee;
	font-size: 14px;
	line-height: 20px;
	padding: 10px 0;
	text-transform: uppercase;
}
.fc-unthemed th,
.fc-unthemed td,
.fc-unthemed thead,
.fc-unthemed tbody,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-row,
.fc-unthemed .fc-popover {
	border-color: #f3f3f3;
}
.fc-button {
	background: #f1f1f1;
	border: none;
	color: #797979;
	text-transform: capitalize;
	box-shadow: none !important;
	border-radius: 3px !important;
	margin: 0 3px !important;
	padding: 6px 12px !important;
	height: auto !important;
}
.fc-text-arrow {
	font-family: inherit;
	font-size: 16px;
}
.fc-state-hover {
	background: #f3f3f3;
}
.fc-state-highlight {
	background: #f0f0f0;
}
.fc-state-down,
.fc-state-active,
.fc-state-disabled {
	background-color: #00d3c7;
	color: #fff;
	text-shadow: none;
}
.fc-cell-overlay {
	background: #f0f0f0;
}
.fc-unthemed .fc-today {
	background: #fff;
}
.fc-event {
	border-radius: 2px;
	border: none;
	cursor: move;
	font-size: 13px;
	margin: 1px 7px;
	padding: 5px;
	text-align: center;
}
.fc-basic-view td.fc-week-number span {
	padding-right: 8px;
	font-weight: 700;
	font-family: 'Rubik', sans-serif;
}
.fc-basic-view td.fc-day-number {
	padding-right: 8px;
	font-weight: 700;
	font-family: 'Rubik', sans-serif;
}

/*-----------------
	20. Profile
-----------------------*/

.card-box.profile-header {
	margin: 0;
}
.profile-details {
	text-align: center;
}
.personal-info li .title {
	color: #515365;
	float: left;
	font-weight: 500;
	margin-right: 30px;
	width: 30%;
	font-size: 14px;
}
.personal-info li .text {
	color: #888da8;
	display: block;
	overflow: hidden;
	font-size: 14px;
}
.personal-info li {
	margin-bottom: 10px;
}
.personal-info {
	list-style: none;
	margin-bottom: 0;
	padding: 0;
}
.personal-info .text > a {
	color: #3a57e8;
	font-size: 14px;
}
.profile-view .profile-img-wrap {
	height: 150px;
	width: 150px;
}
.profile-view .profile-img {
	width: 150px;
	height: 150px;
}
.profile-view .profile-img .avatar {
	font-size: 24px;
	height: 150px;
	line-height: 150px;
	margin: 0;
	width: 150px;
}
.profile-view .profile-basic {
	margin-left: 170px;
}
.staff-msg {
	margin-top: 30px;
}
.experience-box {
	position: relative;
}
.experience-list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}
.experience-list:before {
	background: #ddd;
	bottom: 0;
	content: "";
	left: 8px;
	position: absolute;
	top: 8px;
	width: 2px;
}
.experience-list > li {
	position: relative;
}
.experience-list > li:last-child .experience-content {
	margin-bottom: 0;
}
.experience-user .avatar {
	height: 32px;
	line-height: 32px;
	margin: 0;
	width: 32px;
}
.experience-list > li .experience-user {
	background: #fff;
	height: 10px;
	left: 4px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 4px;
	width: 10px;
}
.experience-list > li .experience-content {
	background-color: #fff;
	margin: 0 0 20px 40px;
	padding: 0;
	position: relative;
}
.experience-list > li .experience-content .timeline-content {
	color: #9e9e9e;
}
.experience-list > li .experience-content .timeline-content a.name {
	color: #616161;
	font-weight: bold;
	font-size: 14px;
}
.experience-list > li .time {
	color: #bdbdbd;
	display: block;
	font-size: 12px;
	line-height: 1.35;
}
.before-circle {
	background-color: #ddd;
	border-radius: 50%;
	height: 10px;
	width: 10px;
}
.skills > span {
	border: 1px solid #ccc;
	border-radius: 500px;
	display: block;
	margin-bottom: 10px;
	padding: 6px 12px;
	text-align: center;
}
.profile-info-left {
	border-right: 2px dashed #ccc;
}
.profile-info-left h3 {
	font-size: 20px;
}
.profile-info-left .staff-id {
	font-size: 15px;
}
.profile-tabs .nav-tabs {
	background-color: #fff;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}
.alert {
	font-size: 14px;
}

/*-----------------
	21. Notifications
-----------------------*/

.notifications {
	padding: 0;
}
.notifications .drop-scroll {
	height: 290px;
	width: 400px;
}
.notifications.msg-noti .drop-scroll {
	width: 310px;
}
.notifications .notification-heading {
	margin: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.45;
	color: #616161;
}
.notifications .notification-time {
	font-size: 12px;
	line-height: 1.35;
	color: #bdbdbd;
}
.notification-list {
	list-style: none;
	padding: 0;
	margin: 0;
}
.notifications ul.notification-list > li {
	margin-top: 0;
	border-bottom: 1px solid #f5f5f5;
}
.notifications ul.notification-list > li:last-child {
	border-bottom: none;
}
.notifications ul.notification-list > li a {
	display: block;
	padding: 12px;
	border-radius: 2px;
}
.notifications ul.notification-list > li a:hover {
	background-color: #fafafa;
}
.drop-scroll {
	overflow-y: scroll;
	position: relative;
}
.topnav-dropdown-header {
	border-bottom: 1px solid #eee;
	text-align: center;
}
.topnav-dropdown-header,
.topnav-dropdown-footer {
	font-size: 12px;
	height: 32px;
	line-height: 32px;
	padding-left: 12px;
	padding-right: 12px;
}
.topnav-dropdown-footer a {
	display: block;
	text-align: center;
	color: #333;
}
.user-menu.nav > li > a .badge {
	color: #fff;
	font-size: 60%;
	font-weight: 700;
	position: absolute;
	right: 3px;
	top: 6px;
}
.user-menu.nav > li > a > i {
	font-size: 16px;
	line-height: 55px;
}
.noti-details {
	color: #989c9e;
	margin: 0;
}
.noti-time {
	margin: 0;
}
.noti-title {
	color: #333;
}

/*-----------------
	22. Roles & Permissions
-----------------------*/

.roles-menu {
	margin-top: 20px;
}
.roles-menu > ul {
	background-color: #fff;
	border: 1px solid #eaeaea;
	border-radius: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}
.roles-menu > ul > li {
	display: block;
	position: relative;
}
.roles-menu > ul > li > a {
	border-left: 3px solid transparent;
	color: #333;
	display: block;
	padding: 10px 15px;
	position: relative;
}
.roles-menu > ul > li.active > a {
	border-color: #009efb;
	color: #009efb;
}
.roles-menu > ul > li > a:hover {
	border-color: #009efb;
	background-color: #eee;
}
.material-switch > input[type="checkbox"] {
	display: none;
}
.material-switch > label {
	cursor: pointer;
	height: 0px;
	position: relative;
	width: 40px;
}
.material-switch > label:before {
	background: rgb(0, 0, 0);
	box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
	border-radius: 8px;
	content: '';
	height: 16px;
	margin-top: -8px;
	position: absolute;
	opacity: 0.3;
	transition: all 0.4s ease-in-out;
	width: 40px;
}
.material-switch > label:after {
	background: rgb(255, 255, 255);
	border-radius: 16px;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	content: '';
	height: 24px;
	left: -4px;
	margin-top: -8px;
	position: absolute;
	top: -4px;
	transition: all 0.3s ease-in-out;
	width: 24px;
}
.material-switch > input[type="checkbox"]:checked + label:before {
	background: inherit;
	opacity: 0.5;
}
.material-switch > input[type="checkbox"]:checked + label:after {
	background: inherit;
	left: 20px;
}
.role-action {
	display: none;
	float: right;
	position: absolute;
	right: 8px;
	top: 8px;
}
.roles-menu > ul > li:hover .role-action {
	display: block;
}
.slide-nav .sidebar {
	margin-left: 0;
}
.action-circle {
	background: transparent;
	border: 1px solid #ccc;
	border-radius: 100%;
	height: 20px;
	width: 20px;
	display: inline-block;
	text-align: center;
	cursor: pointer;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.action-circle .material-icons {
	color: #ccc;
	font-size: 18px;
	vertical-align: -3px;
}
.action-circle.completed {
	background: #35BA67;
	border: 1px solid #2fa65c;
}
.action-circle.completed .material-icons {
	color: #fff;
}
.action-circle.large {
	height: 24px;
	width: 24px;
}
.action-circle.large .material-icons {
	font-size: 16px;
	vertical-align: -4px;
}
.sidebar-overlay {
	display: none;
	position: fixed;
	z-index: 90;
	height: 100%;
	left: 0;
	top: 50px;
	width: 100%;
	z-index: 99;
	background-color: rgba(0, 0, 0, 0.6);
	overflow: hidden;
}
.menu-opened .sidebar-overlay {
	display: block;
}
.sidebar-menu.opened {
	opacity: 1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	-o-transform: translateX(0px);
	transform: translateX(0px);
	margin-left: 0;
}
html.menu-opened {
	overflow: hidden;
}
html.menu-opened body {
	overflow: hidden;
}
.chat-profile-view.opened {
	margin-right: 0;
}
.menu-opened .message-view.chat-view {
	width: 100%;
}

/*-----------------
	23. Chat Right Sidebar
-----------------------*/

.fixed-header .custom-menu {
	margin: 1px 0 0;
}
.topnav-dropdown-footer {
	border-top: 1px solid #eee;
}
.notification-box {
	bottom: 0;
	margin-right: -300px;
	position: fixed;
	right: 0;
	top: 70px;
	transition: all 0.4s ease 0s;
	width: 300px;
	z-index: 101;
	border-left: 1px solid #ddd;
}
.open-msg-box .notification-box {
	margin-right: 0;
}
.msg-sidebar {
	background-color: #fff;
}
.list-box {
	list-style: none;
	padding-left: 0;
}
.list-item.new-message {
	background-color: rgba(0, 0, 0, 0.2);
}
.list-item {
	border-bottom: 1px solid #eaeaea;
	padding: 10px;
	position: relative;
}
.list-left {
	height: 48px;
	position: absolute;
	width: 48px;
}
.files-icon {
	background-color: #f5f5f5;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-block;
	height: 38px;
	line-height: 38px;
	text-align: center;
	width: 38px;
}
.files-icon i {
	color: #777;
	font-size: 20px;
}
.list-body {
	padding: 0 0 0 50px;
}
.message-author {
	color: #333448;
	float: left;
	font-weight: bold;
	width: 175px;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 600;
}
.message-time {
	color: #888;
	float: right;
	font-size: 11px;
}
.message-content {
	color: #333;
	font-size: 11px;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/*-----------------
	24. Invoice
-----------------------*/

.invoice-details,
.invoice-payment-details > li span {
	float: right;
	text-align: right;
}
.attach-files > ul {
	list-style: none;
	margin: 0;
	padding: 0;
}
.attach-files li {
	display: inline-block;
	margin-right: 10px;
	position: relative;
}
.attach-files li img {
	width: 50px;
}
.file-remove {
	color: #f00;
	position: absolute;
	right: -6px;
	top: -7px;
}
.attach-files li:last-child {
	margin-right: 0;
}
.inv-logo {
	height: auto;
	margin-bottom: 20px;
	max-height: 100px;
	width: auto;
}
.form-amt {
	border: 1px solid #fff;
}
.page-title-icon {
	display:inline-flex;
    justify-content: center;
    align-items: center;
    width: 36px;
    height: 36px;
    border-radius: 4px;
    text-align: center;
}

.invoices-links:last-child {
    margin-right: 0px;
}
.invoices-links {
    color: #1B2559;
    margin-right: 20px;
}
.invoice-inner-datepic {
    border: 0;
    padding-left: 0;
}
.invoice-inner-datepic {
    border: 0;
    padding-left: 0;
}
.invoices-form .inovices-month-info .form-control {
    height: 42px;
}
.app-listing {
    padding: 0;
    margin: 0 -15px;
    list-style: none;
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
}
.app-listing > li {
    width: 20%;
    padding-left: 10px;
    padding-right: 10px;
}
.multipleSelection {
    position: relative;
    margin-bottom: 20px;
}
.multipleSelection .selectBox, 
.SortBy .selectBoxes {
    position: relative;
    background: #fff;
    width: 100%;
    padding: 11px 10px;
    font-weight: 400;
    background: #FFFFFF;
	border: 2px solid rgba(46, 55, 164, 0.1);
    border-radius: 10px;
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    justify-content: space-between;
    cursor: pointer;
}
.selectBox p {
    color: #1B2559;
    font-weight: 500;
	font-size: 14px;
}
.selectBox p .select-icon {
    color: #3a57e8;
    width: 20px;
    height: 20px;
}	
.multipleSelection #checkBoxes, .SortBy #checkBox {
    display: none;
    position: absolute;
    width: 300px;
    left: 0;
    z-index: 1;
    margin-top: 10px;
    padding: 20px;
    background: #FFFFFF;
    border: 1px solid #F2ECFF;
    box-shadow: 0px 4px 44px rgb(231 234 252 / 75%);
    border-radius: 6px;
}
.multipleSelection #checkBoxes::before, .SortBy #checkBox::before {
    border: 7px solid #F2ECFF;
    border-color: transparent transparent #ffffff #ffffff;
    box-shadow: -2px 2px 2px -1px rgb(0 0 0 / 10%);
    content: "";
    left: 30px;
    position: absolute;
    top: 0;
    -webkit-transform-origin: 0 0;
    transform-origin: 0 0;
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
}
.checkbox-title {
    font-weight: 600;
    font-size: 15px;
    color: #3a57e8;
    margin-bottom: 14px;
}
#checkBoxes .form-custom {
    margin-bottom: 14px;
}
.selectBox-cont {
    height: 220px;
    overflow-y: auto;
    padding: 5px;
}
#checkBoxes-one .btn-grey {
	background: #55ddff30;
	color: #1B2559;
	margin-top: 10px;
	border: none;
}
.custom_check {
    color: #1B2559;
    display: inline-block;
    position: relative;
    font-size: 13px;
    margin-bottom: 15px;
    padding-left: 30px;
    cursor: pointer;
    font-weight: 400;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.custom_check input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
}
.custom_check .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    border: 1px solid #C4C4C4;
    background-color: transparent;
    border-radius: 0;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.custom_check input:checked ~ .checkmark:after {
    display: block;
}
.custom_check .checkmark::after {
    content: "\f00c";
    font-family: "Font Awesome 5 Free";
    font-weight: 900;
    position: absolute;
    display: none;
    left: 5px;
    top: 2px;
    color: #ffffff;
    font-size: 9px;
}
#checkBoxes .btn, #checkBox .btn {
    font-size: 13px;
    font-weight: 500;
    padding: 8px 0px;
}
#checkBoxes .btn-grey {
    background:#55ddff30;
    color: #1B2559;
    margin-top: 10px;
	border: none;
}
.feather {
    width: 18px;
    height: 18px;
}
.report-btn {
    margin-bottom: 20px;
}
.report-btn .btn {
    font-weight: 600;
    color:#3a57e8;
    background: #FFFFFF;
    border: 2px solid #3a57e8;
    border-radius: 8px;
    width: 100%;
    padding: 11px 0;
}
 
.selectBox-cont-one {
    overflow-y: inherit;
}
.date-picker {
    width: 50%;
    float: left;
    padding-right: 10px;
}
#checkBoxes .form-custom {
    margin-bottom: 14px;
}
#checkBoxes .date-picker .form-custom .form-control {
    padding-left: 10px;
}
.form-custom.cal-icon:after {
    font-size: 14px;
}
.date-list ul {
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
}
.date-list ul li {
    width: 100%;
    padding: 0;
    padding-bottom: 5px;
}
#checkBoxes .btn, #checkBox .btn {
    font-size: 14px;
    font-weight: 500;
    padding: 8px 0px;
}
.date-list .date-btn {
    background: #fff;
    color: #1B2559;
    border: 1px solid #E7EAFC;
    border-radius: 4px;
    padding: 10px 0 !important;
    width: 100%;
}
.date-list .date-btn:hover {
    background: #00d3c7;
    color: #fff;
    border: 1px solid #E7EAFC;
}
.custom_check input:checked ~ .checkmark {
    background-color: #3a57e8;
    border-color: #3a57e8;
}
.invoices-tabs-card {
    background: transparent;
	box-shadow: none;
    border: 0;
}
.inovices-card .card-body {
    padding: 15px;
}
.invoices-main-tabs {
    border-bottom: 2px solid #F3F3F3;
    padding-bottom: 10px;
}
.invoices-tabs ul {
    padding: 0;
    margin: 0;
    list-style: none;
}
.invoices-tabs ul li {
    position: relative;
    display: inline-block;
    margin-right: 36px;
}
.invoices-tabs ul li a.active {
    color: #3a57e8;
    border-bottom: 2px solid #3a57e8;
}
.invoices-settings-btn {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: end;
    -webkit-justify-content: end;
    -ms-flex-pack: end;
}
.invoices-settings-icon {
    color: #3a57e8;
    margin-right: 20px;
}
.invoices-settings-btn .btn {
    font-weight: 600;
    color: #fff;
	background-color: #3a57e8;
    padding: 12px 0;
    min-width: 167px;
    border: 1px solid #3a57e8;
    border-radius: 6px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
}
.inovices-card {
    border-radius: 5px;
}
.inovices-widget-header {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
}
.inovices-widget-icon img {
    width: 50px;
}
.inovices-widget-header .inovices-amount {
    font-weight: 600;
    font-size: 20px;
    color: #3a57e8;
}
.inovices-all {
    font-weight: 500;
    color: #1B2559;
    margin-top: 16px;
}
.inovices-all span {
    font-size: 10px;
    margin-left: 15px;
}
.invoices-tabs ul li a {
    font-weight: 500;
    font-size: 15px;
    color: #1B2559;
    padding-bottom: 24px;
}
table .badge {
    border-radius: 6px;
    display: inline-block;
    font-size: 13px;
    min-width: 105px;
    padding: 8px 20px;
    font-weight: 500;
    text-align: center;
}
.bg-primary-light {
    background-color: rgba(17, 148, 247, 0.12) !important;
    color: #2196f3 !important;
}
.bg-success-light {
    background-color: rgba(15, 183, 107, 0.12) !important;
    color: #26af48 !important;
}
.bg-danger-light {
    background-color: rgb(255 218 218 / 49%) !important;
    color: #FF0000 !important;
}
.table .invoice-link {
    color: #009efb;
}
.invoices-links.active {
    color: #3a57e8;
}
.invoices-links:last-child {
    margin-right: 0px;
}
.invoices-links {
    color: #1B2559;
    margin-right: 20px;
}
.table .bg-success-dark {
    background: #008F64;
}
.table .bg-danger-dark {
    background: #FF0000;
}
.invoices-grid-card {
    background: #FFFFFF;
    box-shadow: 0px 4px 24px rgb(228 228 228 / 25%);
    border-radius: 10px;
    color: #1B2559;
}
.invoices-grid-card .card-header {
    padding: 20px;
    border: 0;
}
.invoice-grid-link {
    color: #1B2559;
	font-size: 14px;
}
.card-middle {
    padding: 20px;
    background: #55ddff30;
}
.card-middle-avatar {
    align-items: center;
    display: inline-flex;
    font-size: 15px;
    margin: 0;
}
.card-middle-avatar a {
    color: #1B2559;
}
.invoices-grid-card .card-body {
    padding: 20px;
}
.invoices-grid-card .card-body span {
   font-size: 14px;
}
.invoices-grid-card .card-footer {
    padding: 20px;
    border: 0;
}
.card-footer:last-child {
    border-bottom-left-radius: 20px;
    border-bottom-right-radius: 20px;
}
.invoices-settings-btn .btn svg{
	margin-right: 10px;
}
.preclincs-title {
    margin: 0;
    padding: 10px;
	display: flex;
	align-items: center;
}
.report-btn .btn:hover {
    color: #FFFFFF;
    background: #3a57e8;
    border: 2px solid #3a57e8;
}
.report-btn .btn:hover img {
    filter: invert(0) brightness(100);
}
.invoices-settings-btn .btn:hover {
    background: #00d3c7;
    border: 1px solid #00d3c7;
}
.invoices-tabs> ul> li > a:hover {
    color: #3a57e8;
}
a.invoices-settings-icon:hover {
    color: #00d3c7;
}
a.btn.delete-invoice-btn:hover {
    background: #474d52;
}
a.btn.save-invoice-btn:hover {
    background: #00d3c7;
}
a.invoices-preview-link:hover {
    color: #00d3c7;
}
li.breadcrumb-item.invoices-breadcrumb-item:hover > a {
	color: #00d3c7;
}
li.breadcrumb-item.invoices-breadcrumb-item:hover > a i {
	background: #00d3c7;
}
.invoice-info > strong > a:hover {
    color: #00d3c7;
}
.invoice-inner-head span a:hover {
    color: #00d3c7;
}
.field-box > a:hover {
    background: #00d3c7;
}
.invoice-total-inner a:hover {
    color: #00d3c7;
}
h2.card-middle-avatar:hover > a {
    color: #00d3c7;
}
.upload-sign button:hover {
    background: #00d3c7;
}
.payment-details:hover {
    background: #00d3c7;
}
.invoices-upload-btn:hover .upload {
	background-color: #00d3c7;
}
.invoice-setting-btn .cancel-btn:hover {
	background-color:#474d52 ;
}
.invoice-setting-btn button:last-child:hover {
	background-color: #00d3c7;
}
.settings-btns button:nth-child(1):hover {
	background-color: #00d3c7;
}
.settings-btn:hover .upload {
	background-color: #00d3c7;
}
.nav-tabs.menu-tabs .nav-link:hover {
	background: #3a57e8;
	color: #fff;
}
.form-row.links-cont a:hover {
    background: #00d3c7;
}
.form-row.links-cont button:hover {
    background: #00d3c7;
}
a.btn.add-links:hover {
    background: #00d3c7;
}
.breadcrumb-item a:hover{
	color: #00d3c7;
}
.sidebar-menu > ul > li > a:hover{
color: #6077ed;
    font-weight: 500;
    background: linear-gradient(135deg, #dbf5e9, #e8e1ff);
    box-shadow: 0 0px 25px rgb(37 99 235 / 5%), 0 0px 15px rgb(16 185 129 / 13%), inset 0 2px 4px rgb(255 255 255 / 56%), inset 0 -3px 8px rgb(255 255 255 / 18%);
    border: 2px solid #ffffffd9;
}
.breadcrumb-item.active  {
	color: rgba(46, 55, 164, 0.5);
}
.breadcrumb-item+.breadcrumb-item::before {
	display: none;
}
.breadcrumb-item+.breadcrumb-item i {
	color: #3a57e8;
}

/*-----------------
	25. Doctors
-----------------------*/

.doctor-img {
	cursor: pointer;
	height: 80px;
	margin: 0 auto 15px;
	position: relative;
	width: 80px;
}
.doctor-img .avatar {
	font-size: 24px;
	height: 80px;
	line-height: 80px;
	margin: 0;
	width: 80px;
}
.doc-prof {
	color: #777;
	font-size: 12px;
	margin-bottom: 10px;
}
.doctor-name {
	margin: 0;
}
.doctor-name a {
	color: #333;
}
.see-all {
	margin-top: 30px;
	text-align: center;
}
.see-all .see-all-btn {
	border: 1px solid #e2e2e2;
	border-radius: 5px;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
	color: #777;
	display: inline-block;
	padding: 10px 20px;
}
.comman-table.custom-table thead tr th,
.comman-table.custom-table tbody tr td {
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}
.comman-table.custom-table thead tr th {
	font-weight: 600;
}
.show-entire .dataTables_length {
	display: none;
}
.doctor-table-blk h3 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}
.doctor-table-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}
.doctor-search-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}
.doctor-search-blk .top-nav-search {
	margin-left: 15px;
}
.doctor-search-blk .top-nav-search form {
	margin: 0px;
}
.add-group {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.add-group .btn-primary {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	color: #3a57e8;
	width: 40px;
	height: 40px;
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.add-group .btn-primary:hover { 
	border: 0;
	background: #3a57e8;
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.add-group .btn-primary:hover img { 
	filter: invert(1) brightness(100);
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.table.comman-table > thead > tr > th,
.table.comman-table > tbody > tr > td {
	padding: 15px 15px;
}
.card-table .card-body {
	padding: 0;
}
.page-table-header {
	padding: 15px 15px 0px 15px;
}
.card-table .dataTables_info {
	padding-left: 15px;
	font-size: 14px;
}
.profile-image a {
	color: #333448;
}
.profile-image a:hover {
	color: #3a57e8;
}

/*-----------------
	26. Add Doctor
-----------------------*/

.profile-upload {
	display: flex;
}
.upload-img {
	margin-right: 10px;
}
.upload-img img {
	border-radius: 4px;
	height: 40px;
	width: 40px;
}
.upload-input {
	width: 100%;
}
.gen-label {
	display: block;
	margin-bottom: 18px;
}
.submit-btn {
	border-radius: 50px;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	min-width: 200px;
	padding: 8px 20px;
	text-transform: uppercase;
}
.delete-modal .modal-body .btn {
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	width: 90px;
	color: #333;
}
.delete-modal .modal-body .btn.btn-danger {
	color: #fff;
}
.delete-modal .modal-body > h3 {
	font-size: 16px;
	font-weight: bold;
	margin: 15px 0 0;
}
.custom-badge {
	border-radius: 8px;
	display: inline-block;
	font-size: 12px;
	min-width: 115px;
	padding: 5px 15px;
	text-align: center;
	border: 0;
}
.status-red,
a.status-red {
	background-color: #ffe5e6;
	color: #fe0000;
}
.status-green,
a.status-green {
	background: rgba(0, 211, 199, 0.1);
	color: #00D3C7;
}
.status-orange,
a.status-orange {
	background-color: #fef5e4;
	color: #ff9b01;
}
.status-blue,
a.status-blue {
	background-color: #e5f3fe;
	color: #008cff;
}
.status-purple,
a.status-purple {
	background-color: #f3e7fd;
	color: #8f13fd;
}
.status-pink,
a.status-pink {
	background-color: #ffe5f6;
	color: #ff01a2;
}
.status-grey,
a.status-grey {
	background-color: #ddd;
	color: #818181;
}
.btn-grey {
	background-color: #b2b2b2;
	border: 1px solid #b2b2b2;
}
.modal-backdrop {
	background-color: #fff;
}
.modal-backdrop.show {
	opacity: 0.9;
}
.invoices-view {
	width: 70%;
	float: right;
}
.local-forms.input-block {
	position: relative;
	margin-bottom: 30px;
}
.local-forms label {
	font-size: 12px;
    color: #333448;
    font-weight: 500;
    position: absolute;
    top: -10px;
    left: 10px;
    background: #fff;
    margin-bottom: 0;
    padding: 0px 5px;
	z-index: 99;
}
.local-forms .select2-container .select2-selection--single {
	height: 45px;
}
.local-forms .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 45px;
}
.local-forms .select2-container--default .select2-selection--single .select2-selection__arrow {
    height: 42px;
}
.form-heading h4 {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 30px;
}
.select-gender .gen-label {
	margin-bottom: 5px;
	color: #333448;
	font-size: 12px;
	font-weight: 500;
}
.select-gender .form-check-label {
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
	font-size: 14px;
}
.select-gender .form-check-input {
    width: 12px;
    height: 12px;
    margin-right: 5px;
    vertical-align: middle;
	margin-top: 0;
}
.local-top-form {
	position: relative
}
.local-top-form .local-top {
    font-size: 12px;
    color: #333448;
    font-weight: 500;
    position: absolute;
    top: -10px;
    left: 10px;
    background: #fff;
    margin-bottom: 0;
    padding: 0px 5px;
    z-index: 99;
}
.settings-btn.upload-files-avator .upload {
	width: 148px;
	background: #F4F5FA;
	color: #3a57e8;
	font-size: 14px;
	font-weight: 500;
	right: -2px;
    top: -2px;
	height: 46px;
}
.settings-btn.upload-files-avator {
	min-height: 45px;
    border: 2px solid rgba(46, 55, 164, 0.1);
    border-radius: 10px;
}
.doctor-submit .btn-primary {
	min-width: 131px;
	font-size: 14px;
	font-weight: 500;
	border-radius: 12px;
	padding: 10px 15px;
}
.doctor-submit .cancel-form {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}
.doctor-submit .cancel-form:hover {
	background: #3a57e8;
	color: #fff;
	border: 1px solid #3a57e8;
}
.calendar-icon:after {
    color: #333448;
    content: '\f073';
    display: block;
    font-family: "Font Awesome 6 Free";
    font-size: 16px;
    font-weight: 600;
    margin: auto;
    position: absolute;
    right: 15px;
    bottom: 10px;
}
.top-nav-search.table-search-blk .btn {
	min-height: 45px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}

/*-----------------
	Doctor Profile
-----------------------*/

.doctor-profile-head {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
}
.profile-bg-img img {
	width: 100%;
	border-radius: 10px;
}
.profile-user-box {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding-left: 30px;
}
.profile-user-img {
	margin-right: 20px;
	position: relative;
    top: -30px;
}
.profile-user-img img {
	border-radius: 50%;
	width: 141px;
}
.names-profiles h4 {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 3px;
}
.names-profiles h5 {
	font-size: 14px;
	font-weight: 500;
	color: #3a57e8;
	margin-bottom: 0;
}
.profile-edit-icon {
    position: absolute;
	border-radius: 50px;
	bottom: 0;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
    -ms-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    -ms-transition: all 0.5s ease;
    -webkit-transition: all 0.5s ease;
}
.profile-edit-icon img {
	width: 25px;
}
.follow-group {
	width: 100%;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.doctor-follows {
	text-align: center;
}
.doctor-follows h5 {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0;
}
.doctor-follows h4 {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 0;
}
.follow-btn-group {
	width: 100%;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.follow-btn-group .btn-info {
	min-width: 127px;
	font-size: 16px;
	font-weight: 500;
	color: #fff;
	border-radius: 10px;
	padding: 9px 15px;
}
.follow-btn-group .follow-btns {
	background: #3a57e8;
	border: 1px solid #3a57e8;
	margin-right: 15px;
}
.follow-btn-group .follow-btns:hover {
	background: #00D3C7;
	border: 1px solid #00D3C7;
}
.follow-btn-group .message-btns {
	background: #00D3C7;
	border: 1px solid #00D3C7;
}
.follow-btn-group .message-btns:hover {
	background: #3a57e8;
	border: 1px solid #3a57e8;
}
.personal-activity {
	margin-bottom: 20px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.views-personal {
	margin-left: 10px;
}
.views-personal h5 {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}
.views-personal h4 {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0;
}
.personal-icons {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	border-radius: 8px;
	width: 40px;
	height: 40px;
}
.personal-icons i {
	color: #3D5EE1;
}
.doctor-personals-grp .card {
	border-radius: 10px;
	box-shadow: none;
}
.heading-detail h4 {
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 25px;
}
.heading-detail p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
}
.hello-park h5 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
}
.hello-park p {
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.skills-head {
	margin-bottom: 10px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.skills-head h5 {
	margin-bottom: 0;
	font-size: 15px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.skills-head p {
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
	font-size: 15px;
	font-weight: 500;
}
.skill-statistics {
	margin-bottom: 25px;
}
.skill-statistics .progress {
	height: 4px;
}
.bg-operations {
	background: #3a57e8;
}
.bg-statistics {
	background: #00D3C7;
}
.bg-haemoglobin {
	background: #FF3667;
}
.bg-endoscopic {
	background: #FFBF42;
}
.bg-visit {
	background: #333548;
}
.setting-form-blk .local-forms label {
	font-size: 12px;
    color: rgba(51, 52, 72, 0.5);
}
.setting-form-blk .local-forms .form-control::placeholder {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
}
.about-info h4 {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	font-size: 18px;
	font-weight: 500;
}
.about-info h4 i {
	color: #8C8C8C;
	background: rgba(51, 53, 72, 0.05);
	border-radius: 10px;
	width: 31px;
	height: 31px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.about-info {
	margin-bottom: 25px;
}
.doctor-up-files label {
	font-size: 15px;
    font-weight: 500;
}
.doctor-up-files label.file-upload.image-upbtn {
	background: #444;
    border: 1px solid #444;
    border-radius: 8px;
    color: #fff;
    padding: 6px 19px;
    font-size: 14px;
    font-weight: 500;
    cursor: pointer;
}
.doctor-up-files label.file-upload.image-upbtn:hover {
	background: #000;
    border: 1px solid #000;
}
.doctor-up-files label.file-upload {
    position: relative;
    overflow: hidden;
}
.doctor-up-files label.file-upload input[type="file"] {
    position: absolute;
    top: 0;
    right: 0;
    min-width: 100%;
    min-height: 100%;
    font-size: 100px;
    text-align: right;
    filter: alpha(opacity=0);
    opacity: 0;
    outline: none;
    background: white;
    cursor: inherit;
    display: block;
}
.doctor-up-files.profile-edit-icon label.file-upload.profile-upbtn {
    cursor: pointer;
}
.list-space {
	padding: 0;
	margin: 0;
}
.about-me-list ul li {
	list-style: none;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 30px;
}
.about-me-list ul li:last-child {
	margin-bottom: 0;
}
.about-me-list ul li h4 {
	min-width: 50%;
	margin-bottom: 0;
	font-size: 15px;
	font-weight: 500;
}
.about-me-list ul li span {
	min-width: 50%;
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.tab-content-set {
	border-bottom : 4px solid rgba(46, 55, 164, 0.05);
    padding-bottom: 25px;
	margin-bottom: 25px;
}
.tab-content-set ul li a.active::after, 
.tab-content-set ul li a:hover::after {
    position: absolute;
    content: "";
    background: #3a57e8;
    width: 100%;
    height: 4px;
    left: 0;
    bottom: -29px;
}
.tab-content-set ul li a.active,
.tab-content-set ul li a:hover {
	color: #3a57e8;
}
.tab-content-set ul li a.active .set-about-icon,
.tab-content-set ul li a:hover .set-about-icon {
	background: rgba(46, 55, 164, 0.05);
}
.tab-content-set ul li a.active .set-about-icon img,
.tab-content-set ul li a:hover .set-about-icon img {
	filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
}
.tab-content-set li a {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: rgba(51, 53, 72, 0.5);
	font-size: 15px;
	font-weight: 600;
	position: relative;
}
.tab-content-set li {
	padding-right: 20px;
}
.set-about-icon {
	background: rgba(51, 53, 72, 0.05);
	border-radius: 8px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.detail-personal h2 {
	font-size: 15px;
	font-weight: 500;
}
.detail-personal h3 {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
	margin-bottom: 0;
}
.personal-list-out {
	margin-bottom: 30px;
}
.profile-table.custom-table thead tr th,
.profile-table.custom-table tbody tr td {
    font-size: 14px;
    color: #333548;
	font-weight: 500;
	padding: 10px;
}
.profile-table.custom-table thead tr th {
	color: #333548;
}
.profile-table.custom-table tbody tr td {
    color: rgba(51, 53, 72, 0.5);
}
.profile-table.custom-table tbody tr {
	box-shadow: none;
}
.profile-check-blk .remember-me {
	margin-bottom: 20px;
}
.profile-check-blk .custom_check input:checked ~ .checkmark {
    background-color: #3a57e8;
    border-color: #3a57e8;
}
.profile-check-blk .form-heading h4 {
	font-size: 16px;
}
.patient-profile-table tbody tr td:nth-child(4) {
    color: rgba(51, 52, 72, 0.5);
}

/*-----------------
	Staffs
-----------------------*/

.staff-search-table {
	padding: 0px 15px;
	margin-top: 30px;
}
.submit-list-form {
	width: 100%;
}
.status-staff {
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.1);
	box-shadow: 5px 5px 20px rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	padding: 0;
}
.status-staff .dropdown-item {
	border-bottom: 1px solid #EBEBF6;
	font-size: 12px;
	padding: 10px;
    text-align: center;
}
.status-staff .dropdown-item:last-child {
	border: 0;
}

/*-----------------
	27. Payslip
-----------------------*/

.payslip-title {
	margin-bottom: 20px;
	text-align: center;
	text-decoration: underline;
	text-transform: uppercase;
}
.pay-head-roll h5 {
	color: #3a57e8;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 20px;
}
.invoice-counts {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.payroll-head-clinic {
	margin-bottom: 20px;
}
.payrolss-counts {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.payrolss-counts h5 {
	margin-bottom: 0;
	font-weight: 600;
	font-size: 16px;
}
.payslip-head-roll h5 {
	font-weight: 600;
	font-size: 18px;
	margin-bottom: 20px;
}

/*-----------------
	28. Attendance
-----------------------*/

.half-day {
	width: 15px;
}

/*-----------------
	29. Inbox
-----------------------*/

.table-inbox input[type="radio"],
.table-inbox input[type="checkbox"] {
	cursor: pointer;
}
.mail-list {
	list-style: none;
	padding: 0;
}
.mail-list > li > a {
	color: #333;
	display: block;
	padding: 10px;
}
.mail-list > li.active > a {
	color: #009efb;
	font-weight: bold;
}
.unread .name,
.unread .subject,
.unread .mail-date {
	color: #000;
	font-weight: 600;
}
.table-inbox .starred.fa-star {
	color: #ffd200;
}
.table.table-inbox > tbody > tr > td,
.table.table-inbox > tbody > tr > th,
.table.table-inbox > tfoot > tr > td,
.table.table-inbox > tfoot > tr > th,
.table.table-inbox > thead > tr > td,
.table.table-inbox > thead > tr > th {
	border-bottom: 1px solid #f2f2f2;
	border-top: 0;
}
.table-inbox {
	font-size: 14px;
	margin-bottom: 0;
}
.note-editor.note-frame {
	border: 1px solid #ccc;
	box-shadow: inherit;
}
.note-editor.note-frame .note-statusbar {
	background-color: #fff;
}
.note-editor.note-frame.fullscreen {
	top: 60px;
}
.mail-title {
	font-weight: bold;
	text-transform: uppercase;
}
.form-control.search-message {
	border-radius: 4px;
	margin-left: 5px;
	width: 180px;
	padding: 0.375rem 0.75rem;
	min-height: 35px;
	margin-bottom: 5px;
}
.table-inbox tr {
	cursor: pointer;
}
table.table-inbox tbody tr.checked {
	background-color: #ffffcc;
}
.mail-label {
	margin-right: 5px;
}

/*-----------------
	29. Mail View
-----------------------*/

.attachments {
	list-style: none;
	margin: 0;
	padding: 0;
}
.attachments li {
	border: 1px solid #eee;
	float: left;
	margin-bottom: 10px;
	margin-right: 10px;
	width: 200px;
}
.attach-file {
	color: #777;
	font-size: 70px;
	padding: 10px;
	text-align: center;
	min-height: 153px;
}
.attach-file > i {
	line-height: 133px;
}
.attach-info {
	background-color: #f4f4f4;
	padding: 10px;
}
.attach-filename {
	color: #777;
	font-weight: bold;
}
.attach-filesize {
	color: #999;
	font-size: 12px;
}
.attach-file img {
	height: auto;
	max-width: 100%;
}
.mailview-header {
	border-bottom: 1px solid #ddd;
	margin-bottom: 20px;
	padding-bottom: 15px;
}
.mailview-footer {
	border-top: 1px solid #ddd;
	margin-top: 20px;
	padding-top: 15px;
}
.mailview-footer .btn-white {
	min-width: 102px;
}
.sender-name {
	display: block;
}
.receiver-name {
	color: #777;
}
.right-action {
	text-align: right;
}
.mail-view-title {
	font-weight: 500;
	font-size: 24px;
	margin: 0;
}
.mail-view-action {
	float: right;
}
.mail-sent-time {
	float: right;
}

/*-----------------
	31. Blog
-----------------------*/

.blog {
	position: relative;
	margin: 0 0 25px;
	background: #FFFFFF;
	border-radius: 12px;
	padding: 20px;
}
.blog-image {
	overflow: hidden;
}
.blog-image,
.blog-image > a,
.blog-image img {
	display: block;
	position: relative;
	width: 100%;
	height: auto;
}
.blog-image img {
	-moz-transform: scaleY(1);
	-webkit-transform: scaleY(1);
	-o-transform: scaleY(1);
	-ms-transform: scaleY(1);
	transform: scaleY(1);
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	-webkit-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
	border-radius: 16px;
}
.blog-image a:hover img {
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}
.blog-image {
	margin-bottom: 30px;
}
.blog-content {
	position: relative;
}
.blog-title {
	color: #000;
	font-weight: normal;
	margin: 0 0 20px;
}
.media {
    display: flex;
    align-items: center;
}
.blog-content p {
	color: rgba(51, 52, 72, 0.75);
	font-size: 14px;
	line-height: 25px;
	margin: 0 0 25px;
}
.read-more {
	color: #282628;
	display: inline-block;
	font-size: 14px;
	margin-bottom: 20px;
}
.read-more:hover {
	color: #009efb;
	margin-left: 10px;
	-moz-transition: all 0.2s linear 0s;
	-ms-transition: all 0.2s linear 0s;
	-o-transition: all 0.2s linear 0s;
	-webkit-transition: all 0.2s linear 0s;
	transition: all 0.2s linear 0s;
}
.read-more i {
	color: #3a57e8;
	font-size: 18px;
	margin-right: 3px;
}
.blog-info {
	border: 1px solid #eaeaea;
	color: #909090;
	font-size: 12px;
	margin-bottom: 0;
	padding: 12px 20px;
}
.blog-info a {
	color: #909090;
	margin-right: 5px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.blog-info a:last-child {
	margin-right: 0;
}
.blog-info a:hover {
	color: #00d3c7;
}
.blog-info i {
	color: rgba(51, 52, 72, 0.5);
	font-size: 18px;
	margin-right: 5px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
}
.post-left {
	float: right;
}
.post-right {
	float: left;
}
.post-left ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.post-left ul li {
	float: left;
	margin-right: 20px;
}
.post-left ul li:last-child {
	margin-right: 0;
}
.video {
	position: relative;
	padding-bottom: 56%;
	height: 0;
	overflow: hidden;
}
.video iframe,
.video object,
.video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}
.widget {
	margin-bottom: 30px;
	background: #FFFFFF;
	border-radius: 10px;
	padding: 20px;
}
.widget h5 {
	color: #333548;
	font-size: 18px;
	font-weight: 500;
	margin: 0 0 20px;
}
.search-form .form-control {
	border: 1px solid #eaeaea;
	border-radius: 0;
	border-right: 0;
	box-shadow: inherit;
	height: 40px;
	color: #ababab;
}
.search-form .btn-primary {
	background-color: transparent;
	border-color: #eaeaea;
	border-left: none;
	color: #009efb;
	height: 40px;
	border-radius: 0;
}
.latest-posts {
	margin: 0;
	padding: 0;
}
.latest-posts li {
	display: table;
	width: 100%;
	padding-bottom: 15px;
	margin-bottom: 15px;
	border-bottom: 1px solid #eee;
}
.latest-posts li:last-child {
	padding-bottom: 0px;
	margin-bottom: 0px;
	border-bottom: none;
}
.post-thumb {
	width: 80px;
	float: left;
	overflow: hidden;
	border-radius: 16px;
}
.post-thumb a img {
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	border-radius: 16px;
}
.post-thumb a:hover img {
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}
.post-info {
	margin-left: 95px;
}
.post-info h4 {
	font-size: 14px;
	font-weight: normal;
	line-height: 18px;
	margin: 0 0 10px;
}
.post-info h4 a {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}
.post-info p {
	color: #3a57e8;
	font-size: 12px;
	margin: 0;
	font-weight: 500;
}
.post-info p i {
	color: #3a57e8;
	font-size: 16px;
	margin-right: 4px;
	position:relative;
	top: 2px;
}
.categories {
	list-style: none;
	margin: 0;
	padding: 0;
}
.categories li {
	padding: 12px 0;
	font-size: 16px;
	color: #333448;
	font-weight: 600;
}
.categories li:last-child {
	padding-bottom: 0px;
	border-bottom: none;
}
.categories li a {
	color: #656565;
	font-size: 14px;
}
.categories li a:hover {
	color: #009efb;
	margin-left: 10px;
	-moz-transition: all 0.2s linear 0s;
	-ms-transition: all 0.2s linear 0s;
	-o-transition: all 0.2s linear 0s;
	-webkit-transition: all 0.2s linear 0s;
	transition: all 0.2s linear 0s;
}
.categories > li > a > i {
	color: #009efb;
	font-size: 18px;
	margin-right: 10px;
}
.tags {
	list-style: none;
	margin: 0;
	overflow: hidden;
	padding: 0;
}
.tags li {
	float: left;
}
.tag {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	color: #333448;
	display: inline-block;
	padding: 5px 10px;
	position: relative;
	margin: 0 10px 10px 0;
	text-decoration: none;
	-moz-transition: color 0.2s;
	-ms-transition: color 0.2s;
	-o-transition: color 0.2s;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
	font-size: 12px;
	font-weight: 500;
}
.tag:hover {
	background-color: #3a57e8;
	color: #fff;
}
.comment-by {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	font-size: 14px;
	line-height: 21px;
	margin: 0 0 10px;
}
.comments-list .comment-block p {
	font-size: 12px;
	line-height: 20px;
	margin: 0;
	text-align: justify;
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
}
blockquote p {
	font-style: italic;
	font-weight: 400;
}
.grid-blog .blog-title {
	font-size: 16px;
	margin: 0 0 10px;
}
.grid-blog .blog-title a {
	color: #333448;
	font-size: 16px;
	font-weight: 500;
}
.grid-blog .blog-content p {
	font-size: 14px;
	margin: 0 0 15px;
	color: rgba(51, 52, 72, 0.5);
}
.grid-blog .blog-info {
	border: 0;
	border-top: 1px solid #eaeaea;
	margin-bottom: 0;
	padding: 12px 0;
}
.grid-blog .blog-image {
	margin-bottom: 20px;
	border-radius: 16px;
}
.grid-blog .read-more {
	font-size: 14px;
	margin-bottom: 0px;
	color: #3a57e8;
	font-weight: 500;
}
.product-thumbnail {
	position: relative;
	margin-bottom: 0;
	margin-top: 10px;
}
.product-remove {
	position: absolute;
	top: -10px;
	right: -6px;
	color: #f06060;
	cursor: pointer;
}
.bootstrap-tagsinput {
	width: 100%;
	height: auto;
	box-shadow: inherit;
	border-radius: 8px;
	line-height: 30px;
}
.bootstrap-tagsinput .badge [data-role="remove"]:hover {
	box-shadow: inherit;
	color: #f00;
}
.blog-views {
    position: absolute;
    top: 20px;
    left: 15px;
    background: #F5F6FA;
    border-radius: 6px;
    padding: 4px 10px;
    display: flex;
    display: -ms-flexbox;
    align-items: center;
    font-size: 12px;
}
.blog-views h5 {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 600;
	margin-bottom: 0;
}
.view-blog-list.blog-views {
    bottom: 20px;
	top: inherit;
}
.blog-views li {
	color: #3a57e8;
	font-weight: 600;
}
.blog-views li:first-child {
	margin-right: 10px;
}
.blog-grp-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	margin-bottom: 25px;
}
.blog-img-blk {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}
.content-blk-blog h4 a {
	font-size: 15px;
	font-weight: 600;
	color: #333448;
}
.content-blk-blog h4 {
	margin-bottom: 0;
}
.content-blk-blog h5 {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
}
.blog-grp-blk span {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 500;
}
.blog-grp-blk img {
	width: 40px;
	height: 40px;
	border-radius: 50px;
}

/*-----------------
	32. Blog View
-----------------------*/

.blog-view .blog-title {
	font-size: 18px;
	font-weight: 500;
}
.blog-view .blog-info {
	border: 0 none;
	margin-bottom: 20px;
	padding: 0;
}
.social-share {
	float: left;
	list-style: none;
	margin: 5px 0 0;
	padding: 0;
}
.social-share > li {
	display: inline-block;
	float: left;
	margin-left: 10px;
	text-align: center;
}
.social-share > li:first-child {
	margin-left: 0;
}
.social-share > li > a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	color: #009efb;
	font-size: 22px;
	height: 40px;
	width: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.social-share > li > a:hover {
	background-color: #3a57e8;
	border-color: #3a57e8;
}
.social-share > li > a:hover img {
	filter: invert(1) brightness(100);
}
.share-blogs a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	color: #009efb;
	font-size: 22px;
	height: 40px;
	width: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.blog-share {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}
.widget h3 {
	color: #333448;
	font-size: 18px;
	margin: 0 0 20px;
}
.blog-reply > a {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 500;
}
.blog-date {
	color: #999;
	font-size: 12px;
}
.comments-list {
	list-style: none;
	margin: 0;
	padding: 0;
}
.comments-list li {
	clear: both;
	padding: 10px 0 0 50px;
}
.comments-list li .comment {
	margin-bottom: 30px;
}
.comments-list li .comment-author {
	margin-left: -50px;
	position: absolute;
}
.comments-list li img.avatar {
	height: 40px;
	width: 40px;
	border-radius: 58px;
}
.blog-author-name {
	color: #009efb;
	font-size: 18px;
}
.text-red {
	color: #f00;
}
.new-comment label {
	font-size: 14px;
	font-weight: 500;
}
.new-comment .input-block {
	margin-bottom: 20px;
}
.comment-submit .btn {
	background-color: #009efb;
	border-color: #009efb;
	border-radius: 0;
	font-size: 18px;
	padding: 8px 26px;
	color: #fff;
}
.about-author-img {
	background-color: #fff;
	height: 120px;
	overflow: hidden;
	position: absolute;
	width: 120px;
}
.author-details {
	margin-left: 145px;
}
.about-author {
	min-height: 120px;
}
.author-details .blog-author-name {
	display: inline-block;
	margin-bottom: 10px;
}
.blog-navigation {
	text-align: right;
}
.read-blks a,
.date-blks li a{
	color: rgba(51, 52, 72, 0.5);
	font-weight: 600;
}
.authr-blog-group h2 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}
.authr-blog-group p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	margin-bottom: 20px;
}
.authr-blog-group span {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.social-blk {
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.social-blk li {
	padding: 0px 10px;
}
.social-blk li a:hover img {
	filter: brightness(0) saturate(100%) invert(21%) sepia(88%) saturate(3137%) hue-rotate(230deg) brightness(98%) contrast(86%);
}
.week-list {
	color: rgba(51, 53, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}
.week-group h5 {
	margin-bottom: 0;
	font-weight: 500;
	font-size: 14px;
}
.share-blogs span {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 600;
}
.list-add-blogs {
	margin-top: 25px;
}
.list-add-blogs ul li {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	padding: 5px 10px;
	margin-right: 10px;
	color: #333448;
	font-size: 12px;
	font-weight: 500;
}
.list-add-blogs ul li:hover {
	background: rgba(51, 52, 72, 0.3);
}
.list-add-blogs ul li:last-child {
	margin-right: 00px;
}
.relat-head {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-bottom: 2px solid rgba(46, 55, 164, 0.05);
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.relat-head h5 {
	margin-bottom: 0;
}
.relat-head a {
	font-weight: 500;
	font-size: 14px;
	color: #3a57e8;
}
.date-posts {
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 10px;
}
.date-posts h5 {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	font-weight: 600;
	font-size: 10px;
	padding: 5px 10px;
	margin-bottom: 0;
}
.date-posts span {
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
	font-size: 12px;
}

/*-----------------
	33. UI Kit
-----------------------*/

.pagination-box .pagination {
	margin-top: 0;
}
.tab-content {
	padding-top: 20px;
}

/*-----------------
	34. Error
-----------------------*/

.error-pages {
	background: #fff;
}
.error-box {
	border-radius: 5px;
	line-height: 1;
	margin: 0 auto;
	max-width: 620px;
	padding: 50px 30px 55px;
	text-align: center;
	width: 100%;
}
.error-wrapper {
	margin: 0;
	color: #4F5155;
	-moz-box-align: center;
	-moz-box-pack: center;
	align-items: center;
	display: flex;
	justify-content: center;
	height: 100%;
}
.error-box h3 {
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 10px;
}
.error-box p {
	margin-bottom: 40px;
	color: rgba(51, 52, 72, 0.5);
}
.error-box img {
	margin-bottom: 50px;
}
.error-box .btn {
	text-transform: capitalize;
	min-width: 179px;
	padding: 10px 15px;
	border-radius: 12px;
}

/*-----------------
	35. Lock Screen
-----------------------*/

.lock-user {
	margin-bottom: 20px;
}
.lock-user img {
	margin-bottom: 15px;
	width: 100px;
}

/*-----------------
	36. Voice call
-----------------------*/

.voice-call-avatar {
	flex-direction: column;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 2;
}
.voice-call-avatar .call-avatar {
	margin: 15px;
	width: 150px;
	height: 150px;
	border-radius: 100%;
	border: 1px solid rgba(0, 0, 0, 0.1);
	padding: 3px;
	background-color: #fff;
}
.call-duration {
	display: inline-block;
	font-size: 30px;
	margin-top: 4px;
	position: absolute;
	left: 0;
}
.voice-call-avatar .call-timing-count {
	padding: 5px;
}
.voice-call-avatar .username {
	font-size: 18px;
	text-transform: uppercase;
}
.call-icons {
	text-align: center;
	position: relative;
}
.call-icons .call-items {
	border-radius: 5px;
	padding: 0;
	margin: 0;
	list-style: none;
	display: inline-block;
}
.call-icons .call-items .call-item {
	display: inline-block;
	text-align: center;
	margin-right: 5px;
}
.call-icons .call-items .call-item:last-child {
	margin-right: 0;
}
.call-icons .call-items .call-item a {
	color: #777;
	border: 1px solid #ddd;
	width: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 50px;
	display: inline-block;
	font-size: 20px;
}
.call-icons .call-items .call-item a i {
	width: 18px;
	height: 18px;
}
.user-video {
	bottom: 0;
	left: 0;
	overflow: auto;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 10;
}
.user-video img {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	display: block;
	margin: 0 auto;
}
.user-video video {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	display: block;
	margin: 0 auto;
}
.my-video {
	position: absolute;
	z-index: 99;
	bottom: 20px;
	right: 20px;
}
.my-video ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.my-video ul li {
	float: left;
	width: 120px;
	margin-right: 10px;
}
.my-video ul li img {
	border: 3px solid #fff;
	border-radius: 6px;
}
.end-call {
	position: absolute;
	top: 7px;
	right: 0;
}
.end-call a {
	color: #fff;
	border-radius: 50px;
	display: inline-block;
	background-color: #f06060;
	padding: 8px 25px;
	text-transform: uppercase;
}
.call-users {
	position: absolute;
	z-index: 99;
	bottom: 20px;
	right: 20px;
}
.call-users ul {
	margin: 0;
	padding: 0;
	list-style: none;
}
.call-users ul li {
	float: left;
	width: 80px;
	margin-left: 10px;
}
.call-users ul li img {
	border-radius: 6px;
	padding: 2px;
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
}
.call-mute {
	width: 80px;
	height: 80px;
	background-color: rgba(0, 0, 0, 0.5);
	position: absolute;
	display: inline-block;
	text-align: center;
	line-height: 80px;
	border-radius: 6px;
	font-size: 30px;
	color: #fff;
	display: none;
	top: 0;
	border: 3px solid transparent;
}
.download-grp {
    display: flex;
    flex-wrap: wrap;
}
.call-users ul li a:hover .call-mute {
	display: block;
}
.call-details {
	margin: 10px 0 0px;
	display: flex;
}
.call-info {
	margin-left: 10px;
	width: 100%;
}
.call-user-details,
.call-timing {
	display: block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}
.call-description {
	white-space: nowrap;
	vertical-align: bottom;
}
.call-timing {
	color: #a0a0a2;
	display: flex;
	font-size: 14px;
	margin-top: 1px;
	overflow: hidden;
	white-space: pre;
}

/*-----------------
	37. Video Call
-----------------------*/

.content-full {
	height: 100%;
	position: relative;
	width: 100%;
}
.video-window .fixed-header {
	padding: 0;
	border: 0;
}
.video-window .fixed-header .nav > li > a {
	padding: 19px 15px;
}

/*-----------------
	38. Incoming Call
-----------------------*/

.incoming-btns {
	margin-top: 20px;
}
.modal.custom-modal {
	background-color: rgba(0, 0, 0, 0.66);
}
.custom-modal .modal-content {
	border: 0;
	background-color: #fff;
}
.custom-modal .profile-widget {
	margin-bottom: 0;
}
.modal.custom-modal.modal-bg{
	background-color: rgba(0, 0, 0, 0.66);
}
.custom-modal.modal-bg .modal-content{
	background-color: #fff;
	text-align: center;
	border-radius: 10px;
}
.custom-modal .modal-body{
	padding: 30px;
}
.form-header {
    text-align: center;
    margin-bottom: 30px;
}
/*-----------------
	39. Notification settings
-----------------------*/

.notification-list .list-group-item {
	padding: 15px;
}
.notification-list .status-toggle {
	float: right;
}
.invoice-load-btn {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
}
.invoice-load-btn .btn {
    font-weight: 700;
    font-size: 14px;
    color: #009efb;
    min-width: 170px;
    padding: 10px 15px;
    background: #FFFFFF;
    border: 2px solid #009efb;
    border-radius: 6px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.invoice-load-btn .btn:hover span {
    border: 3px solid #ffffff7a;
    border-right-color: #fff;
}
.invoice-load-btn .btn:hover{
	background: #009efb;
	color: #fff;
}
.invoice-load-btn .btn span {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 8px;
    vertical-align: 0;
    border: 3px solid #9a55ff21;
    border-right-color: #009efb;
    border-radius: 50%;
    -webkit-animation: .75s linear infinite spinner-border;
    animation: .75s linear infinite spinner-border;
}
.invoices-grid-card .card-footer .badge {
    border-radius: 6px;
    font-size: 13px;
    font-weight: 400;
    padding: 7px 18px;
}
.invoices-grid-card .bg-success-dark {
    background: #008F64;
}
.invoices-grid-card .bg-success-dark {
	background: #008F64;
}
.invoices-grid-card .bg-danger-dark {
	background: #FF0000;
}
.invoices-grid-card .bg-secondary-dark {
	background: #009efb;
}
.invoices-grid-card .bg-primary-dark {
	background: #2196f3;
}
.invoices-grid-card .text-sm {
	font-size: 14px;
}
.invoices-page-header {
    background: #FFFFFF;
    border-radius: 10px;
    padding: 12px;
}
.page-header .breadcrumb {
    background-color: transparent;
    color: #6c757d;
    font-size: 15px;
    font-weight: 500;
    margin-bottom: 0;
    padding: 0;
}
.invoices-page-header .invoices-breadcrumb-item i {
    color: #fff;
    border-radius: 50%;
    width: 20px;
    height: 20px;
	font-size: 10px;
    margin-right: 10px;
    background: #3a57e8;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
}
.invoices-create-btn .invoices-preview-link {
    font-weight: 500;
    color: #3a57e8;
    margin-right: 30px;
	font-size: 15px;
}
.invoices-create-btn .delete-invoice-btn {
    background: #6c757d;
    margin-right: 10px;
}
.invoices-create-btn .btn {
    font-weight: 500;
    font-size: 15px;
    color: #fff;
    border-radius: 8px;
    padding: 10px 0px;
    min-width: 160px;
	position: relative;
}
.check:checked + .checktoggle {
    background-color: #009efb;
    border: 1px solid #009efb;
}
.payment-details {
    width: 266px;
    border-radius: 4px;
    padding: 15px;
    background: #3a57e8;
    display: flex;
    justify-content: space-between;
    align-items: center;
}	
.payment-details p {
    color: #fff;
    max-width: 140px;
    font-weight: 400;
    margin-bottom: 0;
}
.invoices-create-btn .save-invoice-btn {
    background: #3a57e8;
}
.invoices-add-card {
    background: #FFFFFF;
    border-radius: 10px;
}
.invoices-main-form {
    padding-bottom: 15px;
    margin-bottom: 30px;
    border-bottom: 1px solid #E5E5E5;
}
.invoices-main-form label {
	font-size: 14px;
}
.multipleSelection {
    position: relative;
    margin-bottom: 20px;
}
.invoices-form .multipleSelection .selectBox {
    border: 2px solid #3a57e8;
    border-radius: 6px;
}
.multipleSelection #checkBoxes-one {
    display: none;
    position: absolute;
    width: 100%;
    left: 0;
    z-index: 1;
    margin-top: 10px;
    padding: 20px;
    background: #FFFFFF;
    border: 1px solid #F2ECFF;
    box-shadow: 0px 4px 44px rgb(231 234 252 / 75%);
    border-radius: 6px;
}
.invoice-details-title {
    font-weight: 500;
    font-size: 18px;
    color: #1B2559;
    margin-bottom: 0.5rem;
}
.invoice-details-box {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 10px;
}
.invoice-inner-head {
    padding: 26px;
    border-bottom: 1px solid #E5E5E5;
}
.invoice-inner-head span {
    color: #1B2559;
	font-size: 14px;
}
.invoice-inner-head span a {
    font-weight: 500;
    color: #3a57e8;
}
.invoice-inner-footer {
    padding: 0;
}
.invoice-inner-date {
    padding: 26px;
    border-right: 1px solid #E5E5E5;
}
.payment-details {
    width: 266px;
    border-radius: 4px;
    padding: 15px;
    background: #3a57e8;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.payment-details p {
    color: #fff;
    max-width: 140px;
    font-weight: 400;
    margin-bottom: 0;
}
.payment-details a {
    font-size: 26px;
    color: #fff;
}
.invoice-inner-footer .form-control {
    position: absolute;
    color: #009efb;
    background: transparent;
    border: 0;
    display: inline-block;
    width: auto;
    height: auto;
    padding: 0 10px;
}
.invoice-inner-footer span {
    font-weight: 500;
    color: #1B2559;
    position: relative;
}
.invoice-inner-datepic {
    border: 0;
    padding-left: 0;
}
.invoices-form .form-control {
    height: 50px;
    border: 1px solid #E5E5E5;
    border-radius: 6px;
}
.invoice-info {
    margin-bottom: 20px;
}
.invoice-item .customer-text {
    font-size: 18px;
    color: #000;
    font-weight: 600;
    margin-bottom: 16px;
    display: block;
}
.invoice-item .customer-text a {
    font-size: 14px;
    color: #009efb;
    margin-left: 12px;
}
.invoice-item .invoice-details-two {
    text-align: left;
    color: #000;
	float: left;
}
.invoice-add-table h4 {
    font-weight: 600;
    font-size: 18px;
    color: #3a57e8;
    margin-bottom: 30px;
}
.invoice-add-table .add-btns {
    color: #3a57e8;
}
.invoice-add-table .copy-btn {
    color: #C4C4C4;
}
.invoice-add-table .remove-btn {
    color: #FF0000;
}
.invoice-fields .field-title {
    font-weight: 600;
    font-size: 16px;
    color: #1B2559;
    margin-bottom: 15px;
}
.field-box {
    padding: 15px;
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
}
.field-box p {
    font-weight: 500;
    font-size: 14px;
    color: #1B2559;
    margin-bottom: 10px;
}
.field-box .btn {
    min-width: 266px;
    border-radius: 4px;
    padding: 30px 0;
}
.invoice-faq .faq-tab {
    padding-top: 10px;
}
.faq-tab .panel-title {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
    padding: 10px 20px;
    margin-bottom: 0px;
    position: relative;
	font-size: 14px;
}
.faq-tab .panel-title a {
    color: #C4C4C4;
}
.faq-tab .panel-title a.collapsed::after {
    content: '\f067';
    font-family: 'Font Awesome 5 Free';
    position: absolute;
    right: 20px;
    top: 10px;
    color: #f09e9e;
    font-weight: 600;
    font-size: 14px;
}
.faq-tab .panel-title a:not(.collapsed)::after {
    color: #FF0000;
}
.invoice-total-card .invoice-total-title {
    font-weight: 600;
    font-size: 16px;
    color: #1B2559;
    margin-bottom: 15px;
}
.invoice-total-box {
    background: #FFFFFF;
    border: 1px solid #E5E5E5;
    border-radius: 4px;
}
.invoice-total-inner {
    padding: 15px;
}
.invoice-total-box p {
    color: #1B2559;
    margin-bottom: 20px;
    position: relative;
	text-align: initial;
	font-size: 14px;
}
.invoice-total-box p span {
    float: right;
}
.invoice-total-box .add-links {
    font-weight: 500;
    color: #009efb;
    margin-bottom: 20px;
    display: block;
}
.invoice-total-box .service-trash-one {
    margin-top: 10px;
    color: #1B2559;
}
.invoice-total-footer {
    border-top: 1px solid #E5E5E5;
    padding: 15px;
}
.invoice-total-footer h4 {
    font-size: 16px;
    margin-bottom: 0;
    color: #3a57e8;
	text-align: initial;
}
.invoice-total-footer h4 span {
    float: right;
}
.upload-sign {
    float: right;
    margin-top: 20px;
}
.service-upload {
    border: 2px dashed #E5E5E5;
    text-align: center;
    padding: 30px 0;
    background-color: #fff;
    position: relative;
    width: 330px;
}
.service-upload span {
    font-size: 15px;
    color: #858585;
    display: block;
}
.service-upload input[type="file"] {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    opacity: 0;
    cursor: pointer;
}
.upload-sign .btn {
    border-radius: 8px;
    min-width: 198px;
    padding: 10px 0;
}
.invoice-total-box .service-amount {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: space-between;
    -webkit-justify-content: space-between;
    -ms-flex-pack: space-between;
}
.invoice-total-box .service-trash,.invoice-total-box .service-trash1 {
    margin-bottom: 10px;
    color: #1B2559;
}
#show-invoices {
    display: none;
}
.invoice-total-box .service-trash i {
    color: #EC1361;
}
.check:checked + .checktoggles {
    background-color: #009efb;
    border: 1px solid #009efb;
}
.check:checked + .checktoggles:after {
    background-color: #fff;
    left: 100%;
    transform: translate(calc(-100% - 5px), -50%);
}
.checktoggles:after {
    content: ' ';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(5px, -50%);
    width: 8px;
    height: 8px;
    background-color: #fff;
    border-radius: 50%;
    transition: left 300ms ease, transform 300ms ease;
}
.checktoggles {
    background-color: #C4C4C4;
    border: 1px solid #C4C4C4;
    border-radius: 12px;
    cursor: pointer;
    font-size: 0;
    height: 15px;
    margin-left: 10px;
    top: 3px;
    margin-bottom: 0;
    position: absolute;
    width: 30px;
    display: inline-block;
}
.invoice-total-box .add-links1 ,.add-links-one {
    font-weight: 500;
    color: #3a57e8;
    margin-bottom: 20px;
    display: block;
	font-size: 14px;
}
.invoice-add-table th {
    background: #F8F9FA;
	padding: 15px;
	font-size: 14px;
}
.table>:not(:first-child) {
    border-top: 0;
}
td.add-remove {
    padding: 20px;
}
.add-remove i {
    font-size: 18px;
    cursor: pointer;
}
.bank-details .modal-content {
    border: 1px solid #F2ECFF;
    border-radius: 6px;
}
.bank-details .modal-header {
    border: 0;
    justify-content: space-between;
    padding: 30px;
    align-items: center;
    display: flex;
    border-bottom: 1px solid #E5E5E5;
}
.bank-details .close {
    background: transparent;
    border: 0;
    color: #1B2559;
    font-size: 28px;
    line-height: normal;
    top: 20px;
    width: auto;
    height: auto;
    right: 20px;
}
.bank-details .modal-body {
    padding-bottom: 10px;
    border-bottom: 1px solid #E5E5E5;
}
.bank-details .bank-inner-details .form-control {
    height: 50px;
}
.bank-details .modal-footer {
    justify-content: end;
    padding: 30px;
}
.bank-details .modal-footer>* {
    margin: 0;
}
.bank-details-btn .bank-cancel-btn {
    background: #1B2559;
}
.bank-details-btn .bank-save-btn {
    background: #3a57e8;
}
.bank-details-btn .btn {
    min-width: 160px;
    border-radius: 8px;
    padding: 10px 0;
    color: #fff;
}
.invoice-inner-footer .form-control {
    position: relative;
    color: #009efb;
    background: transparent;
    border: 0;
    display: inline-block;
    width: 120px;
    height: auto;
    padding: 0 10px;
}
.invoice-inner-footer span {
    font-weight: 500;
    color: #1B2559;
    position: relative;
	display: flex;
	align-items: center;
	font-size: 13px;
}
.invoice-inner-date {
	padding: 8px 15px;
    border-right: 1px solid #E5E5E5;
}
.invoice-info-card {
    border-radius: 14px;
}
.invoice-item-one {
    border-bottom: 1px solid rgba(231, 234, 252, 0.75);
}
.faq-tab .panel-title a:hover {
    color: #1B2559;
}
.faq-tab .panel-title a:not(.collapsed)::after {
    color: #FF0000;
}
.faq-tab .panel-title a::after {
    content: '\f068';
    font-family: 'Font Awesome 5 Free';
    position: absolute;
    right: 20px;
    top: 10px;
    color: #f09e9e;
    font-weight: 600;
    font-size: 14px;
}
.faq-tab .panel-body textarea {
    min-height: 100px;
    border: 0;
    border-radius: 0 0 4px 4px;
}
.faq-tab .panel-body {
    padding: 10px 20px;
    border: 1px solid #E5E5E5;
}
.inovices-month-info {
    padding-top: 50px;
}
.invoice-add-table {
    padding-top: 20px;
    padding-bottom: 30px;
}
.invoice-item .invoice-logo {
    margin-bottom: 30px;
}
.invoice-item .invoice-logo img {
    width: auto;
    max-height: 52px;
}
.invoice-item .invoice-text h2 {
	color:#272b41;
	font-size:36px;
	font-weight:600;
}
.invoice-item .invoice-details {
	text-align: right;
	font-weight: 400
}
.invoice-item .invoice-details strong {
	color:#272b41;
}
.invoice-item .invoice-details-two {
	text-align: left;
	color: #000;
	font-size: 13px;
}
.invoice-item .invoice-text {
	padding-top:42px;
	padding-bottom:36px
}
.invoice-item .invoice-text h2 {
	font-weight:400
}
.invoice-info {
	margin-bottom: 20px;
}
.invoice-info p {
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
}
.invoice-info.invoice-info2 {
    text-align: right;
}
.invoice-item .customer-text {
	font-size: 20px;
	color: #000;
	font-weight: 600;
	margin-bottom: 16px;
	display: block
}
.invoice-item .customer-text a {
	font-size: 14px;
	color: #3a57e8;
	margin-left: 12px;
}
.invoice-table tr th,
.invoice-table tr td,
.invoice-table-two tr th,
.invoice-table-two tr td {
	color: #272b41;
	font-weight: 600;
	padding: 15px 20px;
	line-height: inherit
}
.invoice-table tr td,
.invoice-table-two tr td {
	font-weight: 500;
}
.invoice-table-two {
	margin-bottom:0
}
.invoice-table-two tr th,
.invoice-table-two tr td {
	border-top: 0;
}
.invoice-table-two tr td {
	text-align: right
}
.invoice-info h5 {
    font-size: 16px;
    font-weight: 500;
}
.other-info {
    margin-top: 10px;
}
.file {
	visibility: hidden;
	position: absolute;
}
.btn-group,
.btn-group-vertical {
	position: relative;
	display: -inline-flexbox;
	display: inline-flex;
	vertical-align: middle; 
}
.font-size-14 {
	font-size: 14px;
}
.invoice-info-card {
	border-radius: 14px;
}
.invoice-item-one {
	border-bottom: 1px solid rgba(231, 234, 252, 0.75);
}
.invoice-item-one .invoice-info {
	margin-bottom: 30px;
	text-align: right;
}
.customer-text-one {
	font-size: 16px;
	color: #1B2559;
	font-weight: 600;
    display: block;
	margin-bottom: 10px;
}
.invoice-name {
	color: #1B2559;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 10px;
}
.invoice-item-one .invoice-details {
	color: #1B2559;
	font-weight: 400;
}
.invoice-head h2 {
	font-weight: 600;
	font-size: 22px;
	color: #1B2559;
	text-transform: uppercase;
	margin-bottom: 0;
}
.invoice-head {
	margin-bottom: 30px;
}
.invoice-head p {
	font-weight: 400;
	font-size: 16px;
	color: #1B2559;	
	margin-bottom: 0;
}
.invoice-item-two {
	padding-top: 30px;
	padding-bottom: 30px;
}
.invoice-item-two .invoice-details {
	color: #1B2559;
	font-weight: 400;
	width: 100%;
}
.invoice-item-box {
	background: #55ddff30;
    border-radius: 5px;
    padding: 15px;
    width: 200px;
    float: right;
    margin-top: 20px;
}
.invoice-item-box p {
	color: #1B2559;
	font-weight: 400;
	margin-bottom: 10px;
}
.invoice-issues-box {
	background: #3a57e8;
	border-radius: 10px;
	text-align: center;
	padding: 10px;
	margin-bottom: 30px;
}
.invoice-issues-date {
	padding-top: 20px;
	padding-bottom: 20px;
}
.invoice-issues-date p {
	font-weight: 600;
	font-size: 14px;
	color: #FFFFFF;
	margin-bottom: 0;
}
.invoice-table-wrap {
	margin-bottom: 30px;
}
.invoice-table > thead > tr > th {
	background: #F5F7FF;
    border-top: 0;
    font-weight: 500;
	font-size: 14px;
	color: #1B2559;
}
.invoice-table > tbody > tr > td {
    font-weight: 400;
	color: #1B2559;
	padding: 15px 20px;
	font-size: 14px;
}
.invoice-terms {
	margin-bottom: 30px;
}
.invoice-total-inner input[type="checkbox"]{
	display: none;
}
.invoice-terms h6 {
	font-weight: 500;
	font-size: 15px;
	color: #1B2559;
	margin-bottom: 6px;
}
.invoice-terms p {
	font-weight: 400;
	font-size: 14px;
	color: #8F9BBA;
}
.invoice-sign {
	padding-top: 30px;
}
.invoice-sign span {
	color: #1B2559;
	margin-top: 18px;
}
.invoice-item-bg {
	background: #3a57e8;
	border-radius: 10px;
	margin-top: 30px;
	margin-bottom: 30px;
}
.invoice-circle-img {
	position: relative;
}
.invoice-circle-img .invoice-circle1 {
	position: absolute;
	left: 0;
	opacity: 0.1;
}
.invoice-circle-img .invoice-circle2 {
	position: absolute;
	right: 0;
	opacity: 0.1;
}
.invoice-item-bg .invoice-info {
    border-right: 1px solid #fff;
    padding: 30px;
    margin-top: 20px;
	text-align: initial;
	display: flow-root;
}
.invoice-payment-box{
	text-align: left;
}
.invoice-item-bg .customer-text-one {
	color: #fff;
}
.invoice-item-bg .invoice-name {
	color: #fff;
}
.invoice-item-bg .invoice-details-two {
	color: #fff;
}
.invoice-item-bg .invoice-info-one p {
	color: #fff;
	margin-bottom: 10px;
}
.invoice-sign-box {
	margin-top: 30px;
	text-align: initial;
}
.invoice-payment-box h4 {
	font-weight: 600;
	font-size: 16px;
	color: #1B2559;
	margin-bottom: 16px;
}
.invoice-payment-box .payment-details {
	background: transparent;
	border: 2px dashed #009efb;
}
.invoice-payment-box .payment-details p {
	font-weight: 600;
	font-size: 15px;
	color: #1B2559;
}
.invoices-preview .modal-body {
	padding: 0;
}
.settings-menu {
    margin-bottom: 30px;
}
.settings-menu ul {
    display: block;
    padding: 0;
	list-style: none;
	margin-bottom: 0;
}
.settings-menu ul li a.active {
    color: #3a57e8 !important;
    border: 0;
}
.settings-menu ul li{
	margin-bottom: 15px;
}
.settings-menu ul li:last-child{
	margin-bottom: 0;
}
.settings-menu ul li a {
    color: #1B2559;
    padding: 0;
    border: 0 !important;
    display: inline-block;
}
.invoices-upload-btn {
    border: 1px solid #dee2e6;
    border-radius: 6px;
    color: #000000;
    cursor: pointer;
    font-weight: 400;
    padding: 15px 15px;
    position: relative;
    width: 100%;
    height: 50px;
}
.invoices-upload-btn .upload {
    position: absolute;
    background: #3a57e8;
    border-radius: 4px;
    right: 6px;
    top: 8px;
    width: 136px;
    height: 32px;
    font-size: 14px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}
.invoices-upload-btn .hide-input {
    position: relative;
    z-index: 1;
    cursor: pointer;
    min-height: auto;
    padding-left: 4px;
    padding-top: 0;
    line-height: 10px;
    width: 100%;
    opacity: 0;
}
 .invoice-setting-btn .cancel-btn {
    background: #6c757d;
}

.invoice-setting-btn .btn {
    min-width: 160px;
    padding: 10px 0;
    color: #fff;
    border-radius: 8px;
	border: 0;
}
.invoice-setting-btn {
    display: flex;
    align-items: center;
    justify-content: end;
}
.paid-continue-btn {
    background-color: #3a57e8;
    border: 1px solid #3a57e8;
    border-radius: 5px;
    color: #fff;
    display: block;
    font-size: 18px;
    font-weight: 400;
    padding: 10px 20px;
    text-align: center;
}
.paid-cancel-btn {
    background-color: #fff;
    border: 1px solid #3a57e8;
    border-radius: 5px;
    color: #3a57e8;
    display: block;
    font-size: 18px;
    font-weight: 400;
    padding: 10px 20px;
    text-align: center;
}
.invoices-page-header .invoices-breadcrumb-item a {
    font-weight: 500;
    color: #3a57e8;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
}
.page-header {
    margin-bottom: 1.875rem;
}
.invoices-table.custom-table tbody tr {
    box-shadow: none;
}
.invoices-table.custom-table tbody tr td {
   vertical-align: middle;
}
.invoices-table.custom-table thead tr th {
	color: #333448;
}
.add-table-invoice {
	background: rgba(46, 55, 164, 0.05);
	border-radius: 12px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}
.add-table-invoice i {
	color: #3a57e8;
}
.grand-totals tr td:first-child {
	width: 75%;
}
.custom-table .bold-total td {
	font-weight: 600;
}
.custom-table .bold-total .form-control {
	font-weight: 600;
}
.invoice-clinic li {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
}
.invoice-details h3 {
	font-size: 14px;
	font-weight: 700;
}
.invoice-details h4 {
	font-size: 14px;
	font-weight: 600;
}
.invoice-details h4 span {
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}
.bold-total-invoice h5 {
	font-size: 22px;
	color: #333448;
	font-weight: 600;
}
.total-fonts tr td {
	color: rgba(51, 53, 72, 0.5);
	font-weight: 500;
}
.invoice-head-clinic {
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
	padding-bottom: 20px;
	margin-bottom: 20px;
}
.invoice-counts h4 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}
.invoice-counts h4 span {
	font-size: 15px;
	font-weight: 500;
	color: rgb(51 53 72 / 50%);
}
.invoice-counts a {
	padding: 3px 23px;
    font-size: 15px;
	border-radius: 8px;
	margin-left: 15px;
}

/*-----------------
	40. Chat Sidebar
-----------------------*/

.chat-sidebar {
	background-color: #fff;
	border-left: 1px solid #eaeaea;
	width: 300px;
}
.chat-sidebar .chat-contents {
	background-color: #fff;
}
.chat-sidebar .chat-left .chat-content {
	border: 0;
	padding: 0;
	border-radius: 0 !important;
	background-color: transparent;
	max-width: 100%;
}
.chat-sidebar .chat-left .chat-body {
	margin-left: 50px;
	padding-right: 0;
}
.chat-sidebar .chat-date {
	background-color: #fff;
}
.chat-sidebar .chats {
	padding: 15px 15px 30px;
}
.chat-sidebar .avatar {
	width: 30px;
	height: 30px;
	line-height: 30px;
}
.chat-sidebar .chat.chat-left {
	margin-bottom: 20px;
}
.chat-sidebar .chat.chat-left:last-child {
	margin-bottom: 0;
}
.chat-sidebar .chat-left .chat-time {
	color: #888;
	display: inline-block;
	font-size: 11px;
}
.chat-sidebar .chat-content > p {
	font-size: 13px;
	margin-bottom: 0;
}
.chat-sidebar.opened {
	margin-right: 0;
}

/*-----------------
	41. Gallery
-----------------------*/

.lg-backdrop {
	z-index: 1041;
}
#lightgallery .img-thumbnail {
	box-shadow: 0 6px 15px rgba(36, 37, 38, 0.08);
}
/*-----------------
   42. Settings
-----------------------*/

.settings-menu-links .nav-tabs.menu-tabs {
    border: none;
    margin-bottom: 20px;
	margin-top: 20px;
}
.nav-tabs.menu-tabs .nav-item {
    padding-right: 10px;
    margin-bottom: 10px;
    display: inline-block;
}
.nav-tabs.menu-tabs .nav-item.active .nav-link {
    color: #fff;
    background: #3a57e8;
}
.nav-tabs.menu-tabs .nav-link {
    position: relative;
    border: none;
    outline: none;
    display: inline-flex;
    align-items: center;
    background: transparent;
    font-weight: 400;
    font-size: 14px;
    padding: 10px 20px;
    border-radius: 5px;
    color: #fff;
   background: rgb(46 55 164 / 53%);
}
.card .card-header .card-title {
    margin-bottom: 0;
	font-size:16px;
	font-weight: 600;
}
.settings-form {
    margin-top: 20px;
}
.settings-label {
    margin-bottom: 10px;
	font-size: 13px;
}
.settings-btn {
    border: 1px solid #D7D7D7;
    border-radius: 5px;
    color: #000000;
    cursor: pointer;
    font-weight: 400;
    padding: 15px 15px;
    position: relative;
    width: 100%;
    height: 46px;
}
.settings-btn .hide-input {
    position: relative;
    z-index: 1;
    cursor: pointer;
    min-height: auto;
    padding-left: 4px;
    padding-top: 0;
    line-height: 10px;
    width: 100%;
    opacity: 0;
}
.settings-btn .upload {
    position: absolute;
    z-index: 11;
    background: #3a57e8;
    border-radius: 5px;
    right: 2px;
    top: 1.5px;
    width: 41px;
    height: 41px;
    font-size: 20px;
    cursor: pointer;
    display: flex;
    justify-content: center;
    align-items: center;
    color: #fff;
}
.settings-size {
    font-size: 13px;
    color: #131523;
    font-style: italic;
    margin-top: 10px;
    margin-bottom: 0;
}
.settings-size span {
    font-weight: 700;
}
.upload-images {
    background: rgba(255, 255, 255, 0.8);
    border: 1px solid #E4E4E4;
    border-radius: 5px;
    display: flex;
    margin-top: 30px;
    width: 196px;
    height: 78px;
    justify-content: space-around;
    align-items: center;
    position: relative;
	margin-bottom: 24px;
}
.upload-images img {
    max-height: 45px;
    width: auto;
}
.upload-images .btn-icon {
    color: #00d3c7;
    font-size: 16px;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    text-align: center;
    position: absolute;
    padding: 0;
    width: 20px;
    height: 20px;
    display: -ms-inline-flexbox;
    display: inline-flex;
    right: 0px;
    top: 0px;
    justify-content: center;
    -webkit-justify-content: center;
}
.invoice-load-btn {
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
}
.invoice-load-btn .btn {
    font-weight: 700;
    font-size: 14px;
    color: #00d3c7;
    min-width: 170px;
    padding: 10px 15px;
    background: #FFFFFF;
    border: 2px solid #00d3c7;
    border-radius: 6px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
}
.invoice-load-btn .btn span {
    display: inline-block;
    width: 25px;
    height: 25px;
    margin-right: 8px;
    vertical-align: 0;
	border: 3px solid rgb(0 211 199 / 57%);
    border-right-color: #00d3c7;
    border-radius: 50%;
    -webkit-animation: .75s linear infinite spinner-border;
    animation: .75s linear infinite spinner-border;
}
.upload-size {
    width: 82px;
    height: 82px;
}
.check {
    display: block;
    margin: 0;
    padding: 0;
    width: 0;
    height: 0;
    visibility: hidden;
    opacity: 0;
    pointer-events: none;
    position: absolute;
}
.checktoggle {
    background-color: #fff;
    border: 1px solid rgba(0, 0, 0, 0.25);
    border-radius: 12px;
    cursor: pointer;
    display: block;
    font-size: 0 !important;
    height: 24px;
    margin-bottom: 0;
    position: relative;
    width: 48px;
}
.checktoggle:after {
    content: ' ';
    display: block;
    position: absolute;
    top: 50%;
    left: 0;
    transform: translate(5px, -50%);
    width: 16px;
    height: 16px;
    background-color: rgba(0, 0, 0, 0.25);
    border-radius: 50%;
    transition: left 300ms ease, transform 300ms ease;
}
.check:checked + .checktoggle {
    background-color: #3a57e8;
    border: 1px solid #3a57e8;
}
.star-red {
    color: #ff0000;
}
form .btn-gradient-primary {
    font-size: 14px;
    padding: 8px 40px;
    color: #fff;
}
form .btn-secondary {
    font-size: 14px;
    padding: 7px 30px;
    color: #fff;
}
.check:checked + .checktoggle:after {
    background-color: #fff;
    left: 100%;
    transform: translate(calc(-100% - 5px), -50%);
}
.card-header{
	padding: 15px;
}
.settings-form .custom_radio {
    color: #000;
    display: inline-block;
    position: relative;
    font-size: 14px;
    font-size: 0.9375rem;
    padding-left: 30px;
    margin-bottom: 0px;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}
.custom_radio input {
    position: absolute;
    opacity: 0;
    cursor: pointer;
    height: 0;
    width: 0;
}
.settings-form .custom_radio .checkmark {
    position: absolute;
    top: 0;
    left: 0;
    height: 20px;
    width: 20px;
    background-color: #fff;
    border: 1px solid #3a57e8;
    border-radius: 50%;
}
.custom_radio input:checked ~ .checkmark::after {
    -webkit-transform: scale(1);
    -moz-transform: scale(1);
    -ms-transform: scale(1);
    -o-transform: scale(1);
    transform: scale(1);
    opacity: 1;
    visibility: visible;
}

.settings-form .custom_radio .checkmark:after {
    display: block;
    content: "";
    position: absolute;
    opacity: 0;
    top: 3px;
    left: 3px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #3a57e8;
    -moz-transition: all 0.3s ease-in-out;
    -o-transition: all 0.3s ease-in-out;
    -webkit-transition: all 0.3s ease-in-out;
    -ms-transition: all 0.3s ease-in-out;
    transition: all 0.3s ease-in-out;
}
.settings-form .social-icon {
    width: 50px;
    height: 42px;
    margin-right: 6px;
    color: #fff;
    background: #3a57e8;
    border: 1px solid #3a57e8;
    border-radius: 5px;
    font-size: 20px;
    display: flex;
    justify-content: space-around;
    align-items: center;
    position: relative;
    padding: 4px;
}
.settings-form .links-cont .social-icon::after {
    content: "";
    border-top: 0.2em solid;
    border-right: 0.2em solid transparent;
    border-bottom: 0;
    border-left: 0.2em solid transparent;
    margin-left: 4px;
}
.settings-form .trash {
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    height: 42px;
    width: 46px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    justify-content: center;
    -webkit-justify-content: center;
    -ms-flex-pack: center;
    background-color: #3a57e8;
    color: #fff;
    position: relative;
    font-size: 16px;
	margin-left: 6px;
}
.add-links {
    background-color: #3a57e8;
    color: #fff !important;
    font-size: 13px;
    font-weight: 700;
    padding: 10px 26px;
    border-radius: 4px;
}
.bootstrap-tagsinput input {
    border: none;
    box-shadow: none;
    outline: none;
    background-color: transparent;
    padding: 0 6px;
    margin: 0;
    width: auto;
    max-width: inherit;
}
.bootstrap-tagsinput input::placeholder {
	font-size: 14px;
}
.settings-form .bootstrap-tagsinput .tag {
    margin-right: 5px;
    margin-bottom: 0px;
    color: #000000;
    background: #E4E4E4 !important;
    border-radius: 0px;
    font-size: 14px;
    font-weight: 500;
    padding: 7px 15px;
}
.settings-form .bootstrap-tagsinput {
    display: block;
    color: #333;
    background: #FFFFFF;
    border: 1px solid #D7D7D7;
    box-shadow: unset;
    min-height: 46px;
    padding-top: 4px;
    padding-left: 5px;
    padding-right: 10px;
    padding-bottom: 4px;
}

 .form-row.links-cont {
    margin-bottom: 0px;
}
textarea.form-control {
    resize: vertical;
}

textarea.form-control {
    height: auto;
}
.settings-form .input-block label {
    margin-bottom: 10px;
	font-size: 13px;
}
.card.invoices-grid-card .card-footer {
    background-color: #fff;
}
.card-block tr th,
.card-block tr td {
	font-size: 14px;
}
.modal-body label {
	font-size: 13px;
}

.avatar {
	width: 34px;
	height: 34px;
}
.avatar-xs {
    width: 1.65rem;
    height: 1.65rem;
}
.avatar-sm {
	width: 2.5rem;
	height: 2.5rem;
}
.avatar-xs {
	width: 1.65rem;
	height: 1.65rem;
}
.avatar-xxl {
    width: 8rem;
    height: 8rem;
}
.avatar-xl {
	width: 5rem;
	height: 5rem;
}
.avatar-lg {
    width: 3.75rem;
    height: 3.75rem;
}
.avatar.shape {
	border-radius: 6px;
}
.avatar.shape img {
	border-radius: 6px;
}
.avatar.avatar-online::before {
    width: 25%;
    height: 25%;
    border-radius: 50%;
    content: "";
    border: 2px solid #ffffff;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #55ce63;
}
.avatar.avatar-offline::before {
    width: 25%;
    height: 25%;
    border-radius: 50%;
    content: "";
    border: 2px solid #ffffff;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #f62d51;
}
.avatar.avatar-away::before {
    width: 25%;
    height: 25%;
    border-radius: 50%;
    content: "";
    border: 2px solid #ffffff;
    position: absolute;
    right: 0;
    bottom: 0;
    background-color: #ffbc34;
}
.avatar-group .avatar {
	margin-right: 0;
	margin-left: -10px;
}
.avatar-group .avatar:first-child {
	margin-right: 0;
	margin-left: 0;
}
.note-editor.note-frame .note-statusbar {
    border-top: 0;
}
.bootstrap-datetimepicker-widget {
    font-size: 13px;
}
.bootstrap-datetimepicker-widget table td.today:before {
    border-bottom-color: #7638ff;
}
.bg-primary-light {
    background-color: rgba(17, 148, 247, 0.12) !important;
    color: #2196f3 !important;
}
.bg-danger-light {
    background-color: rgb(255 218 218 / 49%) !important;
    color: #FF0000 !important;
}
.bg-purple-light {
    background-color: rgba(197, 128, 255, 0.12) !important;
    color: #c580ff !important;
}
.bg-default-light {
    background-color: rgba(40, 52, 71, 0.12) !important;
    color: #283447 !important;
}
.card-two {
    border: 1px solid #DBDFEA;
    border-radius: 5px;
}
.badge-soft-primary {
    color: #405189;
    background-color: rgba(64,81,137,.1);
}
.badge-soft-secondary {
    color: #3577f1;
    background-color: rgba(53,119,241,.1);
}
.badge-soft-success {
    color: #0ab39c;
    background-color: rgba(10,179,156,.1);
}
.badge-soft-info {
    color: #299cdb;
    background-color: rgba(41,156,219,.1);
}
.badge-soft-warning {
    color: #f7b84b;
    background-color: rgba(247,184,75,.1);
}
.badge-soft-danger {
    color: #f06548;
    background-color: rgba(240,101,72,.1);
}
.badge-soft-dark {
    color: #212529;
    background-color: rgba(33,37,41,.1);
}
.badge-soft-light {
    color: #f3f6f9;
    background-color: rgba(243,246,249,.1);
}
.badge-outline-primary {
    color: #405189;
    border: 1px solid #405189;
    background-color: transparent;
}
.badge-outline-secondary {
    color: #3577f1;
    border: 1px solid #3577f1;
    background-color: transparent;
}
.badge-outline-success {
    color: #0ab39c;
    border: 1px solid #0ab39c;
    background-color: transparent;
}
.badge-outline-info {
    color: #299cdb;
    border: 1px solid #299cdb;
    background-color: transparent;
}
.badge-outline-warning {
    color: #f7b84b;
    border: 1px solid #f7b84b;
    background-color: transparent;
}
.badge-outline-danger {
    color: #f06548;
    border: 1px solid #f06548;
    background-color: transparent;
}
.badge-outline-dark {
    color: #212529;
    border: 1px solid #212529;
    background-color: transparent;
}
.badge-outline-light {
    color: #f3f6f9;
    border: 1px solid #f3f6f9;
    background-color: transparent;
}
.badge-gray-outline {
    background-color: #fff;
    border: 1px solid blue;
    color: gray;
}
.badge-gradient-primary {
    background: linear-gradient(135deg,#405189 0,#0ab39c 100%);
}
.badge-gradient-secondary {
    background: linear-gradient(135deg,#3577f1 0,#299cdb 100%);
}
.badge-gradient-success {
    background: linear-gradient(135deg,#0ab39c 0,#f7b84b 100%);
}
.badge-gradient-danger {
    background: linear-gradient(135deg,#f06548 0,#3577f1 100%);
}
.badge-gradient-warning {
    background: linear-gradient(135deg,#f7b84b 0,#eb990a 100%);
}
.badge-gradient-info {
    background: linear-gradient(135deg,#299cdb 0,#0ab39c 100%);
}
.badge-gradient-dark {
    background: linear-gradient(135deg,#212529 0,#405189 100%);
}
.breadcrumb.breadcrumb-colored {
	padding: 15px;
	border-radius: 5px;
}
.breadcrumb.breadcrumb-colored.bg-primary {
	background: #3a57e8 !important;
}
.breadcrumb.breadcrumb-colored.bg-primary li {
	color: #fff;
}
.breadcrumb.breadcrumb-colored.bg-primary li a{
	color: #fff;
}
.breadcrumb.breadcrumb-colored.bg-secondary {
	background: #00D3C7 !important;
}
.irs--flat .irs-bar,.irs--flat .irs-from, .irs--flat .irs-to, .irs--flat .irs-single {
	background: #3a57e8;
}
.irs--flat .irs-handle>i:first-child {
	background: #3a57e8;
}
.irs--sharp .irs-handle,.irs--sharp .irs-from, .irs--sharp .irs-to, .irs--sharp .irs-single,.irs--sharp .irs-min, .irs--sharp .irs-max {
	background: #00D3C7;
}
.irs--sharp .irs-handle>i:first-child {
	border-top-color: #00D3C7;
}
.ribbon-primary {
	background: #3a57e8;
  }
  .ribbon-primary.ribbon-corner:before {
	border-top-color: #3a57e8;
	border-left-color: #3a57e8;
  }
  .ribbon-primary.ribbon-corner.ribbon-right:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
  }
  .ribbon-primary.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3a57e8;
  }
  .ribbon-primary.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #43f;
	border-right-color: #43f;
  }
  .ribbon-primary.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #43f;
	border-left-color: #43f;
  }
  .ribbon-primary.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #43f;
	border-right-color: #43f;
  }
  .ribbon-primary.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #43f;
	border-right-color: transparent;
	border-left-color: #43f;
  }
  
  .ribbon-bookmark.ribbon-primary:before {
	border-color: #3a57e8;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-primary:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-secondary:before {
	border-right-color: #f73164;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-success:before {
	border-right-color: #51bb25;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-danger:before {
	border-right-color: #dc3545;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-info:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-light:before {
	border-right-color: #f4f4f4;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-dark:before {
	border-right-color: #2c323f;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-right.ribbon-warning:before {
	border-right-color: #f8d62b;
	border-left-color: transparent;
  }
  .ribbon-bookmark.ribbon-secondary:before {
	border-color: #f73164;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-success:before {
	border-color: #51bb25;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-danger:before {
	border-color: #dc3545;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-info:before {
	border-color: #3a57e8;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-light:before {
	border-color: #f4f4f4;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-dark:before {
	border-color: #2c323f;
	border-right-color: transparent;
  }
  .ribbon-bookmark.ribbon-warning:before {
	border-color: #f8d62b;
	border-right-color: transparent;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-primary:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-primary:before {
	border-right-color: #3a57e8;
	border-bottom-color: transparent;
  }
  
  .ribbon-secondary {
	background: #f73164;
	background: #f73164;
  }
  .ribbon-secondary.ribbon-corner:before {
	border-top-color: #f73164;
	border-left-color: #f73164;
  }
  .ribbon-secondary.ribbon-corner.ribbon-right:before {
	border-right-color: #f73164;
	border-left-color: transparent;
  }
  .ribbon-secondary.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f73164;
  }
  .ribbon-secondary.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #ec0944;
	border-right-color: #ec0944;
  }
  .ribbon-secondary.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #ec0944;
	border-left-color: #ec0944;
  }
  .ribbon-secondary.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #ec0944;
	border-right-color: #ec0944;
  }
  .ribbon-secondary.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #ec0944;
	border-right-color: transparent;
	border-left-color: #ec0944;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-secondary:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-secondary:before {
	border-right-color: #f73164;
	border-bottom-color: transparent;
  }
  
  .ribbon-success {
	background: #51bb25;
	background: #51bb25;
  }
  .ribbon-success.ribbon-corner:before {
	border-top-color: #51bb25;
	border-left-color: #51bb25;
  }
  .ribbon-success.ribbon-corner.ribbon-right:before {
	border-right-color: #51bb25;
	border-left-color: transparent;
  }
  .ribbon-success.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #51bb25;
  }
  .ribbon-success.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #3f901d;
	border-right-color: #3f901d;
  }
  .ribbon-success.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #3f901d;
	border-left-color: #3f901d;
  }
  .ribbon-success.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3f901d;
	border-right-color: #3f901d;
  }
  .ribbon-success.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #3f901d;
	border-right-color: transparent;
	border-left-color: #3f901d;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-success:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-success:before {
	border-right-color: #51bb25;
	border-bottom-color: transparent;
  }
  
  .ribbon-danger {
	background: #dc3545;
	background: #dc3545;
  }
  .ribbon-danger.ribbon-corner:before {
	border-top-color: #dc3545;
	border-left-color: #dc3545;
  }
  .ribbon-danger.ribbon-corner.ribbon-right:before {
	border-right-color: #dc3545;
	border-left-color: transparent;
  }
  .ribbon-danger.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #dc3545;
  }
  .ribbon-danger.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #bd2130;
	border-right-color: #bd2130;
  }
  .ribbon-danger.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #bd2130;
	border-left-color: #bd2130;
  }
  .ribbon-danger.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #bd2130;
	border-right-color: #bd2130;
  }
  .ribbon-danger.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #bd2130;
	border-right-color: transparent;
	border-left-color: #bd2130;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-danger:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-danger:before {
	border-right-color: #dc3545;
	border-bottom-color: transparent;
  }
  
  .ribbon-info {
	background: #3a57e8;
	background: #3a57e8;
  }
  .ribbon-info.ribbon-corner:before {
	border-top-color: #3a57e8;
	border-left-color: #3a57e8;
  }
  .ribbon-info.ribbon-corner.ribbon-right:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
  }
  .ribbon-info.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3a57e8;
  }
  .ribbon-info.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #9106e7;
	border-right-color: #9106e7;
  }
  .ribbon-info.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #9106e7;
	border-left-color: #9106e7;
  }
  .ribbon-info.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #9106e7;
	border-right-color: #9106e7;
  }
  .ribbon-info.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #9106e7;
	border-right-color: transparent;
	border-left-color: #9106e7;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-info:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-info:before {
	border-right-color: #3a57e8;
	border-bottom-color: transparent;
  }
  
  .ribbon-light {
	background: #f4f4f4;
	background: #f4f4f4;
  }
  .ribbon-light.ribbon-corner:before {
	border-top-color: #f4f4f4;
	border-left-color: #f4f4f4;
  }
  .ribbon-light.ribbon-corner.ribbon-right:before {
	border-right-color: #f4f4f4;
	border-left-color: transparent;
  }
  .ribbon-light.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f4f4f4;
  }
  .ribbon-light.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #dbdbdb;
	border-right-color: #dbdbdb;
  }
  .ribbon-light.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #dbdbdb;
	border-left-color: #dbdbdb;
  }
  .ribbon-light.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #dbdbdb;
	border-right-color: #dbdbdb;
  }
  .ribbon-light.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #dbdbdb;
	border-right-color: transparent;
	border-left-color: #dbdbdb;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-light:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-light:before {
	border-right-color: #f4f4f4;
	border-bottom-color: transparent;
  }
  
  .ribbon-dark {
	background: #2c323f;
	background: #2c323f;
  }
  .ribbon-dark.ribbon-corner:before {
	border-top-color: #2c323f;
	border-left-color: #2c323f;
  }
  .ribbon-dark.ribbon-corner.ribbon-right:before {
	border-right-color: #2c323f;
	border-left-color: transparent;
  }
  .ribbon-dark.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #2c323f;
  }
  .ribbon-dark.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #171a21;
	border-right-color: #171a21;
  }
  .ribbon-dark.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #171a21;
	border-left-color: #171a21;
  }
  .ribbon-dark.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #171a21;
	border-right-color: #171a21;
  }
  .ribbon-dark.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #171a21;
	border-right-color: transparent;
	border-left-color: #171a21;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-dark:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-dark:before {
	border-right-color: #2c323f;
	border-bottom-color: transparent;
  }
  
  .ribbon-warning {
	background: #f8d62b;
	background: #f8d62b;
  }
  .ribbon-warning.ribbon-corner:before {
	border-top-color: #f8d62b;
	border-left-color: #f8d62b;
  }
  .ribbon-warning.ribbon-corner.ribbon-right:before {
	border-right-color: #f8d62b;
	border-left-color: transparent;
  }
  .ribbon-warning.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f8d62b;
  }
  .ribbon-warning.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #e8c308;
	border-right-color: #e8c308;
  }
  .ribbon-warning.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #e8c308;
	border-left-color: #e8c308;
  }
  .ribbon-warning.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #e8c308;
	border-right-color: #e8c308;
  }
  .ribbon-warning.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #e8c308;
	border-right-color: transparent;
	border-left-color: #e8c308;
  }
  
  .ribbon-bookmark.ribbon-vertical-left.ribbon-warning:before, .ribbon-bookmark.ribbon-vertical-right.ribbon-warning:before {
	border-right-color: #f8d62b;
	border-bottom-color: transparent;
  }
  
  .ribbon-wrapper {
	position: relative;
	padding-top: 40px;
  }
  
  .ribbon-wrapper .card-body,
  .ribbon-vertical-left-wrapper .card-body,
  .ribbon-vertical-right-wrapper .card-body {
	position: unset;
  }
  
  .ribbon {
	padding: 0 20px;
	height: 30px;
	line-height: 30px;
	clear: left;
	position: absolute;
	top: 12px;
	left: 0px;
	color: #fff;
	z-index: 1;
  }
  .ribbon-right {
	left: auto;
	right: -2px;
  }
  .ribbon-vertical-left-wrapper {
	padding-left: 40px;
	position: relative;
  }
  .ribbon-vertical-left {
	clear: none;
	padding: 0 5px;
	height: 70px;
	width: 30px;
	line-height: 70px;
	text-align: center;
	left: 12px;
	top: -2px;
  }
  
  .ribbon-vertical-right-wrapper {
	padding-right: 40px;
  }
  
  .ribbon-vertical-right {
	clear: none;
	padding: 0 5px;
	height: 70px;
	width: 30px;
	line-height: 70px;
	text-align: center;
	top: -2px;
	left: auto;
	right: 12px;
  }
  
  .timeline {
	position: relative;
	padding: 20px 0 20px;
	list-style: none;
	max-width: 1200px;
	margin: 0 auto;
  }
  .timeline:before {
	content: " ";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 3px;
	margin-left: -1.5px;
	background-color: #e9ecef;
  }
  .timeline > li {
	position: relative;
	margin-bottom: 20px;
  }
  .timeline > li:after {
	clear: both;
	clear: both;
  }
  .timeline > li > .timeline-panel {
	float: left;
	position: relative;
	width: 46%;
	padding: 20px;
	border: 1px solid #e9ecef;
	border-radius: 0.25rem;
	-webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
  }
  .timeline > li > .timeline-panel:before {
	content: " ";
	display: inline-block;
	position: absolute;
	top: 26px;
	right: -8px;
	border-top: 8px solid transparent;
	border-right: 0 solid #e9ecef;
	border-bottom: 8px solid transparent;
	border-left: 8px solid #e9ecef;
  }
  .timeline > li > .timeline-panel:after {
	content: " ";
	display: inline-block;
	position: absolute;
	top: 27px;
	right: -7px;
	border-top: 7px solid transparent;
	border-right: 0 solid #fff;
	border-bottom: 7px solid transparent;
	border-left: 7px solid #fff;
  }
  .timeline > li > .timeline-badge {
	z-index: 1;
	position: absolute;
	top: 16px;
	left: 50%;
	width: 50px;
	height: 50px;
	margin-left: -25px;
	border-radius: 50% 50% 50% 50%;
	text-align: center;
	font-size: 1.4em;
	line-height: 50px;
	color: #fff;
	overflow: hidden;
  }
  .timeline > li.timeline-inverted > .timeline-panel {
	float: right;
  }
  .timeline > li.timeline-inverted > .timeline-panel:before {
	right: auto;
	left: -8px;
	border-right-width: 8px;
	border-left-width: 0;
  }
  .timeline > li.timeline-inverted > .timeline-panel:after {
	right: auto;
	left: -7px;
	border-right-width: 7px;
	border-left-width: 0;
  }
  
  .timeline > li:before,
  .timeline > li:after {
	content: " ";
	display: table;
	content: " ";
	display: table;
  }
  
  .timeline-badge.primary {
	background-color: #fb9678;
  }
  .timeline-badge.success {
	background-color: #00c292;
  }
  .timeline-badge.warning {
	background-color: #fec107;
  }
  .timeline-badge.danger {
	background-color: #e46a76;
  }
  .timeline-badge.info {
	background-color: #03a9f3;
  }
  
  .timeline-title {
	margin-top: 0;
	color: inherit;
	font-weight: 400;
  }
  
  .timeline-body > p,
  .timeline-body > ul {
	margin-bottom: 0;
  }
  
  .timeline-body > p + p {
	margin-top: 5px;
  }
  
  .cd-horizontal-timeline {
	opacity: 0;
	margin: 2em auto;
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	transition: opacity 0.2s;
  }
  .cd-horizontal-timeline .events {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 30px;
	height: 2px;
	background: #dfdfdf;
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
  }
  .cd-horizontal-timeline .events a {
	padding-bottom: 6px;
	color: #3a57e8;
	position: absolute;
	bottom: 0;
	z-index: 2;
	text-align: center;
	font-size: 14px;
	padding-bottom: 15px;
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
  }
  .cd-horizontal-timeline .events a.selected {
	pointer-events: none;
  }
  .cd-horizontal-timeline .events a.selected::after {
	border-color: #3a57e8;
	background-color: #3a57e8;
	border-color: #3a57e8;
  }
  .cd-horizontal-timeline .events a::after {
	content: "";
	position: absolute;
	left: 50%;
	right: auto;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	bottom: -5px;
	height: 12px;
	width: 12px;
	border-radius: 50%;
	border: 2px solid #dfdfdf;
	background-color: #f8f8f8;
	-webkit-transition: background-color 0.3s, border-color 0.3s;
	-moz-transition: background-color 0.3s, border-color 0.3s;
	transition: background-color 0.3s, border-color 0.3s;
  }
  .cd-horizontal-timeline .events a.older-event::after {
	border-color: #3a57e8;
  }
  .cd-horizontal-timeline .m-t-40 {
	margin-top: 25px !important;
  }
  .cd-horizontal-timeline table {
	border-collapse: collapse;
	border-spacing: 0;
  }
  .cd-horizontal-timeline::before {
	content: "mobile";
	display: none;
  }
  .cd-horizontal-timeline.loaded {
	opacity: 1;
  }
  .cd-horizontal-timeline .timeline {
	position: relative;
	height: 100px;
	width: 90%;
	max-width: 800px;
	margin: 0 auto;
  }
  .cd-horizontal-timeline .timeline:before {
	content: " ";
	display: none;
	bottom: 0;
	left: 0%;
	width: 0px;
	margin-left: -1.5px;
	background-color: #eeeeee;
  }
  .cd-horizontal-timeline .events-wrapper {
	position: relative;
	height: 100%;
	margin: 0 40px;
	overflow: hidden;
  }
  .cd-horizontal-timeline .events-wrapper::before {
	left: 0;
  }
  .cd-horizontal-timeline .events-wrapper::after {
	right: 0;
  }
  .cd-horizontal-timeline .filling-line {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	background-color: #3a57e8;
	-webkit-transform: scaleX(0);
	-moz-transform: scaleX(0);
	-ms-transform: scaleX(0);
	-o-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-ms-transform-origin: left center;
	-o-transform-origin: left center;
	transform-origin: left center;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
  }
  .cd-horizontal-timeline .events-content {
	position: relative;
	width: 100%;
	margin: 2em 0;
	overflow: hidden;
	-webkit-transition: height 0.4s;
	-moz-transition: height 0.4s;
	transition: height 0.4s;
  }
  .cd-horizontal-timeline .events-content li {
	position: absolute;
	z-index: 1;
	width: 100%;
	left: 0;
	top: 0;
	-webkit-transform: translateX(-100%);
	-moz-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	transform: translateX(-100%);
	padding: 0 5%;
	opacity: 0;
	-webkit-animation-duration: 0.4s;
	-moz-animation-duration: 0.4s;
	animation-duration: 0.4s;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
  }
  .cd-horizontal-timeline .events-content li.selected {
	position: relative;
	opacity: 1;
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
  }
  .cd-horizontal-timeline .events-content li > * {
	max-width: 800px;
	margin: 0 auto;
  }
  .cd-horizontal-timeline .events-content h2 {
	font-weight: 600;
	margin-bottom: 0px;
  }
  .cd-horizontal-timeline .events-content em {
	display: block;
	font-style: italic;
	margin: 10px auto;
  }
  .cd-horizontal-timeline .events-content em::before {
	content: "- ";
  }
  .cd-horizontal-timeline .events-content p {
	font-size: 16px;
  }
  
  .cd-horizontal-timeline .filling-line,
  .cd-horizontal-timeline .events a.selected::after {
	background: #3a57e8;
  }
  
  .cd-horizontal-timeline ol,
  .cd-horizontal-timeline ul {
	list-style: none;
  }
  
  .cd-timeline-navigation a:hover,
  .cd-timeline-navigation a:focus {
	border-color: #3a57e8;
  }
  
  .cd-horizontal-timeline a,
  .cd-horizontal-timeline a:hover,
  .cd-horizontal-timeline a:focus {
	color: #3a57e8;
  }
  
  .cd-horizontal-timeline blockquote,
  .cd-horizontal-timeline q {
	quotes: none;
  }
  
  .cd-horizontal-timeline blockquote:before,
  .cd-horizontal-timeline blockquote:after,
  .cd-horizontal-timeline q:before,
  .cd-horizontal-timeline q:after {
	content: "";
	content: none;
  }
  
  .cd-horizontal-timeline .events-wrapper::after,
  .cd-horizontal-timeline .events-wrapper::before {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	height: 100%;
	width: 20px;
  }
  
  .no-touch .cd-horizontal-timeline .events a:hover::after {
	background-color: #3a57e8;
	border-color: #3a57e8;
  }
  .no-touch .cd-timeline-navigation a:hover {
	border-color: #7b9d6f;
  }
  .no-touch .cd-timeline-navigation a.inactive:hover {
	border-color: #dfdfdf;
  }
  
  .cd-timeline-navigation a {
	position: absolute;
	z-index: 1;
	top: 50%;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	height: 34px;
	width: 34px;
	border-radius: 50%;
	border: 2px solid #dfdfdf;
	overflow: hidden;
	color: transparent;
	text-indent: 100%;
	white-space: nowrap;
	-webkit-transition: border-color 0.3s;
	-moz-transition: border-color 0.3s;
	transition: border-color 0.3s;
  }
  .cd-timeline-navigation a::after {
	content: "";
	position: absolute;
	height: 16px;
	width: 16px;
	left: 50%;
	top: 50%;
	bottom: auto;
	right: auto;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	background: url(../img/arrow.svg) no-repeat 0 0;
  }
  .cd-timeline-navigation a.prev {
	left: 0;
	-webkit-transform: translateY(-50%) rotate(180deg);
	-moz-transform: translateY(-50%) rotate(180deg);
	-ms-transform: translateY(-50%) rotate(180deg);
	-o-transform: translateY(-50%) rotate(180deg);
	transform: translateY(-50%) rotate(180deg);
  }
  .cd-timeline-navigation a.next {
	right: 0;
  }
  .cd-timeline-navigation a.inactive {
	cursor: not-allowed;
  }
  .cd-timeline-navigation a.inactive::after {
	background-position: 0 -16px;
  }
  
  .cd-horizontal-timeline .events-content li.enter-right,
  .cd-horizontal-timeline .events-content li.leave-right {
	-webkit-animation-name: cd-enter-right;
	-moz-animation-name: cd-enter-right;
	animation-name: cd-enter-right;
  }
  
  .cd-horizontal-timeline .events-content li.enter-left,
  .cd-horizontal-timeline .events-content li.leave-left {
	-webkit-animation-name: cd-enter-left;
	-moz-animation-name: cd-enter-left;
	animation-name: cd-enter-left;
  }
  
  .cd-horizontal-timeline .events-content li.leave-right,
  .cd-horizontal-timeline .events-content li.leave-left {
	-webkit-animation-direction: reverse;
	-moz-animation-direction: reverse;
	animation-direction: reverse;
  }
  
  .cd-horizontal-timeline .events-content em,
  .cd-horizontal-timeline .events-content p {
	line-height: 30px;
  }
  
  .h-250 {
	height: 250px;
  }
  
  .icons-list {
	padding: 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
  }
  .icons-list li {
	display: block;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 18px;
	border-radius: 50px;
	box-shadow: 0px 2px 3px rgb(215, 197, 255);
	border: 1px solid #e6ebf1;
	color: #3a57e8;
	margin: 5px;
  }
  
  .custom-file-container {
	box-sizing: border-box;
	position: relative;
	display: block;
  }
  .custom-file-container label {
	color: #3a57e8;
  }
  
  .custom-file-container__custom-file {
	box-sizing: border-box;
	position: relative;
	display: inline-block;
	width: 100%;
	height: calc(2.25rem + 2px);
	margin-bottom: 0;
	margin-top: 5px;
  }
  .custom-file-container__custom-file:hover {
	cursor: pointer;
  }
  
  .custom-file-container__custom-file__custom-file-input {
	box-sizing: border-box;
	min-width: 14rem;
	max-width: 100%;
	height: calc(2.25rem + 2px);
	margin: 0;
	opacity: 0;
  }
  .custom-file-container__custom-file__custom-file-input:focus ~ span {
	outline: 1px dotted #dddde0;
	outline: 0px auto -webkit-focus-ring-color;
  }
  
  .custom-file-container__custom-file__custom-file-control {
	box-sizing: border-box;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1;
	height: auto;
	overflow: hidden;
	line-height: 1.5;
	user-select: none;
	background-clip: padding-box;
	border-radius: 0.25rem;
	height: auto;
	border: 1px solid #f1f2f3;
	color: #3b3f5c;
	font-size: 15px;
	padding: 8px 10px;
	letter-spacing: 1px;
	background-color: #f1f2f3;
  }
  
  .custom-file-container__custom-file__custom-file-control__button {
	box-sizing: border-box;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 6;
	display: block;
	height: auto;
	padding: 10px 16px;
	line-height: 1.25;
	background-color: #bdbdbd;
	color: #ffffff;
	border-left: 1px solid #e0e6ed;
	box-sizing: border-box;
  }
  
  .custom-file-container__image-preview {
	box-sizing: border-box;
	margin-top: 54px;
	margin-bottom: 40px;
	height: 250px;
	width: 100%;
	border-radius: 4px;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #ffffff;
	overflow: auto;
	padding: 15px;
	-webkit-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
  }
  
  .custom-file-container__image-multi-preview {
	position: relative;
	box-sizing: border-box;
	border-radius: 6px;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	float: left;
	margin: 1.858736%;
	width: 29.615861214%;
	height: 90px;
	box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.25);
	-webkit-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
  }
  
  .custom-file-container__image-multi-preview__single-image-clear {
	background: #ffffff;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	text-align: center;
	margin-top: -6px;
	border-radius: 50%;
	box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.25);
	position: absolute;
	left: -6px;
  }
  .custom-file-container__image-multi-preview__single-image-clear:hover {
	background: #cbcbbd;
	cursor: pointer;
  }
  
  .custom-file-container__image-multi-preview__single-image-clear__icon {
	color: #3a57e8;
	display: block;
	margin-top: -2px;
  }
  .note-editor.card {
	padding: 0.5rem;
	margin-bottom: 0;
  }
  
  .note-toolbar.card-header {
	padding: 0;
	padding-bottom: 0.5rem;
  }
.nav-pills .nav-link{
	background: rgba(46, 55, 164, 0.05);
	color: #3a57e8;
	    border-radius: 50px;
		    padding: 12px;
}
.nav-pills .nav-link.active {
	background: #3a57e8;
	color: #fff;
}
.navtab-bg li {
	margin-right: 5px;
}
.btn-outline-light,.btn:disabled{
    color: #ababab;
    border-color: #e6e6e6;
}
.card-buttons .btn.btn-secondary {
	background: #00d3c7 !important;
	border-color: #00d3c7;
}
.note-editor.note-frame .note-statusbar .note-resizebar{
	padding-top: 0;
	height: 0;
	width: 100%;
	cursor: ns-resize;
	background: transparent;
	border: 0;
}
.wizard .nav-tabs {
    position: relative;
    margin-top: 20px;
    border: 0;
	margin-bottom: 30px;
}
.wizard .nav-item {
    position: relative;
}
.wizard .nav-item .nav-link {
    width: 56px;
    height: 56px;
    content: "";
    position: absolute;
    background: #fff;
    left: 50%;
    color: #5156be;
    top: 50%;
    font-size: 20px;
    -webkit-transform: translateY(-50%);
    transform: translateY(-50%);
    border: 1px solid rgba(81, 86, 190, 0.2);
}
.wizard .nav-tabs li:first-child::after {
	display: none;
}
.wizard .nav-item .nav-link.active {
    background: #e9e9ef;
    color: #5156be;
    border: 1px solid rgba(81, 86, 190, 0.2);
}
.wizard .nav-tabs li:after {
    content: "";
    width: 75%;
    position: absolute;
    margin-left: auto;
    margin-right: auto;
    background: #e9e9ef;
    height: 2px;
    left: -30%;
    top: 38%;
    z-index: 1;
}
.alertify .ajs-footer {
  border-top: 1px solid #eee;
}
.alertify .ajs-footer .ajs-buttons .ajs-button {
  font-weight: 500;
  background-color: transparent;
  color: #000;
  border: 0;
  font-size: 14px;
  font-weight: 700;
  text-transform: uppercase;
}
.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
  color: #3a57e8;
}
.alertify .ajs-footer .ajs-buttons.ajs-primary {
  text-align: right;
}
.alertify .ajs-body .ajs-content .ajs-input {
  display: block;
  width: 100%;
  padding: 8px;
  margin: 4px;
  border-radius: 2px;
  border: 1px solid #ccc;
}
.alertify .ajs-body .ajs-content .ajs-input:focus-visible {
  outline: 0;
}
.alertify .ajs-commands {
  right: 4px;
  left: auto;
  margin: -14px 0 0 24px;
}
.alertify .ajs-header {
  border-bottom: 1px solid #eee;
}

.alertify-notifier .ajs-message {
  background-color: #3a57e8;
  border-color: #3a57e8;
  color: #ffffff;
  text-shadow: none !important;
}
.alertify-notifier .ajs-message.ajs-success {
  background-color: #26af48;
  border-color: #26af48;
}
.alertify-notifier .ajs-message.ajs-error {
  background-color: #3a57e8;
  border-color: #3a57e8;
}
.alertify-notifier .ajs-message.ajs-warning {
  background-color: #ffbf53;
  border-color: #ffbf53;
}
.alertify-notifier.ajs-right {
  right: 10px;
  left: auto;
}
.alertify-notifier.ajs-right .ajs-message {
  right: -320px;
  left: auto;
}
.alertify-notifier.ajs-right .ajs-message.ajs-visible {
  right: 290px;
  left: auto;
}
.alertify-notifier.ajs-left {
  left: 10px;
  right: auto;
}
.alertify-notifier.ajs-left .ajs-message {
  left: -300px;
  right: auto;
}
.alertify-notifier.ajs-left .ajs-message.ajs-visible {
  left: 0;
  right: auto;
}

body[data-layout-mode=dark] .alertify .ajs-dialog {
  background-color: #313533;
}
body[data-layout-mode=dark] .alertify .ajs-body {
  color: #adb5bd;
}
body[data-layout-mode=dark] .alertify .ajs-body .ajs-content .ajs-input {
  color: #adb5bd;
  background-color: #363a38;
  border: 1px solid #3b403d;
}
body[data-layout-mode=dark] .alertify .ajs-footer .ajs-buttons .ajs-button {
  color: #adb5bd;
}
body[data-layout-mode=dark] .alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
  color: #3a57e8;
}

body[data-layout-mode=dark] .alertify .ajs-footer,
body[data-layout-mode=dark] .alertify .ajs-header {
  color: #ced4da;
  background-color: #313533;
  border-color: #3b403d;
}

.swal2-actions button {
  margin-right: 10px;
}
.select2-container {
    min-width: 100% !important;
    width: auto !important;
}
.breadcrumb {
	position: relative;
}
.card-buttons .breadcrumb .breadcrumb-item {
	position: relative;
}
.card-buttons .breadcrumb .breadcrumb-item + .breadcrumb-item::before {
    float: left;
    padding-right: 0.5rem;
    color: #6c757d;
    content: "/";
	display: block;
	padding-right: 5px;
}
.card-buttons .breadcrumb.breadcrumb-dot .breadcrumb-item + .breadcrumb-item::before {
	content: ".";
	font-size: 25px;
	position: relative;
	top: -13px;
}
.card-buttons .breadcrumb {
    background-color: transparent;
    color: #6c757d;
    font-size: 16px;
    font-weight: 500;
    margin: 0;
    padding: 0;
}
.card-buttons .breadcrumb-colored {
    margin: 0 0 10px;
    padding: 12px 16px;
    border-radius: 4px;
}
.btn-primary span {
	color: #fff;
}
.btn.btn-primary:disabled {
	color: #fff;
}
.swal2-header .swal2-title {
	font-size: 22px;
}
.auth-logo {
	display: flex;
	justify-content: center;
}
.modal-dialog.modal-bottom {
	display: flex;
    align-items: end;
    height: 90%;
}
.modal-dialog.modal-right {
	margin-right: 50px;
}
.sidebar .logout-btn {
	margin-top: 0;
}
table.dataTable>thead>tr>th, table.dataTable>thead>tr>td {
	border-bottom: 1px solid #fff;
}
.dataTables_paginate .paginate_button {
	background: #e9ecef !important;
}
.dataTables_paginate .paginate_button.previous {
	border-radius: 5px 0 0 5px;
}
.dataTables_paginate .paginate_button.next {
	border-radius: 0 5px 5px 0;
}
#DataTables_Table_0_wrapper .dt-layout-row:first-child {
	display: none;
}
#DataTables_Table_0_wrapper .dt-layout-row:last-child {
	padding: 0 20px;
}
#DataTables_Table_1_wrapper .dt-layout-row:first-child {
	display: none;
}
#DataTables_Table_1_wrapper .dt-layout-row:last-child {
	padding: 0 20px;
}
div.dt-container.dt-empty-footer tbody>tr:last-child>* {
	border-bottom: unset;
}
.dt-paging-button.disabled.first, .dt-paging-button.disabled.last {
	display: none !important;
}
.dt-paging-button.previous {
	background: #e9ecef !important;
	padding: 5px 15px;
	font-size: 14px;
	border-radius: 5px 0 0 5px !important;
	margin: 0 !important;
}
.dt-paging-button.next {
	background: #e9ecef !important;
	padding: 5px 15px;
	font-size: 14px;
	margin: 0 !important;
	border-radius: 0 5px 5px 0 !important;
}
div.dt-container .dt-paging .dt-paging-button.current {
	background: #3a57e8 !important;
	border-color: #3a57e8 !important;
	padding: 0;
	color: #fff !important;
	padding: 5px 15px !important;
	margin: 0 !important;
}
div.dt-container .dt-paging .dt-paging-button.current:hover {
	background: #00d3c7 !important;
	border-color: #00d3c7 !important;
	color: #fff !important;
}
.datatable tr th:hover {
	outline: 0  !important;
}
#DataTables_Table_0_info {
	font-size: 14px;
}
.swal2-actions .swal2-confirm.btn:active {
    background-color: #3a57e8;
    border-color: #3a57e8;
}
.swal2-confirm{
    margin-right: 5px;
}
button.swal2-confirm {
    background: #3a57e8;
    border: 1px solid #3a57e8;
    color: #fff;
    border-radius: 5px;
    padding: 0.5rem 0.85rem;
    font-size: 14px;
    transition: all 0.5s;
    font-weight: 500;
}
button.swal2-cancel {
    background: #E70D0D;
    border: 1px solid #E70D0D;
    color: #fff;
    border-radius: 5px;
    padding: 0.5rem 0.85rem;
    font-size: 14px;
    transition: all 0.5s;
    font-weight: 500;
}


ul.nav.nav-pills.navtab-bg.nav-justified {
    width: 40%;
    margin: 0 auto;
}


.attendance-circle-progress.attendance-progress {
    width: 150px;
    height: 150px !important;
    background: #FFF;
    border-radius: 50%;
}
h3.fs-m {
    font-size: 20px;
}

.center-right-contant.ddashboard .card {
    margin-bottom: 0;
    /* border: 1px solid #d1d1d1; */
    background: #fff;
    padding: 24px;
    border-radius: 18px;
    box-shadow: 4px 1px 20px rgb(184 230 208 / 38%);
}

.tracks img {
    width: 180px;
}

.tracks {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 40px;
}

.user-profile1 {
    display: flex;
    align-items: center;
    gap: 14px;
    justify-content: left;
    padding: 10px 22px;
}
.mini-sidebar .user-profile1 {
    padding: 8px 10px;
	    height: 80px;
}

.user-profile1 img {
    width: 36px;
    height: 36px;
    border-radius: 50%;
}

.profile-name h4 {
    font-size: 14px;
    font-weight: 600;
    color: #212121;
    margin-bottom: 0;
}

 
img.settings {
    width: 25px;
}
.user-profile {
    margin-bottom: 10px;
}
.user-names h5 i {
    font-size: 13px;
}
.punch-in {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 7px;
    font-size: 12px;
    font-weight: 600;
	line-height: 20px;
}
.punch-in i {
    font-size: 13px;
}

a.dropdown-item.dr-head {
    padding: 15px !important;
    color: #3a57e8;
    border-bottom: 1px solid #d6d6d6;
}

.footer-links ul {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 10px;
    list-style-type: none;
   
}

.footer-links ul li {
    position: relative;
	    font-size: 13px;
}



/****kanchan***/



.right-view 
 {
    text-align: end;
    margin-top: -11px;
}
h1.text-secondary-500.pb-1\.5x {
    font-size: 24px; 
}
.text-secondary-500 
 { 
    color: #394657;
}

.pb-1\.5x {
    padding-bottom: 15px;
}
.text-black-2 
 {
    color: #3b4452;
}

.uppercase {
    text-transform: uppercase;
}
.text-base {
    font-size: 1rem;
    line-height: 1.5rem;
}
.text-secondary-400 
 { 
    color:#5a6a7c;
}
.slides-2 p {
    margin: 0;
    margin-bottom: 6px;
    font-size: 15px;
}
.author-inserted{
    font-size: 14px;
}


.center-right-contant .quote {
      font-size: 15px;
      color: #2d2d2d;
      line-height: 22px;
      margin-bottom: 10px;
    }
    .center-right-contant .quote span {
      font-size: 13px;
      color: #666;
    }
    .center-right-contant .banner {
      background: linear-gradient(90deg, #f2efff, #edf1fd);
      padding: 20px;
      border-radius: 10px;
      margin-bottom: 20px;
    }
    .center-right-contant .banner h1 {
      margin: 0;
      font-size: 16px;
      font-weight: 600;
      color: #3b3b3b;
    }
    .center-right-contant .banner h1 span {
      color: #888;
    }
    .center-right-contant .banner p {
      font-size: 13px;
      color: #555;
      margin-top: 8px;
    }
    .center-right-contant .banner p span {
      color: #c433cc;
      font-weight: 500;
    }
    .center-right-contant .explore-btn {
      background: #3a57e8;
      color: #fff;
      border: none;
      padding: 8px 20px;
      border-radius: 6px;
      font-size: 13px;
      cursor: pointer;
    }
    .center-right-contant .grid {
      display: flex;
      gap: 20px;
    }
    .center-right-contant .column {
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
     
    .center-right-contant .card h2 {
      font-size: 15px;
      line-height: 1.25rem;
      font-weight: 600;
      color: #3d3d3d;
      font-weight: 600;
    }
    .center-right-contant .card p,
    .center-right-contant .card li,
    .center-right-contant .card div {
      font-size: 14px;
      color: #131313;
    }
    .center-right-contant .card ul {
      padding-left: 6px;
      margin: 0;
    }
    .center-right-contant .card .note {
      font-size: 11px;
      color: #999;
      margin-top: 8px;
    }
    .center-right-contant .payslip-graph {
      text-align: center;
      padding: 20px 0;
    }
    .center-right-contant .payslip-label {
      font-size: 14px;
      font-weight: 500;
      margin-top: 10px;
    }
    .center-right-contant .payslip-days {
      font-size: 12px;
      color: #777;
    }
    .center-right-contant .payslip-amounts {
      font-size: 13px;
      line-height: 22px;
      padding-left: 10px;
    }
    .center-right-contant .payslip-links a {
      color: #397af6;
      font-size: 13px;
      text-decoration: none;
    }
    .center-right-contant .card {
      width: 100%;
      background: white;
      border-radius: 12px;
      /* box-shadow: 0 2px 10px rgba(0,0,0,0.1); */
      padding: 20px;
      position: relative;
    }

    .center-right-contant .card h4 {
      color: #4f4f4f;
    font-size: 15px;
    margin: 0 0 10px;
    }
.fs-14{
font-size:14px !important;
}
    .center-right-contant .arrow {
      position: absolute;
      right: 20px;
      top: 20px;
      font-size: 16px;
      color: #666;
    }

    .center-right-contant .chart-container {
         width: 160px;
         height: 160px;
         /* margin: 0 auto; */
         position: relative;
         margin-top: 20px;
    }

    .center-right-contant .pay-info {
      text-align: right;
      margin-top: 10px;
    }

    .center-right-contant .pay-info .month {
      font-weight: 600;
      font-size: 14px;
      line-height: 1.25rem;
      margin-bottom: 2px;
    }
	.center-right-contant .pay-info .month span {
    font-weight: 400;
}

    .center-right-contant .pay-info .days {
      color: #464646;
    font-size: 13px;
    }

    .center-right-contant .legend {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 10px;
    }

    .center-right-contant .legend-item {
      display: flex;
      align-items: center;
      font-size: 14px;
      margin-top: 11px;
    }

    .center-right-contant .legend-color {
      width: 4px;
      height: 20px;
      border-radius: 2px;
      margin-right: 10px;
    }

    .center-right-contant .legend-item span {
      margin-left: auto;
      font-weight: bold;
      letter-spacing: 2px;
    }

    .center-right-contant .legend .gross .legend-color { background: #343434; }
    .center-right-contant .legend .deduction .legend-color { background: #3a57e852; }
    .center-right-contant .legend .net .legend-color { background: #3a57e8; }

    .center-right-contant .actions {
      display: flex;
      justify-content: space-between;
      margin-top: 26px;
      font-size: 14px;
      border-top: 1px solid #e3e6e9;
      padding-top: 16px;
    }

    .center-right-contant .actions a {
      text-decoration: none;
      color: #3a57e8;
      font-weight: 500;
    }
    .center-right-contant {
        /* width: 88%;
        margin: auto; */
        /* margin-bottom: 60px; */
    }
    .btn.btn-icon {
        background: #3a57e8;
        color: #fff;
    }
    .review-a.text-center img {margin: 20px 0;}
    .review-a.text-center p {
    font-size: .875rem;
    line-height: 1.25rem;
    color: #3d4854;
    }
    .arrow-flex 
 {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* margin-bottom: 17px; */
    border-bottom: 1px solid #5a6a7c2b;
    padding-bottom: 6px;
}
    .center-right-contant .leave-cal li {
    list-style: none;
    margin-top: 18px;
    color: #3d3d3d !important;
}
.chart-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin: 20px 0;
}
.it-declaration 
 {
    display: flex;
    align-items: self-start;
    margin-top: 20px;
    gap: 15px;
}
.banner-container {
      max-width: 800px;
      margin: 20px auto;
      border-radius: 10px;
      background: linear-gradient(to right, #faf6f4, #b36d3917);
      border: 1px solid #eee;
      display: flex;
      align-items: center;
      gap: 40px;
      padding: 10px 15px;
    }
    .banner-left {
      flex: 1;
      display: flex;
      align-items: center;
    }
    .banner-title {
      margin-right: 15px;
    }
    .banner-title span:first-child {
      font-weight: 600;
      color: #444;
    }
    .banner-title span:last-child {
      color: #777;
    }
    .banner-middle {
      flex: 3;
      display: flex;
      align-items: center;
      background: #ffffffa8;
      border-radius: 6px;
      border: 1px solid #e0e0e0;
      padding: 8px 12px;
    }
    .banner-icon {
      border-radius: 50%;
      margin-right: 12px;
    }
    .banner-text-title {
      font-weight: 600;
      color: #333;
      font-size: 16px;
      margin-bottom: 5px;
    }
    .banner-text-subtitle {
      font-size: 15px;
      color: #666;
    }
    .highlight {
      color: #3a57e8;
      font-weight: 500;
    }
    .banner-right {
      flex: 0 0 auto;
      margin-left: 15px;
    }
    .explore-btn {
      background: #5273ec;
      color: white;
      border: none;
      border-radius: 5px;
      padding: 6px 14px;
      font-size: 14px;
      font-weight: 500;
      cursor: pointer;
    }
    .center-right-contant .grid {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
}

/* leave apply page */
.leave-apply .info-box {
      background: #fffbe6;
      padding: 15px;
      font-size: 12px;
      color: #666;
      margin-bottom: 20px;
      border-radius: 4px;
    }
    .leave-apply .form {
      background: #ffffff;
      border: 1px solid #e0e0e0;
      border-radius: 10px;
      padding: 25px;
     margin-bottom: 10px;
    }
   
    .leave-apply .form-label {
      display: block;
      font-size: 14px;
      font-weight: 500;
      margin-bottom: 6px;
      color: #000;
    }
    .leave-apply .form-control,
    .leave-apply .form-select,
    .leave-apply textarea {
      width: 100%;
      border: 1px solid #ccc;
      border-radius: 6px;
      color: #404854;
      border-color: #cbd5e1;
      font-size: 14px;
      padding: 10px; 
      font-weight: 600;
    }
    .leave-apply .form-row {
      display: flex;
      gap: 20px;
      /* margin-bottom: 20px; */
    }
	
    .leave-apply .file-types {
      font-size: 12px;
      color: #999;
      margin-top: 4px;
    }

   .leave-apply .side-tab {
    display: grid;
    gap: 10px;
    margin-top: 55px;
}

.leave-apply .tab-container {
    display: grid;
    grid-template-columns: 17% 78%;
    align-items: flex-start;
}
.side-tab a {
    line-height: 1.25rem;
    padding-left: 7px;
    color: #7f8fa4;
    font-size: 12px;
    font-weight: 500;
}
.top-tab {
    display: flex;
    background: #ffffff;
    border: 1px solid #e0e0e0;
    /* border-radius: 8px; */
    /* overflow: hidden; */
    /* width: fit-content; */
    margin-bottom: 20px;
    /* margin: auto; */
    margin-bottom: -1px;
}

.top-tab a {
    padding: 11px 35px;
    background: #ffffff;
    border: none;
    /* border-right: 1px solid #e0e0e0; */
    cursor: pointer;
    font-weight: 500;
    color: #394657;
    position: relative;
}
a.top-tab-active {
    background: #3a57e8;
    color: #fff;
}
a.side-tab-active {
    border-left: 2px solid #000000;
    color: #000;
    font-weight: 500;
}
.holiday-group{
    display: flex;
    align-items: center;
    margin: 30px 0; 
}
.holiday-group-border{
    border-left: 1px solid #CBD5E1;
    padding-left: 10px;
}
.text-secondary, .label-style {
    color: #7f8fa4 !important;
}
/* .form-select-2{
    padding: 10px 12px;
    font-size: 14px;
    border: 1px solid #ccc;
    border-radius: 6px;
    min-width: 200px;
    max-width: 245px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    color: #3b4452;
    border-color: #cbd5e1;
    font-size: 14px;
    padding-left: 10px;
    padding-right: 10px;
    font-weight: 600;
} */
 
    .adding-dropdown .label-header {
      margin-left: 20px;
      margin-top: 10px;
      font-size: 14px;
    }
    .adding-dropdown .label-header div:first-child {
      font-size: 12px;
      color: #555;
    }
    .adding-dropdown .label-header span {
      color: #aaa;
      font-weight: bold;
    }
    .adding-dropdown .dropdown-container {
      width: 250px;
      border: 1px solid #ccc;
      border-radius: 6px;
      padding: 10px;
      background-color: white;
      position: absolute;
      display: none;
      z-index: 10;
    }
    .adding-dropdown .dropdown-header {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      margin-bottom: 5px;
    }
    .adding-dropdown .close-icon {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      border: 2px solid #3fa6f4;
      color: #3fa6f4;
      text-align: center;
      line-height: 18px;
      cursor: pointer;
      font-weight: bold;
      font-size: 14px;
    }
    .adding-dropdown .search-box {
      width: 100%;
      margin-bottom: 10px;
      position: relative;
    }
    .adding-dropdown .search-box input {
      width: 100%;
      padding: 6px 8px;
      border: 1px solid #ccc;
      border-radius: 4px;
      font-size: 13px;
    }
    .adding-dropdown .user-list {
      max-height: 150px;
      overflow-y: auto;
    }
    .adding-dropdown .user-item {
      display: flex;
      align-items: center;
      margin-bottom: 16px;
    }
    .adding-dropdown .user-item img {
      width: 35px;
      height: 35px;
      margin-right: 8px;
      /* border: 1px solid #000; */
      border-radius: 50%;
    }
    .adding-dropdown .user-info {
      display: flex;
      flex-direction: column;
      font-size: 13px;
    }
    .adding-dropdown .user-info span:first-child {
      font-weight: bold;
    }
    .adding-dropdown .user-info span:last-child {
      color: #777;
      font-size: 12px;
    }
    .adding-dropdown .user-item input {
      margin-right: 6px;
    }
    button.plus-btn {
    border: none;
    background: none;
}
   button.plus-btn-2 {
    border: none;
    background: none;
}

button.plus-btn i {
    border: 1px solid #cbd5e1;
    padding: 5px;
    border-radius: 50%;
    font-size: 20px;
    color: #98a2ad;
    margin-right: 10px;
    width: 35px;
    height: 35px;
    line-height: 24px;
}

.upload-link 
 {
    position: relative; 
} 
.update-flie {
    position: absolute;
    opacity: 0;
    z-index: 0;
    width: 100%;
    cursor: pointer;
    left: 0; 
}
button.trigger-button {
    font-size: 13px;
    font-weight: 500;
    margin-bottom: 2px;
    color: #7f8fa4;
}
.leave-table-container {
      width: 100%;
      border: 1px solid #ddd;
      overflow-y: auto;
      max-height: 265px; /* adjust height as needed */
      margin-bottom: 28px;
    }
    .leave-table {
      width: 100%;
      border-collapse: collapse;
    }
    .leave-table thead {
      background-color: #fbfcff;
      text-align: left;
      position: sticky;
      top: 0;
      z-index: 1;
    }
    .leave-table th,
    .leave-table td {
      padding: 10px;
      border-top: 1px solid #ddd;
      vertical-align: top;
      font-size: 13px;
    }
	.leave-table th {
      font-size: 13px;
	  font-weight: 700;
    }
    .leave-type {
      font-weight: bold;
    }
    .subtext {
      color: #888;
      font-size: 13px;
    }
    .radio-cell {
      width: 5%;
    }
    .empty-sec {
    text-align: center;
    margin-top:20px;
}

.empty-sec img {
    margin-bottom: 20px;
}

.empty-sec p {
    color: #7f8fa4;
    font-size: 12px;
	margin-bottom: 0;
}
.pending-sec-box {
    background: #ffffff;
    border: 1px solid #e0e0e0;
    border-radius: 5px;
    padding: 25px;
    margin: 0 auto;
    margin-bottom: 40px;
     margin-top: 40px;
    width: 80%;
}
 .leave-accordion .accordion {
      background: #fff;
      border-radius: 6px;
      margin-bottom: 12px;
      box-shadow: 0 0 4px rgba(0, 0, 0, 0.05);
      overflow: hidden;
      border: 1px solid #ddd;
      border: 1px solid #64c89947;
      box-shadow: 4px 1px 20px rgb(184 230 208 / 38%);
    }

    .leave-accordion .accordion-header {
      display: flex;
      justify-content: space-between;
      align-items: center;
      padding: 15px 20px;
      cursor: pointer;
      border: 1px solid #64c89947;
      /* box-shadow: 4px 1px 20px rgb(184 230 208 / 38%); */
      background: #b8e6d00f;
    }

    .leave-accordion .accordion-header > .col {
      flex: 1;
      font-size: 14px;
      font-weight: 600;
      color: #666;
    }

    .leave-accordion .accordion-header .status {
      color: #5bc67e;
      font-weight: 400;
      text-transform: uppercase;
      vertical-align: sub;
      letter-spacing: .05rem;
    }

    .leave-accordion .accordion-header .arrow {
      /* width: 24px; */
      text-align: center;
      /* font-size: 16px; */
      /* transition: transform 0.3s ease; */
      /* flex-shrink: 0; */
      border: 1px solid #CBD5E1;
      border-radius: 50%;
      border-color: #a3b2c7;
      height: 26px;
      width: 26px;
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 4px;
    }

    .leave-accordion .accordion-header.active .arrow {
      transform: rotate(180deg);
    }

    .leave-accordion .accordion-body {
      display: none;
      padding: 0;
      font-size: 14px;
      border-top: 1px solid #eee;
      background-color: #fefeff;
    }

    .leave-accordion .accordion-body div {
      /* margin-bottom: 6px; */
    }

    .leave-accordion .accordion-body .applied {
      /* margin-top: 10px; */
      font-weight: 500;
      padding: 20px;
      border-top: 1px solid #CBD5E1;
    }

    .leave-accordion .accordion-body a {
      float: right;
      color: #007bff;
      text-decoration: none;
      font-weight: 500;
    }
    .history-sec {
    margin: 0 auto;
    margin-bottom: 40px;
    margin-top: 40px;
    width: 80%;
}
.col strong {
    font-size: 12px;
    font-weight: 600;
    color: #7f8fa4;
}
.duration {
    padding: 20px 20px;
}
 .balence-sec .top-controls {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 10px;
      margin-bottom: 20px;
    }

    .balence-sec .top-controls button,
    .balence-sec .top-controls select {
      padding: 6px 12px;
      font-size: 14px;
      border: 1px solid #ccc;
      border-radius: 4px;
      background: #fff;
      cursor: pointer;
    }

    .balence-sec .top-controls .apply-btn {
      background-color: #007bff;
      color: white;
      border: none;
    }

    .balence-sec .top-controls .download-btn {
      background-color: #00aaff;
      color: white;
      border: none;
    }

    .balence-sec .grid {
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
      gap: 15px;
    }

    .balence-sec .card {
      background: white;
      border: 1px solid #e0e0e0;
      border-radius: 4px;
      padding: 15px;
      text-align: center;
    }

    .balence-sec .card h4 {
      margin: 0;
      font-size: 14px;
      color: #444;
    }

    .balence-sec .card .granted {
      font-size: 12px;
      color: #888;
      margin-bottom: 10px;
    }

    .balence-sec .card .balance {
      font-size: 24px;
      font-weight: bold;
      color: #444;
    }

    .balence-sec .card .label {
      font-size: 13px;
      color: #888;
      margin-bottom: 10px;
    }

    .balence-sec .view-details {
      font-size: 13px;
      color: #007bff;
      cursor: pointer;
      margin-bottom: 5px;
      display: inline-block;
    }

   .balence-sec .progress-bar-container {
      width: 100%;
      height: 5px;
      background: #e0e0e0;
      border-radius: 10px;
      overflow: hidden;
      margin-top: 5px;
    }

   .balence-sec .progress-bar {
      height: 100%;
      background: #00aaff;
      width: 0%;
    }
 
    .balence-sec .earned-leave .progress-bar {
      width: 96.6%;
    }

    .balence-sec .casual-leave .progress-bar {
      width: 100%;
    }

   .balence-sec .restricted-holiday .progress-bar {
      width: 0%;
      background: #ccc;
    }

    .balence-sec .card .consumed-text {
      font-size: 11px;
      color: #666;
    }
    .bg-vectors {
    position: absolute;
    bottom: -20px;
    z-index: 0;
    opacity: 0.1;
}
.bg-vectors img{
    width: 100%;
}

 #app 
 {
    /* text-align: center; */
    font-size: 28px;
    font-weight: 600;
    margin-left: 8px;
    margin-bottom: 4px;
    background-image: linear-gradient(-225deg, #3b4452 0%, #3b4452 29%, #3b4452 67%, #3b4452 100%);
    background-clip: border-box;
    text-fill-color: transparent;
    background-clip: text;
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    text-fill-color: transparent;
    animation: textclip 2s linear infinite;
}

@keyframes textclip {
  to {
    background-position: 200% center;
  }
}
/* .banner-section{
    background-position: right, right;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #f2eefc !important;
    padding: 16px 20px 25px;
    position: relative;
    border-radius: 20px;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
    height: 225px;
    background-image: url(../img/bg-img.png);
    object-fit: cover;
} */

.banner-section {
    background-position: right, right;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #e5e0fe !important;
    padding: 16px 20px 25px;
    position: relative;
    border-radius: 20px;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
    height: 225px;
    background-image: url(../img/bg-img.png);
    object-fit: fill;
}
.banner-section.is-birthday {
    background-image: url(../img/birthday-banner.jpg);
    display: flex;
    align-items: center;
    justify-content: center;
}
.banner-section.is-birthday .banner-birthday-wish {
    width: 100%;
    text-align: center;
    padding: 0 24px;
}
.banner-section.is-birthday .banner-birthday-wish h2 {
    margin: 0 0 4px;
    font-size: 32px;
    font-weight: 700;
    color: #1f2937;
    line-height: 1.3;
}
.banner-section.is-birthday .banner-birthday-wish h3 {
    margin: 0 0 8px;
    font-size: 24px;
    font-weight: 600;
    color: #1f2937;
    line-height: 1.3;
}
.banner-section.is-birthday .banner-birthday-wish p {
    margin: 0 auto;
    max-width: 270px;
    font-size: 14px;
    font-weight: 400;
    color: #4b5563;
    line-height: 1.5;
}
/* .salary-card{
    background-image: url(../images/phone.png);
} */
 .image-home-noon img {
    position: absolute;
        right: 170px;
    bottom: 0;
}
a.btn.btn-2 {
    outline: none;
    color: #646bbc;
}
.bg-vectors-review {
    left: 50%;
    transform: translate(-50%, -21px);
}
.review-a.text-center.mt-110 {
    margin-top: 110px;
}
.holiday-flex img {
    width: 60px;
}

.holiday-flex {
    /* display: flex; */
    justify-content: space-between;
    /* align-items: center; */
}


.donut-wrapper {
    width: 150px;
    margin: auto;
    position: relative;
    margin-top: 10px;
    margin-bottom: 20px;
}

    .donut-center-label {
      position: absolute;
      top: 50%;
      left: 50%;
      transform: translate(-50%, -50%);
      font-weight: bold;
      font-size: 16px;
      color: #666;
	      width: 100%;
    }
	.timing-info {
    text-align: left;
}



.flip-card {
  background-color: transparent;
  /* width: 300px; */
  height: 327px;
  perspective: 1000px; /* Remove this if you don't want the 3D effect */
}
 
/* This container is needed to position the front and back side */
.flip-card-inner {
  position: relative;
  width: 100%;
  height: 100%;
  text-align: center;
  transition: transform 0.8s;
  transform-style: preserve-3d;
}

/* Do an horizontal flip when you move the mouse over the flip box container */
.flip-card:hover .flip-card-inner {
  transform: rotateY(180deg);
}

/* Position the front and back side */
.flip-card-front, .flip-card-back {
  position: absolute;
  width: 100%;
  height: 100%;
  backface-visibility: hidden;
}

/* Style the front side (fallback if image is missing) */
.flip-card-front {
  background-color: #ffffff;
  border-radius: 20px;
  color: black;
}

/* Style the back side */
.flip-card-back {
  background-color: #fff;
  color: white;
  transform: rotateY(180deg);
  border-radius: 20px;
}
li.att-info {
    display: flex;
    justify-content: space-between;
}


li.att-info {
    font-size: 11px !important;
}
li.att-info span 
 {
    font-size: 14px !important;
}
.Employ-Mint{font-size: 28px;}
.mini-sidebar .Employ-Mint{font-size: 14px;}
.timing-info-flex {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 11px;
}

.timing-info-flex p {
    margin: 0;
}
 .year-select {
      border: 1px solid #ccc;
      padding: 3px 10px;
      border-radius: 5px;
      background: #f9f9f9;
      font-size: 14px;
    }

    .stats {
      display: grid;
          grid-template-columns: repeat(6, 1fr);
      gap: 10px 10px;
      font-size: 14px;
      /* margin-bottom: 20px; */
      text-align: left;
      margin-top: 12px;
    }

    .stat-item {
      display: flex;
      flex-direction: column;
      /* align-items: center; */
      text-align: left;
      min-width: 80px;
      padding: 12px;
      background: rgb(58 87 232 / 6%);
      border-radius: 8px;
    }

    .stat-item span:first-child {
     font-size: 19px;
     font-weight: 700;
    }

    /* .purple { color: #7c3aed; }
    .green { color: #16a34a; }
    .lightgreen { color: #22c55e; }
    .red { color: #dc2626; }
    .blue { color: #3b82f6; }
    .skyblue { color: #0ea5e9; } */

    .apply-btn {
      background-color: #4661e9;
      color: white;
      padding: 9px 20px;
      border: none;
      border-radius: 6px;
      font-weight: 500;
      cursor: pointer;
      font-size: 13px;
    }

    .apply-btn:hover {
      background-color: #4661e9;
    }
	.pay-slip-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.stat-item {
    color: #3d3d3d !important;
    font-size: 11px !important;
    font-weight: 600;
    text-align: center;
}
  /* .pay-slip-flex .chart-container {
      width: 400px;
      height: 400px;
      position: relative;
    }
    canvas {
      width: 100%;
      height: 100%;
    } */
	 .holiday-group-border span {
    font-size: 14px;
}
a.top-tab-active:before 
 {
    border-left: 11px solid transparent;
    border-right: 11px solid transparent;
    border-top: 7px solid #3a57e8;
    bottom: -7px;
    content: "";
    height: 0;
    left: 50%;
    position: absolute;
    transform: translateX(-50%);
    width: 0;
}
.sidebar-menu ul ul a:before {
    position: absolute;
    content: "";
    width: 8px;
    height: 2px;
    background: #3a57ecb8;
    top: 49%;
    left: 43px;
}
.total-work-hours.text-center.w-100 span {
    font-size: 12px;
	    font-weight: 500;
}
.card.flex-fill.border-primary.attendance-bg {
   background: #fff;
    border: 1px solid #ffffff !important;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}
.form-select:focus { 
    box-shadow:none;
}
.level-tab {
    height: 46px;
    align-items: center;
    overflow: hidden;
	transition:.3s all ease;
	border: 1px solid #C8D3DE !important;
    border-top: 1px solid #3a57e8 !important;
}
.position-relative.border.card.rounded-2.level-tab:hover{
	    border: 1px solid #3a57e8 !important;
		transition:.3s all ease;

}
span.avatar.rounded-circle svg { 
    filter: brightness(0) saturate(100%) invert(100%) sepia(0%) saturate(0%) hue-rotate(248deg) brightness(108%) contrast(101%);
}

.accordion-body .applied {
    color: #333333;
}

.accordion-body .duration {
    color: #333333;
	    font-size: 13px;
}

.card-body-1 {
    padding: 9px 0;
}
 
.level-tab p{
	font-weight: 500;
}
.leave-accordion .accordion-header.active {
    background: #e6ffe659;
}

a.logo img {
    width: 115px;
}



/*****kanchan***/




 .main-box1 {
      display: flex;
      gap: 20px;
      background: #fff;
      padding: 30px 25px;
      border-radius: 8px;
      /* box-shadow: 0 0 8px rgba(0,0,0,0.05); */
      border: 1px solid #ddd;
    }
    .left-panel1 {
      flex: 2;
      border-right: 1px solid #e0e0e0;
      padding-right: 20px;
    }
    .right-panel1 {
      flex: 1;
    }
    .approved1 {
      color: #28a745;
      font-weight: 600;
      float: right;
    }
    .approver1 {
      font-weight: 700;
      margin-top: 5px;
    }
    .yellow-box1 {
      display: flex;
      background: #fefedc;
      border: 1px solid #eee;
      padding: 10px;
      margin: 20px 0;
      text-align: center;
      border-radius: 6px;
    }
    .yellow-box1 div {
      flex: 1;
      border-right: 1px solid #ccc;
    }
    .yellow-box1 div:last-child {
      border-right: none;
    }
    .yellow-box1 strong {
      display: block;
      font-size: 16px;
      margin-bottom: 4px;
      color: #333;
    }
    .yellow-box1 span {
      font-size: 13px;
          color: #474747;
		      font-weight: 500;
    }
    .balance1 {
      font-size: 14px;
      color: #333;
      margin-bottom: 20px;
    border-bottom: 1px solid #cccccc;
    padding-bottom: 12px;
    }
    .details-box {
      font-size: 14px;
    }
    .details-box p {
      margin: 6px 0;
      color: #333;
    }
    .details-box span {
      font-weight: 600;
      margin-right: 8px;
      color: #777;
    }
    .timeline-box {
      border: 1px solid #ddd;
      border-radius: 6px;
      padding: 15px;
      background: #fff;
    }
    .timeline-box h4 {
      font-size: 15px;
      color: #444;
      margin-bottom: 20px;
    }
    .timeline-item {
      position: relative;
      margin-bottom: 20px;
      padding-left: 20px;
    }
    .timeline-item::before {
      content: "";
      position: absolute;
      left: 0;
      top: 5px;
      width: 10px;
      height: 10px;
      background: #527cc7;
      border-radius: 50%;
    }
    .timeline-item:last-child::after {
      content: "";
      position: absolute;
      left: 4px;
      top: 15px;
      width: 2px;
      height: calc(100% - 15px);
      background: #ccc;
    }
    .timeline-item:last-child::after {
      display: none;
    }
    .timeline-item .label {
      font-weight: 600;
      font-size: 13px;
    }
    .timeline-item .sub {
      font-size: 12px;
      color: #666;
    }
	
	.details-box {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.detail-row {
  display: grid;
  grid-template-columns: 120px 1fr;
  font-size: 14px;
  color: #333;
}
.detail-row label {
  font-weight: 600;
  color: #777;
}
.detail-row div {
  color: #333;
}




.bg-black-le {
    background-image: url(../img/bg/bg-black-le.svg);
    background-position: right top;
    background-repeat: no-repeat;
    background-size: contain;
}
.remain-balance{
	font-size: 13px;
    font-weight: 600;
    padding: 5px 12px;
	display: block;
}

.text-start.leaves p{
	font-weight:500;
}

.leave-balance .card-body {
    padding: 18px;
}
.leave-balance {
    height: 210px;
}

.leave-balance .text-center a{
	font-weight:600;
}
.custom-datatable-filter.border.tbl1 {
    padding: 0;
}
.leave-count {
    text-align: center;
}

.leave-table-body tr td span {
    font-size: 13px;
    color: grey;
}
span.fc-icon.fc-icon-chevron-left {
    line-height: 19px;
}
span.fc-icon.fc-icon-chevron-right {
    line-height: 19px;
}
.table-responsive.br-0 {
    border-radius: 0;
}


    .calendar-container {
      background: white;
      border-radius: 6px;
      box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
      padding: 0px;
    }
    .fc .fc-toolbar-title {
      font-size: 20px;
      font-weight: 600;
    }
    .fc-daygrid-day-frame {
      position: relative;
    }
    .cell-tag {
      position: absolute;
      bottom: 4px;
      right: 4px;
      font-size: 10px;
      padding: 2px 4px;
      background: #e3f2fd;
      color: #1976d2;
      border-radius: 4px;
    }
    .fc-daygrid-day.fc-day-today {
     background: linear-gradient(135deg, #61c7971a, #6a3ef624);
    }

.mt-1x {
    margin-top: 10px;
}


.emp-bubble {
    border-radius: 50%;
    width: 36px;
    height: 36px;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    border: 2px solid black;
}
.emp-bubble-periwinkle-gray {
       border-color: #3a57e8b3;
}


.emp-bubble-brandy {
    border-color: #e0b19d;
}

.mr-0\.5x {
    margin-right: 5px;
}

.employees-list-item {
    list-style-type: none;
}
.mini-logo{
	display:none;
}
.mini-sidebar .mini-logo{
	display:block;
}
.mini-sidebar .main-logo{
	display:none;
}
.mini-logo {
    width: 30px !important;
    margin-left: 8px;
}
.tracks.leave img {
    width: 70px;
}

.month-holiday-list-item {
    display: flex;
    align-items: center;
    margin-bottom: 12px;
}
.holiday {
    margin-right: 30px;
    flex: 0 0 24px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
.holiday-date {
    font-size: 16px;
    line-height: 24px;
    color: #7f8fa4;
    font-weight: 600;
}

ul.month-holiday-list {
    padding-left: 0;
    margin-top: 12px;
    margin-bottom: 0;
}
span.holiday-weekday {
    font-size: 13px;
}


.leave-balance.holiday-calendar {
    height: 260px;
}

ul.month-holiday-list {
    height: 180px;
    overflow-y: auto;
}



.calendar-container {
    width: 100%; /* Adjust width as needed */
    background-color: #fff;
    border-radius: 8px;
    /* box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1); */
    overflow: hidden;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}

.calendar-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 10px;
    background-color: #fff;
    background: linear-gradient(135deg, #61c797, #6a3ef6);
    border-bottom: 1px solid #cbd5e1;
    font-size: 1.2em;
    font-weight: bold;
    color: #ffffff;
}

.nav-arrow {
        color: #ffffff;
        cursor: pointer;
        font-weight: normal;
        font-size: 14px;
}

.month-year {
    color: #ffffff;
}

.calendar-grid {
    display: grid;
    grid-template-columns: repeat(7, 1fr);
    gap: 1px; /* To create the subtle grid lines */
    background-color: #fff; /* Grid line color */
    padding-top: 1px; /* Top grid line */
}

.day-name {
    background-color: #ffffff;
    padding: 12px 0;
    text-align: center;
    font-weight: bold;
    color: #666;
    font-size: 0.9em;
    border-bottom: 1px solid #cbd5e1; /* Separator for day names */
}

.calendar-day {
    background-color: #fff;
    min-height: 65px; /* Adjust height for cells */
    padding: 8px;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    position: relative;
    border-right: 1px solid #cbd5e1;
    border-bottom: 1px solid #cbd5e1;
    box-sizing: border-box; /* Include padding and border in the element's total width and height */
}

.calendar-day:nth-child(7n) { /* Remove right border for Saturday */
    border-right: none;
}

/* Remove bottom border for the last row */
.calendar-grid > *:nth-last-child(-n + 7) {
    border-bottom: none;
}


.date {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
    margin-bottom: 5px; /* Space between date and indicators */
}

.indicator-p {
    font-size:14px;
        color: #515151; /* Blue for P */
    margin-top: auto; /* Push to bottom */
    align-self: flex-end; /* Align to the right */
    padding-right: 5px;
	text-align: center;
    width: 100%;
	font-weight: 500;
}

.indicator-o {
    font-size: 14px;
        color: #515151;
    align-items: center;
    padding-right: 5px;
    text-align: center;
    width: 100%;
    margin-top: 10px;	
    font-weight: 500;
}

.indicator-gl {
    font-size: 0.8em;
    color: #aaa; /* Lighter grey for GL */
    margin-top: auto;
    align-self: flex-end;
    padding-right: 5px;
}

/* Specific day styles */
.prev-month,
.next-month {
    background-color: #f8f8f8;
    color: #bbb; /* Lighter color for dates not in current month */
}
.prev-month .date,
.next-month .date {
    color: #bbb;
}

.available {
    background-color: #e6ffe6; /* Light green */
}

.booked {
    background: rgb(252, 229, 192); /* Light orange/peach */
}

.weekend {
    background-color: #f8f8f8; /* Lighter background for weekends */
}

.weekend .date {
    color: #666;
}

.current-day {
    border: 2px solid #6952e9; /* Blue border for the current day */
    background-color: #e6f2ff; /* Light blue background for current day */
    box-sizing: border-box; /* Ensure border is included in dimensions */
}

/* The selected "start" days (14 and 21) */
.current-month-selected-start {
    background-color: #e6ffe6; /* Match available light green */
    position: relative;
    /* Optional: add a subtle indicator if needed to show it's a "start" */
}

.icon-camera {
    position: absolute;
    top: 8px;
    right: 8px;
    /* width: 20px; */
    /* height: 16px; */
    /* background-color: #ccc;  */
    /* border-radius: 3px; */
    /* box-shadow: 0 0 0 1px #999 inset; */
}

.icon-camera::before {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    /* transform: translate(-50%, -50%); */
    /* width: 8px; */
    /* height: 8px; */
    /* background-color: #666; */
    /* border-radius: 50%; */
}

.icon-camera::after {
    content: '';
    position: absolute;
    top: 2px;
    right: 2px;
    /* width: 4px; */
    /* height: 2px; */
    /* background-color: #eee; */
    /* border-radius: 1px; */
}


.text-5, .label-style {
    font-size: 12px;
    margin-top: 0;
    margin-bottom: 0;
}

.insights {
    display: flex;
    align-items: center;
    height: 100%;
}
.insights a {
    font-weight:600;
}

a.bt-grid {
    border-radius: 0;
}
a.bt-list {
    border-radius: 0;
	background:white !important;
}
a.bt-list i {
	color:blue;
}
.btn-icon.btn-sm {
    width: 1.75rem;
    height: 1.75rem;
    font-size: 12px;
}





.table-section.-side-status {
    /* display: block; */
}

.cell.border-none {
    border: none !important;
}

.container-side-status {
    border-radius: 8px;
    /* box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); */
    width: 100%; /* Adjust width as needed */
    /* overflow: hidden; */
    position: relative; /* For the scrollbar styling */
     /* Subtle border around the whole container */
    /* box-shadow: 0px 0px 20px rgb(106 62 246 / 21%); */
}

/* Header Section */
.header-section-side-status {
    display: flex;
    align-items: center;
    padding: 15px 15px;
    background-color: #fdfdfd;
    border-bottom: 1px solid #e0e0e0;
    border-radius: 8px 8px 0 0;
    background: linear-gradient(135deg, #61c797, #6a3ef6);
}

.date-box {
    background-color: #e5e4fd; /* Light blue background */
    border: 1px solid #6855e6; /* Slightly darker blue border */
    border-radius: 4px;
    padding: 8px 15px;
    text-align: center;
    margin-right: 20px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    font-weight: bold;
    min-width: 60px; /* Ensure consistent width */
}

.date-box .date {
    font-size: 20px;
    color: #6952e9; /* Blue color for the date */
    line-height: 1;
}

.date-box .day {
    font-size: 0.9em;
    color: #666;
    margin-top: 2px;
}

.shift-info {
    flex-grow: 1; 
}

.shift-info .shift-name {
    font-size: 1.1em;
    font-weight: bold;
    color: #ffffff;
    margin-bottom: 3px;
}

.shift-info .shift-time {
    font-size: 0.9em;
    color: #ffffff;
}

.attendance-scheme {
    text-align: right;
}

.attendance-scheme .scheme-name {
    font-size: 1.1em;
    font-weight: bold;
    color: #ffffff;
    margin-bottom: 3px;
}

.attendance-scheme .scheme-type {
    font-size: 0.9em;
    color: #ffffff;
}

/* Processed On */
.processed-on {
    background-color: #f8f8f8;
    padding: 10px 20px;
    font-size: 0.85em;
    color: #777;
    border: 1px solid #e0e0e0;
    border-top: none;
}

/* Table Sections */
.table-section.-side-status {
    margin-bottom: 20px;
    border: 1px solid #e0e0e0;
	    border-top: none;
     border-radius: 0px 0px 4px 4px;
    overflow: hidden;
    margin: 0px 0px 15px;   
    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); /* Subtle shadow for tables */
}

.section-title-side-status {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
    padding: 7px 20px;
    margin-bottom: 10px;
    background: white;
    /* padding-bottom: 5px; */
    margin-bottom: 0;
	    border: 1px solid #e0e0e0;
	 border-radius: 4px 4px 0 0;
}
.table-section.-side-status.table-wrapper.scroll-x {
    overflow-x: scroll;
}
.table-header-side-status {
    /* display: flex; */
    background-color: #eeedff; /* Light blue header for tables */
    font-weight: bold;
    color: #333;
    border-bottom: 1px solid #cce0ff; /* Darker blue border for header */
}

.table-row {
    /* display: flex; */
    background-color: #fff;
    border-bottom: 1px solid #eee;
}

.table-row:last-child {
    border-bottom: none; /* No border for the last row */
}

.table-header-side-status .cell,
.table-row .cell {
    padding: 12px 10px;
    text-align: left;
    flex: 1; /* Distribute space evenly */
     /* Allow cells to shrink */
    white-space: nowrap; /* Prevent text wrapping for headers */
    font-size: 13px;
    font-weight: 500;
    border-right: 1px solid #eee; /* Vertical dividers */
}

.table-header-side-status .cell:last-child,
.table-row .cell:last-child {
    border-right: none;
}

/* Specific column widths for the first table */
.table-section.-side-status:nth-of-type(2) .table-header-side-status .cell,
.table-section.-side-status:nth-of-type(2) .table-row .cell {
    flex: 1; /* Default flex for all */
}

/* Adjust column widths for "Status Details" table */
.status-col {
    flex: 0.3 !important; /* Smaller column for Status */
}

.remarks-col {
    flex: 0.7 !important; /* Larger column for Remarks */
    text-align: left !important;
}

/* Adjust column widths for "Session Details" table */
.session-col {
    flex: 0.25 !important;
}

.session-timing-col {
    flex: 0.35 !important;
}

.first-in-col,
.last-out-col {
    flex: 0.2 !important;
}


/* Scrollbar styling (if content overflows) */
.container-side-status::-webkit-scrollbar {
    width: 8px;
}

.container-side-status::-webkit-scrollbar-track {
    background: #f1f1f1;
}

.container-side-status::-webkit-scrollbar-thumb {
    background: #888;
    border-radius: 4px;
}

.container-side-status::-webkit-scrollbar-thumb:hover {
    background: #555;
}

/* Optional: Windows Activation Overlay (if you want to simulate it, though it's likely unwanted) */
/*
.windows-activation-overlay {
    position: fixed;
    bottom: 0;
    right: 0;
    background-color: rgba(255, 255, 255, 0.95);
    border: 1px solid #ccc;
    padding: 10px;
    font-size: 13px;
    color: #333;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.2);
    z-index: 1000;
}

.windows-activation-overlay span {
    display: block;
    font-size: 11px;
    color: #666;
    margin-top: 5px;
}
*/




td.cell.border-none span {
    color: grey;
    font-size: 11px;
}



.legends-container {
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1);
    /* Adjust width as needed to match your layout */
    overflow: hidden;
    border: 1px solid #ddd;
}

.legends-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 15px 20px;
    background-color: #fdfdfd;
    border-bottom: 1px solid #e0e0e0;
}

.legends-title {
    font-size: 1.1em;
    font-weight: bold;
    color: #333;
}

.toggle-icon {
    font-size: 0.8em;
    color: #007bff;
    background-color: #e6f2ff;
    border: 1px solid #9acafc;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    display: flex;
    justify-content: center;
    align-items: center;
    cursor: pointer;
    font-weight: bold;
}

.legends-content {
    padding: 15px 20px !important;
}

.legend-grid {
    display: grid;
    /* 5 columns, each min 100px and then takes equal space */
    grid-template-columns: repeat(auto-fill, minmax(100px, 1fr));
    gap: 15px 10px; /* Row gap, Column gap */
        margin-bottom: 12px;
}

.legend-item {
    display: flex;
    align-items: center;
    gap: 8px; /* Space between code/icon and text */
	justify-content: center;
}

/* Common styling for the code/color box */
.legend-code,
.legend-color-box {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 28px; /* Fixed width to make them consistent squares/rectangles */
    height: 22px; /* Fixed height */
    border-radius: 3px;
        font-size: 11.5px;
    font-weight: 500;
    box-sizing: border-box; /* Include padding and border in element's total width and height */
    padding: 0 4px; /* Slight horizontal padding */
}

.legend-color-box {
    border: 1px solid transparent; /* Placeholder border to align with legend-code */
}

/* Specific background and text colors for legend codes */
.legend-p { background-color: #e6ffe6; color: #339933; border: 1px solid #99cc99; } /* Light green, dark green */
.legend-a { background-color: #ffe6e6; color: #cc3333; border: 1px solid #ff9999; } /* Light red, dark red */
.legend-o { background-color: #f0f0f0; color: #666666; border: 1px solid #cccccc; } /* Light grey, dark grey */
.legend-r { background-color: #f0f0f0; color: #666666; border: 1px solid #cccccc; } /* Light grey, dark grey */
.legend-l { background-color: #f5e6ff; color: #9933cc; border: 1px solid #cc99e6; } /* Light purple, dark purple */
.legend-od { background-color: #fff2e6; color: #e69900; border: 1px solid #ffcc99; } /* Light orange, dark orange */
.legend-h { background-color: #e6f2ff; color: #007bff; border: 1px solid #9acafc; } /* Light blue, dark blue */

.legend-alert-deduction { background-color: #ffdab9; border: 1px solid #ffb366; } /* Peach/Orange */
.legend-deduction { background-color: #ffcce6; border: 1px solid #ff99cc; } /* Light pink */
.legend-status-unknown { background-color: #f8f8f8; color: #888888; border: 1px solid #e0e0e0; } /* Very light grey, grey */


.legend-text {
    font-size: 0.9em;
    color: #555;
    /* white-space: nowrap;  */
	/* Prevent text from wrapping */
}

/* Icon styling */
.legend-icon {
    font-size: 1.1em;
    color: #666; /* Default icon color */
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 28px;
    height: 22px;
    box-sizing: border-box;
    position: relative; /* For pseudo-elements */
}

/* Specific icon adjustments */
.icon-overtime, .icon-override, .icon-rest-day, .icon-holiday-type {
    /* Use direct unicode characters in HTML for these, simple styling */
}

/* Custom CSS icons */
.icon-ignored {
    color: transparent; /* Hide the character if any */
}
.icon-ignored::before {
    content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-top: 16px solid transparent;
    /* border-bottom: 7px solid transparent; */
    border-left: 16px solid #555;
    /* transform: rotate(-30deg); */
    left: 10px;
    top: 3px;
}

.icon-grace {
    color: transparent;
}
.icon-grace::before {
	content: '';
    position: absolute;
    width: 0;
    height: 0;
    border-top: 16px solid transparent;
    /* border-bottom: 7px solid transparent; */
    border-left: 16px solid #007bff;
    /* transform: rotate(-30deg); */
    left: 10px;
    top: 3px;
}

.icon-off-day { /* Simple TV icon */
    color: transparent;
    border: 1.5px solid #666;
    width: 20px;
    height: 14px;
    border-radius: 2px;
    position: relative;
}
.icon-off-day::before {
    content: '';
    position: absolute;
    width: 2px;
    height: 2px;
    background-color: #666;
    border-radius: 50%;
    bottom: 2px;
    left: 3px;
}
.icon-off-day::after {
    content: '';
    position: absolute;
    width: 4px;
    height: 1.5px;
    background-color: #666;
    bottom: -1.5px;
    left: 50%;
    transform: translateX(-50%);
    border-radius: 1px;
}


.icon-half-day { /* Half-circle icon */
    color: transparent;
    width: 16px;
    height: 16px;
    border: 1.5px solid #666;
    border-radius: 50%;
    position: relative;
    overflow: hidden;
}
.icon-half-day::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 50%;
    height: 100%;
    background-color: #666;
}

.icon-plant-shutdown { /* X or cross icon */
    color: transparent;
    width: 18px;
    height: 18px;
    position: relative;
}
.icon-plant-shutdown::before,
.icon-plant-shutdown::after {
    content: '';
    position: absolute;
    background-color: #666;
    height: 2px;
    border-radius: 1px;
}
.icon-plant-shutdown::before {
    width: 100%;
    top: 50%;
    left: 0;
    transform: translateY(-50%) rotate(45deg);
}
.icon-plant-shutdown::after {
    width: 100%;
    top: 50%;
    left: 0;
    transform: translateY(-50%) rotate(-45deg);
}


/* Subheader for Day Type */
.legends-subheader {
    font-size: 1em;
    font-weight: bold;
    color: #333;
    padding: 10px 0;
    margin-top: 15px;
    margin-bottom: 8px;
    border-top: 1px solid #e0e0e0; /* Separator line */
}



.leave-accordion .legends-header.accordion-header .arrow {
    height: 22px;
    width: 22px;
}
.leave-accordion .legends-header.accordion-header .arrow i {
    font-size:12px;
}

.leave-accordion .section-title-side-status.accordion-header .arrow {
    height: 22px;
    width: 22px;
}
.leave-accordion .section-title-side-status.accordion-header .arrow i {
    font-size:12px;
}

span.legend-icon.icon-overtime {
    min-width: fit-content;
}
span.legend-icon.icon-override {
    min-width: fit-content;
}

span.legend-icon.iconrest-day {
    min-width: fit-content;
}
span.legend-icon.iconoff-day {
    min-width: fit-content;
}
span.legend-icon.iconholiday-type {
    min-width: fit-content;
}
span.legend-icon.iconhalf-day {
    min-width: fit-content;
}
span.legend-icon.iconplant-shutdown {
    min-width: fit-content;
}
.legends-content.accordion-body span.legend-icon i {
    font-size: 14px;
}



.gt-alert {
    min-height: 30px;
    border: 1px solid #cbd5e1;
    border-radius: 4px;
    padding: 8px 12px;
    margin-bottom: 10px;
    display: flex;
    align-items: center;
	    width: fit-content;
    justify-content: center;
}


.gt-alert-icon {
    display: inline-block;
    
    margin-right: 6px;
    font-size: 16px;
    color: #f66;
}
.avg-wrk {
    text-align: center;
}

.avg-wrk span {
    color: grey;
    font-size: 11px;
}

.avg-wrk span b {
    color: green;
	font-weight: 500;
}
.accordion.border-none {
    border: none;
}

.emp-bubble span {
    line-height: 16px;
}


.stat-item.review a span {
    font-size: 15px;
    font-weight: 500;
}

.leave-accordion .accordion-header > .col.manager {
    font-size: 14px;
    font-weight: 600;
    color: #212121;
}
.leave-accordion .accordion-header > .col.manager img {
    width: 35px;
    height: 35px;
    border-radius: 50%;
}

.leave-accordion .accordion-header > .col.manager {
    display: flex;
    align-items: center;
    gap: 8px;
}
.leave-review span.fullday {
    display: block;
    font-size: 10px;
    color: #616161;
}

.leave-review .applied {
    display: flex;
    align-items: center;
    justify-content: space-between;
}
.leave-review .applied  a {
    float: unset; 
}


.leave-review .applied  button.btn.btn-outline-light.border.me-2 {
    border-color: #304fdc !important;
    color: #304fdc !important;
	margin-left:8px;
}


.leave-review .applied .btn {
    padding: 5px 28px;
}

.select-search-employe {
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.form-check-input.review {
    width: 18px;
    height: 18px;
}

.form-check-label.review{
	margin-top: 2px;
}
.leave-review .es-icon-search {
    padding-top: 32px;
    background-image: url(../img/search-icon.svg);
    background-repeat: no-repeat;
    background-position: right;
    height: 14px;
    width: 14px;
    padding-left: 32px;
	position: absolute;
    right: 14px;
    top: 7px;
}

textarea.form-control.leave-review {
    height: auto;
    height: 48px;
}

.left-panel.down {
    margin-top: 30px;
    background: white;
    padding: 30px 25px;
    border-radius: 8px;
    border: 1px solid #ddd;
	    width: 700px;
}
.stat-item.detail {
    width: fit-content;
}
.leave-review-table tr td span{
	 font-size: 12px;
    color: grey;
}
.applied.footer-btn {
    background: white;
    padding: 30px;
    position: sticky;
    width: 100%;
    bottom: 0;
    right: 0;
	display: flex;
	align-items:center;
    justify-content: right;
    gap: 15px;
}

.search-att-info .accordion.leave-review {
    background: unset;
    box-shadow: unset;
    border: none;
    width: fit-content;
}

.search-att-info .accordion-header {
    background: white;
    border-radius: 30px;
    padding: 10px !important;
}



button#sidefilterBtn i {
    font-size: 16px;
}









.summary {
      display: flex;
      align-items: center;
      gap: 0.5rem;
      background-color: #fff5f5;
      color: #e53935;
      padding: 0.75rem 1rem;
      border-radius: 6px;
      width: max-content;
      font-weight: 500;
      margin-bottom: 1rem;
    }


:root{
        /* Palette tuned to the screenshot */
        --app-bg: #f5f7fb;
        --card-bg: #ffffff;
        --text-strong: #1f2937;
        --text: #344054;
        --muted: #98a2b3;
        --border: #e6e7eb;
        --brand: #21b3c2;        /* teal accent */
        --brand-600: #189aa7;
        --kudos-bg: #ffeef4;     /* pastel pink tile */
        --kudos-bd: #ffa0c2;
        --polls-bg: #e9fbf7;     /* pastel teal tile */
        --polls-bd: #9ce3d1;
        --radius-card: 6px;
        --shadow-1: 0 1px 2px rgba(16,24,40,.08), 0 6px 12px rgba(16,24,40,.05);
      }
  
      /* Layout */
      .app-engage{
        display:flex;
        min-height:100vh;
        gap:0;
        overflow:hidden;
      }
      
      .avatar-initials{
        width:40px;height:40px;border-radius:50%;
        background:#e6f7f9;color:#0b7285;
        display:grid;place-items:center;
        font-weight:600;
      }
      .menu .nav-link{
        color:#475467;
        border-radius: 8px;
        padding:.5rem .625rem;
        display:flex; align-items:center; gap:.5rem;
      }
      .menu .nav-link:hover{
        background: #f3f4f6;
        color:#1f2937;
      }
      .menu .nav-link.active{
        background:#eefafb;
        color:#0b7285;
        font-weight:600;
        border:1px solid #d7f1f4;
      }
      .menu .bi{
        width:20px; text-align:center; color:#98a2b3;
      }

      .main-engage{
        flex:1;
        padding: 0px;
        
      }

      /* Cards */
      .card-lite{
        background: var(--card-bg);
        border:1px solid var(--border);
        border-radius: var(--radius-card);
        /* box-shadow: var(--shadow-1); */
      }
 
      /* Header welcome card */
      .welcome-card .initial{
        width:56px;height:56px;border-radius:50%;
            background: #3d59e9;
    color: #ffffff;display:grid;place-items:center;
        font-weight:700;
      }
      .action-tile{
        border:1px solid var(--border);
      border-radius: 20px;
    padding: 10px 16px;
        display:flex; align-items:center; gap:10px;
        font-weight:600;
        cursor:pointer;
        user-select:none;
        transition: .15s ease;
      }
      .action-tile .bi{ font-size:20px; }
      .action-kudos{ background: var(--kudos-bg); border-color: var(--kudos-bd); color:#c2255c; }
      .action-kudos:hover{ filter: brightness(.98); }
      .action-polls{ background: var(--polls-bg); border-color: var(--polls-bd); color:#0b7285; }
      .action-polls:hover{ filter: brightness(.98); }

      /* Section header with accent bar */
      .section-title{
        position:relative; padding-left:16px;
      }
      .section-title:before{
        content:""; position:absolute; left:0; top:.25rem; bottom:.25rem; width:3px; background: var(--brand);
        border-radius: 2px;
      }

      /* Filters panel */
      .filters .form-check{
		padding: 13px 30px;
		border-radius: 18px;
		text-align: center;
		font-weight: 600;
		}
	  .filters .form-check label {
      cursor: pointer;
       width:100%;
        }
    
	  .filters .form-check.active{
       background: linear-gradient(135deg, #61c797, #6a3ef6);
       border-radius: 18px;
       color: #fff;
      }
      .filters .search-wrap{
        position:relative;
      }
      .filters .search-wrap .bi{
        position:absolute; right:12px; top:50%; transform:translateY(-50%); color:#98a2b3;
      }
      .filters .accordion-button{
        background:#fff !important; border-radius:10px !important;font-size: 14px;
      }
	  .filters .accordion-button:after {
          background-size: 16px !important;
	  }

      /* Feed */
      .feed-card .logo{
        width:56px; height:56px; border-radius:8px; object-fit:cover;
        border:1px solid var(--border);
      }
      .feed-card .meta{
        color: var(--muted);
        font-size: .875rem;
      }
      .feed-card .divider{
        height:1px; background: var(--border);
      }
      .feed-card .reaction{
        color:#475467; font-weight:500; cursor:pointer;
      }
      .feed-empty{
        color:#98a2b3;
        text-align:center; padding:40px 0;
      }
      /* Footer small row */
      .app-footer{
        color:#98a2b3; font-size:.875rem;
      }
      /* Utilities */
      .small-muted{ color: var(--muted); }
      .rounded-10{ border-radius:10px !important; }
      .rounded-12{ border-radius:12px !important; }

button.accordion-button.px-0:focus:not(:focus-visible) {
    box-shadow: none;
}

img.logo.congratulations {
    width: 126px;
    height: 114px;
    border: none;
    object-fit: contain;
}

.es-search .es-employee-photo {
    background-image: url(../img/default-emp-icon.svg);
}



/*-----------------
	43. Responsive
-----------------------*/


@media only screen and (min-width: 991px) {
	#toggle_btn {
		color: #fff;
		float: left;
		font-size: 20px;
		line-height: 70px;
		padding: 0 10px;
		filter: brightness(0) saturate(100%) invert(47%) sepia(93%) saturate(6754%) hue-rotate(229deg) brightness(98%) contrast(86%);
	}
	.user-active .call-imgs {
		width: 100%;
	}
	.join-video.user-active {
		height: auto;
	}
	.single-user .call-imgs {
		width: 100%;
	}
	.mini-sidebar .header-left .logo span {
		display: none;
	}
	.mini-sidebar .header .header-left {
		padding: 0 5px;
		width: 74px;
	}
	 .logo { 
    padding-left: 6px;
}
	.mini-sidebar .sidebar {
		width: 74px;
	}
	.mini-sidebar.expand-menu .sidebar {
		width: 230px;
	}
	.mini-sidebar .menu-title {
		visibility: hidden;
		white-space: nowrap;
	}
	.mini-sidebar.expand-menu .menu-title {
		visibility: visible;
	}
	.modal-open .mini-sidebar .sidebar {
		z-index: 1051;
	}
	.mini-sidebar .sidebar .sidebar-menu ul > li > a span {
		display: none;
		transition: all 0.2s ease-in-out;
		opacity: 0;
	}
	.mini-sidebar.expand-menu .sidebar .sidebar-menu ul > li > a span {
		display: inline;
		opacity: 1;
	}
	.mini-sidebar .page-wrapper {
		margin-left: 60px;
	}
	.mini-sidebar .sidebar .sidebar-menu ul > li > a span.menu-side {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		opacity: 1;
	}
	.mini-sidebar .sidebar-menu > ul > li > a {
		padding: 12px 10px;
	}
	.mini-sidebar.expand-menu .sidebar-menu > ul > li > a {
		padding: 12px 20px;
	}
	.mini-sidebar .sidebar-menu .logout-btn a {
		padding: 12px 10px;
	}
	.mini-sidebar.expand-menu .sidebar-menu .logout-btn a { 
		padding: 12px 20px;
	}
}
@media only screen and (min-width: 768px) {
	
	/* .main-box1 { */
        /* flex-direction: column; */
      /* } */
      /* .left-panel1 { */
        /* border-right: none; */
        /* padding-right: 0; */
        /* border-bottom: 1px solid #eee; */
        /* margin-bottom: 20px; */
      /* } */
	
	.modal-md {
		width: 500px;
	}
	.nav-tabs.nav-justified.nav-tabs-top {
		border-bottom: 1px solid #ddd;
	}
	.nav-tabs.nav-justified.nav-tabs-top > li > a,
	.nav-tabs.nav-justified.nav-tabs-top > li > a:hover,
	.nav-tabs.nav-justified.nav-tabs-top > li > a:focus {
		border-width: 2px 0 0 0;
	}
	.nav-tabs.nav-tabs-top > li {
		margin-bottom: 0;
	}
	.nav-tabs.nav-tabs-top > li > a,
	.nav-tabs.nav-tabs-top > li > a:hover,
	.nav-tabs.nav-tabs-top > li > a:focus {
		border-width: 2px 0 0 0;
	}
	.nav-tabs.nav-tabs-top > li + li > a {
		margin-left: 1px;
	}
	.nav-tabs.nav-tabs-top > li > a.active,
	.nav-tabs.nav-tabs-top > li > a.active:hover,
	.nav-tabs.nav-tabs-top > li > a.active:focus {
		border-top-color: #3a57e8;
	}
	.nav-tabs.nav-tabs-bottom > li {
		margin-bottom: -1px;
	}
	.nav-tabs.nav-tabs-bottom > li > a.active,
	.nav-tabs.nav-tabs-bottom > li > a.active:hover,
	.nav-tabs.nav-tabs-bottom > li > a.active:focus {
		border-bottom-width: 2px;
		border-color: transparent;
		border-bottom-color: #009efb;
		background-color: transparent;
		transition: none 0s ease 0s;
		-moz-transition: none 0s ease 0s;
		-o-transition: none 0s ease 0s;
		-ms-transition: none 0s ease 0s;
		-webkit-transition: none 0s ease 0s;
	}
	.nav-tabs.nav-tabs-bottom > li {
		margin-bottom: -1px;
	}
	.nav-tabs.nav-tabs-bottom > li > a.active,
	.nav-tabs.nav-tabs-bottom > li > a.active:hover,
	.nav-tabs.nav-tabs-bottom > li > a.active:focus {
		border-bottom-width: 2px;
		border-color: transparent;
		border-bottom-color: #3a57e8;
		background-color: transparent;
		transition: none 0s ease 0s;
		-moz-transition: none 0s ease 0s;
		-o-transition: none 0s ease 0s;
		-ms-transition: none 0s ease 0s;
		-webkit-transition: none 0s ease 0s;
	}
	.nav-tabs.nav-tabs-solid {
		background-color: #fafafa;
		border: 0;
	}
	.nav-tabs.nav-tabs-solid > li {
		margin-bottom: 0;
	}
	.nav-tabs.nav-tabs-solid > li > a {
		border-color: transparent;
	}
	.nav-tabs.nav-tabs-solid > li > a:hover,
	.nav-tabs.nav-tabs-solid > li > a:focus {
		background-color: #f5f5f5;
	}
	.nav-tabs.nav-tabs-solid > .open:not(.active) > a {
		background-color: #f5f5f5;
		border-color: transparent;
	}
	.nav-tabs-justified.nav-tabs-top {
		border-bottom: 1px solid #ddd;
	}
	.nav-tabs-justified.nav-tabs-top > li > a,
	.nav-tabs-justified.nav-tabs-top > li > a:hover,
	.nav-tabs-justified.nav-tabs-top > li > a:focus {
		border-width: 2px 0 0 0;
	}
}
@media only screen and (max-width: 1199.98px) {
	.profile-user-img img {
		width: 90px;
	}
	.profile-edit-icon img {
		width: 25px;
	}
	.follow-btn-group .btn-info {
		min-width: auto;
	}
	.profile-table.custom-table thead tr th, .profile-table.custom-table tbody tr td {
		padding: 10px;
	}
	.invoices-view {
		width: 90%;
		float: right;
	}
	.invoices-tabs ul li {
		margin-right: 10px;
	}
	.invoices-tabs ul li a {
		font-size: 14px;
	}
	.login-wrap-bg {
		padding: 15px 50px 15px;
	}
	.login-wrapper .loginbox .login-right {
		padding: 30px;
	}
	.morning-user {
		padding: 30px 0px 30px 30px;
	}
	.morning-user h2 {
		font-size: 28px;
		font-weight: 600;
	}
	.border-right-bg:before {
		display: none;
	}
	.border-right-bg {
		margin-bottom: 10px;
	}
	.wallet-widget .circle-bar > div canvas {
		width: 140px !important;
		height: 140px !important;
	}
	.meeting .join-video {
		height: 320px;
	}
	.join-video.single-user {
		height: auto;
	}
}
@media only screen and (max-width: 991.98px) {
	.profile-rightbar {
		display: inline-block !important;
	}
	div.dataTables_wrapper div.dataTables_info {
		padding-bottom: 0.85em;
	}
	.chat-profile-view {
		display: none;
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
		right: 0;
		transform: translateX(0px);
		z-index: 1041;
		width: 300px;
		position: fixed;
		margin-right: -300px;
		display: table-cell;
		top: 0;
		padding-bottom: 60px;
		margin-top: 50px;
	}
	.message-view.chat-view {
		width: 100%;
	}
	.slide-nav .page-wrapper {
		left: 225px;
		margin-left: 0;
	}
	.chat-main-row {
		left: 0;
	}
	.header .header-left {
		position: absolute;
		width: 100%;
	}
	.mobile_btn {
		display: block;
	}
	.page-title-box {
		display: none;
	}
	.sidebar {
		margin-left: -225px;
		width: 225px;
	}
	.page-wrapper {
		margin-left: 0;
		padding-left: 0;
		padding-right: 0;
	}
	.slide-nav .sidebar {
		margin-left: 0;
	}
	a.mobile_btn {
		color: #fff;
		font-size: 24px;
		height: 70px;
		left: 0;
		line-height: 70px;
		padding: 0 20px;
		position: absolute;
		top: 0;
		width: 60px;
		z-index: 10;
	}
	.slide-nav .page-wrapper {
		left: 225px;
		margin-left: 0;
	}
	.invoices-view {
		width: 100%;
		float: none;
	}
	#toggle_btn {
		display: none;
	}
	.sidebar {
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
	}
	.page-wrapper {
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
	}
	/* invoice */
	.app-listing li {
		width: 49%;
		display: inline-block;
	}
	.app-listing {
		display: inline-block;
	}
	.multipleSelection #checkBoxes, 
	.SortBy #checkBox {
		width: 100%;
	}
	.inovices-month-info {
		padding-top: 20px;
	}
	.invoice-inner-date {
		padding:  10px;
	}
	.invoice-inner-date.invoice-inner-datepic {
		padding: 10px 0;
	}
	.field-box .btn {
		min-width: auto;
		border-radius: 4px;
		padding: 10px;
	}
	.invoice-inner-head {
		padding: 10px;
		border-bottom: 1px solid #E5E5E5;
	}
	.invoice-circle-img {
		display: none;
	}
	.invoice-item-bg .invoice-info {
		border-right: 1px solid #fff;
		padding: 10px 30px;
		margin-top: 20px;
	}
	.invoice-item-bg .invoice-info {
		border-right: 1px solid #fff;
		padding: 10px 30px;
		margin-top: 0;
	}
	.invoice-info {
		margin-bottom: 0;
	}
	.payment-details {
		width: auto;
	}
	.invoices-preview .modal-dialog {
		max-width: 700px;
	}
	.invoice-item-one .invoice-info {
		text-align: left;
	}
	.invoice-head h2 {
		font-size: 16px;
	}
	.invoice-head p {
		font-size: 14px;
	}
	.invoice-payment-box .payment-details {
		margin-bottom: 20px;
	}
	.invoice-faq .faq-tab {
		padding-bottom: 10px;
	}
	.service-upload {
		padding: 30px 0;
		width: auto;
	}
	.invoice-inner-date.invoice-inner-datepic {
		padding: 10px;
	}
	.bank-details-btn .btn {
		min-width: auto;
		padding: 10px;
	}
	.invoice-info-card .invoice-item-one .invoice-info {
		text-align: right;
	}
	.login-wrap {
		display: none;
	}
	.account-logo,
	.login-wrapper .loginbox .login-right h2,
	.login-wrapper .loginbox .login-right .forgotpass,
	.login-btn	{
		margin-bottom: 25px;
	}
	.login-wrapper .loginbox .login-right h2 {
		font-size: 20px;
	}
	.error-box h3 {
		font-size: 26px;
	}
	.mob-view {
		display: none;
	}
	.logo {
		justify-content: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
	}
	.morning-user {
		padding: 25px 0px 25px 25px;
	}
	.morning-user h2 {
		font-size: 26px;
	}
	.user-menu.nav li {
		margin-right: 6px;
	}
	.profile-user-img img {
		width: 60px;
	}
	.profile-edit-icon img {
		width: 15px;
	}
	.names-profiles h4 {
		font-size: 14px;
	}
	.names-profiles h5 {
		font-size: 12px;
	}
	.doctor-follows h5 {
		font-size: 12px;
	}
	.doctor-follows h4 {
		font-size: 16px;
	}
	.follow-btn-group .btn-info {
		min-width: 90px;
		font-size: 12px;
		padding: 4px 15px;
	}
	.meeting .join-video {
		height: 320px;
	}
	.join-video.single-user {
		height: auto;
	}
	.feather-chevron-right:before {
		top: 2px;
		position: relative;
	}
}
@media only screen and (max-width: 767.98px) {
	.table .invoice-link{
		font-size: 14px;
	}
	div.dataTables_wrapper div.dataTables_paginate ul.pagination {
		padding-bottom: 15px;
		justify-content:center;
	}
	.profile-info-left {
		border-right: none;
		border-bottom: 2px dashed #ccc;
		margin-bottom: 20px;
		padding-bottom: 20px;
	}
	.navbar-nav .open .dropdown-menu {
		float: left;
		position: absolute;
	}
	.notifications {
		right: -48px;
	}
	.notifications:before,
	.notifications:after {
		right: 60px;
	}
	.modal-body.card-box {
		background-color: #fff;
		border: none;
		border-radius: inherit;
		box-shadow: unset;
		margin-bottom: 0;
		padding: 15px;
	}
	.roles-menu {
		margin-bottom: 20px;
	}
	.left-action {
		text-align: center;
		margin-bottom: 15px;
	}
	.right-action {
		text-align: center;
	}
	.top-action-left .float-left {
		float: none !important;
	}
	.top-action-left .btn-group {
		margin-bottom: 15px;
	}
	.top-action-right {
		text-align: center;
	}
	.top-action-right a.btn.btn-white {
		margin-bottom: 15px;
	}
	.mail-sent-time {
		float: left;
		margin-top: 10px;
		width: 100%;
	}
	.nav-tabs.nav-justified {
		border-bottom: 1px solid #ddd;
	}
	.nav-tabs.nav-justified > li > a.active,
	.nav-tabs.nav-justified > li > a.active:hover,
	.nav-tabs.nav-justified > li > a.active:focus {
		border-color: transparent transparent transparent #009efb;
		border-left-width: 2px;
	}
	.nav-tabs {
		border-bottom: 0;
		position: relative;
		background-color: #fff;
		padding: 5px 0;
		border: 1px solid #ddd;
		border-radius: 3px;
	}
	.nav-tabs .nav-item {
		margin-bottom: 0;
	}
	.nav-tabs > li > a {
		border-width: 2px;
		border-left-color: transparent;
	}
	.nav-tabs .nav-link {
		border-width: 2px;
	}
	.nav-tabs > li > a:hover,
	.nav-tabs > li > a:focus {
		background-color: #fafafa;
	}
	.nav-tabs .nav-item.show .nav-link,
	.nav-tabs .nav-link.active,
	.nav-tabs > li > a.active,
	.nav-tabs > li > a.active:hover,
	.nav-tabs > li > a.active:focus {
		background-color: #f5f5f5;
		border-color: transparent transparent transparent #009efb;
		border-left-width: 2px;
	}
	.nav-tabs > li.open:not(.active) > a,
	.nav-tabs > li.open:not(.active) > a:hover,
	.nav-tabs > li.open:not(.active) > a:focus {
		background-color: #fafafa;
	}
	.nav-tabs.nav-tabs-solid {
		padding: 5px;
	}
	.nav-tabs.nav-tabs-solid.nav-tabs-rounded {
		border-radius: 5px;
	}
	.nav-tabs.nav-tabs-solid > li > a {
		border-left-width: 0!important;
	}
	.nav-tabs-justified {
		border-bottom: 1px solid #ddd;
	}
	.nav-tabs-justified > li > a.active,
	.nav-tabs-justified > li > a.active:hover,
	.nav-tabs-justified > li > a.active:focus {
		border-width: 0 0 0 2px;
		border-left-color: #009efb;
	}
	h1 {
		font-size: 2em;
	}
	h2 {
		font-size: 1.5em;
	}
	h3 {
		font-size: 1.17em;
	}
	h4 {
		font-size: 1.12em;
	}
	h5 {
		font-size: .83em;
	}
	h6 {
		font-size: .75em;
	}
	.page-title {
		font-size: 1.2em;
		padding-top: 10px;
	}
	.card-title {
		font-size: 1.12em;
	}
	.blog-view .blog-title {
		font-size: 18px;
	}
	.widget h3 {
		font-size: 18px;
	}
	.my-video ul li {
		width: 80px;
	}
	.voice-call-avatar .call-avatar {
		width: 120px;
		height: 120px;
	}
	.table-responsive {
		display: block;
		width: 100%;
		overflow-x: auto;
		-ms-overflow-style: -ms-autohiding-scrollbar;
	}
	.header .has-arrow .dropdown-toggle > span:nth-child(2) {
		display: none;
	}
	.header .has-arrow .dropdown-toggle:after {
		display: none;
	}
	.btn-white {
		margin: 0px;
	}
	.login-wrapper .loginbox .login-right .forgotpass,
	.next-sign 	{
		display: block;
	}
	.remember-me {
		margin-bottom: 10px;
	}
	.login-right .btn-primary {
		font-size: 14px;
		padding: 7px 15px;
	}
	.account-subtitle {
		margin-bottom: 15px;
	}
	.login-wrap-bg {
		padding: 15px 20px 15px;
	}
	.login-wrapper .loginbox .login-right {
		padding: 20px;
	}
	.error-box h3 {
		font-size: 18px;
	}
	.error-box p {
		font-size: 14px;
	}
	.error-box img {
		margin-bottom: 25px;
	}
	.sucess-mail h4 {
		font-size: 22px;
	}
	.mobile-user-menu > a {
		color: #3a57e8;
	}
	.morning-img img {
		position: relative;
		width: 100%;
	}
	 
	.morning-user {
		padding: 0;
	}
	.good-morning-blk {
		padding: 20px;
	}
	.morning-user h2 {
		font-size: 20px;
	}
	.morning-user p {
		font-size: 14px;
	}
	.page-header .breadcrumb {
		font-size: 14px;
	}
	.dash-content h4 {
		font-size: 14px;
		margin-bottom: 15px;
	}
	.dash-content h2 {
		font-size: 28px;
		margin-bottom: 15px;
	}
	.patient-visit {
		flex-wrap: wrap;
	}
	.chat-user-total {
		margin: 10px 0px;
	}
	.wallet-widget .circle-bar > div canvas {
		width: 100px !important;
		height: 100px !important;
	}
	.steps-history li,
	.doctor-date-list li {
		font-size: 12px;
	}
	.doctor-date-list li span {
		padding-left: 5px;
	}
	.border-right-bg:before {
		display: none;
	}
	.border-right-bg {
		margin-bottom: 10px;
	}
	.active-doctor {
		display: block;
	}
	.weight-blk {
		margin-bottom: 5px;
	}
	.treat-box {
		display: block;
	}
	.user-imgs-blk {
		margin-bottom: 10px;
	}
	.user-imgs-blk img {
		margin-right: 8px;
	}
	.profile-user-img img {
		width: 90px;
	}
	.profile-edit-icon img {
		width: 25px;
	}
	.doctor-follows h5 {
		font-size: 12px;
	}
	.doctor-follows h4 {
		font-size: 16px;
	}
	.follow-group {
		padding: 0px 15px;
	}
	.follow-btn-group .btn-info {
		font-size: 14px;
		padding: 6px 15px;
	}
	.follow-btn-group {
		margin: 15px 0px;
	}
	.names-profiles h4,
	.tab-content-set li a	{
		font-size: 16px;
	}
	.tab-content-set ul li a.active::after, 
	.tab-content-set ul li a:hover::after {
		display: none;
	}
	.tab-content-set li {
		margin-bottom: 15px;
	}
	.tab-content-set {
		padding: 0;
	}
	.detail-personal {
		margin-bottom: 15px;
	}
	.doctor-submit .btn-primary {
		min-width: 125px;
		font-size: 12px;
		border-radius: 12px;
		padding: 7px 15px;
		margin-bottom: 8px;
		margin-right: 0px !important;
	}
	.invoice-counts h4 {
		display: inline-block;
	}
	.activity-list::before {
		display: none;
	}
	.timeline-group-blk {
		display: block;
	}
	.comman-activitys {
		padding: 12px;
		margin-top: 5px;
	}
	.activity-sub-list li {
		margin-bottom: 10px;
	}
	.latest-posts-act .post-thumb {
		float: inherit;
		margin-bottom: 15px;
	}
	.latest-posts-act .post-info {
		margin-left: 0;
	}
	.blog-grp-blk {
		flex-wrap: wrap;
	}
	.blog-img-blk {
		margin-bottom: 5px;
	}
	.blog-grp-blk span {
		margin-left: auto;
	}
	.grid-blog .blog-title a {
		font-size: 15px;
	}
	.chat-search-group {
		display: block;
	}
	.chat-search-list ul {
		margin-top: 10px;
	}
	.chat-search-list ul li:first-child {
		margin-left: 0;
	}
	.inputgroups input[type="text"] {
		padding-right: 125px;
	}
	.settings-btn.upload-files-avator .upload {
		width: 120px;
		font-size: 12px;
	}
	.mailview-header, .send-user.send-user-name h4 {
		display: block;
	}
	.sender-info {
		margin-bottom: 10px;
	}
	.send-user.send-user-name h4 span {
		display: inline-block;
		margin: 0;
	}
	.mail-attach .msg-sub-list li {
		margin-bottom: 10px;
	}
	.forward-send .btn-primary {
		margin-bottom: 10px;
		width: 100%;
	}
	.chat-user-group.clinic-user {
		display: block !important;
	}
	.call-list-add {
		padding: 0;
	}
	.meeting .join-video {
		height: 116px;
	}
	.join-video.single-user {
		width: 100%;
	}
	.join-video.single-user {
		height: auto;
	}
	.meet-icons .meet-items .meet-item > a {
		width: 35px;
		height: 35px;
	}
	.end-call-chat .btn-primary {
		min-width: 90px;
		margin: 0px 5px;
		padding: 6px 13px;
		font-size: 14px;
	}
	.meet-icons .meet-items .meet-item, .action-items .action-item {
		margin-right: 5px;
	}
	.card {
		width: 100%;
	}
	.patient-structure h3 {
		font-size: 32px;
	}
}
@media only screen and (max-width: 575.98px) {
	.app-listing li {
		width: 100%;
	}
	.download-grp {
		margin-top: 10px;
	}
	.invoices-tabs ul li {
		margin-right: 0;
		display: block;
		margin-bottom: 14px;
	}
	.schedule-time{
		margin-bottom: 10px;
	}
	.invoices-tabs ul li a{
		padding-bottom: 0;
	}
	.invoices-settings-btn{
		justify-content: start;
	}
	.invoices-create-btn .btn {
		font-size: 14px;
		padding: 10px;
		min-width: auto;
	}
	.invoice-info-card .invoice-item-one .invoice-info {
		text-align: left;
	}
	.invoice-item .invoice-details {
		text-align: left;
		float: left;
	}
	.invoice-info.invoice-info2 {
		text-align: left;
	}
	.invoice-total-footer h4 {
		font-size: 14px;
	}
	.nav-tabs.menu-tabs .nav-link{
		padding: 10px;
	}
	ul.nav.nav-tabs.menu-tabs {
		padding: 10px;
	}
	.invoice-setting-btn .btn {
		min-width: auto;
		padding: 10px;
	}
	.contact-cat {
		padding-right: 70px;
	}
	.user-menu {
		display: none;
	}
	.mobile-user-menu {
		display: block;
	}
	.search-box {
		display: none;
	}
	.filter-row {
		margin-bottom: 15px;
	}
	.page-wrapper > .content {
		padding: 15px;
	}
	.profile-view .profile-basic {
		margin-left: 0;
	}
	.profile-img-wrap {
		position: relative;
		margin: 0 auto;
	}
	.profile-view .profile-img-wrap {
		margin: 0 auto 10px;
		height: 100px;
		width: 100px;
	}
	.profile-view .profile-img {
		height: 100px;
		width: 100px;
	}
	.profile-view .profile-img .avatar {
		font-size: 24px;
		height: 100px;
		line-height: 100px;
		margin: 0;
		width: 100px;
	}
	.profile-info-left {
		text-align: center;
	}
	.profile-basic {
		margin-left: 0;
		margin-top: 15px;
	}
	.page-title {
		font-size: 18px;
	}
	.fc-toolbar .fc-right {
		display: inline-block;
		float: none;
		margin: 10px auto 0;
		width: 200px;
		clear: both;
	}
	.fc-toolbar .fc-left {
		float: none;
		margin: 0 auto;
		width: 200px;
	}
	.upload-text {
		font-size: 18px;
	}
	.call-duration {
		display: block;
		margin-top: 0;
		margin-bottom: 10px;
		position: inherit;
	}
	.end-call {
		margin-top: 10px;
		position: inherit;
	}
	.chat-right .chat-content {
		max-width: 90%;
	}
	.chat-right .chat-body {
		padding-left: 0;
		padding-right: 0;
	}
	.chat-left .chat-content {
		max-width: 90%;
	}
	.chat-left .chat-body {
		padding-left: 0;
		padding-right: 0;
	}
	.chat-avatar .avatar {
		height: 20px;
		line-height: 20px;
		width: 20px;
	}
	.account-box {
		width: 100%;
		margin-bottom: 20px;
	}
	.content {
		padding: 0 50px;
	}
	.custom-menu.navbar-nav > li > a {
		margin-left: 10px;
	}
	.error-box h1 {
		font-size: 50px;
	}
	.submit-btn {
		min-width: 150px;
	}
	.ui-kit-wrapper button {
		margin-bottom: 5px;
	}
	.pagination > li > a,
	.pagination > li > span {
		padding: .5rem !important;
	}
	.invoice-item-box{
		float: left;
	}
	.wizard .nav-tabs li:after {
		display: none;
	}
}
@media only screen and (max-width: 479px) {
	.compose-btn button {
		padding: 0.365rem 0.5rem;
	}
	.doctor-search-blk .add-group{
		margin-top: 10px;
	}
	.doctor-search-blk .top-nav-search {
		margin-left: 0;
	}
	.attachments li {
		float: none;
		text-align: center;
		margin: 0 auto;
		margin-bottom: 10px;
	}
	.meeting .join-video {
		height: 100%;
	}
	.follow-btn-group .btn-info {
		min-width: auto;
	}
}


/* ============================
   SVG DONUT CHART
============================ */

.ps-donut-chart{
    width:170px;
    height:170px;
    position:relative;
    display:flex;
    align-items:center;
    justify-content:center;
    flex-shrink:0;
}

.ps-donut-svg{
    width:170px;
    height:170px;
    transform:rotate(-90deg);
}

.ps-track{
    fill:none;
    stroke:#edf1fb;
    stroke-width:14;
}

.ps-arc{
    fill:none;
    stroke-width:14;
    stroke-linecap:round;
}

.ps-arc-purple{
    stroke:url(#psGradientPurple);
    stroke-dasharray:178 377;
    stroke-dashoffset:0;
}

.ps-arc-blue{
    stroke:url(#psGradientBlue);
    stroke-dasharray:92 377;
    stroke-dashoffset:-188;
}

.ps-arc-green{
    stroke:url(#psGradientGreen);
    stroke-dasharray:54 377;
    stroke-dashoffset:-290;
}

/* ============================
   CENTER TEXT
============================ */

.ps-donut-center{
    position:absolute;
    width:106px;
    height:106px;
    background:#ffffff;
    border-radius:50%;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    box-shadow:0 8px 20px rgba(96,111,161,.08);
}

.ps-donut-center span{
    font-size:15px;
    font-weight:500;
    color:#7d879c;
    line-height:1;
}

.ps-donut-center strong{
    margin-top:6px;
    font-size:22px;
    font-weight:700;
    color:#222b45;
    line-height:1;
}

/* ============================
   DIVIDER
============================ */

.ps-divider{
    width:100%;
    height:1px;
    background:#eef2f7;
    margin:22px 0 18px;
}

/* ============================
   FOOTER
============================ */

.ps-footer{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:18px;
}

.ps-paid-days{
    display:flex;
    align-items:center;
    gap:10px;
}

.ps-paid-days i{
    color:#6a5cff;
    font-size:16px;
}

.ps-paid-days span{
    font-size:14px;
    font-weight:500;
    color:#6b7485;
}

.ps-status{
    display:flex;
    align-items:center;
    gap:10px;
}

.ps-status-label{
    font-size:14px;
    color:#6b7485;
}

.ps-status-badge{
    background:#e8f9ef;
    color:#2db36b;
    border-radius:30px;
    padding:6px 16px;
    font-size:13px;
    font-weight:700;
    line-height:1;
}

/* ============================
   DOWNLOAD BUTTON
============================ */

.ps-download-btn{
    width:100%;
    height:54px;
    border:none;
    outline:none;
    border-radius:16px;
    background:#f4f2ff;
    color:#695cff;
    display:flex;
    align-items:center;
    justify-content:center;
    gap:10px;
    font-size:15px;
    font-weight:600;
    cursor:pointer;
    transition:.25s ease;
}

.ps-download-btn:hover{
    background:#ede8ff;
}

.ps-download-btn i{
    font-size:16px;
}

/* ============================
   HOVER CARD
============================ */

psx-card{
width:320px;
background:#fff;
border-radius:18px;
padding:18px;
box-shadow:
0 15px 45px rgba(35,55,80,.08),
0 2px 8px rgba(0,0,0,.05);
}

.psx-header{display: flex;justify-content: space-between;align-items: center;border-bottom: 1px solid #00000012;padding-bottom: 12px;margin-bottom: 15px;}

.psx-title{font-size: 15px;font-weight:700;color:#2f3445;}

.psx-month{
font-size:12px;
color:#7d8698;
}

.psx-top{display:flex;gap: 8px;align-items:center;}

.psx-chart-wrap{
width:130px;
height:130px;
position:relative;
}

.psx-center{
position:absolute;
left:50%;
top:50%;
transform:translate(-50%,-50%);
text-align:center;
pointer-events:none;
}

.psx-center h4{
font-size:16px;
font-weight:700;
color:#31384a;
}

.psx-center span{
font-size:13px;
color:#777;
}

.psx-info{flex:1;display:flex;flex-direction:column;gap: 7px;}

.psx-box{background:#fff;border:1px solid #edf0f6;border-radius:14px;padding: 8px 10px;display:flex;justify-content:space-between;align-items:center;box-shadow:0 6px 18px rgba(0,0,0,.04);}

.psx-left{
display:flex;
gap:10px;
align-items:center;
}

.psx-icon{
width:28px;
height:28px;
border-radius:50%;
display:flex;
align-items:center;
justify-content:center;
font-size:15px;
font-weight:700;
}

.psx-purple{
background:#efe7ff;
color:#6d3eff;
}

.psx-red{
background:#ffecec;
color:#ff3d3d;
}

.psx-green{
background:#eaf9ef;
color:#17b44c;
}

.psx-label{
font-size:12px;
color:#777;
}

.psx-value{
font-size:15px;
font-weight:700;
margin-top:2px;
color:#20242d;
}

.psx-bottom{
margin-top:18px;
display:flex;
justify-content:space-between;
align-items:center;
}

.psx-days{
display:flex;
align-items:center;
gap:8px;
font-size:13px;
color:#000;
    font-weight: 600;
}

.psx-status{
text-align:right;
    display: flex;
    align-items: center;
    gap: 10px;
}

.psx-status small{
display:block;
color: #000;
    font-weight: 600;
margin-bottom:4px;
font-size:12px;
}

.psx-pill{
background:#dff7e7;
color:#28a745;
padding:5px 7px;
border-radius:20px;
font-size:10px;
font-weight:600;
}

.psx-download{
margin-top:18px;
height:46px;
background:linear-gradient(90deg,#eff9f1,#f7faf9);
border-radius:12px;
display:flex;
align-items:center;
padding:0 16px;
gap:10px;
font-weight:600;
color:#17a44a;
cursor:pointer;
transition:.3s;
}

.psx-download:hover{
transform:translateY(-2px);
}
.psx-card {
    background: #fff;
    padding: 24px;
    border-radius: 18px;
    box-shadow: 4px 1px 20px rgb(184 230 208 / 38%);
}
.slides-2.container h1 {
    color: #3b4452;
    font-weight: 600;
    font-size: 22px;
}

.qaPanelWrapX9{
    background:#fff;
    border-radius:18px;
    padding: 24px;
    box-shadow: 4px 1px 20px rgb(184 230 208 / 38%);
    margin-top: 16px;
}

.qaPanelTitleX9{
    font-size: 15px;
    font-weight: 700;
    color: #2f3445;
    border-bottom: none;
    padding-bottom: 0;
    margin-bottom: 0;
}

.qaPanelHeaderX9{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    border-bottom: 1px solid #00000012;
    padding-bottom: 12px;
    margin-bottom: 16px;
}

.qaGridBoxX9{display:grid;grid-template-columns: repeat(3,1fr);gap: 9px;}

.qaCardItemX9{background:#f9fbff;border:1px solid #edf1f7;border-radius:14px;padding: 10px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;cursor:pointer;transition:.3s;}

.qaCardItemX9:hover{

    transform:translateY(-4px);
    background:#fff;
    box-shadow:0 10px 20px rgba(20,35,90,.08);
}

.qaCardItemX9 i{

    font-size:28px;
}

.qaCardItemX9 span{margin-top:12px;font-size: 10px;font-weight:600;color:#374151;line-height:18px;}

/* Icon Colors */



.qaIconOrangeX9{
    color:#f97316;
}

.qaIconBlueX9{
    color:#2563eb;
}

.qaIconPurpleX9{
    color:#4f46e5;
}

/* Responsive */

@media(max-width:600px){

.qaPanelWrapX9{
    width:100%;
}

.qaGridBoxX9{
    grid-template-columns:repeat(2,1fr);
}

}
.card.leave-card {
    background: #fff;
    border-radius: 18px;
    padding: 22px;
    box-shadow: 4px 1px 20px rgb(230 211 245);
}
.leave-text {
  font-size: 15px;
    font-weight: 700;
    color: #2f3445; 
}

.empPromoCard {
       background: url(../img/bg-bottom.png);
       height: 96%;
       background-size: cover, 100%;
       background-repeat: no-repeat;
       background-position: right;
       padding: 24px;
       border-radius: 20px;
       box-shadow: 0px 0px 20px rgb(33 150 243 / 25%);
}

h3.empPromoTitle {
    font-size: 20px;
    font-weight: 500;
}
.uholiday-card{ 
    background:#fff;
    border-radius:18px;
    box-shadow:0 10px 35px rgba(27,39,94,.08);
    overflow:hidden;
}

.uholiday-header{
    display:flex;
    justify-content:space-between;
    align-items:center;
    /* padding: 0px 0px 10px; */
    border-bottom:1px solid #edf0f7;
}

.uholiday-title{
    display:flex;
    align-items:center;
    gap:10px;
}

.uholiday-title h3{
    font-size: 15px;
    color:#25324b;
    font-weight:600;
}

.uholiday-icon{
    width:28px;
    height:28px;
    display:flex;
    align-items:center;
    justify-content:center;
    background:#eef2ff;
    border-radius:8px;
}

.uholiday-header a{
    text-decoration:none;
    color: #17a44a;
    font-size: 13px;
    font-weight:600;
}

.uholiday-item{
    display: grid;
    grid-template-columns: 21% 47% 21%;
    gap: 15px;
    align-items: end;
    padding:18px 20px;
    border-bottom:1px solid #edf0f7;
}

.uholiday-item:last-child{
    border-bottom:none;
}

.uholiday-date{
    width: 68px;
    height: 68px;
    background:#f8f9fd;
    border-radius:14px;
    display:flex;
    flex-direction:column;
    justify-content:center;
    align-items:center;
    flex-shrink:0;
}

.uholiday-date h2{
    font-size: 21px;
    color:#1f2940;
    line-height:1;
    font-weight:700;
    margin-bottom: 3px;
}

.uholiday-date span{
    font-size:12px;
    color:#6b7280;
    letter-spacing:1px;
    margin-top:4px;
    font-weight:600;
}

.uholiday-content{
}

.uholiday-content h4{
    font-size: 14px;
    color:#1f2940;
    margin-bottom:6px;
    font-weight:600;
}

.uholiday-content p{
    color:#7d879c;
    font-size:14px;
}

.uholiday-image{
    /* width: 104px; */
    text-align:right;
}

.uholiday-image img{
    width: 100%;
    /* height: 68px; */
    object-fit:contain;
}

@media(max-width:480px){

    .uholiday-card{
        width:100%;
        margin:15px;
    }

    .uholiday-image{
        width:70px;
    }

    .uholiday-image img{
        height:55px;
    }

    .uholiday-content h4{
        font-size:14px;
    }

}
.leave-1{background: #e0f8e5;}
.leave-2{background: #ffeaea;}
.leave-3{background: #edf2fd;}
.leave-4{background: #eeebfe;}
.leave-5{background: #f6ecfc;}
.leave-6{background: #faf3e6;}

.dashboard-btn::after{

    content:"";

    position:absolute;

    top:0;
    left:-120%;

    width:60%;
    height:100%;

    transform:skewX(-25deg);

    background:linear-gradient(
        90deg,
        transparent,
        rgba(255,255,255,.35),
        transparent
    );

    transition:.8s;

}

.dashboard-btn:hover::after{
    left:160%;
}

.dashboard-btn:hover{

    transform:translateY(-3px);

    box-shadow:
        0 10px 25px rgba(37,99,235,.45),
        0 20px 50px rgba(16,216,118,.35);

}
h4.pre-att {
    font-size: 19px !important;
    font-weight: 700;
    color: #000 !important;
}
.attendance_bottom {
    display: flex;
    gap: 15px;
}
.attendance_in {
   background: #e0f8e5;
} 
.attendance_box {
    flex: 1;
    border-radius: 16px;
        padding: 9px 15px;
    display: flex;
    align-items: center;
    gap: 12px;
}
.attendance_out {
   background: #ffeaea;
}
.attendance_box_label {
    font-size: 11px !important;
}

.attendance_box_time {
    font-weight: 600;
}
.attendance_box.attendance_in i {
    color: green;
    font-size: 22px;
}
.attendance_out i {
    color: red;
    font-size: 22px;
}

.kc-help-card{
   width: 100%;
    height: 225px;
    border-radius: 40px;
    padding: 16px;
    position: relative;
    overflow: hidden;
    background-image: url(../img/caredesk.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    box-shadow: 0px 0px 20px rgb(215 206 255);
    border: 1px solid #fff;
}

.kc-help-content{
    position:absolute;
    bottom: 18px;
    left: 20px;
    right: 20px;
}

.kc-help-title{
    font-size: 18px;
    font-weight:700;
    color:#1F2340;
    margin-bottom: 3px;
}

.kc-help-text{
    color: #333540;
    font-size: 13px;
    margin-bottom: 10px;
}

.kc-help-btn{
    width:100%;
    height: 50px;
    border:none;
    border-radius:16px;
    background:linear-gradient(90deg,#7B61FF,#A06BFF);
    color:#fff;
    font-size: 12px;
    font-weight:600;
    display:flex;
    justify-content:center;
    align-items:center;
    gap:12px;
    cursor:pointer;
    transition:.3s;
    box-shadow:0 10px 25px rgba(123,97,255,.35);
}

.kc-help-btn:hover{
    transform:translateY(-3px);
}

.kc-help-arrow{
    font-size:20px;
}
.btn-width {
    width: fit-content !important;
    padding: 12px 30px;
}
img.web-logo {
    width: auto;
    max-width: 160px;
    height: 40px;
    max-height: 40px;
    object-fit: contain;
    object-position: left center;
    display: block;
}

ul.nav.user-menu.top-header-flex {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-left: 18px;
    padding-top: 4px;
}
.btn.btn-primary {
    background: linear-gradient(135deg, #61c797, #6a3ef6);
    box-shadow: 0 0px 25px rgb(37 99 235 / 5%), 0 0px 15px rgb(16 185 129 / 13%), inset 0 2px 4px rgb(255 255 255 / 56%), inset 0 -3px 8px rgb(255 255 255 / 18%);
    border-color: #e5ddfd !important;
    color: #FFF;
}
.active-dropdown{
	color: #0d6efd !important;
}
.flex-box {
    display: grid;
    grid-template-columns: 22% 74%;
    align-items: center;
    gap: 10px;
}
.icon-box i {
    font-size: 22px;
    color: #17a460;
}
.icon-box {
    width: 48px;
    height: 48px;
    background: #80ccaf70;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.flex-box h4 {
    margin-bottom: 0;
}
.border-1.rounded.bg-white {
    border: 1px solid #64c89947;
	    box-shadow: 4px 1px 20px rgb(184 230 208 / 38%);
}
.leave-apply.possition-relative {
    position: relative;
}

.right-att-img.possition-absolute {
    position: absolute;
    width: 370px;
    right: -49px;
    top: -135px;
}

.leave-apply-banner {
    background-position: right, right;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #f1eefe !important;
    padding: 16px 20px 25px;
    /* position: relative; */
    border-radius: 20px;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
    background-image: url(../img/apply-leave-banner.png);
    height: 120px;
}
.leave-apply-banner h2 {
    font-size: 20px;
}


.lb_card_unique{
    background:#fff;
    border:1px solid #eef0f6;
    border-radius:14px;
    padding:24px;
    box-shadow:0 2px 8px rgba(0,0,0,0.04);
    margin-bottom:14px;
}

.lb_header_unique{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin-bottom: 28px;
    border-bottom: 1px solid #0000001f;
    padding-bottom: 10px;
}

.lb_header_unique {}

.lb_title_unique{
    font-size: 20px;
    font-weight:700;
    color:#23263b;
}

.lb_icon_box_unique{
    width:26px;
    height:26px;
    border-radius:8px;
    background:#f3edff;
    display:flex;
    align-items:center;
    justify-content:center;
    color:#7b61ff;
    font-size:13px;
}

.lb_item_unique{
    margin-bottom: 28px;
}

.lb_item_top_unique{
    display:flex;
    justify-content:space-between;
    font-size:11px;
    margin-bottom: 12px;
}

.lb_label_unique{
    color:#636b82;
    font-weight:600;
    font-size: 13px;
}

.lb_value_unique{
    color:#2a3145;
    font-weight:700;
}

.lb_progress_bg_unique{
    width:100%;
    height: 8px;
    background:#edf0f7;
    border-radius:20px;
    overflow:hidden;
}

.lb_progress_fill_unique{
    height:100%;
    background:#4caf50;
    border-radius:20px;
}

.lb_view_btn_unique{
    width:100%;
    border:none;
    background:none;
    color:#5c50ff;
    font-size:12px;
    font-weight:700;
    cursor:pointer;
    margin-top:5px;
}

.lb_quick_title_unique{
    font-size: 18px;
    font-weight:700;
    color:#23263b;
    margin-bottom:14px;
	border-bottom: 1px solid #0000001f;
    padding-bottom: 10px;
}

.lb_action_item_unique{
    display:flex;
    align-items:center;
    justify-content:space-between;
    padding: 14px 10px;
	border-radius: 5px;
  
}
.a-leave{
  border-bottom:1px solid #f1f3f8;
}
.a-leave:last-child{
    border-bottom:none;
}

.lb_action_left_unique{
    display:flex;
    align-items:center;
    gap:10px;
}

.lb_action_icon_unique{
   width: 38px;
    height: 38px;
    border-radius: 8px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 20px;
}

.lb_purple_unique{
    background:#f3edff;
    color:#7b61ff;
}

.lb_green_unique{
    background:#e9f8ef;
    color:#2eb872;
}

.lb_orange_unique{
    background:#fff0e8;
    color:#ff8a4c;
}

.lb_action_heading_unique{
    font-size: 14px;
    font-weight:700;
    color:#2a3145;
}

.lb_action_sub_unique{
    font-size: 12px;
    color:#8b93a8;
    margin-top:2px;
}

.lb_arrow_unique{
    color: #484848;
    font-size: 15px;
}
span.hide-helps a { 
    display: block;
    white-space: nowrap;
    font-weight: 500;
}
.lb_action_item_unique.active{
	background: linear-gradient(135deg, #61c797, #6a3ef6);
	
}
.lb_action_item_unique.active .lb_action_heading_unique,.lb_action_item_unique.active .lb_action_sub_unique,.lb_action_item_unique.active .lb_arrow_unique{
	color: #fff;
}
button.btn.btn-submit {
    background: linear-gradient(135deg, #61c797, #6a3ef6);
    box-shadow: 0 0px 25px rgb(37 99 235 / 5%), 0 0px 15px rgb(16 185 129 / 13%), inset 0 2px 4px rgb(255 255 255 / 56%), inset 0 -3px 8px rgb(255 255 255 / 18%);
    border-color: #e5ddfd !important;
    color: #FFF;
    border-radius: 18px;
    padding: 12px 30px;
}
.card.border.leave-balance{
    margin-bottom: 25px;
    box-shadow: none;
    border: 0;
    border-radius: 12px;
    width: 100%;
}
.bg-info-transparent {
    background-color: #D6E9FF !important;
    color: #1B84FF !important;
}
.remain-balance {
    font-size: 13px;
    font-weight: 600;
    padding: 5px 12px;
    display: block;
}
.leave-bal-banner { 
    background-color: #fdfcfd !important; 
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
    background-image: url(../img/leave-cal.png);
    height: 132px;
}
.icon-box-1 {
    background: #eae7fb;
    color: #5c41e7;
    width: 44px;
    height: 44px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
	font-size: 18px;
}
.remain-balance-1 {
    background-color: #eae7fb !important;
    color: #5c41e7 !important;
}
.icon-box-2 {
    background: #fdeaf0;
    color: #f5548e;
}

.remain-balance-2 {
    color: #f2709f !important;
    background: #fdeaf0 !important;
}

.progress-bar.m-color {
    background: #f2709f;
}
.icon-box-3 {
    background: #e4f4e9;
    color:#13b726;
}

.remain-balance-3 {
    color: #13b726 !important;
    background: #e4f4e9 !important;
}

.progress-bar.e-color {
    background: #13b726;
}
.icon-box-4 {
    background: #fee9cf;
    color: #fe8409;
}

.remain-balance-4 {
    color: #fe8409 !important;
    background: #fee9cf !important;
}

.progress-bar.c-color {
    background: #fe8409;
}
.icon-box-5 {
    background: #e9f1ff;
    color: #184fe9;
}

.remain-balance-5 {
    color: #184fe9 !important;
    background: #e9f1ff !important;
}

.progress-bar.w-color {
    background: #184fe9;
}
.icon-box-6 {
    background:#eee9fd;
    color: #5e3fdf;
}

.remain-balance-6 {
    color: #5e3fdf !important;
    background: #eee9fd !important;
}

.progress-bar.r-color {
    background:#5e3fdf;
}
.icon-box-7 {
    background:#e3f7f9;
    color: #4daab9;
}

.remain-balance-7 {
    color: #4daab9 !important;
    background: #e3f7f9 !important;
}

.progress-bar.re-color {
    background:#4daab9;
}
.icon-box-8 {
    background:#fde4e4;
    color: #ea2d44;
}

.remain-balance-8 {
    color:#ea2d44 !important;
    background: #fde4e4 !important;
}

.progress-bar.l-color {
    background:#ea2d44;
}
.form-group.form-group-grid label {
    font-weight: 600;
    display: block;
}
.form-group.form-group-grid {
    display: grid;
    grid-template-columns: 16% 44%;
    align-items: center;
}

.transcation-bg {
    background: linear-gradient(135deg, #61c797, #6a3ef6);
    color: #fff;
}
a.fc-col-header-cell-cushion {
    color: #000;
}
.fc-daygrid-day-number {
    color: #000;
}
.fc-view-harness.fc-view-harness-active {
    height: 438px !important;
}
.fc-scroller.fc-scroller-liquid-absolute {
    overflow: hidden !important;
}
.fc .fc-button-primary { 
    background: linear-gradient(135deg, #61c797, #6a3ef6);
    border-color: #ffffff;
    color: var(--fc-button-text-color);
}
.uholiday-item-2 {
    display: grid;
    grid-template-columns: 20% 53% 20%;
    gap: 10px;
    align-items: center;
    padding: 11px 14px;
    border-bottom: 1px solid #edf0f7;
}
.uholiday-date-2 {
    width: 61px;
    height: 61px; 
    border-radius: 14px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    flex-shrink: 0;
}
.uholiday-image-2 {
    width: 56px;
    text-align: right;
}
.uholiday-image-2 img {
    width:100%; 
}
.uholiday-date-2 h2 {
    font-size: 21px;
    font-weight: 700;
}
.working-time{
	grid-template-columns: 60% 36%;
}
.working-time .uholiday-image-2 {
      width: 100px;
}
.uholiday-list-2 {
    height: 190px;
    overflow-y: scroll;
}
.uholiday-list-2::-webkit-scrollbar {
    display: none;
}
.uholiday-item-2:last-child {
    border-bottom: none;
}
.engage-banner {
    height: 150px;
}
.form-check-grid {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 5px;
}
.form-check-grid .form-check input {
    display: none;
}
.row-grid {
    display: flex;
    gap: 26px;
    align-items: center;
}

.anni-bg {
    background-color: #f4fefd;
    background-image: url(../img/bg-03.svg);
    border: 1px solid #0000000f;
    padding: 13px;
    border-radius: 13px;
    background-repeat: no-repeat;
    background-position: left top;
}
.birth-bg{
    background-color: #fbf9f3;
    background-image: url(../img/bg-02.svg);
    border: 1px solid #0000000f;
    padding: 13px;
    border-radius: 13px;
    background-repeat: no-repeat;
    background-position: left top;
}
.payslip-card {
    background: #fff;
    border: 1px solid #bbb2f8ad;
    border-radius: 14px;
    padding: 15px 17px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}

    .left-section{
        display:flex;
        align-items:center;
        gap:14px;
    }

    .icon-box{
        width:58px;
        height:58px;
        border-radius:50%;
        background:#edf9f1;
        display:flex;
        align-items:center;
        justify-content:center;
    }

    .icon-box svg{
        width:28px;
        height:28px;
        stroke:#18b45b;
    }

    .content-3 h4{
        font-size:14px;
        font-weight:500;
        color:#5f6b85;
        margin-bottom:8px;
    }

    .content-3 h2{
        font-size: 29px;
        color: #000000;
        font-weight:700;
        line-height:1;
        margin-bottom:0px;
    }
 

    .divider{
        width:1px;
        height:65px;
        background:#e6e9f2;
    }

    .download-section{
        text-align:center;
        cursor:pointer;
    }

    .download-circle{
        width:48px;
        height:48px;
        border-radius:50%;
        border:2px solid #8ea3ff;
        display:flex;
        align-items:center;
        justify-content:center;
        margin:0 auto 8px;
    }

    .download-circle svg{
        width:22px;
        height:22px;
        stroke:#3f5cff;
    }

    .download-text{
        font-size:14px;
        font-weight:600;
        color:#1f4fff;
    }
	.leave-apply-banner.pay-banner {
    height: 143px;
}

.salary-slip-card{
    background:#fff;
    border:1px solid #e7ebf3;
    border-radius:18px;
    padding:20px;
}

.salary-toolbar{
    display:flex;
    gap:15px;
    margin-bottom:20px;
    justify-content:space-between;
}

.salary-select,
.salary-search{
    height:46px;
    border:1px solid #e4e9f2;
    border-radius:12px;
    padding:0 16px;
}

.salary-search{
    width:320px;
}

.salary-filter-btn{
    height:46px;
    padding:0 22px;
    border:none;
    border-radius:12px;
    background:#ffffff;
    border:1px solid #e4e9f2;
    cursor:pointer;
}

.salary-history-table{
    width:100%;
    border-collapse:separate;
    border-spacing:0;
}

.btn-view-payslip{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    width:40px;
    height:40px;
    padding:0;
    border-radius:10px;
    flex-shrink:0;
}

.btn-view-payslip i{
    font-size:15px;
}

.payslip-view-modal .ant-modal-content{
    overflow: hidden;
}

.payslip-view-modal .ant-modal-header{
    padding: 12px 16px;
    margin-bottom: 0;
}

.payslip-view-modal .ant-modal-body{
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden !important;
    max-height: none !important;
    padding: 8px !important;
}

.payslip-view-modal .payslip-view-modal__body{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    overflow: hidden;
}

.payslip-view-modal .salary-slip{
    margin: 0 auto;
    transform: none;
    border: 1px solid #d8d2ea;
    box-shadow: 0 2px 12px rgba(106, 62, 246, 0.08);
}

.salary-history-table thead th{
    background:#f4f7fd;
    padding:18px;
    color:#55627d;
    font-size:14px;
    font-weight:600;
    border-bottom:1px solid #e7ebf3;
}

.salary-history-table tbody td{
    padding:20px 18px;
    border-bottom:1px solid #edf1f7;
    vertical-align:middle;
}

.period-wrap{
    display:flex;
    align-items:center;
    gap:15px;
}

.month-box{
    width:50px;
    overflow:hidden;
    border-radius:10px;
    border:1px solid #e2e8f4;
}

.month{
    display:block;
    background:#3d59e9;
    color:#fff;
    text-align:center;
    padding:8px;
    font-size:11px;
    font-weight:700;
}

.year{
    display:block;
    text-align:center;
    padding:8px;
    font-weight:600;
}

.period-info h4{
    font-size:15px;
    color:#1b2840;
    margin-bottom:5px;
}

.period-info p{
    color:#8390ab;
    font-size:13px;
}

.net-salary{
    color:#3d59e9;
    font-weight:700;
}

.days-badge{
    padding:8px 14px;
    background:#e8f8ee;
    color:#1f9b58;
    border-radius:30px;
    font-size:13px;
    font-weight:600;
}

.action-wrap{
    /* display:flex; */
    /* align-items:center; */
    /* gap:10px; */
}

.download-btn{
    background:#3d59e9;
    color:white;
    border:none;
    padding:10px 18px;
    border-radius:8px;
    cursor:pointer;
    width: 100%;
}

.more-btn{
    border:none;
    background:none;
    font-size:20px;
    cursor:pointer;
    color:#7d88a2;
}

.salary-footer{
    margin-top:20px;
    display:flex;
    justify-content:space-between;
    align-items:center;
}

.pagination-box{
    display:flex;
    align-items:center;
    gap:10px;
}

.pagination-box button{
    width:36px;
    height:36px;
    border:1px solid #e5eaf3;
    background:white;
    border-radius:8px;
}

.pagination-box .active{
    background:#3d59e9;
    color:white;
}
.w-100 {
    width: 100% !important;
}

.document-page-sec .documents-title{
    font-size:28px;
    font-weight:700;
    color:#111;
    margin-bottom:25px;
}

.document-page-sec .documents-grid{
    display:grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 15px;
}

.document-page-sec .document-card{
    background:#fff;
    border-radius:22px;
    padding: 18px 16px;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}

.document-page-sec .document-card:hover{
    /* transform:translateY(-6px); */
    /* box-shadow:0 18px 35px rgba(0,0,0,0.12); */
}

.document-page-sec .card-top{
    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:20px;
}

.document-page-sec .card-left{
    display:flex;
    align-items:center;
    gap: 10px;
}

.document-page-sec .icon-box{
    width:52px;
    height:52px;
    border-radius:16px;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:22px;
}

.document-page-sec .doc-icon{
    background:rgba(90,103,216,.15);
    color:#5A67D8;
}

.document-page-sec .ytd-icon{
    background:rgba(16,185,129,.15);
    color:#10B981;
}

.document-page-sec .form-icon{
    background:rgba(236,72,153,.15);
    color:#EC4899;
}

.document-page-sec .policy-icon{
    background:rgba(59,130,246,.15);
    color:#3B82F6;
}

.document-page-sec .card-title{
    font-size: 14px;
    font-weight:600;
    color:#111827;
    margin-bottom: 0;
}

.document-page-sec .view-btn {
    text-decoration: none;
    color: #3d59e9;
    font-weight: 600;
    transition: .3s;
    font-size: 12px;
    white-space: nowrap;
}   

.document-page-sec .view-btn:hover{
    color:#312E81;
}

.document-page-sec .file-count{
    font-size:17px;
    color:#6B7280;
}

.att_unique_card{width:100%;max-width:1100px;background:#fff;border-radius:18px;padding: 15px;box-shadow:0 8px 30px rgba(0,0,0,.06);}

.att_unique_header{
display:flex;
justify-content:space-between;
align-items:center;
margin-bottom:20px;
}

.att_unique_title{font-size: 16px;font-weight:700;color:#172B4D;}

.att_unique_title span{font-weight:500;font-size: 11px;color:#7A869A;}

.att_unique_select{border:1px solid #E5E8EF;padding: 5px 8px;border-radius:8px;outline:none;background:#fff;cursor:pointer;}

/* .att_unique_chart{
height:360px;
} */
canvas#attendanceChart{height: 180px;}


/* who is in */

.section-title {
      font-weight: 600;
      font-size: 20px;
      margin-bottom: 10px;
    }
    .filter-section {
    width: 30%;
}
    .filter-section .form-control {
      border-radius: 8px;
    }
    .summary-boxes {
      display: flex;
      justify-content: space-between;
      background: white;
      padding: 15px;
      border-radius: 0 0 8px 8px;
      box-shadow: 0 2px 4px rgba(0,0,0,0.05);
      margin-bottom: 20px;
      text-align: center;
    }
    .summary-boxes div {
      flex: 1;
    }
    .summary-boxes div:not(:last-child) {
      border-right: 1px solid #e5e5e5;
    }
    .summary-percentage {
      font-weight: 600;
      font-size: 18px;
    }
    .summary-label {
      font-size: 14px;
      color: #6c757d;
    }
    .status-cards {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 15px;
    }
	.card-box1 {
		background: #fff;
		border: 1px solid #ffffff !important;
		box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
		border-radius: 8px;
		padding: 15px 12px;
		display: flex;
		flex-direction: column;
		height: 100%;
	}
    .card-header1 {
      font-weight: 500;
    margin-bottom: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid grey;
    padding-bottom: 10px; 
    }
    .table-responsive {
      overflow-y: auto;
      max-height: 400px;
	  background: white;
    padding: 20px; 
    }
  
    td small {
      color: #6c757d;
    }
    .badge-approved {
      background: #28a745;
      color: white;
      padding: 2px 8px;
      border-radius: 12px;
      font-size: 12px;
      display: inline-block;
    }
    .badge-applied {
      background: #0d6efd;
      color: white;
      padding: 2px 8px;
      border-radius: 12px;
      font-size: 12px;
      display: inline-block;
    }
 .employee-details {
      background: #f8f9fa;
      padding: 10px;
      margin-top: 8px;
      border-radius: 5px;
      display: none;
    }
	.employee-details td {
    padding: 20px;
    /* padding-left: 19px !important; */
}
    .toggle-details {
      cursor: pointer;
      position: relative;
    }
    .dropdown-icon {
      float: right;
    font-size: 10px;
    color: #6c757d;
    border: 1px solid grey;
    border-radius: 50%;
    width: 17px;
    height: 17px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .5s all ease;
    }

i.bi.dropdown-icon.bi-chevron-up {
    color: #3a57e8;
	border: 1px solid #3a57e8;
}
.bg-secondary-50 {
    --tw-bg-opacity: 1;
    background-color: rgb(247 247 247 / var(--tw-bg-opacity, 1));
	    padding: 8px
}

tr.toggle-details td {
    padding: 10px 10px !important;
}

.summary-section-title{
	border-bottom: 1px solid #e5e5e5;
    padding: 10px;
    text-align: center;
    background: white;
	border-radius: 8px 8px 0 0;
}
.att-who-is-in {
    height: 130px;
}
.text-start-1.who-in-is p {
    font-size: 12px;
}
table.table.table-sm.who-is-in-table thead tr {
    background-image: linear-gradient(135deg, #61c797, #6a3ef6) !important; 
}
table.table.table-sm.who-is-in-table thead tr th {
    background-color:transparent; 
	color: #fff;
}
:root{
    --eht-blue:#2f6fed;
    --eht-blue-light:#eaf1ff;
    --eht-green:#22a35a;
    --eht-green-light:#e7f8ee;
    --eht-red:#e5484d;
    --eht-red-light:#fdecec;
    --eht-purple:#8b5cf6;
    --eht-purple-light:#f1ebfe;
    --eht-orange:#f5a623;
    --eht-orange-light:#fef3e0;
    --eht-gray:#9aa4b2;
    --eht-gray-light:#f4f5f7;
    --eht-border:#e9ecf1;
    --eht-text:#1f2733;
    --eht-text-soft:#8a93a3;
  }
   
  .eht-table-scroll::-webkit-scrollbar {
    width: 6px;
    height: 4px;
}

.eht-table-scroll::-webkit-scrollbar-thumb {
    background: #b5b5b5;
    border-radius: 10px;
}

.eht-table-scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
}
  .eht-dashboard{
    max-width:1180px;
    margin:0 auto;
  }

  /* ===== Toolbar ===== */
  .eht-toolbar{
    display:flex;
    align-items:center;
    gap:12px;
    background:#fff;
    border:1px solid var(--eht-border);
    border-radius:14px;
    padding:12px 14px;
    margin-bottom:16px;
    flex-wrap:wrap;
  }
  .eht-field{
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--eht-border);
    border-radius:10px;
    padding:9px 12px;
    background:#fff;
    font-size:13.5px;
    color:var(--eht-text);
    white-space:nowrap;
  }
  .eht-field svg{flex-shrink:0;color:var(--eht-text-soft);}
  .eht-field.eht-select{cursor:pointer;}
  .eht-field.eht-search{flex:1;min-width:180px;}
  .eht-field.eht-search input{
    border:none;outline:none;font-size:13.5px;width:100%;color:var(--eht-text);background:transparent;
  }
  .eht-field.eht-search input::placeholder{color:var(--eht-text-soft);}
  .eht-chevron{margin-left:2px;}
  .eht-filters-btn{
    margin-left:auto;
    display:flex;align-items:center;gap:8px;
    border:1px solid var(--eht-blue);
    color:var(--eht-blue);
    background:#fff;
    border-radius:10px;
    padding:9px 16px;
    font-size:13.5px;
    font-weight:600;
    cursor:pointer;
  }

  /* ===== Stat cards ===== */
  .eht-stats-row{
    display:grid;
    grid-template-columns: repeat(5,1fr);
    gap: 8px;
    margin-bottom:18px;
  }
  .eht-stat-card{
    background:#fff;
    border:1px solid var(--eht-border);
    border-radius:14px;
    padding: 20px 12px;
    display:flex;
    align-items:center;
    gap: 10px;
	    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
  }
  .eht-stat-icon{
    width:42px;height:42px;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
  }
  .eht-stat-icon.eht-i-total{background:var(--eht-blue-light);color:var(--eht-blue);}
  .eht-stat-icon.eht-i-present{background:var(--eht-green-light);color:var(--eht-green);}
  .eht-stat-icon.eht-i-absent{background:var(--eht-red-light);color:var(--eht-red);}
  .eht-stat-icon.eht-i-leave{background:var(--eht-purple-light);color:var(--eht-purple);}
  .eht-stat-icon.eht-i-holiday{background:var(--eht-orange-light);color:var(--eht-orange);}
  .eht-stat-icon.eht-i-attendance{background:var(--eht-blue-light);color:var(--eht-blue);}
  .eht-stat-label{
    font-size: 12px;
    color: #000000;
    margin-bottom: 4px;
  }
  .eht-stat-value{
    font-size:20px;font-weight:700;line-height:1.1;
  }
  .eht-stat-sub{
    font-size:11.5px;font-weight:600;margin-left:4px;
  }
  .eht-stat-sub.eht-sub-green{color:var(--eht-green);}
  .eht-stat-sub.eht-sub-red{color:var(--eht-red);}
  .eht-stat-sub.eht-sub-orange{color:var(--eht-orange);}
  .eht-stat-sub.eht-sub-purple{color:var(--eht-purple);}
  .eht-stat-sub.eht-sub-blue{color:var(--eht-blue);}

  /* ===== Table card ===== */
  .eht-table-card{
    background:#fff;
    border:1px solid var(--eht-border);
    border-radius:14px;
    padding:18px 18px 10px;
  }
  .eht-table-scroll{
    overflow-x:auto;
  }
  .eht-table{
    border-collapse:separate;
    border-spacing:0;
    width:100%;
    min-width:1300px;
  }
  .eht-table thead th{
    font-size:11px;
    font-weight:600;
    color:var(--eht-text-soft);
    text-align:center;
    padding:6px 15px;
    border-bottom:1px solid var(--eht-border);
	    border-right: 1px solid var(--eht-border);
    white-space:nowrap;
  }
  .eht-th-emp{
    text-align:left !important;
    font-size:13px !important;
    color:var(--eht-text) !important;
    padding-left:4px !important;
    min-width:230px;
    width:230px;
  }

  /* ===== Sticky left column (Employee Details) ===== */
  .eht-sticky-left{
    position:sticky;
    left:0;
    z-index:3;
    background:#fff;
	    border-right: 1px solid #8a93a326;
  }
  .eht-sticky-left::after{
    content:"";
    position:absolute;
    top:0; right:-8px; bottom:0;
    width:8px;
    box-shadow:4px 0 8px -4px rgba(20,20,30,0.12);
    pointer-events:none;
  }

  /* ===== Sticky right columns (P L H A WO OFF %) ===== */
 
  .eht-day-head{
    line-height:1.5;
  }
  .eht-day-head.eht-weekend{
    background:var(--eht-red-light); 
    color:var(--eht-red) !important;
  }
  .eht-th-summary{
    min-width:44px;
    width:44px;
  }
  .eht-th-pct{min-width:76px;width:76px;}

  .eht-table tbody td{
    text-align:center;
    padding:14px 4px;
    border-bottom:1px solid var(--eht-border);
	    border-right: 1px solid var(--eht-border);
    font-size:12.5px;
  }
  .eht-emp-cell{
    text-align:left !important;
    display:flex;
    align-items:center;
    gap:10px;
    padding-left:4px !important;
  }
  .eht-avatar{
    width:38px;height:38px;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-weight:700;
    font-size:13px;
    flex-shrink:0;
  }
  .eht-avatar.eht-av-blue{background:#e3edff;color:#3b6fe0;}
  .eht-avatar.eht-av-teal{background:#dff5f1;color:#1ea390;}
  .eht-avatar.eht-av-purple{background:#efe7fe;color:#8b5cf6;}
  .eht-avatar.eht-av-orange{background:#feefdd;color:#e39a2a;}
  .eht-emp-name{
    font-weight:700;
    font-size:13px;
    color:var(--eht-text);
    display:flex;align-items:center;gap:6px;
  }
  .eht-emp-id{
    font-size:11px;
    font-weight:600;
    color:var(--eht-blue);
    background:var(--eht-blue-light);
    border-radius:5px;
    padding:1px 6px;
  }
  .eht-emp-role{
    font-size:11.5px;color:var(--eht-text-soft);margin-top:2px;
  }

  .eht-cell{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:2px;
  }
  .eht-dot{
    width:8px;height:8px;border-radius:50%;
  }
  .eht-label{
    font-size:10.5px;font-weight:600;
  }
  .eht-status-p .eht-dot{background:var(--eht-green);}
  .eht-status-p .eht-label{color:var(--eht-green);}
  .eht-status-a .eht-dot{background:var(--eht-red);}
  .eht-status-a .eht-label{color:var(--eht-red);}
  .eht-status-wo .eht-dot{background:var(--eht-orange);}
  .eht-status-wo .eht-label{color:var(--eht-orange);}
  .eht-status-cl .eht-dot,
  .eht-status-el .eht-dot{background:var(--eht-purple);}
  .eht-status-cl .eht-label,
  .eht-status-el .eht-label{color:var(--eht-purple);}
  .eht-status-empty{color:var(--eht-text-soft);font-weight:600;}

  .eht-col-divider{
    border-left:1px solid var(--eht-border);
  }
  .eht-pct-pill{
    display:inline-block;
    font-weight:700;
    font-size:12px;
    padding:4px 10px;
    border-radius:16px;
    background:var(--eht-green-light);
    color:var(--eht-green);
  }

  /* ===== Legend ===== */
  .eht-legend{
    display:flex;
    align-items:center;
    gap:26px;
    flex-wrap:wrap;
    padding:16px 6px 6px;
    font-size:12.5px;
    color:var(--eht-text-soft);
  }
  .eht-legend-item{
    display:flex;align-items:center;gap:7px;
  }
  .eht-legend-dot{
    width:9px;height:9px;border-radius:50%;
  }
  .eht-legend-dot.eht-ld-green{background:var(--eht-green);}
  .eht-legend-dot.eht-ld-red{background:var(--eht-red);}
  .eht-legend-dot.eht-ld-purple{background:var(--eht-purple);}
  .eht-legend-dot.eht-ld-orange{background:var(--eht-orange);}
  .eht-legend-dot.eht-ld-blue{background:var(--eht-blue);}
  .eht-legend-dot.eht-ld-gray{background:#c7cdd6;}

  @media (max-width:900px){
    .eht-stats-row{grid-template-columns:repeat(2,1fr);}
  }

   :root{
    --sr-green-bg:#e6f6ea;
    --sr-green-text:#1e8a3c;
    --sr-green-dot:#34a853;
    --sr-off-bg:#eef0f2;
    --sr-off-text:#6b7280;
    --sr-off-dot:#c6cbd1;
    --sr-cl-bg:#eef1fd;
    --sr-cl-text:#5b6bd9;
    --sr-cl-dot:#8b9cf0;
    --sr-el-bg:#fbeefb;
    --sr-el-text:#b355b3;
    --sr-el-dot:#e08fe0;
    --sr-weekend-bg:#f7f8fa;
    --sr-border:#e9ebee;
    --sr-text-main:#1f2430;
    --sr-text-muted:#8a8f99;
    --sr-blue:#3b6fe0;
  }

 

  .sr-breadcrumb{
    font-size:13px;
    color:var(--sr-text-muted);
    margin-bottom:16px;
  }
  .sr-breadcrumb .sr-crumb-current{
    color:var(--sr-text-main);
    font-weight:600;
  }

  .sr-card{
    background:#ffffff;
    border-radius:12px;
    padding:20px 20px 8px 20px;
    box-shadow:0 1px 2px rgba(16,24,40,0.04);
  }

  .sr-toolbar{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
    flex-wrap:wrap;
  }

  .sr-select-group{
    display:flex;
    align-items:center; 
    border:1px solid var(--sr-border);
    border-radius:8px;
    padding:8px 12px;
    font-size:13px;
    color:var(--sr-text-main);
    background:#fff;
    cursor:pointer;
  }
  .sr-select-group svg{flex-shrink:0;}
  .sr-select-group select{
    border:none;
    outline:none;
    background:transparent;
    font-size:13px;
    color:var(--sr-text-main);
    cursor:pointer;
    appearance:none;
    padding: 0 14px;
  }
  .sr-select-group .sr-caret{
    margin-left:-14px;
    pointer-events:none;
  }

  .sr-search-box{
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--sr-border);
    border-radius:8px;
    padding:8px 12px;
    flex:1;
    min-width:220px;
    max-width:360px;
  }
  .sr-search-box input{
    border:none;
    outline:none;
    font-size:13px;
    width:100%;
    color:var(--sr-text-main);
  }
  .sr-search-box input::placeholder{color:var(--sr-text-muted);}

  .sr-spacer{flex:1;}

  .sr-export-btn{
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--sr-blue);
    color:var(--sr-blue);
    background:#fff;
    border-radius:8px;
    padding:9px 16px;
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    white-space:nowrap;
  }
  .sr-export-btn:hover{background:#f2f6ff;}

  .sr-table-scroll{
    overflow-x:auto;
    padding-bottom:8px;
	border-top: 1px solid #e9ebee;
  }

  .sr-table{
    border-collapse:separate;
    border-spacing:0;
    width:100%;
    min-width:1400px;
  }

  .sr-table thead th{
    background:#fff;
    z-index:2;
    font-weight:600;
    font-size:11px;
    text-align:center;
    color:var(--sr-text-muted);
    padding: 12px 4px 12px 4px;
    border-bottom:1px solid var(--sr-border);
    border-right: 1px solid #e9ebee;
  }

  .sr-th-employee{
    text-align:left;
    padding-left:8px;
    min-width:220px;
    position:sticky;
    left:0;
    background:#fff;
    z-index:3;
    font-size:13px;
    color:var(--sr-text-muted);
    font-weight:600;
  }
  .sr-th-wd, .sr-th-off{
    min-width:44px;
  }

  .sr-day-head{
    min-width:38px;
  }
  .sr-day-num{
    display:block;
    font-size:12px;
    font-weight:700;
    color:var(--sr-text-main);
  }
  .sr-day-dow{
    display:block;
    font-size:10px;
    color:var(--sr-text-muted);
    font-weight:500;
  }
 .sr-day-head.sr-weekend {
    background: #ffcbcb;
}

  .sr-table tbody td{
    text-align:center;
    padding: 14px 4px;
    border-bottom:1px solid var(--sr-border);
    font-size:11px;
	border-right: 1px solid var(--sr-border);
  }

  .sr-table tbody tr:last-child td{
    border-bottom:none;
  }

  .sr-td-employee{
    text-align:left;
    position:sticky;
    left:0;
    background:#fff;
    z-index:1;
    padding:14px 8px;
    border-right: 1px solid #e9ebee;
  }

  .sr-emp-row{
    display:flex;
    align-items:center;
    gap:10px;
  }

  .sr-avatar{
    width:36px;
    height:36px;
    border-radius:50%;
    background:linear-gradient(135deg,#dbe4ff,#c3d0ff);
    color:#3b52b0;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:700;
    flex-shrink:0;
  }

  .sr-emp-name{
    font-size:13px;
    font-weight:700;
    color:var(--sr-text-main);
    line-height:1.3;
  }
  .sr-emp-id{
    font-weight:500;
    color:var(--sr-text-muted);
  }
.sr-emp-role 
 {
    font-size: 11.5px;
    color: var(--sr-text-muted); 
    margin-top: 4px;
    text-align: left;
}

  .sr-td-num{
    font-weight:700;
    font-size:13px;
    color:var(--sr-text-main);
  }

  .sr-day-cell{
    background:transparent;
  }
  .sr-day-cell.sr-weekend{
       background: #ffcbcb;
  }

  .sr-tag{
    display:inline-block;
    min-width:34px;
    padding:4px 6px;
    border-radius:6px;
    font-size:10.5px;
    font-weight:700;
    letter-spacing:0.2px;
  }
  .sr-tag-gs{background:var(--sr-green-bg);color:var(--sr-green-text);}
  .sr-tag-off {
    background: #ffcbcb;
    color: #F44336;
}
  .sr-tag-cl{background:var(--sr-cl-bg);color:var(--sr-cl-text);}
  .sr-tag-el{background:var(--sr-el-bg);color:var(--sr-el-text);}

  .sr-legend{
    display:flex;
    align-items:center;
    gap:24px;
    flex-wrap:wrap;
    padding:16px 8px 18px 8px;
    margin-top:4px; 
    font-size:12.5px;
    color:var(--sr-text-main);
  }
  .sr-legend-item{
    display:flex;
    align-items:center;
    gap:7px;
  }
  .sr-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    display:inline-block;
  }
  .sr-dot-gs{background:var(--sr-green-dot);}
  .sr-dot-off{background:var(--sr-off-dot);}
  .sr-dot-cl{background:var(--sr-cl-dot);}
  .sr-dot-el{background:var(--sr-el-dot);}

    .sr-table-scroll::-webkit-scrollbar {
    width: 6px;
    height: 4px;
}

.sr-table-scroll::-webkit-scrollbar-thumb {
    background: #b5b5b5;
    border-radius: 10px;
}

.sr-table-scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
}
th.sr-th-employee {
    font-size: 16px !important;
    color: #000 !important;
}

 :root {
      --trg-purple: #6C4FE0;
      --trg-purple-dark: #5B3EDC;
      --trg-purple-light: #EFEAFD;
      --trg-green: #1BAA6A;
      --trg-green-light: #E7F8EF;
      --trg-red: #E14848;
      --trg-red-light: #FDECEC;
      --trg-text-dark: #1E1B2E;
      --trg-text-muted: #8B87A0;
      --trg-border: #EDEBF5;
      --trg-bg: #F7F6FC;
    }
 
    /* Breadcrumb */
    .trg-breadcrumb {
      font-size: 13px;
      color: var(--trg-text-muted);
      margin-bottom: 18px;
    }

    .trg-breadcrumb a {
      color: var(--trg-purple);
      text-decoration: none;
      font-weight: 500;
    }

    .trg-breadcrumb .trg-sep {
      margin: 0 6px;
      color: #C9C5DA;
    }

    /* Header */
    .trg-header {
      position: relative;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: 26px;
      overflow: hidden;
    }

    .trg-header h1 {
      font-size: 26px;
      font-weight: 800;
      margin: 0 0 6px 0;
      letter-spacing: -0.3px;
    }

    .trg-header p {
      font-size: 14px;
      color: var(--trg-text-muted);
      margin: 0;
    }

    .trg-header-art {
      width: 120px;
      height: 90px;
      flex-shrink: 0;
    }

    /* Stat cards (also act as tabs) */
    .trg-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-bottom: 26px;
    }

    .trg-stat-card {
      border-radius: 18px;
      padding: 20px 22px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 96px;
      cursor: pointer;
      user-select: none;
      transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
      border: 2px solid var(--trg-border);
      background: #fff;
    }

    .trg-stat-card:hover {
      transform: translateY(-2px);
    }

    .trg-stat-card.trg-tab-active.trg-stat-pending {
      box-shadow: 0 12px 24px -8px rgba(108, 79, 224, 0.55);
    border-color: #673AB7;
    }

    .trg-stat-card.trg-tab-active.trg-stat-accepted {
      border-color: var(--trg-green);
      box-shadow: 0 10px 22px -10px rgba(27, 170, 106, 0.35);
    }

    .trg-stat-card.trg-tab-active.trg-stat-rejected {
      border-color: var(--trg-red);
      box-shadow: 0 10px 22px -10px rgba(225, 72, 72, 0.3);
    }

    .trg-stat-left {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .trg-stat-label-row {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 15px;
      font-weight: 600;
    }

    .trg-stat-pending .trg-stat-label-row {
      color: #673ab7;
    }
 
    .trg-stat-accepted .trg-stat-label-row {
      color: var(--trg-green);
    }

    .trg-stat-rejected .trg-stat-label-row {
      color: var(--trg-red);
    }

    .trg-stat-icon-badge {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .trg-stat-pending .trg-stat-icon-badge {
      background: var(--trg-purple-light);
      color: var(--trg-purple);
    }
 

    .trg-stat-accepted .trg-stat-icon-badge {
      background: var(--trg-green-light);
    }

    .trg-stat-rejected .trg-stat-icon-badge {
      background: var(--trg-red-light);
    }

    .trg-stat-number {
      font-size: 30px;
      font-weight: 800;
      line-height: 1;
    }

    .trg-stat-sub {
      font-size: 12px;
      font-weight: 500;
      color: var(--trg-text-muted);
    }

    .trg-stat-card.trg-tab-active.trg-stat-pending .trg-stat-sub {
      color: rgba(255, 255, 255, 0.75);
    }

    .trg-stat-right-icon {
      width: 46px;
      height: 46px;
      border-radius: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      background: var(--trg-purple-light);
    }
 

    .trg-stat-accepted .trg-stat-right-icon {
      background: var(--trg-green-light);
    }

    .trg-stat-rejected .trg-stat-right-icon {
      background: var(--trg-red-light);
    }

    /* Table card */
    .trg-table-card {
      background: #fff;
      border-radius: 18px;
      border: 1px solid var(--trg-border);
      padding: 22px 24px 10px 24px;
    }

    .trg-table-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 18px;
    }

    .trg-table-title {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 16px;
      font-weight: 700;
    }

    .trg-table-title-icon {
      width: 32px;
      height: 32px;
      border-radius: 9px;
      background: var(--trg-purple-light);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .trg-table-total {
      font-size: 13px;
      font-weight: 700;
      color: var(--trg-purple);
    }

    /* Tab panels — each one holds its own fully static <table> */
    .trg-tab-panel {
      display: none;
    }

    .trg-tab-panel.trg-panel-active {
      display: block;
    }

    .trg-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 13px;
    }

    .trg-table thead th {
      text-align: left;
      color: var(--trg-text-muted);
      font-weight: 600;
      font-size: 12px;
      padding: 10px 12px;
      border-bottom: 1px solid var(--trg-border);
      white-space: nowrap;
    }

    .trg-table tbody td {
      padding: 14px 12px;
      border-bottom: 1px solid var(--trg-border);
      vertical-align: middle;
      color: var(--trg-text-dark);
      white-space: nowrap;
    }

    .trg-table tbody tr:last-child td {
      border-bottom: none;
    }

    .trg-emp-cell {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .trg-avatar {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 700;
      color: #fff;
    }

    .trg-emp-name {
      font-weight: 600;
      font-size: 13px;
      white-space: nowrap;
    }

    .trg-emp-role {
      font-size: 11.5px;
      color: var(--trg-text-muted);
    }

    .trg-mgr-cell {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .trg-mgr-avatar {
      width: 26px;
      height: 26px;
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 10px;
      font-weight: 700;
      color: #fff;
    }

    .trg-mgr-name {
      font-weight: 600;
      font-size: 12.5px;
    }

    .trg-mgr-role {
      font-size: 11px;
      color: var(--trg-text-muted);
    }

    .trg-email {
      color: var(--trg-text-muted);
      font-size: 12.5px;
    }

    .trg-status-badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 5px 12px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 600;
    }

    .trg-status-badge::before {
      content: '';
      width: 6px;
      height: 6px;
      border-radius: 50%;
    }

    .trg-status-badge.trg-status-pending {
      background: var(--trg-purple-light);
      color: var(--trg-purple);
    }

    .trg-status-badge.trg-status-pending::before {
      background: var(--trg-purple);
    }

    .trg-status-badge.trg-status-accepted {
      background: var(--trg-green-light);
      color: var(--trg-green);
    }

    .trg-status-badge.trg-status-accepted::before {
      background: var(--trg-green);
    }

    .trg-status-badge.trg-status-rejected {
      background: var(--trg-red-light);
      color: var(--trg-red);
    }

    .trg-status-badge.trg-status-rejected::before {
      background: var(--trg-red);
    }

    /* Action dropdown */
    .trg-action-dd {
      position: relative;
      display: inline-block;
    }

    .trg-action-btn {
      width: 30px;
      height: 30px;
      border-radius: 8px;
      border: 1px solid var(--trg-border);
      background: #fff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--trg-purple);
      cursor: pointer;
    }

    .trg-action-btn:hover {
      background: var(--trg-purple-light);
    }

    .trg-action-btn.trg-open {
      background: var(--trg-purple-light);
      border-color: var(--trg-purple);
    }

    .trg-action-menu {
      position: absolute;
      top: 36px;
      right: 0;
      background: #fff;
      border: 1px solid var(--trg-border);
      border-radius: 12px;
      box-shadow: 0 14px 32px -10px rgba(30, 27, 46, 0.2);
      padding: 6px;
      min-width: 150px;
      z-index: 20;
      display: none;
    }

    .trg-action-menu.trg-show {
      display: block;
    }

    .trg-action-item {
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      border: none;
      background: none;
      text-align: left;
      padding: 8px 10px;
      border-radius: 8px;
      font-size: 12.5px;
      font-weight: 600;
      cursor: pointer;
      color: var(--trg-text-dark);
    }

    .trg-action-item:hover {
      background: var(--trg-bg);
    }

    .trg-action-item.trg-accept-item {
      color: var(--trg-green);
    }

    .trg-action-item.trg-reject-item {
      color: var(--trg-red);
    }

    .trg-action-item svg {
      flex-shrink: 0;
    }

    .trg-menu-btn {
      background: none;
      border: none;
      color: var(--trg-text-muted);
      cursor: pointer;
      padding: 4px;
    }

    /* Footer / pagination */
    .trg-table-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 16px 4px 6px 4px;
      font-size: 12.5px;
      color: var(--trg-text-muted);
    }

    .trg-pagination {
      display: flex;
      align-items: center;
      gap: 6px;
    }

    .trg-page-arrow {
      width: 28px;
      height: 28px;
      border-radius: 8px;
      border: 1px solid var(--trg-border);
      background: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--trg-text-muted);
      cursor: pointer;
    }

    .trg-page-num {
      width: 28px;
      height: 28px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 600;
      background: var(--trg-purple);
      color: #fff;
      font-size: 12.5px;
    }

    .trg-per-page {
      display: flex;
      align-items: center;
      gap: 6px;
      border: 1px solid var(--trg-border);
      border-radius: 8px;
      padding: 5px 10px;
      font-weight: 600;
      color: var(--trg-text-dark);
    }

/* ===== Engage activity cards (Kudos / Polls) ===== */
.engage-card {
  display: flex;
  flex-direction: column;
  width: 100%;
  background-color: #ffffff;
  border: 1px solid #ece7f5;
  border-radius: 18px;
  padding: 18px;
  box-shadow: 0 8px 24px rgba(106, 62, 246, 0.06);
  transition: transform 0.2s ease, box-shadow 0.2s ease;
  position: relative;
  overflow: hidden;
}

/* Event cards: restore decorative bg (engage-card used to wipe background-image) */
.engage-card.birth-bg {
  background-color: #fbf9f3;
  background-image: url(../img/bg-02.svg);
  background-repeat: no-repeat;
  background-position: left top;
}

.engage-card.anni-bg {
  background-color: #f4fefd;
  background-image: url(../img/bg-03.svg);
  background-repeat: no-repeat;
  background-position: left top;
}

.engage-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 14px 30px rgba(106, 62, 246, 0.1);
}

.engage-kudos-card {
  border-top: 3px solid #ffa0c2;
}

.engage-poll-card {
  border-top: 3px solid #00d3c7;
}

.engage-card__header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 16px;
}

.engage-card__user {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.engage-card__avatar {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 700;
  color: #ffffff;
  flex-shrink: 0;
}

.engage-card__avatar--kudos {
  background: linear-gradient(135deg, #ff7aa2, #6a3ef6);
}

.engage-card__avatar--poll {
  background: linear-gradient(135deg, #00d3c7, #3a57e8);
}

.engage-card__user-meta {
  min-width: 0;
}

.engage-card__name {
  font-size: 14px;
  font-weight: 700;
  color: #1f2937;
  line-height: 1.3;
}

.engage-card__sub,
.engage-card__time {
  font-size: 12px;
  color: #6b7280;
  line-height: 1.4;
}

.engage-card__time {
  flex-shrink: 0;
  white-space: nowrap;
}

.engage-card__body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  min-height: 0;
}

.engage-kudos__hero {
  text-align: center;
  margin-bottom: 12px;
}

.engage-kudos__recipient {
  font-size: 16px;
  font-weight: 700;
  color: #1f2937;
  margin: 8px 0 12px;
}

.engage-kudos__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  min-height: 32px;
  align-content: flex-start;
}

.engage-tag {
  display: inline-flex;
  align-items: center;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
  background: #fff;
  border: 1px solid transparent;
}

.engage-tag--primary {
  color: #3a57e8;
  border-color: #c7d2fe;
  background: #eef2ff;
}

.engage-tag--success {
  color: #059669;
  border-color: #a7f3d0;
  background: #ecfdf5;
}

.engage-tag--info {
  color: #0891b2;
  border-color: #a5f3fc;
  background: #ecfeff;
}

.engage-tag--warning {
  color: #d97706;
  border-color: #fde68a;
  background: #fffbeb;
}

.engage-tag--danger {
  color: #db2777;
  border-color: #fbcfe8;
  background: #fdf2f8;
}

.engage-kudos__message {
  margin-top: 8px;
  padding: 12px 14px;
  border-radius: 12px;
  background: #faf7ff;
  border: 1px solid #eee8fb;
  color: #374151;
  font-size: 13px;
  line-height: 1.5;
  min-height: 48px;
}

.engage-kudos__message p {
  margin: 0;
}

.engage-card__reactions {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  flex-wrap: wrap;
}

.engage-card__reaction-icons {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 16px;
}

.engage-card__reaction-text {
  font-size: 12px;
  color: #6b7280;
}

.engage-card__footer {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px solid #f0ecf8;
  position: relative;
}

.engage-card__react-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: none;
  background: #f6f4ff;
  color: #4b5563;
  border-radius: 999px;
  padding: 6px 12px;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.engage-card__react-btn:hover {
  background: linear-gradient(135deg, #efe9ff, #e8fbff);
  color: #3a57e8;
}

.engage-card__emoji-picker {
  position: absolute;
  bottom: 48px;
  left: 0;
  z-index: 20;
}

.eht-kudos-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 48px 20px;
  gap: 8px;
}

.eht-kudos-empty__art {
  width: 160px;
  height: 160px;
  margin-bottom: 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.eht-kudos-empty__art img {
  width: 100%;
  height: 100%;
  object-fit: contain;
}

.eht-kudos-empty h3 {
  margin: 0;
  font-size: 20px;
  font-weight: 700;
  color: #1f2937;
}

.eht-kudos-empty p {
  margin: 0 0 12px;
  color: #6b7280;
  font-size: 14px;
  max-width: 360px;
}

.eht-kudos-empty .action-tile {
  cursor: pointer;
}

.engage-poll__question-wrap {
  margin-bottom: 14px;
}

.engage-poll__question {
  font-size: 16px;
  font-weight: 700;
  color: #1f2937;
  margin-bottom: 8px;
  line-height: 1.35;
}

.engage-poll__badge {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  color: #0b7285;
  background: #e9fbf7;
  border: 1px solid #9ce3d1;
}

.engage-poll__badge--anon {
  color: #6b7280;
  background: #f3f4f6;
  border-color: #e5e7eb;
}

.engage-poll__options {
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
}

.engage-poll-option {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  width: 100%;
  min-height: 46px;
  padding: 10px 14px;
  border-radius: 12px;
  border: 1px solid #e5e7eb;
  background: #f8fafc;
  overflow: hidden;
  cursor: pointer;
  text-align: left;
  transition: border-color 0.15s ease, box-shadow 0.15s ease;
}

.engage-poll-option:hover {
  border-color: #a5b4fc;
  box-shadow: 0 4px 12px rgba(58, 87, 232, 0.08);
}

.engage-poll-option__fill {
  position: absolute;
  inset: 0 auto 0 0;
  background: linear-gradient(90deg, #a6effe 0%, #c7b6ff 100%);
  opacity: 0.55;
  transition: width 0.3s ease;
  pointer-events: none;
}

.engage-poll-option__label {
  position: relative;
  z-index: 1;
  font-size: 13px;
  font-weight: 600;
  color: #1f2937;
}

.engage-poll-option__percent {
  position: relative;
  z-index: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 46px;
  padding: 4px 8px;
  border-radius: 999px;
  background: linear-gradient(135deg, #3a57e8, #6a3ef6);
  color: #ffffff;
  font-size: 11px;
  font-weight: 700;
}

.engage-poll__meta {
  margin-top: 12px;
  font-size: 12px;
  color: #6b7280;
  font-weight: 500;
}

@media (max-width: 767px) {
  .engage-card {
    padding: 16px;
  }
}
/* ===== Attendance Muster (EHT UI) ===== */
:root {
  --eht-blue: #2f6fed;
  --eht-blue-light: #eaf1ff;
  --eht-green: #22a35a;
  --eht-green-light: #e7f8ee;
  --eht-red: #e5484d;
  --eht-red-light: #fdecec;
  --eht-purple: #8b5cf6;
  --eht-purple-light: #f1ebfe;
  --eht-orange: #f5a623;
  --eht-orange-light: #fef3e0;
  --eht-gray: #9aa4b2;
  --eht-gray-light: #f4f5f7;
  --eht-border: #e9ecf1;
  --eht-text: #1f2733;
  --eht-text-soft: #8a93a3;
}

.eht-dashboard {
  width: 100%;
  max-width: 100%;
}

.eht-toolbar {
  display: flex;
  align-items: center;
  gap: 12px;
  background: #fff;
  border: 1px solid var(--eht-border);
  border-radius: 14px;
  padding: 12px 14px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.eht-field {
  display: flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--eht-border);
  border-radius: 10px;
  padding: 8px 12px;
  background: #fff;
  font-size: 13.5px;
  color: var(--eht-text);
  white-space: nowrap;
}

.eht-field svg {
  flex-shrink: 0;
  color: var(--eht-text-soft);
}

.eht-field.eht-search {
  flex: 1;
  min-width: 200px;
}

.eht-field.eht-search input {
  border: none;
  outline: none;
  font-size: 13.5px;
  width: 100%;
  color: var(--eht-text);
  background: transparent;
}

.eht-field.eht-search input::placeholder {
  color: var(--eht-text-soft);
}

.eht-native-select {
  border: none;
  outline: none;
  background: transparent;
  color: var(--eht-text);
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  min-width: 90px;
}

.eht-export-btn {
  margin-left: auto;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--eht-blue);
  color: var(--eht-blue);
  background: #fff;
  border-radius: 10px;
  padding: 9px 16px;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.eht-export-btn:hover {
  background: var(--eht-blue-light);
}

.eht-stats-row {
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  gap: 10px;
  margin-bottom: 18px;
}

.eht-stat-card {
  background: #fff;
  border: 1px solid var(--eht-border);
  border-radius: 14px;
  padding: 18px 14px;
  display: flex;
  align-items: center;
  gap: 12px;
  box-shadow: 0px 0px 20px rgb(106 62 246 / 12%);
}

.eht-stat-icon {
  width: 42px;
  height: 42px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  font-size: 18px;
}

.eht-stat-icon.eht-i-total {
  background: var(--eht-blue-light);
  color: var(--eht-blue);
}
.eht-stat-icon.eht-i-present {
  background: var(--eht-green-light);
  color: var(--eht-green);
}
.eht-stat-icon.eht-i-absent {
  background: var(--eht-red-light);
  color: var(--eht-red);
}
.eht-stat-icon.eht-i-leave {
  background: var(--eht-purple-light);
  color: var(--eht-purple);
}
.eht-stat-icon.eht-i-attendance {
  background: var(--eht-blue-light);
  color: var(--eht-blue);
}

.eht-stat-label {
  font-size: 12px;
  color: #000;
  margin-bottom: 4px;
}

.eht-stat-value {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.1;
  color: var(--eht-text);
}

.eht-stat-sub {
  font-size: 11.5px;
  font-weight: 600;
  margin-left: 4px;
}
.eht-stat-sub.eht-sub-green {
  color: var(--eht-green);
}
.eht-stat-sub.eht-sub-red {
  color: var(--eht-red);
}
.eht-stat-sub.eht-sub-purple {
  color: var(--eht-purple);
}

.eht-table-card {
  background: #fff;
  border: 1px solid var(--eht-border);
  border-radius: 14px;
  padding: 18px 18px 10px;
}

.eht-table-scroll {
  overflow-x: auto;
}

.eht-table-scroll::-webkit-scrollbar {
  width: 6px;
  height: 4px;
}
.eht-table-scroll::-webkit-scrollbar-thumb {
  background: #b5b5b5;
  border-radius: 10px;
}
.eht-table-scroll::-webkit-scrollbar-track {
  background: #f1f1f1;
}

.eht-table {
  border-collapse: separate;
  border-spacing: 0;
  width: 100%;
  min-width: 1200px;
}

.eht-table thead th {
  font-size: 11px;
  font-weight: 600;
  color: var(--eht-text-soft);
  text-align: center;
  padding: 10px 8px;
  border-bottom: 1px solid var(--eht-border);
  border-right: 1px solid var(--eht-border);
  white-space: nowrap;
  background: #fafbff;
}

.eht-th-emp {
  text-align: left !important;
  font-size: 13px !important;
  color: var(--eht-text) !important;
  padding-left: 12px !important;
  min-width: 240px;
  width: 240px;
}

.eht-sticky-left {
  position: sticky;
  left: 0;
  z-index: 3;
  background: #fff;
  border-right: 1px solid #8a93a326;
}

.eht-sticky-left::after {
  content: "";
  position: absolute;
  top: 0;
  right: -8px;
  bottom: 0;
  width: 8px;
  box-shadow: 4px 0 8px -4px rgba(20, 20, 30, 0.12);
  pointer-events: none;
}

thead .eht-sticky-left {
  background: #fafbff;
  z-index: 4;
}

.eht-day-head {
  line-height: 1.4;
  min-width: 44px;
}

.eht-day-head.eht-weekend {
  background: var(--eht-red-light);
  color: var(--eht-red) !important;
}

.eht-th-summary {
  min-width: 44px;
  width: 44px;
}

.eht-table tbody td {
  text-align: center;
  padding: 12px 4px;
  border-bottom: 1px solid var(--eht-border);
  border-right: 1px solid var(--eht-border);
  font-size: 12.5px;
  vertical-align: middle;
}

.eht-emp-cell {
  text-align: left !important;
  padding: 12px !important;
  min-width: 240px;
}

.eht-emp-inner {
  display: flex;
  align-items: center;
  gap: 10px;
}

.eht-avatar {
  width: 38px;
  height: 38px;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 700;
  font-size: 13px;
  flex-shrink: 0;
}

.eht-avatar.eht-av-blue {
  background: #e3edff;
  color: #3b6fe0;
}
.eht-avatar.eht-av-teal {
  background: #dff5f1;
  color: #1ea390;
}
.eht-avatar.eht-av-purple {
  background: #efe7fe;
  color: #8b5cf6;
}
.eht-avatar.eht-av-orange {
  background: #feefdd;
  color: #e39a2a;
}

.eht-emp-name {
  font-weight: 700;
  font-size: 13px;
  color: var(--eht-text);
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
}

.eht-emp-id {
  font-size: 11px;
  font-weight: 600;
  color: var(--eht-blue);
  background: var(--eht-blue-light);
  border-radius: 5px;
  padding: 1px 6px;
}

.eht-emp-role {
  font-size: 11.5px;
  color: var(--eht-text-soft);
  margin-top: 2px;
  line-height: 1.35;
}

.eht-col-divider {
  border-left: 1px solid var(--eht-border);
}

.eht-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  padding: 14px 4px 8px;
  border-top: 1px solid var(--eht-border);
  margin-top: 8px;
}

.eht-legend-item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: var(--eht-text-soft);
  font-weight: 500;
}

.eht-legend-dot {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  display: inline-block;
}

.eht-ld-green {
  background: var(--eht-green);
}
.eht-ld-red {
  background: var(--eht-red);
}
.eht-ld-purple {
  background: var(--eht-purple);
}
.eht-ld-orange {
  background: var(--eht-orange);
}
.eht-ld-blue {
  background: var(--eht-blue);
}
.eht-ld-gray {
  background: var(--eht-gray);
}

.eht-empty {
  padding: 40px 16px;
  text-align: center;
  color: var(--eht-text-soft);
}

@media (max-width: 991px) {
  .eht-stats-row {
    grid-template-columns: repeat(2, 1fr);
  }

  .eht-export-btn {
    margin-left: 0;
  }
}

@media (max-width: 575px) {
  .eht-stats-row {
    grid-template-columns: 1fr;
  }
}

/* ===== Employee Swipes (EHT UI) ===== */
.eht-swipes-toolbar .eht-field-employee {
  flex: 1.2;
  min-width: 260px;
  padding-top: 4px;
  padding-bottom: 4px;
}

.eht-select-wrap {
  flex: 1;
  min-width: 0;
}

.eht-date-input {
  min-width: 140px;
  font-weight: 600;
}

.eht-swipes-stats {
  grid-template-columns: repeat(4, 1fr);
}

.eht-swipes-scroll {
  max-height: 560px;
}

.eht-swipes-table {
  min-width: 980px;
}

.eht-swipes-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
}

.eht-swipe-date {
  font-weight: 600;
  color: var(--eht-text);
  white-space: nowrap;
}

.eht-swipe-times,
.eht-swipe-addresses {
  display: flex;
  flex-direction: column;
  gap: 6px;
  align-items: flex-start;
}

.eht-swipe-chip {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--eht-blue-light);
  color: var(--eht-blue);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

.eht-shift-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 8px;
  background: var(--eht-purple-light);
  color: var(--eht-purple);
  font-size: 12px;
  font-weight: 600;
}

.eht-swipe-address {
  max-width: 280px;
  font-size: 12px;
  color: var(--eht-text-soft);
  line-height: 1.35;
  text-align: left;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.eht-status-pill {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 84px;
  padding: 5px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 700;
}

.eht-status-present {
  background: var(--eht-green-light);
  color: var(--eht-green);
}

.eht-status-missing {
  background: var(--eht-gray-light);
  color: var(--eht-text-soft);
}

.eht-status-empty {
  color: var(--eht-text-soft);
  font-weight: 600;
}

@media (max-width: 991px) {
  .eht-swipes-stats {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 575px) {
  .eht-swipes-stats {
    grid-template-columns: 1fr;
  }
}

/* ===== Leave Review (EHT UI) ===== */
.eht-review-tabs {
  display: flex;
  gap: 10px;
  margin-bottom: 16px;
  flex-wrap: wrap;
}

.eht-review-tab {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  border: 1px solid var(--eht-border);
  background: #fff;
  color: var(--eht-text-soft);
  border-radius: 12px;
  padding: 10px 16px;
  font-size: 13.5px;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.15s ease;
}

.eht-review-tab:hover {
  border-color: #c7b6ff;
  color: #3a57e8;
}

.eht-review-tab--active {
  background: linear-gradient(135deg, #3a57e8, #6a3ef6);
  border-color: transparent;
  color: #fff;
  box-shadow: 0 8px 18px rgba(58, 87, 232, 0.22);
}

.eht-review-tab__count {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  padding: 0 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.22);
  font-size: 11px;
  font-weight: 700;
}

.eht-review-tab:not(.eht-review-tab--active) .eht-review-tab__count {
  background: var(--eht-blue-light);
  color: var(--eht-blue);
}

.eht-review-stats {
  grid-template-columns: repeat(3, 1fr);
}

.eht-review-list-card {
  padding: 16px;
}

.eht-review-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.eht-review-card {
  border: 1px solid var(--eht-border);
  border-radius: 14px;
  background: #fff;
  overflow: hidden;
  transition: box-shadow 0.2s ease, border-color 0.2s ease;
}

.eht-review-card:hover,
.eht-review-card--open {
  border-color: #d7cff8;
  box-shadow: 0 10px 24px rgba(106, 62, 246, 0.08);
}

.eht-review-card__header {
  width: 100%;
  border: none;
  background: transparent;
  display: grid;
  grid-template-columns: minmax(180px, 1.1fr) minmax(280px, 2fr) 28px;
  gap: 16px;
  align-items: center;
  padding: 16px;
  text-align: left;
  cursor: pointer;
}

.eht-review-meta {
  display: grid;
  grid-template-columns: 1.1fr 1.6fr 0.6fr;
  gap: 14px;
  align-items: start;
}

.eht-review-meta__item {
  display: flex;
  flex-direction: column;
  gap: 4px;
  min-width: 0;
}

.eht-review-meta__label {
  font-size: 11px;
  font-weight: 600;
  color: var(--eht-text-soft);
  text-transform: uppercase;
  letter-spacing: 0.3px;
}

.eht-review-meta__value {
  font-size: 13px;
  font-weight: 600;
  color: var(--eht-text);
}

.eht-leave-type-pill,
.eht-daytype-pill {
  display: inline-flex;
  align-items: center;
  width: fit-content;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 600;
}

.eht-leave-type-pill {
  background: var(--eht-purple-light);
  color: var(--eht-purple);
}

.eht-daytype-pill {
  background: var(--eht-blue-light);
  color: var(--eht-blue);
  margin-top: 2px;
}

.eht-review-chevron {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  background: #f4f5f7;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: var(--eht-text-soft);
  transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease;
}

.eht-review-chevron--open {
  transform: rotate(180deg);
  background: var(--eht-blue-light);
  color: var(--eht-blue);
}

.eht-review-card__body {
  border-top: 1px solid var(--eht-border);
  padding: 16px;
  background: #fbfbff;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
}

.eht-review-details {
  display: grid;
  grid-template-columns: repeat(3, minmax(140px, 1fr));
  gap: 14px;
  flex: 1;
}

.eht-review-detail {
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.eht-review-detail strong {
  font-size: 13px;
  color: var(--eht-text);
  font-weight: 600;
  line-height: 1.4;
}

.eht-review-actions {
  display: flex;
  gap: 10px;
  flex-shrink: 0;
}

.eht-review-btn {
  min-width: 100px;
  height: 40px;
  border-radius: 10px;
  font-size: 13.5px;
  font-weight: 700;
  cursor: pointer;
  transition: all 0.15s ease;
}

.eht-review-btn--reject {
  border: 1px solid #f1c0c2;
  background: #fff;
  color: var(--eht-red);
}

.eht-review-btn--reject:hover {
  background: var(--eht-red-light);
}

.eht-review-btn--approve {
  border: none;
  background: linear-gradient(135deg, #3a57e8, #6a3ef6);
  color: #fff;
  box-shadow: 0 8px 16px rgba(58, 87, 232, 0.2);
}

.eht-review-btn--approve:hover {
  filter: brightness(1.05);
}

.eht-status-approved {
  background: var(--eht-green-light);
  color: var(--eht-green);
}

.eht-status-rejected {
  background: var(--eht-red-light);
  color: var(--eht-red);
}

.eht-review-card__body--closed {
  align-items: stretch;
}

.eht-review-details--closed {
  grid-template-columns: repeat(4, minmax(120px, 1fr));
}

.eht-empty i {
  font-size: 24px;
  margin-bottom: 8px;
  display: block;
  color: var(--eht-text-soft);
}

@media (max-width: 991px) {
  .eht-review-stats {
    grid-template-columns: 1fr;
  }

  .eht-review-card__header {
    grid-template-columns: 1fr 28px;
  }

  .eht-review-meta {
    grid-column: 1 / -1;
    grid-template-columns: 1fr;
  }

  .eht-review-details,
  .eht-review-details--closed {
    grid-template-columns: 1fr;
  }

  .eht-review-card__body {
    align-items: stretch;
  }

  .eht-review-actions {
    width: 100%;
  }

  .eht-review-btn {
    flex: 1;
  }
}



/*============================
 [Table of CSS]

1. General
2. Table
3. Helper Class
4. Bootstrap Classes
5. Header
6. Sidebar
7. Content
8. Login
9. Dashboard
10. Activity
11. Select2
12. Nav tabs
13. Holidays
14. Edit Profile
15. Chat
16. Focus Label
17. Leave
18. Employee
19. Events
20. Profile
21. Notifications
22. Roles & Permissions
23. Chat Right Sidebar
24. Invoice
25. Doctors
26. Add Doctor
27. Payslip
28. Attendance
29. Inbox
30. Mail View
31. Blog
32. Blog View
33. UI Kit
34. Error
35. Lock Screen
36. Voice call
37. Video Call
38. Incoming call
39. Notification settings
40. Chat Sidebar
41. Gallery
42. Settings
43. Responsive

========================================*/

/*-----------------
	1. General
-----------------------*/



@import url('https://fonts.googleapis.com/css2?family=Open+Sans:ital,wght@0,300..800;1,300..800&display=swap');


html {
	height: 100%;
}

body {
    font-family: "Open Sans", sans-serif;
    font-weight: 500;
    font-size: 14px;
    font-weight: normal;
    color: #333448;
    background: linear-gradient(#ffffffa1, #ffffffa1), url(../img/bg.png);
    overflow-x: hidden;
    height: 100%;
}

h1,
h2,
h3,
h4,
h5,
h6 {
	margin-top: 0;
}

h1,
.h1 {
	font-size: 2.25rem;
}

h2,
.h2 {
	font-size: 1.875rem;
}

h3,
.h3 {
	font-size: 1.5rem;
}

h4,
.h4 {
	font-size: 1.125rem;
}

h5,
.h5 {
	font-size: 16px;
}

h6,
.h6 {
	font-size: 14px;
	font-weight: 600;
}

a:hover,
a:active,
a:focus {
	text-decoration: none;
	/* color: #009ce7; */
	outline: none;
}

.form-control {
	box-shadow: none;
	padding: 8px 15px;
	font-size: 14px;
	min-height: 40px;
	border: 2px solid rgb(46 55 164 / 15%);
	border-radius: 10px;
}

.form-control::placeholder {
	font-size: 13px;
}

.form-control:focus {
	border-color: #3a57e8;
	box-shadow: none;
	outline: 0 none;
}

a {
	color: #3a57e8;
	text-decoration: none;
}

input,
button,
a {
	transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	-o-transition: all 0.4s ease;
	-ms-transition: all 0.4s ease;
	-webkit-transition: all 0.4s ease;
}

input,
button {
	outline: none;
}

input[type="file"] {
	height: auto;
	padding: 6px 0.75rem;
}

input[type=text],
input[type=password] {
	-webkit-appearance: none;
	-moz-appearance: none;
	appearance: none;
}

textarea.form-control {
	resize: vertical;
}

.navbar-nav>li {
	float: left;
}

.input-block {
	margin-bottom: 20px;
}

.display-block {
	display: block;
}

.btn.rounded {
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}

.btn.focus,
.btn:focus {
	box-shadow: inherit !important;
}

.list-group-item {
	border: 1px solid #eaeaea;
}

/*-----------------
	2. Table
-----------------------*/

.table>:not(:first-child) {
	border: 0;
}

table.table td,
table.table th {
	border-color: #dee2e6;
}

.table-bordered td,
.table-bordered th {
	border: 1px solid #dee2e6;
}

.dataTables_length select {
	appearance: auto;
}

.table {
	color: #000;
	border: 1px solid #f0f0f0;
}

.table.table-white {
	background-color: #fff;
}

.table>tbody>tr>td {
	font-weight: 500;
}

.table-striped>tbody>tr:nth-of-type(2n + 1) {
	background-color: #f6f6f6;
}

table.table td .avatar {
	margin: 0 5px 0 0;
}

table.table td h2 {
	display: inline-block;
	font-size: inherit;
	font-weight: 400;
	margin: 0;
	padding: 0;
	vertical-align: middle;
}

table.table td h2 a {
	color: #757575;
}

table.table td h2 a:hover {
	color: #009efb;
}

table.table td h2 span {
	color: #9e9e9e;
	display: block;
	font-size: 12px;
	margin-top: 3px;
}

.table-nowrap td,
.table-nowrap th {
	white-space: nowrap;
}

/*-----------------
	3. Helper Class
-----------------------*/

.m-r-5 {
	margin-right: 5px !important;
}

.m-r-10 {
	margin-right: 10px !important;
}

.m-l-5 {
	margin-left: 5px !important;
}

.m-t-0 {
	margin-top: 0 !important;
}

.m-t-10 {
	margin-top: 10px !important;
}

.m-t-20 {
	margin-top: 20px !important;
}

.m-t-30 {
	margin-top: 30px !important;
}

.m-t-50 {
	margin-top: 50px !important;
}

.m-b-10 {
	margin-bottom: 10px !important;
}

.m-b-20 {
	margin-bottom: 20px !important;
}

.m-b-30 {
	margin-bottom: 30px !important;
}

.w-40 {
	width: 40px;
}

.block {
	display: block !important;
}

.text-ellipsis {
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.text-muted-light {
	color: #aaa;
}

.card-box {
	background-color: #fff;
	border-radius: 12px;
	margin-bottom: 30px;
	padding: 20px;
	position: relative;
}

.card-title {
	color: #333448;
	font-size: 16px;
	margin-bottom: 20px;
}

.page-title {
	color: #333448;
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 25px;
}

.page-sub-title {
	color: #565656;
	font-size: 18px;
	font-weight: normal;
	margin-bottom: 20px;
}

.cal-icon:after {
	background: transparent url("../img/icons/calendar-icon.svg") no-repeat scroll 0 0;
	bottom: 0;
	content: "";
	display: block;
	height: 24px;
	margin: auto;
	position: absolute;
	right: 15px;
	top: 0;
	width: 24px;
	cursor: pointer;
}

.cal-icon {
	position: relative;
	width: 100%;
}

.time-icon:after {
	background: transparent url("../img/clock.png") no-repeat scroll 0 0;
	bottom: 0;
	content: "";
	display: block;
	height: 19px;
	margin: auto;
	position: absolute;
	right: 15px;
	top: 0;
	width: 19px;
}

.time-icon {
	position: relative;
	width: 100%;
}

.badge-success-border {
	border: 1px solid #55ce63;
	color: #55ce63;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}

.badge-danger-border {
	border: 1px solid #f62d51;
	color: #f62d51;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}

.badge-warning-border {
	border: 1px solid #ffbc34;
	color: #ffbc34;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}

.badge-info-border {
	border: 1px solid #009efb;
	color: #009efb;
	background-color: #fff;
	display: inline-block;
	min-width: 80px;
}

.modal-footer.text-start {
	text-align: left;
}

.modal-footer.text-center {
	text-align: center;
}

.font-18 {
	font-size: 18px;
}

.border-right {
	border-right: 1px solid #e7e7e7;
}

.blur {
	-webkit-filter: blur(3px);
	-moz-filter: blur(3px);
	-o-filter: blur(3px);
	-ms-filter: blur(3px);
	filter: blur(3px);
}

.btn {
	font-size: 0.875rem;
}

/*-----------------
	4. Bootstrap Classes
-----------------------*/

.btn-white {
	background-color: #fff;
	border: 1px solid #3a57e8;
	color: #333;
	padding: 6px 10px;
	gap: 5px;
}

.rounded,
.circle {
	border-radius: 500px;
}

.bg-success,
.badge-success {
	background-color: #55ce63 !important;
}

.bg-info,
.badge-info {
	background-color: #009efb !important;
}

.bg-warning,
.badge-warning {
	background-color: #ffbc34 !important;
}

.bg-danger,
.badge-danger {
	background-color: #f62d51 !important;
}

.bg-white {
	background-color: #fff;
}

.text-primary,
.dropdown-menu>li>a.text-primary {
	color: #00d3c7 !important;
}

.text-success,
.dropdown-menu>li>a.text-success {
	color: #55ce63;
}

.text-danger,
.dropdown-menu>li>a.text-danger {
	color: #f62d51;
}

.text-info,
.dropdown-menu>li>a.text-info {
	color: #009efb;
}

.text-warning,
.dropdown-menu>li>a.text-warning {
	color: #ffbc34 !important;
}

.text-purple,
.dropdown-menu>li>a.text-purple {
	color: #7460ee;
}

.btn-primary {
	border: 1px solid #fff;
	background: linear-gradient(135deg, #61c797, #6a3ef6);
	border-radius: 8px;
	padding: 10px 20px;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary.active,
.btn-primary:active,
.open>.dropdown-toggle.btn-primary {
	background: linear-gradient(135deg, #61c797, #6a3ef6);
	border: 1px solid #fff;
	color: #fff;
}

.btn-primary.active.focus,
.btn-primary.active:focus,
.btn-primary.active:hover,
.btn-primary.focus:active,
.btn-primary:active:focus,
.btn-primary:active:hover,
.open>.dropdown-toggle.btn-primary.focus,
.open>.dropdown-toggle.btn-primary:focus,
.open>.dropdown-toggle.btn-primary:hover {
	background-color: #009efb;
	border: 1px solid #009efb;
}

.btn-primary.active:not(:disabled):not(.disabled),
.btn-primary:active:not(:disabled):not(.disabled),
.show>.btn-primary.dropdown-toggle {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}

.btn-outline-primary {
	border-color: #009efb;
	color: #009efb;
}

.btn-outline-primary:hover {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}

.btn-outline-primary.active:not(:disabled):not(.disabled),
.btn-outline-primary:active:not(:disabled):not(.disabled),
.show>.btn-outline-primary.dropdown-toggle {
	background-color: #009efb;
	border-color: #009efb;
	color: #fff;
}

.btn-success {
	background-color: #55ce63;
	border: 1px solid #55ce63
}

.btn-success:hover,
.btn-success:focus,
.btn-success.active,
.btn-success:active,
.open>.dropdown-toggle.btn-success {
	background: #4ab657;
	border: 1px solid #4ab657
}

.btn-success.active.focus,
.btn-success.active:focus,
.btn-success.active:hover,
.btn-success.focus:active,
.btn-success:active:focus,
.btn-success:active:hover,
.open>.dropdown-toggle.btn-success.focus,
.open>.dropdown-toggle.btn-success:focus,
.open>.dropdown-toggle.btn-success:hover {
	background: #4ab657;
	border: 1px solid #4ab657
}

.btn-info {
	background-color: #009efb;
	border: 1px solid #009efb
}

.btn-info:hover,
.btn-info:focus,
.btn-info.active,
.btn-info:active,
.open>.dropdown-toggle.btn-info {
	background-color: #028ee1;
	border: 1px solid #028ee1
}

.btn-info.active.focus,
.btn-info.active:focus,
.btn-info.active:hover,
.btn-info.focus:active,
.btn-info:active:focus,
.btn-info:active:hover,
.open>.dropdown-toggle.btn-info.focus,
.open>.dropdown-toggle.btn-info:focus,
.open>.dropdown-toggle.btn-info:hover {
	background-color: #028ee1;
	border: 1px solid #028ee1
}

.btn-warning {
	background: #ffbc34;
	border: 1px solid #ffbc34
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning.active,
.btn-warning:active,
.open>.dropdown-toggle.btn-warning {
	background: #e9ab2e;
	border: 1px solid #e9ab2e
}

.btn-warning.active.focus,
.btn-warning.active:focus,
.btn-warning.active:hover,
.btn-warning.focus:active,
.btn-warning:active:focus,
.btn-warning:active:hover,
.open>.dropdown-toggle.btn-warning.focus,
.open>.dropdown-toggle.btn-warning:focus,
.open>.dropdown-toggle.btn-warning:hover {
	background: #e9ab2e;
	border: 1px solid #e9ab2e
}

.btn-danger {
	background: #f62d51;
	border: 1px solid #f62d51
}

.btn-danger:hover,
.btn-danger:focus {
	background-color: #e6294b;
	border: 1px solid #e6294b
}

.pagination>.active>a,
.pagination>.active>a:focus,
.pagination>.active>a:hover,
.pagination>.active>span,
.pagination>.active>span:focus,
.pagination>.active>span:hover {
	background-color: #00d3c7;
	border-color: #00d3c7;
}

.pagination>li>a,
.pagination>li>span {
	color: #3a57e8;
	font-size: 14px;
	padding: 5px 15px !important;
}

.page-item.active .page-link {
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.dropdown-menu {
	border: 1px solid rgba(0, 0, 0, 0.1);
	border-radius: 3px;
	transform-origin: left top 0;
	box-shadow: inherit;
	background-color: #fff;
}

.navbar-nav .open .dropdown-menu {
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
}

.btn-group-xs>.btn,
.btn-xs {
	min-height: 22px;
	min-width: 22px;
}

.dropdown-menu {
	font-size: 13px;
}

.btn-link,
.btn-link:hover,
.btn-link:focus,
.btn-link:active {
	box-shadow: none;
}

.btn-link {
	color: #333;
}

.nav .open>a,
.nav .open>a:focus,
.nav .open>a:hover {
	background-color: rgba(0, 0, 0, 0.2);
}

.card {
	margin-bottom: 16px;
	box-shadow: none;
	border: 0;
	border-radius: 12px;
	width: 100%;
	box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}

.card-title {
	margin-bottom: 1.125rem;
}

.dropdown-action .dropdown-toggle:after {
	display: none;
}

.badge.rounded-pill {
	border-radius: 10rem;
}

.badge-primary {
	color: #fff;
}

.btn.btn-rounded {
	border-radius: 50px;
}

.nav-tabs .nav-link:focus,
.nav-tabs .nav-link:hover {
	/* background-color: #eee; */
	/* border-color: transparent; */
}

.nav-tabs .nav-link {
	border-radius: 0;
}

.table.dataTable {
	border-collapse: collapse !important;
}

textarea.form-control {
	height: auto;
}

.progress-example .progress {
	margin-bottom: 1.5rem;
}

.progress-xs {
	height: 4px;
}

.progress-sm {
	height: 15px;
}

.progress.progress-sm {
	height: 6px;
}

.progress.progress-md {
	height: 8px;
}

.progress.progress-lg {
	height: 18px;
}

.form-control.form-control-sm {
	padding: 0.25rem 0.5rem;
}

.card .card-header {
	background-color: rgba(255, 255, 255, 0.1);
	border: 0 none;
	font-size: 16px;
	line-height: 30px;
	padding: 15px;
}

.card .card-header .card-title {
	font-size: 18px;
	font-weight: 400;
	line-height: 20px;
	margin: 0;
	padding: 5px 0;
}

.table h5 {
	font-size: 14px;
	font-weight: 400;
	line-height: 18px;
	margin-bottom: 0;
	vertical-align: middle;
}

.table h5+p {
	color: #9e9e9e;
	font-size: 14px;
	line-height: 18px;
	margin-bottom: 0;
}

.page-link:focus {
	box-shadow: unset;
}

.col-form-label {
	font-size: 14px;
	font-weight: 500;
}

.input-group-text {
	height: 40px;
}

/*-----------------
	5. Header
-----------------------*/

.header {
	left: 0;
	position: fixed;
	right: 0;
	top: 0;
	z-index: 999;
	height: 70px;
	background: #FFFFFF;
	box-shadow: 0px 0px 14px rgba(204, 204, 204, 0.25);
}

.header .header-left {
	float: left;
	height: 70px;
	padding: 0 20px;
	position: relative;
	text-align: center;
	width: 240px;
	z-index: 1;
}

.logo {
	align-items: center;
	display: flex;
	height: 70px;
	justify-content: start;
}

.logo span {
	color: #3a57e8;
	font-size: 20px;
	font-weight: 500;
	margin-left: 10px;
}

.header .navbar-nav .badge {
	position: absolute;
	right: 7px;
	top: 4px;
}

.header .dropdown-menu>li>a {
	position: relative;
}

.header .dropdown-toggle:after {
	display: none;
}

.page-title-box {
	border-radius: 0;
	height: 70px;
	margin-bottom: 0;
	padding: 14px 20px;
}

.page-title-box h3 {
	color: #fff;
	font-size: 18px;
	font-weight: 500;
	margin: 0;
}

.user-menu {
	margin: 0;
	position: relative;
	z-index: 99;
}

.user-menu.nav>li>a {
	color: #fff;
	font-size: 16px;
	line-height: 70px;
	padding: 0 5px;
	height: 70px;
}

.user-menu.nav>li>a:hover,
.user-menu.nav>li>a:focus {}

.user-img {
	display: inline-block;
	position: relative;
}

.header .user-img img {
	width: 40px;
	border-radius: 14px;
}

.user-img .status {
	border: 2px solid #fff;
	bottom: 0;
	height: 10px;
	position: absolute;
	right: 0;
	width: 10px;
}

.user-menu .user-img .status {
	bottom: 0px;
}

.user-menu .dropdown-menu {
	min-width: 145px;
	padding: 0;
	visibility: hidden;
	opacity: 0;
	display: block;
	transform: translate(0px, 100px);
}

.user-menu .dropdown-menu.show {
	visibility: visible;
	opacity: 1;
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
}

.table .dropdown-item {
	padding: 7px 10px;
}

.user-menu .bg-primary {
	background-color: #009efb !important;
}

.status {
	background-color: #ccc;
	border-radius: 50%;
	display: inline-block;
	height: 10px;
	width: 10px;
}

.status.online {
	background-color: #55ce63;
}

.status.offline {
	background-color: #f62d51;
}

.status.away {
	background-color: #faa937;
}

.top-nav-search {
	float: left;
	margin-left: 22px;
}

.top-nav-search form {
	margin-top: 13px;
	position: relative;
	width: 270px;
}

.top-nav-search .form-control {
	background: rgba(58 87 232 / 6%);
	background: rgb(58 87 232 / 6%);
	border-radius: 12px;
	border: 0;
	height: 40px;
	padding: 10px 15px 10px 40px;
}

.top-nav-search .btn {
	background-color: transparent;
	color: #646bbc;
	border-color: transparent;
	min-height: 40px;
	padding: 7px 10px;
	position: absolute;
	left: 0;
	top: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.top-nav-search .form-control::-webkit-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}

.top-nav-search .form-control::-moz-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}

.top-nav-search .form-control:-ms-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}

.top-nav-search .form-control::-ms-input-placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}

.top-nav-search .form-control::placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-weight: 500;
}

.theme-set .form-control {
	line-height: 29px;
}

.user-profile-list .user-link {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 0px 10px !important;
}

.user-menu.nav li.user-profile-list a {
	line-height: 20px;
	padding-top: 6px;
	padding-bottom: 6px;
	font-size: 15px;
}

.user-names {
	padding-right: 10px;
	text-align: right;
}

.user-names h5 {
	color: #000000;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 0;
}

.user-names span {
	color: rgba(46, 55, 164, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}

.user-menu.nav li {
	margin-right: 12px;
	position: relative;
}

/*-----------------
	6. Sidebar
-----------------------*/

.sidebar {
	top: 62px;
	width: 265px;
	z-index: 999;
	background-color: #fff;
	bottom: 0;
	margin-top: 0px;
	position: fixed;
	left: 0;
	transition: all 0.2s ease-in-out;
	border-top-right-radius: 0;
	box-shadow: 5px 20px 14px rgba(46, 55, 164, 0.05);
	overflow-y: hidden;
	height: 100vh;
}

.sidebar.opened {
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.sidebar-inner {
	height: 100%;
	transition: all 0.2s ease-in-out 0s;
}

.sidebar-menu ul {
	font-size: 14px;
	list-style-type: none;
	margin: 0;
	padding: 0;
}

.sidebar-menu li a {
	color: #888;
	display: block;
	font-size: 14px;
	height: auto;
	padding: 0 20px;
}

.sidebar-menu li a:hover {
	color: #3a57e8;
}

.sidebar-menu ul li .active img {
	filter: invert(13%) sepia(85%) saturate(7478%) hue-rotate(266deg) brightness(50%) contrast(340%);
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
}

.sidebar-menu li.active a {
	color: #3a57e8;
}

.menu-title {
	color: #333;
	font-size: 15px;
	font-weight: 500;
	padding: 12px 20px;
}

.menu-title>i {
	float: right;
	line-height: 40px;
}

.sidebar-menu li.menu-title a {
	color: #009efb;
	display: inline-block;
	float: right;
	padding: 0;
}

.sidebar-menu li.menu-title a.btn {
	color: #fff;
	display: block;
	float: none;
	font-size: 15px;
	line-height: inherit;
	margin-bottom: 15px;
}

.sidebar-menu ul .submenu .active {
	color: #fff;
	font-weight: 500;
}

.sidebar-menu ul .submenu a.active {
	color: #fff;
	font-weight: 500;
	background: linear-gradient(90deg, #e3e7fa 0.07%, rgba(255, 255, 255, 0) 99.91%);
	border-radius: 18px;
	background: linear-gradient(135deg, #61c797, #6a3ef6);
	box-shadow: 0 0px 25px rgb(37 99 235 / 5%), 0 0px 15px rgb(16 185 129 / 13%), inset 0 2px 4px rgb(255 255 255 / 56%), inset 0 -3px 8px rgb(255 255 255 / 18%);
	border: 2px solid #ffffffd9;
}

.sidebar-menu ul .submenu ul li a.active {
	color: #3a57e8;
	font-weight: 500;
	background: unset;
	border-radius: unset;
	box-shadow: unset;
}

.sidebar-menu ul li .active {
	color: #3a57e8;
	font-weight: 500;
}

.sidebar-menu ul .submenu ul .active {
	position: relative;
}

.sidebar-menu ul .submenu ul .active:before {
	/* background-image: url(../img/icons/right-icon.svg); */
	content: "";
	position: absolute;
	/* width: 10px; */
	/* height: 10px; */
	background-repeat: no-repeat;
	top: 50%;
	left: 35px;
	-webkit-transform: translate(0, -50%);
	-ms-transform: translate(0, -50%);
	transform: translate(0, -50%);
}

.sidebar-menu ul ul a.active {
	color: #3a57e8;
	font-weight: 500;
}

.mobile-user-menu {
	color: #fff;
	display: none;
	font-size: 24px;
	height: 70px;
	line-height: 70px;
	padding: 0 20px;
	position: absolute;
	right: 0;
	text-align: right;
	top: 0;
	width: 50px;
	z-index: 10;
}

.mobile-user-menu>a {
	color: #fff;
	padding: 0;
}

.mobile-user-menu>a:hover {
	color: #fff;
}

.mobile-user-menu>.dropdown-menu>a {
	line-height: 23px;
}

.profile-rightbar {
	display: none !important;
	color: #009efb;
	font-size: 26px;
	margin-left: 15px;
}

.fixed-sidebar-right {
	position: fixed;
	top: 60px;
	right: 0;
	width: 300px;
	margin-right: -300px;
	bottom: 0;
	z-index: 101;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.mobile_btn {
	display: none;
}

.sidebar .sidebar-menu>ul>li>a span {
	transition: all 0.2s ease-in-out 0s;
	margin-left: 10px;
	white-space: nowrap;
}

.sidebar .sidebar-menu>ul>li>a span.badge {
	color: #fff;
	margin-left: auto;
}

.sidebar-menu ul ul a {
	display: block;
	font-size: 14px;
	padding: 9px 10px 9px 60px;
	position: relative;
	color: rgba(51, 53, 72, 0.75);
	font-weight: 500;
}

.sidebar-menu ul ul a.active-under {
	color: #3a57e8;
}

.sidebar-menu ul ul a:before {
	position: absolute;
	content: "";
	width: 8px;
	height: 2px;
	background: #3a57ecb8;
	top: 49%;
	left: 43px;
}

.sidebar-menu ul ul ul a:before {
	left: 53px;
}


.sidebar-menu ul ul {
	display: none;
}

.sidebar-menu ul ul ul a {
	padding-left: 70px;
}

.sidebar-menu ul ul ul ul a {
	padding-left: 90px;
}

.sidebar-menu>ul>li {
	position: relative;
	padding: 0 15px;
	border-radius: 18px;
	margin-bottom: 4px;
}

.sidebar-menu .menu-arrow {
	-webkit-transition: -webkit-transform 0.15s;
	-o-transition: -o-transform 0.15s;
	transition: transform .15s;
	position: absolute;
	right: 15px;
	display: inline-block;
	font-family: 'FontAwesome';
	text-rendering: auto;
	line-height: 40px;
	font-size: 15px;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	-webkit-transform: translate(0, 0);
	-ms-transform: translate(0, 0);
	-o-transform: translate(0, 0);
	transform: translate(0, 0);
	line-height: 18px;
	top: 23px;
}

.sidebar-menu .menu-arrow:before {
	content: "\f105";
}

.sidebar-menu li a.subdrop .menu-arrow {
	-ms-transform: rotate(90deg);
	-webkit-transform: rotate(90deg);
	-o-transform: rotate(90deg);
	transform: rotate(90deg);
}

.sidebar-menu ul ul a .menu-arrow {
	top: 11px;
}

.sidebar-menu a {
	transition: unset;
	-moz-transition: unset;
	-o-transition: unset;
	-ms-transition: unset;
	-webkit-transition: unset;
}

.sidebar-menu>ul>li>a {
	padding: 8px 20px 8px 10px;
	align-items: center;
	display: flex;
	justify-content: flex-start;
	position: relative;
	transition: all 0.2s ease-in-out 0s;
	    color: rgb(51 53 72);
	font-weight: 500;

	border-radius: 18px;
}

.sidebar-menu>ul>li>a:hover {
	color: #6077ed;
	font-weight: 500;
	background: linear-gradient(135deg, #dbf5e9, #e8e1ff);
	box-shadow: 0 0px 25px rgb(37 99 235 / 5%), 0 0px 15px rgb(16 185 129 / 13%), inset 0 2px 4px rgb(255 255 255 / 56%), inset 0 -3px 8px rgb(255 255 255 / 18%);

}


.sidebar-menu ul li a i {
	font-size: 18px;
	min-height: 24px;
	line-height: 18px;
	transition: all 0.2s ease-in-out 0s;
	background: rgba(58 87 232 / 6%);
	border-radius: 8px;
	width: 40px;
	height: 40px;
	margin-left: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.sidebar-menu ul li a span.menu-side {
	font-size: 18px;
	min-height: 24px;
	line-height: 18px;
	transition: all 0.2s ease-in-out 0s;
	background: #fff;
	border-radius: 12px;
	width: 40px;
	height: 40px;
	margin-left: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
}

.sidebar-menu ul .submenu .active img {
	filter: brightness(0) saturate(100%) invert(28%) sepia(39%) saturate(4400%) hue-rotate(224deg) brightness(94%) contrast(94%);
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
}

.sidebar-menu li a:hover img {
	filter: brightness(0) saturate(100%) invert(28%) sepia(39%) saturate(4400%) hue-rotate(224deg) brightness(94%) contrast(94%);
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
}

.sidebar-menu ul li.menu-title a i {
	font-size: 16px;
	margin-right: 0;
	text-align: right;
	width: auto;
}

.logout-btn {
	margin: 50px 0px;
}

.logout-btn a span.menu-side {
	font-size: 18px;
	min-height: 24px;
	line-height: 18px;
	transition: all 0.2s ease-in-out 0s;
	background: rgba(58 87 232 / 6%);
	border-radius: 8px;
	width: 40px;
	height: 40px;
	margin-left: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	flex-shrink: 0;
}

.logout-btn a {
	padding: 12px 20px;
	align-items: center;
	display: flex;
	justify-content: flex-start;
	position: relative;
	transition: all 0.2s ease-in-out 0s;
	color: #3a57e8;
	font-weight: 500;
}

.logout-btn a span {
	margin-left: 10px;
}

/*-----------------
	7. Content
-----------------------*/

.page-wrapper {
	left: 0;
	margin-left: 265px;
	padding-top: 70px;
	position: relative;
	-webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease;
	transition: all 0.4s ease;
}

.page-wrapper>.content {
	padding: 30px;
	padding-bottom: 30px;
}

/*-----------------
	12. Login
-----------------------*/

.login-body {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.login-wrapper .loginbox .login-right .login-right-wrap {
	max-width: 100%;
	flex: 0 0 100%;
}

.login-wrapper .loginbox .login-right .login-right-wrap .input-block {
	position: relative;
}

.login-wrapper .loginbox .login-right .login-right-wrap .input-block label {
	font-size: 12px;
	color: #333448;
	font-weight: 500;
	position: absolute;
	top: -10px;
	left: 10px;
	background: #fff;
	margin-bottom: 0;
	padding: 0px 5px;
}

.login-danger,
.star-red {
	color: #FF0000;
}

.account-subtitle {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
	margin-bottom: 0;
	text-align: left;
	font-weight: 500;
}

.account-subtitle a {
	color: #3a57e8;
}

.login-wrapper .loginbox .login-right h2 {
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 40px;
}

.login-wrapper .loginbox .login-right .forgotpass {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 40px;
}

.remember-me .custom_check {
	color: #333448;
	font-size: 13px;
	font-weight: 500;
}

.remember-me .custom_check .checkmark {
	width: 18px;
	height: 18px;
	top: 2px;
	left: 2px;
	border: 2px solid rgba(51, 52, 72, 0.2);
	border-radius: 4px;
	background-color: #fff;
}

.remember-me .custom_check .checkmark::after {
	left: 3px;
	top: 0px;
}

.login-wrapper .loginbox .login-right .forgotpass a {
	color: #00D3C7;
	font-size: 14px;
	font-weight: 500;
	margin-left: auto;
}

.login-wrapper .loginbox .login-right .forgotpass a:hover {
	color: #333;
	text-decoration: underline;
}

.login-wrapper .loginbox .login-right .dont-have {
	color: #a0a0a0;
	margin: 20px 0px;
}

.login-wrapper .loginbox .login-right .dont-have a {
	color: #18AEFA;
	font-weight: 500;
}

.login-wrapper .loginbox .login-right .dont-have a:hover {
	text-decoration: underline;
}

.social-login {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.social-login>span {
	color: #a0a0a0;
	margin-right: 8px;
}

.social-login>a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	height: 40px;
	margin-right: 6px;
	width: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.social-login>a:hover {
	background-color: #e6e6e8;
	color: #fff;
}

.social-login>a:last-child {
	margin-right: 0;
}

.btn-primary.primary-reset {
	background-color: #18AEFA;
	border-color: #18AEFA;
}

.btn-primary.primary-reset:hover {
	background-color: #3d5ee1;
	border: 1px solid #3d5ee1;
}

.profile-views {
	position: absolute;
	right: 17px;
	top: 50%;
	transform: translateY(-50%);
	color: rgba(51, 52, 72, 0.2);
	cursor: pointer;
}

.login-right .form-control {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
	height: 45px;
}

.login-right .form-control:focus {
	border: 2px solid rgb(74 83 199 / 80%);
}

.btn-block {
	width: 100%;
}

.account-logo {
	margin-bottom: 40px;
	text-align: left;
}

.account-logo img {
	width: 40%;
}

.login-right .btn-primary {
	background: linear-gradient(92.39deg, #4E57CD 1.86%, #3a57e8 100%);
	border-radius: 12px;
	font-size: 16px;
	padding: 10px 15px;
}

.login-right .btn-primary:hover {
	background: linear-gradient(92.39deg, #3a57e8 1.86%, #00318b 100%);
	border: 1px solid #00318b;
}

.next-sign {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.login-btn {
	margin-bottom: 40px;
}

.login-wrapper .login-right .user-lock-screen h2 {
	margin-bottom: 10px;
}

.user-lock-screen p {
	margin-bottom: 0;
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}

.user-lock-screen {
	margin-bottom: 30px;
}

.sucess-mail h4 {
	font-size: 26px;
	font-weight: 600;
	margin: 15px 0px 20px;
}

.sucess-mail p {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0px;
}

/*-----------------
	14. Login
-----------------------*/

.login-sec {
	text-align: center;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: end;
	height: auto;
}

.log-img img {
	margin: 0 auto;
}

.login-wrapper {
	width: 100%;
	height: 100%;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	-webkit-flex-wrap: wrap;
}

.login-wrap {
	background-color: #3a57e8;
	top: 0;
	left: 0;
	position: fixed;
	height: 100vh;
	padding: 0px;
	border-radius: 0px 65px 65px 0px;
}

.login-wrap-bg {
	position: absolute;
	right: 0;
	padding: 15px 90px 15px;
	height: 100%;
}

.login-wrap .login-sec {
	position: absolute;
	background-image: url('../img/login-0l.png');
	background-repeat: no-repeat;
	background-position: top right;
	background-size: cover, auto;
	width: 100%;
}

.login-wrapper .loginbox {
	background: #FFFFFF;
	box-shadow: 0px 80px 80px rgba(46, 55, 164, 0.03);
	border-radius: 24px;
	display: flex;
	max-width: 830px;
	width: 100%;
}

.login-wrapper .loginbox .login-right {
	padding: 50px;
	width: 100%;
}

/*-----------------
	9. Dashboard
-----------------------*/

.dash-widget {
	background-color: #fff;
	border-radius: 12px;
	backdrop-filter: blur(2px);
	margin-bottom: 30px;
	padding: 18px;
	position: relative;
	height: 180px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
	border: 1px solid #3a57e875;
}

.dash-boxs {
	background: rgb(58 87 232 / 10%);
	border: 2px solid #3a57e83d;
	border-radius: 12px;
	width: 46px;
	height: 46px;
	margin-bottom: 10px;
}

.dash-content h4 {
	font-size: 15px;
	font-weight: 500;
	margin-bottom: 0px;
	color: #1f1f1f;
}

.dash-content h2 {
	color: #3a57e8;
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 20px;
}

.dash-content p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0px;
}

.dash-content p .negative-view {
	color: #FF3667;
}

.dash-content p .passive-view {
	color: #00D3C7;
}

.comman-flex-center {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.card-table.card-table-top .card-body {
	height: 175px;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}

.chart-title {
	margin-bottom: 25px;
}

.chart-title h4 {
	display: inline-block;
	font-size: 18px;
	font-weight: 600;
	line-height: 20px;
	margin: 0;
	color: #333;
}

.chart-title span {
	color: #009efb;
}

.card-title>a.btn {
	color: #fff;
}

ul.chat-user-total li {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: #333448;
	padding-right: 10px;
	font-size: 14px;
	font-weight: 500;
}

ul.chat-user-total li i.current-users {
	color: #3a57e8;
	padding-right: 5px;
	font-size: 8px;
}

ul.chat-user-total li i.low-users {
	color: #D5D7ED;
	padding-right: 5px;
	font-size: 8px;
}

ul.chat-user-total li i.old-users {
	color: #00D3C7;
	padding-right: 5px;
	font-size: 8px;
}

.new-patient-table {
	display: table;
}

.new-patient-table td,
.new-patient-table th {
	vertical-align: middle;
}

.new-patient-table tr td img {
	margin-right: 5px;
}

.btn-primary-one {
	border: 1px solid #ffbc35;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}

.btn-primary-two {
	border: 1px solid #009efb;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}

.btn-primary-three {
	border: 1px solid #55ce63;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}

.btn-primary-four {
	border: 1px solid #ffbc35;
	border-radius: 25px;
	width: 100px;
	background: transparent;
	color: #000;
}

.bar-chart {
	position: relative;
	width: 100%;
	margin-top: 15px;
}

.bar-chart>.legend {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 40px;
	margin-bottom: -45px;
	border-top: 1px solid #000;
}

.bar-chart>.legend>.item {
	position: relative;
	display: inline-block;
	float: left;
	width: 25%;
}

.bar-chart>.legend>.item:before {
	display: block;
	position: absolute;
	top: 0;
	left: 0;
	content: '';
	width: 1px;
	height: 8px;
	background-color: #000;
	margin-top: -8px;
}

.bar-chart>.legend>.item.text-end:before {
	right: 0;
	left: auto;
}

.bar-chart>.legend>.item h4 {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 1px;
	padding-top: 5px;
}

.bar-chart>.chart {
	position: relative;
	width: 100%;
}

.bar-chart>.chart>.item {
	position: relative;
	width: 100%;
	height: 40px;
	margin-bottom: 10px;
	color: #fff;
	text-transform: uppercase;
}

.bar-chart>.chart>.item>.bar {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: #ffbc35;
	z-index: 5;
}

.bar-chart>.chart>.item>.bar>.percent {
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	height: 40px;
	line-height: 40px;
	padding-right: 12px;
	z-index: 15;
}

.bar-chart>.chart>.item>.bar>.item-progress {
	position: absolute;
	top: 0;
	left: 0;
	height: 100%;
	background-color: #009efb;
	z-index: 10;
}

.bar-chart>.chart>.item>.bar>.item-progress>.title {
	display: block;
	position: absolute;
	height: 40px;
	line-height: 40px;
	padding-left: 12px;
	letter-spacing: 2px;
	z-index: 15;
}

.hospital-barchart h4 {
	display: inline-block;
	font-size: 18px;
	font-weight: 400;
	line-height: 20px;
	margin: 0;
	color: #333;
}

.custom-table tr {
	background-color: #fff;
	white-space: nowrap;
}

.table.custom-table>tbody>tr>td,
.table.custom-table>tbody>tr>th,
.table.custom-table>tfoot>tr>td,
.table.custom-table>tfoot>tr>th,
.table.custom-table>thead>tr>td,
.table.custom-table>thead>tr>th {
	padding: 10px 15px;
	vertical-align: middle;
}

.member-panel .contact-list>li:last-child {
	border-bottom: 0;
}

.member-panel .card-body {
	overflow-y: auto;
	height: 245px;
	-webkit-overflow-scrolling: touch;
	padding: 0;
}

.contact-list {
	list-style: none;
	padding-left: 0;
	margin: 0;
}

.contact-list>li {
	border-bottom: 1px solid #eaeaea;
	border-radius: inherit;
	padding: 10px;
	background-color: #fff;
}

.contact-cont {
	position: relative;
}

.contact-info {
	padding: 0 30px 0 50px;
}

.contact-date {
	color: #888;
	font-size: 12px;
}

.take-btn {
	min-width: 80px;
}


.morning-user {
	/* padding: 50px 0px 50px 35px; */
}

.morning-user h2 {
	font-size: 28px;
	font-weight: 600;
}

.morning-user h2 span {
	color: #3a57e8;
}

.morning-user p {
	font-size: 15px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}

.morning-img img {
	position: absolute;
	bottom: 0;
	right: 200px;
}

.position-blk {
	position: relative;
}

.activity-top {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 20px;
}

.activity-boxs {
	background: rgba(58 87 232 / 6%);
	width: 45px;
	height: 45px;
	margin-right: 10px;
	border-radius: 50px;
}

.departments-list h4 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}

.departments-list p {
	font-size: 14px;
	font-weight: 600;
	color: rgba(51, 53, 72, 0.5);
	margin-bottom: 0;
}

.chart-user-icon {
	position: relative;
}

.chart-user-icon img {
	position: absolute;
	top: 65px;
	left: 50%;
	-webkit-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:before,
table.dataTable thead .sorting_desc_disabled:after {
	bottom: 15px;
}

.custom-table tbody tr {
	box-shadow: 0 0 3px #e5e5e5;
	border: 0;
}

.custom-table tbody tr td,
.custom-table thead tr th {
	border: 0;
}

.custom-table tbody tr td {
	font-size: 14px;
}

.custom-table thead tr th {
	font-size: 14px;
	color: rgba(51, 52, 72, 0.5);
}

.table-dash .dataTables_length,
.table-dash .dataTables_info,
.table-dash .pagination {
	display: none;
}

.table-image {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.table-image img {
	margin-right: 10px;
}

.patient-views {
	color: #3a57e8;
	font-size: 14px;
	font-weight: 500;
}

.appoint-doctor h2 {
	color: #3a57e8;
}

.appoint-time span {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
}

.appoint-time h6 {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}

.patient-visit {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.doctor-list-blk {
	background: #FFFFFF;
	border-radius: 16px;
	padding: 20px;
	margin-bottom: 25px;
}

.doctor-widget {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	position: relative;
}

.doctor-box-icon {
	width: 66px;
	height: 66px;
	background: #3a57e8;
	border-radius: 12px;
	margin-right: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.doctor-content {
	width: 100%;
}

.doctor-content h4 {
	font-size: 24px;
	color: #3a57e8;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-weight: 600;
}

.doctor-content h5 {
	font-size: 14px;
	margin-bottom: 0;
}

.doctor-content h4 span:nth-child(2) {
	font-size: 14px;
	color: rgb(51 52 72 / 20%);
}

.doctor-content h4 span:last-child {
	font-size: 10px;
	border-radius: 20px;
	margin: auto;
	padding: 5px;
}

.border-right-bg:before {
	content: "";
	position: absolute;
	background: rgba(46, 55, 164, 0.2);
	height: 44px;
	width: 2px;
	right: 0;
}

.income-value {
	text-align: center;
}

.income-value h3 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}

.income-value h3 span {
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
}

.income-value p {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}

.income-value p span {
	color: #00D3C7
}

.patient-structure h5 {
	font-size: 16px;
	font-weight: 500;
	color: #3a57e8;
	margin-bottom: 10px;
}

.struct-point {
	width: 100%;
}

.patient-structure h3 {
	font-size: 40px;
	font-weight: 600;
	margin-bottom: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.patient-structure h3 span {
	font-size: 12px;
	padding: 3px 7px;
	border-radius: 20px;
}

.check-point {
	border: 0;
	border-radius: 4px;
}

.card.wallet-widget {
	margin-bottom: 25px;
	padding: 15px;
	width: 100%;
}

.main-limit {
	text-align: center;
}

.main-limit p {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 10px;
}

.main-limit h4 {
	font-size: 24px;
	font-weight: 600;
	color: #3a57e8;
	margin-bottom: 0;
}

.wallet-widget .circle-bar {
	text-align: center;
}

.wallet-widget .circle-bar>div {
	display: inline-block;
	position: relative;
	text-align: center;
}

.wallet-widget .circle-bar>div b {
	left: 0;
	position: absolute;
	top: 50%;
	right: 0;
	text-align: center;
	margin: 0 auto;
	transform: translateY(-50%);
	width: 60px;
	height: 60px;
	border-radius: 50px;
	background: rgba(0, 211, 199, 0.1);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.wallet-widget .circle-bar>div canvas {
	width: 100px !important;
	height: 100px !important;
}

.teaching-card {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.steps-history {
	margin-bottom: 0;
	margin-right: 10px;
	align-items: baseline;
	display: inline-grid;
	padding: 0;
	width: 40px;
}

.steps-history li {
	margin-top: 5px;
	color: rgba(51, 53, 72, 0.5);
	font-weight: 500;
	list-style: none;
	font-size: 12px;
}

.activity-feed {
	list-style: none;
	margin-bottom: 0;
	margin-left: 5px;
	padding: 0;
	width: 100%;
	position: relative;
}

.activity-feed::after {
	position: absolute;
	content: "";
	background: #e4e8eb;
	width: 2px;
	height: 100%;
	left: -2px;
	top: 10px;
	z-index: 0;
}

.activity-feed .feed-item {

	padding-bottom: 20px;
	padding-left: 20px;
	position: relative;
}

.activity-feed .feed-item:last-child {
	padding-bottom: 0;
}

.activity-feed .feed-item:after {
	content: "";
	display: block;
	position: absolute;
	background-color: #333448;
	width: 7px;
	height: 7px;
	top: 10px;
	left: -4px;
	border-radius: 50px;
	z-index: 9;
}

.doctor-date-list {
	padding: 0;
}

.doctor-date-list li {
	list-style: none;
	color: #333548;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 15px;
}

.doctor-date-list li span {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	padding-left: 15px;
}

.doctor-date-list li i {
	font-size: 6px;
}

.dolor-activity {
	width: 100%;
}

.dolor-activity .stick-line {
	text-decoration: line-through;
	color: rgba(51, 53, 72, 0.5);
}

.active-doctor {
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 14px;
	padding: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.doctor-sub-list {
	padding: 10px;
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 14px;
	width: 100%;
	position: absolute;
	z-index: 99;
	display: none;
}

.ongoing-blk {
	position: relative;
}

.schedule-time li {
	width: 30px;
	height: 30px;
	border: 1px solid rgba(46, 55, 164, 0.2);
	border-radius: 5px;
}

.schedule-time li {
	margin-right: 5px;
	margin-bottom: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.schedule-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-top: 1px solid rgba(51, 52, 72, 0.2);
	padding-top: 10px;
	flex-wrap: wrap;
}

.appoint-start {
	font-size: 12px;
	border-radius: 10px;
	padding: 10px 20px;
}

.new-dot {
	padding: 3px 10px;
	font-size: 12px;
	margin-left: auto;
	border-radius: 8px;
}

.doctor-date-list .new-dot i {
	font-size: 5px;
}

.patient-new-list {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}

.average-health h5 {
	margin-bottom: 0;
	background: rgba(58 87 232 / 6%);
	border-radius: 8px;
	padding: 6px 10px;
	font-size: 14px;
	font-weight: 500;
}

.average-health h5 span {
	color: rgba(46, 55, 164, 0.5);
	font-size: 10px;
}

.dash-content h5 {
	font-size: 24px;
	color: #3a57e8;
	font-weight: 600;
	margin-bottom: 20px;
}

.calendar header .month {
	font-size: 18px;
}

.dash-content h5 span {
	font-size: 16px;
	color: rgba(51, 52, 72, 0.5);
}

.report-blk {
	width: 100%;
}

.ongoing-drapt {
	position: relative;
	margin-left: auto;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.ongoing-drapt i {
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.2);
	box-shadow: 0px 25px 50px rgba(46, 55, 164, 0.07);
	border-radius: 6px;
	color: #3a57e8;
	width: 20px;
	height: 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.doctor-date-list li .ongoing-drapt i {
	font-size: 12px;
}

.active-doctor.dropdown-toggle::after {
	display: none;
}

.doctor-sub-list .dropdown-item {
	padding: 0;
}

.doctor-sub-list .dropdown-item:focus,
.doctor-sub-list .dropdown-item:hover {
	background-color: transparent;
}

.active-doctor .active-circles {
	color: #00D3C7;
}

.doctor-date-list .active-doctor span {
	color: #3a57e8;
}

.doctor-date-list .active-doctor span.ongoing-drapt {
	color: rgba(51, 52, 72, 0.5);
}

.note-checkit .custom_check .checkmark {
	border: 2px solid rgba(46, 55, 164, 0.2);
	border-radius: 5px;
}

.note-checkit .custom_check input:checked~.checkmark {
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.note-checkit .custom_check {
	color: #333548;
	font-size: 12px;
	font-weight: 600;
}

.wallet-widget.general-health {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-around;
	-webkit-justify-content: space-around;
	-ms-flex-pack: space-around;
	flex-direction: inherit;
}

.general-health .main-limit p {
	font-weight: 600;
}

.general-health.wallet-widget .circle-bar>div canvas {
	width: 135px;
	height: 135px;
}

.status-gray.re-shedule {
	color: #3a57e8;
	font-weight: 600;
	font-size: 12px;
}

.patient-table tbody tr td,
.patient-table tbody tr td h2 {
	font-weight: 500;
	color: #333448;
}

.patient-table tbody tr td:nth-child(3) {
	color: rgba(51, 52, 72, 0.5);
}

.treat-box {
	background: #FFFFFF;
	border-radius: 10px;
	padding: 15px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.user-imgs-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.user-imgs-blk img {
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	border-radius: 50px;
	margin-right: 20px;
	border: 2px solid rgba(46, 55, 164, 0.2);
}

.active-user-detail h4 {
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 5px;
}

.active-user-detail p {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0;
}

.weight-blk .slick-slide {
	transition: all ease-in-out .3s;
	opacity: .2;
}

.weight-blk .slick-slide div {
	text-align: center;
}

.weight-blk .slick-slide span {
	opacity: 0;
}

.weight-blk .slick-slide h4 {
	margin-bottom: 0;
	font-size: 14px;
}

.weight-blk .slick-current span {
	opacity: 1;
	font-size: 12px;
}

.weight-blk .slick-active {
	opacity: .5;
}

.weight-blk .slick-current {
	opacity: 1;
}

.max-blk {
	width: 50%;
}

.weight-blk {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 14px;
	padding: 25px 0px 20px;
	position: relative;
}

.report-head h4 {
	margin-bottom: 0;
	font-size: 18px;
}

.report-head img {
	width: 40px;
	height: 40px;
}

.weight-blk:before {
	background-image: url(../img/icons/mass-icon.svg);
	content: "";
	position: absolute;
	width: 20px;
	height: 20px;
	background-repeat: no-repeat;
	left: 50%;
	top: 0px;
	-webkit-transform: translate(-50%, 0);
	-ms-transform: translate(-50%, 0);
	transform: translate(-50%, 0);
}

.weight-bar.progress {
	height: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 40px 0px 10px;
}

.weight-bar .progress-bar {
	width: 100px;
	background-color: #3a57e8;
	border-radius: 20px;
}

.weight-checkit {
	list-style: none;
	padding: 0;
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.pulse {
	display: block;
	position: absolute;
	top: 24px;
	right: 6px;
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: #00d3c7;
}

.pulse:before {
	content: "";
	top: 0px;
	right: 0px;
	width: 10px;
	height: 10px;
	position: absolute;
	border-radius: 50%;
	background: rgb(0 211 199 / 50%);
	cursor: pointer;
	box-shadow: 0 0 0 rgb(0 211 199);
	animation: pulse 1s linear infinite;
	z-index: 1;
}

@keyframes pulse {
	100% {
		transform: scale(2.5);
	}
}

/*-----------------
	10. Activity
-----------------------*/

.activity-box {
	position: relative;
}

.activity-list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

.activity .activity-list>li .activity-user {
	height: 32px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 12px;
	left: 8px;
	width: 32px;
}

.activity .activity-list>li .activity-content {
	margin: 0 0 0 40px;
	padding: 0;
	position: relative;
}

.activity-list>li {
	margin-bottom: 10px;
	padding: 10px;
	position: relative;
}

.activity-list>li:last-child .activity-content {
	margin-bottom: 0;
}

.activity-user .avatar {
	height: 32px;
	line-height: 32px;
	margin: 0;
	width: 32px;
}

.activity-list>li .activity-user {
	background: #fff;
	height: 32px;
	left: -7px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 3px;
	width: 32px;
}

.activity-list>li .activity-content {
	background-color: #fff;
	margin: 0 0 20px 40px;
	padding: 0;
	position: relative;
}

.activity-list>li .time {
	color: rgba(51, 52, 72, 0.5);
	display: block;
	font-size: 12px;
	line-height: 1.35;
}

.activity-delete {
	background-color: #ffe5e6;
	border: 1px solid #fe0000;
	color: #fe0000;
	display: none;
	font-size: 20px;
	height: 20px;
	line-height: 18px;
	position: absolute;
	right: 0;
	text-align: center;
	top: 0;
	width: 20px;
}

.activity-delete:hover {
	background-color: #fe0000;
	color: #fff;
}

.activity-list>li:hover .activity-delete {
	display: inline-block;
}

.activity-list::before {
	background: rgba(46, 55, 164, 0.1);
	bottom: 0;
	content: "";
	left: 23px;
	position: absolute;
	top: 8px;
	width: 2px;
}

.timeline-group {
	margin-right: 20px;
	min-width: 100px;
}

.timeline-group h4 {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 0;
}

.timeline-group-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.comman-activitys {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 0px 16px 16px 16px;
	padding: 20px;
	width: 100%;
}

.comman-activitys h3 {
	color: #3a57e8;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 5px;
}

.comman-activitys h3 span {
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}

.comman-activitys p {
	color: rgba(51, 52, 72, 0.5);
	margin-bottom: 0px;
	font-size: 12px;
}

.activity-sub-list li {
	margin-right: 10px;
}

.activity-sub-list li img {
	border-radius: 8px;
}

.activity-maps {
	border-radius: 8px;
	border: 2px solid #fff;
}

.activity-maps iframe {
	width: 100%;
}

/*-----------------
	11. Select2
-----------------------*/

.select2-container .select2-selection--single {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
	height: 42px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 38px;
	right: 7px;
}

.select2-container--default .select2-selection--single .select2-selection__arrow b {
	left: 50%;
	margin-left: -10px;
	margin-top: -2px;
	position: absolute;
	top: 50%;
	border-top: 0;
	border-left: 0;
	border-bottom: 1px solid #171717;
	border-right: 1px solid #171717;
	content: '';
	height: 6px;
	display: inline-block;
	pointer-events: none;
	-webkit-transform-origin: 66% 66%;
	-ms-transform-origin: 66% 66%;
	transform-origin: 66% 66%;
	-webkit-transform: rotate(45deg);
	-ms-transform: rotate(45deg);
	transform: rotate(45deg);
	-webkit-transition: all 0.15s ease-in-out;
	transition: all 0.15s ease-in-out;
	width: 6px;
	vertical-align: 0px;
}

.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	-webkit-transform: rotate(-135deg);
	-ms-transform: rotate(-135deg);
	transform: rotate(-135deg);
	border-top: 0;
	border-left: 0;
	border-bottom: 1px solid #171717;
	border-right: 1px solid #171717;
}

.select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 30px;
	padding-left: 15px;
}

.select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #676767;
	font-size: 14px;
	font-weight: normal;
	line-height: 38px;
}

.select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: #3a57e8;
}

.select2-container--default.select2-container--focus .select2-selection--multiple {
	border: 1px solid #eaeaea;
	border-radius: 0;
}

.select2-container--default .select2-selection--multiple {
	border: 1px solid #eaeaea;
	border-radius: 0;
}

.select2-container .select2-selection--multiple {
	min-height: 40px;
}

.select2-results__option {
	font-size: 14px;
}

/*-----------------
	12. Nav tabs
-----------------------*/

.nav-tabs>li>a {
	margin-right: 0;
	color: #888;
	border-radius: 0;
}

.nav-tabs>li>a:hover,
.nav-tabs>li>a:focus {
	border-color: transparent;
	color: #333;
}

.nav-tabs.nav-justified>li>a {
	border-radius: 0;
	margin-bottom: 0;
}

.nav-tabs.nav-justified.nav-tabs-solid>li>a {
	border-color: transparent;
}

.nav-tabs.nav-tabs-solid>li>a {
	color: #333;
}

.nav-tabs.nav-tabs-solid>li>a.active,
.nav-tabs.nav-tabs-solid>li>a.active:hover,
.nav-tabs.nav-tabs-solid>li>a.active:focus {
	background-color: #3a57e8;
	border-color: #3a57e8;
	color: #fff;
}

.nav-tabs.nav-tabs-solid.nav-tabs-rounded {
	border-radius: 50px;
}

.nav-tabs.nav-tabs-solid.nav-tabs-rounded>li>a {
	border-radius: 50px;
}

.nav-tabs.nav-tabs-solid.nav-tabs-rounded>li>a.active,
.nav-tabs.nav-tabs-solid.nav-tabs-rounded>li>a.active:hover,
.nav-tabs.nav-tabs-solid.nav-tabs-rounded>li>a.active:focus {
	border-radius: 50px;
}

.nav-tabs-justified>li>a {
	border-radius: 0;
	margin-bottom: 0;
}

.nav-tabs-justified>li>a:hover,
.nav-tabs-justified>li>a:focus {
	border-bottom-color: #ddd;
}

.nav-tabs-justified.nav-tabs-solid>li>a {
	border-color: transparent;
}

/*-----------------
	13. Holidays
-----------------------*/

.custom-table tr.holiday-completed {
	color: #aaa;
}

.modal-header.bg-danger .modal-title {
	color: #fff;
}

.dropdown.action-label {
	display: inline-block;
}

.action-label>a {
	display: inline-block;
	min-width: 103px;
}

.action-label .btn-sm {
	padding: 5px;
}

/*-----------------
	14. Edit Profile
-----------------------*/

.profile-img-wrap {
	height: 120px;
	position: absolute;
	width: 120px;
	background: #fff;
	overflow: hidden;
}

.profile-basic {
	margin-left: 140px;
}

.profile-img-wrap img {
	width: 120px;
	height: 120px;
}

.fileupload.btn {
	position: absolute;
	right: 0;
	bottom: 0;
	background: rgba(33, 33, 33, 0.5);
	border-radius: 0;
	padding: 3px 10px;
	border: none;
}

.fileupload input.upload {
	cursor: pointer;
	filter: alpha(opacity=0);
	font-size: 20px;
	margin: 0;
	opacity: 0;
	padding: 0;
	position: absolute;
	right: -3px;
	top: -3px;
	padding: 5px;
}

.btn-text {
	color: #fff;
}

/*-----------------
	15. Chat
-----------------------*/

.media .avatar {
	min-width: 36px;
}

.avatar {
	background-color: #aaa;
	border-radius: 50%;
	color: #fff;
	display: inline-block;
	font-weight: 500;
	height: 38px;
	line-height: 38px;
	margin: 0 4px 0 0;
	overflow: hidden;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	vertical-align: middle;
	width: 38px;
	position: relative;
	white-space: nowrap;
	font-size: 14px;
}

.avatar:hover {
	color: #fff;
}

.avatar>img {
	width: 100%;
	display: block;
}

.card.chat-box {
	padding: 20px;
	border-radius: 8px;
	width: 100%;
}

.card.chat-box-clinic {
	padding: 0;
	border-radius: 8px;
	width: 100%;
}

.chat-box-clinic .chat-user-group,
.chat-box-clinic .chat-search {
	padding: 10px 20px;
}

.chat-box-clinic .chat-user-group,
.chat-box-clinic .chat-search {
	margin-bottom: 20px;
}

.chat-box-clinic .chat-user-group:hover {
	background: #3a57e8;
}

.chat-box-clinic .chat-user-group:hover .user-titles h5,
.chat-box-clinic .chat-user-group:hover .chat-user-time p {
	color: #FFFFFF;
}

.chat-box-clinic .chat-user-group:hover .user-text p {
	color: rgba(255, 255, 255, 0.5);
}

.chat-user-group:hover .chat-user-count span {
	background: #fff;
	color: #3a57e8;
}

.chat-user-group {
	margin-bottom: 30px;
}

.chat-user-group-head .img-users {
	margin-right: 10px;
}

.chat-user-group-head {
	padding: 20px;
}

.chat-user-group-head .user-titles h5 {
	color: #3a57e8;
}

.chat-users {
	width: 100%;
}

.chat-users.user-main {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.user-dot-list {
	width: 40px;
	height: 40px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.user-dot-list a {
	color: #171717;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.chat-user-time,
.chat-user-count {
	margin-left: auto;
}

.user-titles h5 {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 3px;
}

.chat-user-time p,
.user-text p {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
}

.chat-user-count span {
	background: #3a57e8;
	border-radius: 50px;
	width: 15px;
	height: 15px;
	font-size: 10px;
	color: #fff;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.chat-user-count .user-check {
	background: none;
	color: #838383;
	font-size: 14px;
}

.chat-user-group .img-users {
	width: 45px;
	height: 45px;
	margin-right: 10px;
}

.user-check.active {
	color: #399E8D;
}

.chat-user-group .active-users {
	width: 8px;
	height: 8px;
	right: 5px;
	top: 0px;
}

.img-users {
	position: relative;
}

.active-users {
	width: 10px;
	height: 10px;
	background: green;
	border-radius: 50px;
	position: absolute;
	right: 0;
	border: 1px solid #FFFFFF;
}

.call-user img {
	width: 45px;
	height: 45px;
	border-radius: 50px;
}

.call-list-add li a {
	background: rgba(58 87 232 / 6%);
	border-radius: 12px;
	width: 50px;
	height: 50px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}

.call-list-add li {
	list-style: none;
	margin-right: 10px;
}

.call-list-add li:first-child a {
	width: 67px;
}

.call-list-add {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 0;
}

.chat-search .input-block {
	position: relative;
	width: 100%;
}

.chat-search {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	margin-bottom: 30px;
}

.add-search a {
	background: rgba(58 87 232 / 6%);
	border-radius: 12px;
	width: 40px;
	height: 40px;
	flex-shrink: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	color: #3a57e8;
}

.add-search a:hover {
	background: #223d9f;
}

.add-search a:hover i {
	color: #fff;
}

.top-liv-search.top-chat-search .btn {
	left: 0;
	right: inherit;
}

.top-liv-search.top-chat-search .form-control {
	padding-left: 40px;
	background: rgba(58 87 232 / 6%);
	border-radius: 12px;
	border: 0;
}

.top-liv-search.top-chat-search .form-control::placeholder {
	color: rgba(46, 55, 164, 0.3);
	font-size: 12px;
}

.chat-search-group {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.chat-search-list ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	padding: 0;
	margin-bottom: 0;
}

.chat-search-list ul li {
	padding: 10px 0px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 0px 10px;
	background: rgba(58 87 232 / 6%);
	border-radius: 8px;
}

.chat-search-list ul li:last-child {
	margin-right: 0;
}

.card.chat-message-box {
	padding: 20px;
}

.message-sub-box h4 {
	color: #000000;
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 15px;
}

.message-sub-box p {
	font-size: 12px;
	font-weight: 400;
	background: rgba(51, 52, 72, 0.1);
	border-radius: 0px 10px 10px 10px;
	padding: 10px;
	margin-bottom: 5px;
	max-width: 270px;
}

.message-sub-box span {
	color: rgba(51, 53, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}

.media.sent .media-body {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: end;
	-webkit-justify-content: end;
	-ms-flex-pack: end;
}

.media.sent .message-sub-box {
	text-align: right;
}

.media.sent .message-sub-box p {
	background: rgba(46, 55, 164, 0.1);
	border-radius: 0px 15px 15px 15px;
	color: #3a57e8;
}

.msg-sub-list {
	margin-bottom: 0;
}

.msg-sub-list li {
	background: rgba(58 87 232 / 6%);
	border-radius: 8px;
	margin-bottom: 5px;
	padding: 5px;
	max-width: 270px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	font-size: 12px;
}

.msg-sub-list li:last-child {
	margin-bottom: 0;
}

.footer-discussion {
	display: inline-flex;
	width: 100%;
}

.footer-discussion .inputgroups {
	width: 100%;
	margin-top: 30px;
	position: relative;
}

.inputgroups input[type="text"] {
	width: 100%;
	height: 52px;
	padding-left: 32px;
	background: rgba(58 87 232 / 6%);
	border-radius: 12px;
	border: 0;
}

.inputgroups input[type="text"]::placeholder {
	font-size: 12px;
	color: rgba(51, 52, 72, 0.3);
}

.chat-footer-box {
	border-top: 2px solid rgba(58 87 232 / 6%);
	border-radius: 0px 0px 10px 10px;
}

.position-icon {
	position: absolute;
}

.micro-text {
	top: 15px;
	left: 10px;
}

.send-chat {
	background: #234CE3;
	border-radius: 8px;
	width: 52px;
	height: 52px;
	top: 0;
	right: 0;
}

.comman-flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.symple-text ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	margin-bottom: 0;
}

.symple-text ul li {
	list-style: none;
}

.symple-text {
	top: 15px;
	right: 65px;
}

.chat-heading h3 {
	margin-bottom: 20px;
}

.chat-users.chat-user-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.comman-space-flex {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.chat-user-blk .user-titles p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}

.chat-user-blk .user-text {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.chat-user-icon {
	margin-left: 15px;
}

.call-all {
	margin-bottom: 25px;
}

.call-all h4 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.call-all h4 span {
	background: #0DBF0A;
	border-radius: 50px;
	width: 20px;
	height: 20px;
	color: #fff;
	font-size: 10px;
	margin-left: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.call-all h5 {
	margin-bottom: 0;
}

.call-all h5 a {
	color: #3a57e8;
	font-size: 14px;
	font-weight: 600;
}

.voice-call-user {
	margin-bottom: 30px;
}

.voice-call-user img {
	width: 80px;
	height: 80px;
	border-radius: 50px;
	margin-bottom: 10px;
}

.voice-call-user h3 {
	color: #333448;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}

.voice-call-user p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 0;
}

.voice-time {
	background: rgba(58 87 232 / 6%);
	border-radius: 12px;
	max-width: 191px;
	margin: auto;
}

.voice-time h3 {
	font-size: 26px;
	color: #3a57e8;
	font-weight: 600;
	margin-bottom: 0;
	padding: 10px;
}

.voice-menu ul {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin: 30px 0px;
	padding: 0;
}

.voice-menu ul li {
	margin-right: 20px;
	list-style: none;
}

.voice-menu ul li:last-child {
	margin-right: 0px;
}

.voice-menu ul li:hover a {
	background: #3a57e8;
	border: 1px solid #3a57e8;
}

.voice-menu ul li:hover img {
	filter: invert(1) brightness(100);
}

.voice-menu ul li a {
	width: 50px;
	height: 50px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.end-call-voice .btn-primary {
	background: #FE3F51;
	border-radius: 8px;
	min-width: 136px;
	padding: 10px 15px;
	font-size: 16px;
	font-weight: 600;
}

.end-call-voice .btn-primary:hover {
	background: #234ce3;
	border: 1px solid #234ce3;
}

.video-call-blk.chat-user-group:hover {
	border-radius: 8px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
}

.video-call-blk.chat-user-group {
	padding: 10px;
	margin-bottom: 15px;
}

.chat-user-group .user-titles h5 {
	color: #333448;
}

.message-sub-box h5 {
	color: rgba(51, 52, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}

.video-chat-show .message-sub-box p {
	font-size: 12px;
}

.video-chat-show ul li {
	margin-bottom: 15px;
}

.video-chat-show ul {
	margin-bottom: 0px;
	padding: 0;
}

.video-chat-show ul li:last-child {
	margin-bottom: 0px;
}

.calling-income h4 {
	color: #35446F;
	font-size: 15px;
	font-weight: 600;
	margin-bottom: 30px;
}

.crypto-income-blk .voice-call-user h3 {
	color: #35446F;
	font-size: 20px;
	font-weight: 700;
	margin-bottom: 5px;
}

.crypto-income-blk .voice-call-user p {
	color: #3a57e8;
	font-size: 14px;
	font-weight: 600;
}

.voice-menu-income .btn-primary {
	width: 60px;
	height: 60px;
	border-radius: 12px;
}

.voice-menu-income .call-remove {
	background: #FE3F51;
}

.voice-menu-income .call-received {
	background: #0DBF0A;
}

.top-liv-search.top-chat-search .btn {
	left: 0;
	right: inherit;
}

.top-liv-search .btn {
	background-color: transparent;
	border-color: transparent;
	color: rgba(17, 17, 17, 0.32);
	min-height: 45px;
	padding: 7px 15px;
	position: absolute;
	right: 0;
	top: 0;
	margin-bottom: 0;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

/*-----------------
	10. Join Call
-----------------------*/

.page-content {
	width: 100%;
}

.join-call {
	max-width: 950px;
	width: 100%;
	margin: 0 auto;
	padding-top: 50px;
}

.join-video {
	position: relative;
	margin-bottom: 30px;
}

.join-video img {
	border-radius: 10px;
	object-fit: cover;
}

.join-video.video-hide>img,
.video-wrap.video-hide>video {
	display: none;
}

.video-avatar {
	color: #FFF;
	background: #5D5D5D;
	font-size: 50px;
	border-radius: 10px;
	height: 100%;
	width: 100%;
	position: absolute;
	top: 0;
	left: 0;
	display: none;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.video-avatar.active {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.video-avatar h4 {
	font-weight: 700;
	font-size: 24px;
	color: #FFFFFF;
}

.join-content {
	padding-bottom: 25px;
}

.join-content h3 {
	font-weight: 700;
	font-size: 22px;
	margin-bottom: 37px;
}

.join-content label {
	font-size: 20px;
	margin-bottom: 1.25rem;
}

.icon-mic {
	background: #31AA52;
	border-radius: 10px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	color: #fff;
}

.icon-mic i {
	color: #fff;
}

.btn-join {
	font-weight: 700;
	font-size: 20px;
	padding: 14px 20px;
	min-width: 192px;
	border-radius: 10px;
}

.btn-infos {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.btn-infos .btn-join {
	margin-right: 18px;
}

.btn-infos .icon-mic {
	margin-right: 15px;
}

.btn-infos span {
	font-size: 18px;
	color: #808184;
}

.call-icons {
	text-align: center;
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
}

.call-icons .call-items {
	border-radius: 5px;
	padding: 0;
	margin: 0;
	list-style: none;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	position: absolute;
	bottom: 60px;
	left: 50%;
	transform: translate(-50%, 0);
}

.call-icons .call-items .call-item {
	display: inline-block;
	text-align: center;
	margin-right: 15px;
}

.call-icons .call-items .call-item:last-child {
	margin-right: 0;
}

.call-icons .call-items .call-item a {
	color: #FFF;
	border: 1px solid #FFF;
	background: rgba(255, 255, 255, 0.07);
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	width: 60px;
	height: 60px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	font-size: 20px;
	white-space: nowrap;
}

.call-icons .call-items .call-item a:hover {
	opacity: 0.8;
}

.call-icons .call-items .call-item .mute-video.stop,
.call-icons .call-items .call-item .mute-bt.stop {
	background: #EB4132;
	border: 1px solid #EB4132;
}

.set-icon {
	position: absolute;
	top: 30px;
	right: 30px;
	z-index: 1;
}

.vert-icon,
a.vert-icon {
	width: 40px;
	height: 40px;
	background: #FFFFFF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	font-size: 18px;
	color: #000;
}

.voice-sec1 {
	width: 100%;
	height: 100%;
	top: 0;
	position: absolute;
}

.voice-sec {
	position: absolute;
	top: 30px;
	left: 30px;
	z-index: 1;
}

.voice-icon,
a.voice-icon {
	width: 40px;
	height: 40px;
	background: #31AA52;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.25);
	border-radius: 10px;
	font-size: 18px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	color: #FFF;
}

.voice-icon:hover,
a.voice-icon:hover,
.vert-icon:hover,
a.vert-icon:hover {
	opacity: 0.8;
}

/*-----------------
	Meeting Call
-----------------------*/

.meet-icons {
	padding: 40px 0px 20px;
	margin-top: 40px;
	border-top: 2px solid rgba(58 87 232 / 6%);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: center;
}

.meet-icons .meet-items,
.action-items {
	padding: 0;
	margin: 0;
	list-style: none;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
}

.meet-icons .meet-items .meet-item,
.action-items .action-item {
	display: inline-block;
	text-align: center;
	margin-right: 15px;
}

.meet-icons .meet-items .meet-item:last-child,
.action-items .action-item:last-child {
	margin-right: 0;
}

.meet-icons .meet-items .meet-item>a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	color: #636e8e;
	border-radius: 8px;
	width: 50px;
	height: 50px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	font-size: 20px;
}

.meet-icons .meet-items .meet-item>a:hover img {
	filter: invert(1) brightness(100);
}

.meet-icons .meet-items .meet-item>a:hover,
.action-items .action-item a:hover {
	opacity: 0.8;
	background: #3a57e8;
}

.meet-icons .meet-items .meet-item>a.showChatList.active,
.meet-icons .meet-items .meet-item>a.showInviteList.active,
.meet-icons .meet-items .meet-item>a.hand-raise.active,
.action-items .action-item a.record-icon.active {
	background: #3a57e8;
}

.meet-icons .meet-items .meet-item>a.mute-bt.stop,
.meet-icons .meet-items .meet-item>a.mute-video.stop {
	background: #3a57e8;
}

.meet-icons .meet-items .meet-item>a.mute-video.stop .feather-video-off {
	filter: invert(1) brightness(100);
}

.meet-icons .meet-items .meet-item>a.show {
	background: #0074E0;
}

.action-items .action-item a {
	width: 80px;
	height: 50px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	display: -webkit-inline-box;
	display: -ms-inline-flexbox;
	display: inline-flex;
	font-size: 20px;
	box-shadow: 0px 15px 15px rgba(229, 229, 229, 0.32);
	border-radius: 10px;
	color: #FFF;
}

.action-items .action-item a.share-icon {
	background: #EB4132;
}

.action-items .action-item a.callend-icon {
	background: #0074E0;
}

.action-items .action-item a.record-icon {
	background: #31AA52;
}

.end-calls {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: end;
	-ms-flex-pack: end;
	justify-content: flex-end;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.action-icons {
	text-align: center;
}

.part-name {
	position: absolute;
	top: 20px;
	left: 20px;
	text-align: left;
}

.part-name h4 {
	font-weight: 600;
	font-size: 10px;
	color: #FFF;
	margin-bottom: 0;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
	background: #35446F;
	opacity: 0.75;
	backdrop-filter: blur(2.5px);
	border-radius: 8px;
	padding: 10px;
	display: inline-block;
}

.more-icon {
	position: absolute;
	top: 20px;
	right: 20px;
}

.more-icon a {
	color: #FFF;
	background: #35446F;
	opacity: 0.75;
	border-radius: 8px;
	width: 38px;
	height: 38px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.single-user .more-icon a {
	width: 30px;
	height: 30px;
}

.more-icon a:first-child {
	padding-left: 0;
}

.more-icon a:hover {
	opacity: 0.8;
}

.meeting .part-name {
	top: inherit;
	left: 15px;
	bottom: 15px
}

.meeting .more-icon {
	top: 15px;
	right: 15px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.meeting-wrapper,
.meeting {
	width: inherit;
	max-width: inherit;
}

.show-chat-list,
.show-invite-list,
.show-chat-list .user-sidebar-right,
.show-invite-list .invite-sidebar-right {
	transition: all 0.8s ease;
}

.user-sidebar-right,
.invite-sidebar-right {
	background: #dedede;
	border-radius: 10px;
	width: 410px;
	position: absolute;
	top: 105px;
	bottom: 117px;
	right: 0;
	margin-right: -410px;
	transition: all 0.8s ease;
	overflow: hidden;
	font-size: 13px;
	z-index: 3;
}

.join-contents {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-wrap: wrap;
	align-content: flex-start;
	box-sizing: border-box;
	width: 100%;
	max-width: 950px;
	margin: 0 auto;
	overflow: hidden;
}

.join-contents.grid-view {
	align-content: center;
}

.ripple {
	width: 114px;
	height: 114px;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.multigrid-view .text-box {
	height: 61px;
	width: 61px;
}

.multigrid-view .ripple {
	width: 80px;
	height: 80px;
	background: rgba(0, 0, 0, 0.2);
	border-radius: 50%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.meeting .join-video {
	margin: 0 5px 10px;
	width: 100%;
	height: 309px;
}

.join-video.user-active {
	background: #415B6A;
	border-radius: 10px;
}

.join-video.single-user {
	width: 23%;
	flex-grow: 1;
	box-sizing: border-box;
	margin: 0 5px 10px;
	-webkit-box-pack: justify;
	-ms-flex-pack: justify;
	justify-content: space-between;
	text-align: center;
	height: auto;
	background: #415B6A;
	border-radius: 10px;
	padding: 0;
}

.multigrid-view .join-video.single-user {
	width: calc(20% - 10px);
	flex-grow: 0;
}

.join-video.single-user img {
	height: auto;
}

.text-avatar h4 {
	color: #FFF;
}

.text-avatar {
	color: #FFF;
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}

.text-box {
	height: 86px;
	width: 86px;
	border-radius: 50%;
	background-color: rgba(0, 0, 0, 0.2);
	font-size: 36px;
	font-weight: 700;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
}

.settings-menu {
	background: #E4EEFF;
	box-shadow: 0px 4px 4px rgba(0, 0, 0, 0.13);
	border-radius: 10px;
	padding: 0 15px;
}

.settings-menu li a {
	padding: 12px 0;
	border-bottom: 1px solid #FFFFFF;
	width: auto;
	height: auto;
	background: #E4EEFF;
	font-weight: 600;
	font-size: 14px;
	color: #000;
}

.settings-menu li a:focus,
.settings-menu li a:hover {
	color: #000;
	background-color: #E4EEFF;
}

.settings-menu li:last-child a {
	border: 0;
}

.settings-menu .user-img {
	font-size: 18px;
}

.settings-menu .user-img img {
	width: 36px;
	border-radius: 10px;
}

.settings-menu.setting-list-menu li a {
	background: transparent;
}

.overlay-icon {
	background: rgba(0, 0, 0, 0.7);
	border-radius: 10px;
	width: 44px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	position: absolute;
	top: 42px;
	left: 15px;
	opacity: 0;
	transition: opacity .3s linear;
}

.overlay-icon a {
	color: #FFF;
	padding: 3px 0;
	font-size: 14px;
	text-align: center;
}

.overlay-icon a:hover {
	opacity: 0.8;
}

.join-video.single-user::before,
.meeting .join-video::before {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0, 0, 0, 0.7);
	content: "";
	border-radius: 10px;
	opacity: 0;
	transition: opacity .3s linear;
}

.join-video.single-user:hover::before,
.meeting .join-video:hover::before {
	opacity: 1;
}

.join-video.single-user:hover .overlay-icon,
.join-video:hover .overlay-icon {
	opacity: 1;
}

.more-icon.mic-view .mic-off {
	display: block;
}

.grid-view .join-video.single-user {
	width: 48%;
}

.join-contents.multigrid-view {
	max-width: 100%;
	padding: 25px 100px 0;
	justify-content: center;
}

.meeting-list {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	display: -ms-flexbox;
	display: flex;
	flex-direction: column;
	height: 100%;
	width: 100%;
	position: relative;
}

.user-active .more-icon .handraise-on.active {
	display: block;
	animation: mymove 5s;
}

.user-active .more-icon .handraise-on.active .meeting .join-video.user-active::before {
	animation: mymove 5s infinite;
	opacity: 1;
}

@keyframes mymove {
	from {
		color: #0074E0;
	}

	to {
		color: transparent;
	}
}

.join-contents.vertical-view {
	display: -webkit-flex;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	align-content: center;
	max-width: 1300px;
}

.join-contents.vertical-view .join-video.user-active {
	flex: 1;
	margin-bottom: 5px;
	;
}

.join-contents.vertical {
	flex-direction: column;
	height: 200px;
}

.join-contents.vertical-view .join-video.single-user {
	width: 97%;
	flex-grow: 1;
}

.meeting .join-contents.vertical .join-video.user-active {
	flex: 1 0 100%;
}

.meeting .join-contents.vertical .join-video.single-user {
	flex: 0;
}

.meeting .join-contents.vertical .join-video {
	width: auto;
}

.ptro-holder-wrapper {
	top: 80px !important;
	position: relative !important;
	height: auto !important;
	bottom: 300px;
	z-index: 4;
}

.chat-footer .btn:hover {
	background: #0066c5;
	color: #FFF;
}

.person-view {
	width: 40px;
	height: 40px;
	background: #415B6A;
	border-radius: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	-webkit-box-pack: center;
	-ms-flex-pack: center;
	justify-content: center;
	margin-right: 16px;
	color: #FFF;
	font-weight: 700;
	font-size: 14px;
}

.end-call-chat .btn-primary {
	min-width: 136px;
	background: #FE3F51;
	border-radius: 8px;
	margin: 0px 20px;
	padding: 12px 15px;
	font-size: 16px;
}

/*-----------------
	Email
-----------------------*/

.compose-mail .btn-primary {
	font-size: 14px;
	font-weight: 500;
	min-width: 100%;
	padding: 10px 15px;
	margin-bottom: 30px;
}

.email-menu-blk ul {
	padding: 0;
}

.email-menu-blk ul li {
	list-style: none;
}

.email-menu-blk ul li a {
	color: rgba(51, 52, 72, 0.5);
	font-size: 15px;
	font-weight: 500;
	padding: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	border-radius: 8px;
	margin-bottom: 5px;
}

.email-menu-blk ul li a:hover {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}

.email-menu-blk ul li.active a {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}

.email-menu-blk ul li.active span {
	background: #00D3C7;
	border-radius: 20px;
	color: #fff;
	font-weight: 600;
}

.email-menu-blk ul li span {
	font-size: 14px;
	margin-left: auto;
	width: 45px;
	height: 26px;
}

.sub-mails {
	padding: 0;
	position: absolute;
	top: 13px;
	right: 20px;
}

.sub-mails li {
	padding: 0px 5px;
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}

.summer-mail .card .card-header {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
}

.summer-mail .note-editor.note-frame {
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
}

.chat-user-group .user-titles.user-head-compse h5 {
	color: #3a57e8;
}

.label-blk {
	margin-bottom: 20px;
}

.label-blk h4 {
	margin-bottom: 0;
	color: #333448;
	font-size: 16px;
	font-weight: 600;
}

.label-add-list li .add-list-btn {
	width: 30px;
	height: 30px;
	background: rgba(58 87 232 / 6%);
	border-radius: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.label-add-list li .add-list-btn:hover {
	background: #234CE3;
	color: #fff;
}

.top-action-right ul li {
	margin-right: 20px;
}

.top-action-right ul li:last-child {
	margin-right: 0px;
}

.top-liv-search.top-action-search .form-control {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	border: 0;
}

.top-inbox-blk {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	width: 40px;
	height: 40px;
}

.top-inbox-blk .dropdown-menu {
	text-align: center;
	padding: 0;
	border: 0;
	background: linear-gradient(51.64deg, rgba(255, 255, 255, 0) 34.2%, rgba(255, 255, 255, 0.5) 97.35%, rgba(255, 255, 255, 0) 160.66%), rgba(255, 255, 255, 0.8);
	box-shadow: 0px 4px 9px #E1ECFF, inset 0px 0px 15px rgba(255, 255, 255, 0.35);
	backdrop-filter: blur(5px);
	border-radius: 5px;
}

.top-inbox-blk .dropdown-menu .dropdown-item {
	border-bottom: 1px solid #EBEBF6;
	font-size: 14px;
	font-weight: 600;
	color: #333448;
	padding: 10px;
}

.top-inbox-blk .dropdown-menu .dropdown-item:last-child {
	border-bottom: 0px;
}

.top-recheck .custom_check input {
	position: relative;
}

.top-check .form-check-input {
	border: 2px solid rgba(51, 52, 72, 0.2);
	border-radius: 4px;
	width: 18px;
	height: 18px;
}

.top-check .form-check-input:checked[type=checkbox] {
	background-color: #234ce3;
}

.form-check-input:checked {}

.select-gender .form-check-input:focus {
	box-shadow: none;
}

.top-check .form-check-input:focus {
	box-shadow: none;
}

.email-content .table-inbox tr {
	background: #fff;
	border-radius: 5px;
}

.email-content .table-inbox tr td {
	vertical-align: middle;
	padding: 15px;
	color: #6586BF;
	white-space: nowrap;
}

.email-img img {
	border-radius: 50px;
	width: 48px;
	height: 48px;
	margin-right: 10px;
}

.send-user h4 {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 5px;
}

.send-user p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}

.email-img-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.send-user h4 span {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding: 5px;
	margin-left: 10px;
	font-size: 10px;
	border-radius: 8px;
}

.send-user .email-market {
	background: rgba(0, 211, 199, 0.15);
	color: #00D3C7;
}

.email-office {
	background: rgba(13, 191, 10, 0.15);
	color: #0DBF0A;
}

.email-bills {
	background: rgba(254, 63, 81, 0.15);
	color: #FE3F51;
}

.email-work {
	background: rgba(255, 182, 39, 0.15);
	color: #FFB627;
}

.send-user h4 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.compose-mail h3 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 30px;
}

.mail-send {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: end;
	-webkit-justify-content: end;
	-ms-flex-pack: end;
}

.mail-send .btn-primary {
	margin-bottom: 0;
	min-width: 111px;
	border-radius: 12px;
}

.mail-reports ul li .ford-angle {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	transform: matrix(-1, 0, 0, 1, 0, 0);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	width: 40px;
	height: 40px;
}

.mail-reports ul li .ford-angle:hover {
	background: rgb(35 76 227 / 50%);
}

.mail-reports ul li .ford-angle:hover img,
.mail-reports ul li .ford-angle:hover i {
	filter: invert(1) brightness(100);
}

.mail-reports ul li {
	margin-right: 10px;
}

.mail-reports ul li:last-child {
	margin-right: 0px;
}

.mail-view-list {
	margin-bottom: 25px;
}

.mail-view-list li {
	margin-right: 10px;
}

.mailview-inner p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 13px;
	font-weight: 600;
}

.thank-mail {
	margin-bottom: 40px;
}

.thank-mail h5 {
	color: #35446F;
	font-size: 14px;
	margin-bottom: 0;
}

.thank-mail h4 {
	color: #333448;
	font-size: 16px;
	font-weight: 600;
}

.forward-send .btn-primary {
	padding: 10px 15px;
	padding: 7px 23px;
	margin-bottom: 0;
	border: 2px solid transparent;
	font-size: 14px;
}

div.dataTables_wrapper div.dataTables_info {
	padding-bottom: 0.85em;
}

div.dataTables_wrapper div.dataTables_paginate {
	padding-right: 15px;
}

.forward-send .forwrd-btn {
	background: transparent;
	border: 2px solid #234CE3;
	color: #234CE3;
	font-weight: 600;
}

.forward-send .forwrd-btn:hover {
	background: #234CE3;
	border: 2px solid #234CE3;
	color: #fff;
}

.forward-send .forwrd-btn:hover img {
	filter: invert(1) brightness(100);
}

.custom-file-upload {
	background: linear-gradient(51.64deg, rgba(255, 255, 255, 0) 34.2%, rgba(255, 255, 255, 0.2) 97.35%, rgba(255, 255, 255, 0) 160.66%), rgba(255, 255, 255, 0.2);
	border: 2px solid #FFFFFF;
	border-radius: 8px;
	display: inline-flex;
	transition: border-color .3s;
	width: 100%;
	font-size: 14px;
	cursor: pointer;
	margin-top: 0;
	height: 53px;
	color: #000;
	position: relative;
}

.custom-file-upload input {
	display: none;
}

.custom-file-upload .file-upload-text {
	display: flex;
	display: -ms-flexbox;
	align-items: center;
	padding-left: 15px;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.change-user {
	padding: 10px 18px;
	background: #6586BF;
	border-radius: 8px;
	font-size: 16px;
	color: #FFF;
	position: absolute;
	right: 0;
	margin: 2px;
	min-width: 177px;
	text-align: center;
}

.sender-img img {
	width: 48px;
	height: 48px;
}

.send-user.send-user-name h4 {
	font-size: 15px;
}

.send-user.send-user-name h4 span {
	padding: 5px 15px;
}

.send-user p span {
	color: #333448;
	font-weight: 600;
}

.mail-reports ul li .ford-angle.star-bg {
	background: transparent;
	margin-right: 0;
}

.ford-angle.star-bg i {
	color: #FFB627;
}

.mail-attach .msg-sub-list li {
	max-width: 100%;
	margin-bottom: 0;
	margin-right: 10px;
}

.mail-attach .msg-sub-list li i {
	color: #FE3F51;
}

.mail-attach {
	margin-bottom: 40px;
}

.view-content-bottom {
	border-bottom: 2px solid #FFFFFF;
	padding-bottom: 40px;
	margin-bottom: 40px;
}

.mail-attach h2 {
	color: #35446F;
	font-size: 16px;
	font-weight: 600;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.mail-attach h2 a {
	color: #3a57e8;
	font-size: 14px;
}

.setting-title p {
	margin-bottom: 0;
}

/*-----------------
	16. Focus Label
-----------------------*/

.form-focus {
	display: flex;
	height: 50px;
	position: relative;
}

.form-focus .focus-label {
	font-size: 16px;
	font-weight: 400;
	opacity: 0.4;
	pointer-events: none;
	position: absolute;
	-webkit-transform: translate3d(0, 22px, 0) scale(1);
	-ms-transform: translate3d(0, 22px, 0) scale(1);
	-o-transform: translate3d(0, 22px, 0) scale(1);
	transform: translate3d(0, 22px, 0) scale(1);
	transform-origin: left top;
	transition: 240ms;
	left: 12px;
	top: -8px;
	z-index: 1;
	color: #888;
}

.form-focus.focused .focus-label {
	opacity: 1;
	font-weight: 300;
	top: -14px;
	font-size: 12px;
	z-index: 1;
}

.form-focus .form-control {
	height: 50px;
	padding: 21px 12px 6px;
}

.form-focus .form-control::-webkit-input-placeholder {
	color: transparent;
	transition: 240ms;
}

.form-focus .form-control:focus::-webkit-input-placeholder {
	transition: none;
}

.form-focus.focused .form-control::-webkit-input-placeholder {
	color: #bbb;
}

.profile-basic .cal-icon {
	width: 100%;
}

.form-focus .select2-container .select2-selection--single {
	border: 1px solid #ccc;
	height: 50px;
	border-radius: 0;
}

.form-focus .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 48px;
	right: 7px;
}

.form-focus .select2-container--default .select2-selection--single .select2-selection__arrow b {
	border-color: #ccc transparent transparent;
	border-style: solid;
	border-width: 6px 6px 0;
	height: 0;
	left: 50%;
	margin-left: -10px;
	margin-top: -2px;
	position: absolute;
	top: 50%;
	width: 0;
}

.form-focus .select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {
	border-color: transparent transparent #ccc;
	border-width: 0 6px 6px;
}

.form-focus .select2-container .select2-selection--single .select2-selection__rendered {
	padding-right: 30px;
	padding-left: 12px;
	padding-top: 10px;
}

.form-focus .select2-container--default .select2-selection--single .select2-selection__rendered {
	color: #676767;
	font-size: 14px;
	font-weight: normal;
	line-height: 38px;
}

.form-focus .select2-container--default .select2-results__option--highlighted[aria-selected] {
	background-color: #fc6075;
}

.file-size {
	color: #888;
}

/*-----------------
	17. Leave
-----------------------*/

.filter-row .btn {
	border-radius: 0;
	min-height: 50px;
	padding: 12px;
	text-transform: uppercase;
}

.form-focus.select-focus .focus-label {
	opacity: 1;
	font-weight: 300;
	top: -20px;
	font-size: 12px;
	z-index: 1;
}

.action-label .label {
	display: inline-block;
	min-width: 85px;
	padding: 0.5em 0.6em;
}

.action-label i {
	margin-right: 3px;
}

.action-label .dropdown-menu>li>a {
	padding: 3px 10px;
}

/*-----------------
	18. Employee
-----------------------*/

.action-icon {
	color: #777;
	font-size: 14px;
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
	width: 31px;
	height: 31px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	margin-left: auto;
}

.table .dropdown-menu {
	font-size: 12px;
	padding: 0;
}

.profile-widget {
	background-color: #fff;
	border-radius: 4px;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
	margin-bottom: 30px;
	padding: 20px;
	text-align: center;
	position: relative;
	overflow: hidden;
}

.profile-widget .user-name>a {
	color: #333;
}

.dropdown.profile-action {
	position: absolute;
	right: 5px;
	text-align: right;
	top: 10px;
}

.profile-action .dropdown-toggle:after {
	display: none;
}

.profile-img {
	cursor: pointer;
	height: 80px;
	margin: 0 auto;
	position: relative;
	width: 80px;
}

.profile-img .avatar {
	font-size: 24px;
	height: 80px;
	line-height: 80px;
	margin: 0;
	width: 80px;
}

.mobile-no>a {
	color: #777;
	display: inline-block;
}

.staff-mail>a {
	color: #777;
	display: inline-block;
	margin-top: 5px;
}

.staff-action-btns {
	margin-top: 10px;
}

.staff-id {
	margin-top: 5px;
}

.view-icons {
	float: right;
	margin-right: 10px;
}

.view-icons .btn {
	color: #888;
	font-size: 18px;
	margin-right: 5px;
	padding: 4px;
}

.view-icons .btn.active {
	color: #333;
}

.attent-status {
	background: rgba(0, 211, 199, 0.15);
	border-radius: 6px;
	width: 26px;
	height: 26px;
	color: #00D3C7;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.present-table {
	background: rgba(0, 211, 199, 0.15);
	color: #00D3C7;
}

.absent-table {
	background: rgba(255, 54, 103, 0.1);
	color: #FF3667;
}

.month-table h5 {
	font-weight: 500;
	font-size: 14px;
}

.attent-table thead tr th:first-child {
	color: #333448;
}

.attent-table thead tr th {
	font-weight: 600;
	font-size: 14px;
	color: #3a57e8;
}

.attent-table .week-days {
	color: rgba(51, 52, 72, 0.2);
}

/*-----------------
	19. Events
-----------------------*/

.calendar {
	float: left;
	margin-bottom: 0;
}

.fc-view {
	margin-top: 30px;
}

a.fc-event:not([href]) {
	color: #fff;
}

.none-border .modal-footer {
	border-top: none;
}

.fc-toolbar h2 {
	font-size: 18px;
	font-weight: 600;
	line-height: 30px;
	text-transform: uppercase;
}

.fc-day-grid-event .fc-time {}

.fc-day {
	background: #fff;
}

.fc-toolbar .fc-state-active,
.fc-toolbar .ui-state-active,
.fc-toolbar button:focus,
.fc-toolbar button:hover,
.fc-toolbar .ui-state-hover {
	z-index: 0;
}

.fc th.fc-widget-header {
	background: #eeeeee;
	font-size: 14px;
	line-height: 20px;
	padding: 10px 0;
	text-transform: uppercase;
}

.fc-unthemed th,
.fc-unthemed td,
.fc-unthemed thead,
.fc-unthemed tbody,
.fc-unthemed .fc-divider,
.fc-unthemed .fc-row,
.fc-unthemed .fc-popover {
	border-color: #f3f3f3;
}

.fc-button {
	background: #f1f1f1;
	border: none;
	color: #797979;
	text-transform: capitalize;
	box-shadow: none !important;
	border-radius: 3px !important;
	margin: 0 3px !important;
	padding: 6px 12px !important;
	height: auto !important;
}

.fc-text-arrow {
	font-family: inherit;
	font-size: 16px;
}

.fc-state-hover {
	background: #f3f3f3;
}

.fc-state-highlight {
	background: #f0f0f0;
}

.fc-state-down,
.fc-state-active,
.fc-state-disabled {
	background-color: #00d3c7;
	color: #fff;
	text-shadow: none;
}

.fc-cell-overlay {
	background: #f0f0f0;
}

.fc-unthemed .fc-today {
	background: #fff;
}

.fc-event {
	border-radius: 2px;
	border: none;
	cursor: move;
	font-size: 13px;
	margin: 1px 7px;
	padding: 5px;
	text-align: center;
}

.fc-basic-view td.fc-week-number span {
	padding-right: 8px;
	font-weight: 700;
	font-family: 'Rubik', sans-serif;
}

.fc-basic-view td.fc-day-number {
	padding-right: 8px;
	font-weight: 700;
	font-family: 'Rubik', sans-serif;
}

/*-----------------
	20. Profile
-----------------------*/

.card-box.profile-header {
	margin: 0;
}

.profile-details {
	text-align: center;
}

.personal-info li .title {
	color: #515365;
	float: left;
	font-weight: 500;
	margin-right: 30px;
	width: 30%;
	font-size: 14px;
}

.personal-info li .text {
	color: #888da8;
	display: block;
	overflow: hidden;
	font-size: 14px;
}

.personal-info li {
	margin-bottom: 10px;
}

.personal-info {
	list-style: none;
	margin-bottom: 0;
	padding: 0;
}

.personal-info .text>a {
	color: #3a57e8;
	font-size: 14px;
}

.profile-view .profile-img-wrap {
	height: 150px;
	width: 150px;
}

.profile-view .profile-img {
	width: 150px;
	height: 150px;
}

.profile-view .profile-img .avatar {
	font-size: 24px;
	height: 150px;
	line-height: 150px;
	margin: 0;
	width: 150px;
}

.profile-view .profile-basic {
	margin-left: 170px;
}

.staff-msg {
	margin-top: 30px;
}

.experience-box {
	position: relative;
}

.experience-list {
	list-style: none;
	margin: 0;
	padding: 0;
	position: relative;
}

.experience-list:before {
	background: #ddd;
	bottom: 0;
	content: "";
	left: 8px;
	position: absolute;
	top: 8px;
	width: 2px;
}

.experience-list>li {
	position: relative;
}

.experience-list>li:last-child .experience-content {
	margin-bottom: 0;
}

.experience-user .avatar {
	height: 32px;
	line-height: 32px;
	margin: 0;
	width: 32px;
}

.experience-list>li .experience-user {
	background: #fff;
	height: 10px;
	left: 4px;
	margin: 0;
	padding: 0;
	position: absolute;
	top: 4px;
	width: 10px;
}

.experience-list>li .experience-content {
	background-color: #fff;
	margin: 0 0 20px 40px;
	padding: 0;
	position: relative;
}

.experience-list>li .experience-content .timeline-content {
	color: #9e9e9e;
}

.experience-list>li .experience-content .timeline-content a.name {
	color: #616161;
	font-weight: bold;
	font-size: 14px;
}

.experience-list>li .time {
	color: #bdbdbd;
	display: block;
	font-size: 12px;
	line-height: 1.35;
}

.before-circle {
	background-color: #ddd;
	border-radius: 50%;
	height: 10px;
	width: 10px;
}

.skills>span {
	border: 1px solid #ccc;
	border-radius: 500px;
	display: block;
	margin-bottom: 10px;
	padding: 6px 12px;
	text-align: center;
}

.profile-info-left {
	border-right: 2px dashed #ccc;
}

.profile-info-left h3 {
	font-size: 20px;
}

.profile-info-left .staff-id {
	font-size: 15px;
}

.profile-tabs .nav-tabs {
	background-color: #fff;
	box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);
}

.alert {
	font-size: 14px;
}

/*-----------------
	21. Notifications
-----------------------*/

.notifications {
	padding: 0;
}

.notifications .drop-scroll {
	height: 290px;
	width: 400px;
}

.notifications.msg-noti .drop-scroll {
	width: 310px;
}

.notifications .notification-heading {
	margin: 0;
	font-size: 14px;
	font-weight: normal;
	line-height: 1.45;
	color: #616161;
}

.notifications .notification-time {
	font-size: 12px;
	line-height: 1.35;
	color: #bdbdbd;
}

.notification-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

.notifications ul.notification-list>li {
	margin-top: 0;
	border-bottom: 1px solid #f5f5f5;
}

.notifications ul.notification-list>li:last-child {
	border-bottom: none;
}

.notifications ul.notification-list>li a {
	display: block;
	padding: 12px;
	border-radius: 2px;
}

.notifications ul.notification-list>li a:hover {
	background-color: #fafafa;
}

.drop-scroll {
	overflow-y: scroll;
	position: relative;
}

.topnav-dropdown-header {
	border-bottom: 1px solid #eee;
	text-align: center;
}

.topnav-dropdown-header,
.topnav-dropdown-footer {
	font-size: 12px;
	height: 32px;
	line-height: 32px;
	padding-left: 12px;
	padding-right: 12px;
}

.topnav-dropdown-footer a {
	display: block;
	text-align: center;
	color: #333;
}

.user-menu.nav>li>a .badge {
	color: #fff;
	font-size: 60%;
	font-weight: 700;
	position: absolute;
	right: 3px;
	top: 6px;
}

.user-menu.nav>li>a>i {
	font-size: 16px;
	line-height: 55px;
}

.noti-details {
	color: #989c9e;
	margin: 0;
}

.noti-time {
	margin: 0;
}

.noti-title {
	color: #333;
}

/*-----------------
	22. Roles & Permissions
-----------------------*/

.roles-menu {
	margin-top: 20px;
}

.roles-menu>ul {
	background-color: #fff;
	border: 1px solid #eaeaea;
	border-radius: 4px;
	list-style: none;
	margin: 0;
	padding: 0;
}

.roles-menu>ul>li {
	display: block;
	position: relative;
}

.roles-menu>ul>li>a {
	border-left: 3px solid transparent;
	color: #333;
	display: block;
	padding: 10px 15px;
	position: relative;
}

.roles-menu>ul>li.active>a {
	border-color: #009efb;
	color: #009efb;
}

.roles-menu>ul>li>a:hover {
	border-color: #009efb;
	background-color: #eee;
}

.material-switch>input[type="checkbox"] {
	display: none;
}

.material-switch>label {
	cursor: pointer;
	height: 0px;
	position: relative;
	width: 40px;
}

.material-switch>label:before {
	background: rgb(0, 0, 0);
	box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.5);
	border-radius: 8px;
	content: '';
	height: 16px;
	margin-top: -8px;
	position: absolute;
	opacity: 0.3;
	transition: all 0.4s ease-in-out;
	width: 40px;
}

.material-switch>label:after {
	background: rgb(255, 255, 255);
	border-radius: 16px;
	box-shadow: 0px 0px 5px rgba(0, 0, 0, 0.3);
	content: '';
	height: 24px;
	left: -4px;
	margin-top: -8px;
	position: absolute;
	top: -4px;
	transition: all 0.3s ease-in-out;
	width: 24px;
}

.material-switch>input[type="checkbox"]:checked+label:before {
	background: inherit;
	opacity: 0.5;
}

.material-switch>input[type="checkbox"]:checked+label:after {
	background: inherit;
	left: 20px;
}

.role-action {
	display: none;
	float: right;
	position: absolute;
	right: 8px;
	top: 8px;
}

.roles-menu>ul>li:hover .role-action {
	display: block;
}

.slide-nav .sidebar {
	margin-left: 0;
}

.action-circle {
	background: transparent;
	border: 1px solid #ccc;
	border-radius: 100%;
	height: 20px;
	width: 20px;
	display: inline-block;
	text-align: center;
	cursor: pointer;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}

.action-circle .material-icons {
	color: #ccc;
	font-size: 18px;
	vertical-align: -3px;
}

.action-circle.completed {
	background: #35BA67;
	border: 1px solid #2fa65c;
}

.action-circle.completed .material-icons {
	color: #fff;
}

.action-circle.large {
	height: 24px;
	width: 24px;
}

.action-circle.large .material-icons {
	font-size: 16px;
	vertical-align: -4px;
}

.sidebar-overlay {
	display: none;
	position: fixed;
	z-index: 90;
	height: 100%;
	left: 0;
	top: 50px;
	width: 100%;
	z-index: 99;
	background-color: rgba(0, 0, 0, 0.6);
	overflow: hidden;
}

.menu-opened .sidebar-overlay {
	display: block;
}

.sidebar-menu.opened {
	opacity: 1;
	-webkit-transform: translateX(0px);
	-moz-transform: translateX(0px);
	-ms-transform: translateX(0px);
	-o-transform: translateX(0px);
	transform: translateX(0px);
	margin-left: 0;
}

html.menu-opened {
	overflow: hidden;
}

html.menu-opened body {
	overflow: hidden;
}

.chat-profile-view.opened {
	margin-right: 0;
}

.menu-opened .message-view.chat-view {
	width: 100%;
}

/*-----------------
	23. Chat Right Sidebar
-----------------------*/

.fixed-header .custom-menu {
	margin: 1px 0 0;
}

.topnav-dropdown-footer {
	border-top: 1px solid #eee;
}

.notification-box {
	bottom: 0;
	margin-right: -300px;
	position: fixed;
	right: 0;
	top: 70px;
	transition: all 0.4s ease 0s;
	width: 300px;
	z-index: 101;
	border-left: 1px solid #ddd;
}

.open-msg-box .notification-box {
	margin-right: 0;
}

.msg-sidebar {
	background-color: #fff;
}

.list-box {
	list-style: none;
	padding-left: 0;
}

.list-item.new-message {
	background-color: rgba(0, 0, 0, 0.2);
}

.list-item {
	border-bottom: 1px solid #eaeaea;
	padding: 10px;
	position: relative;
}

.list-left {
	height: 48px;
	position: absolute;
	width: 48px;
}

.files-icon {
	background-color: #f5f5f5;
	border: 1px solid #ddd;
	border-radius: 4px;
	display: inline-block;
	height: 38px;
	line-height: 38px;
	text-align: center;
	width: 38px;
}

.files-icon i {
	color: #777;
	font-size: 20px;
}

.list-body {
	padding: 0 0 0 50px;
}

.message-author {
	color: #333448;
	float: left;
	font-weight: bold;
	width: 175px;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
	font-size: 14px;
	font-weight: 600;
}

.message-time {
	color: #888;
	float: right;
	font-size: 11px;
}

.message-content {
	color: #333;
	font-size: 11px;
	display: block;
	max-width: 100%;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}

/*-----------------
	24. Invoice
-----------------------*/

.invoice-details,
.invoice-payment-details>li span {
	float: right;
	text-align: right;
}

.attach-files>ul {
	list-style: none;
	margin: 0;
	padding: 0;
}

.attach-files li {
	display: inline-block;
	margin-right: 10px;
	position: relative;
}

.attach-files li img {
	width: 50px;
}

.file-remove {
	color: #f00;
	position: absolute;
	right: -6px;
	top: -7px;
}

.attach-files li:last-child {
	margin-right: 0;
}

.inv-logo {
	height: auto;
	margin-bottom: 20px;
	max-height: 100px;
	width: auto;
}

.form-amt {
	border: 1px solid #fff;
}

.page-title-icon {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	width: 36px;
	height: 36px;
	border-radius: 4px;
	text-align: center;
}

.invoices-links:last-child {
	margin-right: 0px;
}

.invoices-links {
	color: #1B2559;
	margin-right: 20px;
}

.invoice-inner-datepic {
	border: 0;
	padding-left: 0;
}

.invoice-inner-datepic {
	border: 0;
	padding-left: 0;
}

.invoices-form .inovices-month-info .form-control {
	height: 42px;
}

.app-listing {
	padding: 0;
	margin: 0 -15px;
	list-style: none;
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}

.app-listing>li {
	width: 20%;
	padding-left: 10px;
	padding-right: 10px;
}

.multipleSelection {
	position: relative;
	margin-bottom: 20px;
}

.multipleSelection .selectBox,
.SortBy .selectBoxes {
	position: relative;
	background: #fff;
	width: 100%;
	padding: 11px 10px;
	font-weight: 400;
	background: #FFFFFF;
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
	display: flex;
	display: -ms-flexbox;
	align-items: center;
	justify-content: space-between;
	cursor: pointer;
}

.selectBox p {
	color: #1B2559;
	font-weight: 500;
	font-size: 14px;
}

.selectBox p .select-icon {
	color: #3a57e8;
	width: 20px;
	height: 20px;
}

.multipleSelection #checkBoxes,
.SortBy #checkBox {
	display: none;
	position: absolute;
	width: 300px;
	left: 0;
	z-index: 1;
	margin-top: 10px;
	padding: 20px;
	background: #FFFFFF;
	border: 1px solid #F2ECFF;
	box-shadow: 0px 4px 44px rgb(231 234 252 / 75%);
	border-radius: 6px;
}

.multipleSelection #checkBoxes::before,
.SortBy #checkBox::before {
	border: 7px solid #F2ECFF;
	border-color: transparent transparent #ffffff #ffffff;
	box-shadow: -2px 2px 2px -1px rgb(0 0 0 / 10%);
	content: "";
	left: 30px;
	position: absolute;
	top: 0;
	-webkit-transform-origin: 0 0;
	transform-origin: 0 0;
	-webkit-transform: rotate(135deg);
	transform: rotate(135deg);
}

.checkbox-title {
	font-weight: 600;
	font-size: 15px;
	color: #3a57e8;
	margin-bottom: 14px;
}

#checkBoxes .form-custom {
	margin-bottom: 14px;
}

.selectBox-cont {
	height: 220px;
	overflow-y: auto;
	padding: 5px;
}

#checkBoxes-one .btn-grey {
	background: #55ddff30;
	color: #1B2559;
	margin-top: 10px;
	border: none;
}

.custom_check {
	color: #1B2559;
	display: inline-block;
	position: relative;
	font-size: 13px;
	margin-bottom: 15px;
	padding-left: 30px;
	cursor: pointer;
	font-weight: 400;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.custom_check input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
}

.custom_check .checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 20px;
	width: 20px;
	border: 1px solid #C4C4C4;
	background-color: transparent;
	border-radius: 0;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.custom_check input:checked~.checkmark:after {
	display: block;
}

.custom_check .checkmark::after {
	content: "\f00c";
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	position: absolute;
	display: none;
	left: 5px;
	top: 2px;
	color: #ffffff;
	font-size: 9px;
}

#checkBoxes .btn,
#checkBox .btn {
	font-size: 13px;
	font-weight: 500;
	padding: 8px 0px;
}

#checkBoxes .btn-grey {
	background: #55ddff30;
	color: #1B2559;
	margin-top: 10px;
	border: none;
}

.feather {
	width: 18px;
	height: 18px;
}

.report-btn {
	margin-bottom: 20px;
}

.report-btn .btn {
	font-weight: 600;
	color: #3a57e8;
	background: #FFFFFF;
	border: 2px solid #3a57e8;
	border-radius: 8px;
	width: 100%;
	padding: 11px 0;
}

.selectBox-cont-one {
	overflow-y: inherit;
}

.date-picker {
	width: 50%;
	float: left;
	padding-right: 10px;
}

#checkBoxes .form-custom {
	margin-bottom: 14px;
}

#checkBoxes .date-picker .form-custom .form-control {
	padding-left: 10px;
}

.form-custom.cal-icon:after {
	font-size: 14px;
}

.date-list ul {
	padding: 0;
	margin: 0;
	list-style: none;
	text-align: center;
}

.date-list ul li {
	width: 100%;
	padding: 0;
	padding-bottom: 5px;
}

#checkBoxes .btn,
#checkBox .btn {
	font-size: 14px;
	font-weight: 500;
	padding: 8px 0px;
}

.date-list .date-btn {
	background: #fff;
	color: #1B2559;
	border: 1px solid #E7EAFC;
	border-radius: 4px;
	padding: 10px 0 !important;
	width: 100%;
}

.date-list .date-btn:hover {
	background: #00d3c7;
	color: #fff;
	border: 1px solid #E7EAFC;
}

.custom_check input:checked~.checkmark {
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.invoices-tabs-card {
	background: transparent;
	box-shadow: none;
	border: 0;
}

.inovices-card .card-body {
	padding: 15px;
}

.invoices-main-tabs {
	border-bottom: 2px solid #F3F3F3;
	padding-bottom: 10px;
}

.invoices-tabs ul {
	padding: 0;
	margin: 0;
	list-style: none;
}

.invoices-tabs ul li {
	position: relative;
	display: inline-block;
	margin-right: 36px;
}

.invoices-tabs ul li a.active {
	color: #3a57e8;
	border-bottom: 2px solid #3a57e8;
}

.invoices-settings-btn {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: end;
	-webkit-justify-content: end;
	-ms-flex-pack: end;
}

.invoices-settings-icon {
	color: #3a57e8;
	margin-right: 20px;
}

.invoices-settings-btn .btn {
	font-weight: 600;
	color: #fff;
	background-color: #3a57e8;
	padding: 12px 0;
	min-width: 167px;
	border: 1px solid #3a57e8;
	border-radius: 6px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.inovices-card {
	border-radius: 5px;
}

.inovices-widget-header {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.inovices-widget-icon img {
	width: 50px;
}

.inovices-widget-header .inovices-amount {
	font-weight: 600;
	font-size: 20px;
	color: #3a57e8;
}

.inovices-all {
	font-weight: 500;
	color: #1B2559;
	margin-top: 16px;
}

.inovices-all span {
	font-size: 10px;
	margin-left: 15px;
}

.invoices-tabs ul li a {
	font-weight: 500;
	font-size: 15px;
	color: #1B2559;
	padding-bottom: 24px;
}

table .badge {
	border-radius: 6px;
	display: inline-block;
	font-size: 13px;
	min-width: 105px;
	padding: 8px 20px;
	font-weight: 500;
	text-align: center;
}

.bg-primary-light {
	background-color: rgba(17, 148, 247, 0.12) !important;
	color: #2196f3 !important;
}

.bg-success-light {
	background-color: rgba(15, 183, 107, 0.12) !important;
	color: #26af48 !important;
}

.bg-danger-light {
	background-color: rgb(255 218 218 / 49%) !important;
	color: #FF0000 !important;
}

.table .invoice-link {
	color: #009efb;
}

.invoices-links.active {
	color: #3a57e8;
}

.invoices-links:last-child {
	margin-right: 0px;
}

.invoices-links {
	color: #1B2559;
	margin-right: 20px;
}

.table .bg-success-dark {
	background: #008F64;
}

.table .bg-danger-dark {
	background: #FF0000;
}

.invoices-grid-card {
	background: #FFFFFF;
	box-shadow: 0px 4px 24px rgb(228 228 228 / 25%);
	border-radius: 10px;
	color: #1B2559;
}

.invoices-grid-card .card-header {
	padding: 20px;
	border: 0;
}

.invoice-grid-link {
	color: #1B2559;
	font-size: 14px;
}

.card-middle {
	padding: 20px;
	background: #55ddff30;
}

.card-middle-avatar {
	align-items: center;
	display: inline-flex;
	font-size: 15px;
	margin: 0;
}

.card-middle-avatar a {
	color: #1B2559;
}

.invoices-grid-card .card-body {
	padding: 20px;
}

.invoices-grid-card .card-body span {
	font-size: 14px;
}

.invoices-grid-card .card-footer {
	padding: 20px;
	border: 0;
}

.card-footer:last-child {
	border-bottom-left-radius: 20px;
	border-bottom-right-radius: 20px;
}

.invoices-settings-btn .btn svg {
	margin-right: 10px;
}

.preclincs-title {
	margin: 0;
	padding: 10px;
	display: flex;
	align-items: center;
}

.report-btn .btn:hover {
	color: #FFFFFF;
	background: #3a57e8;
	border: 2px solid #3a57e8;
}

.report-btn .btn:hover img {
	filter: invert(0) brightness(100);
}

.invoices-settings-btn .btn:hover {
	background: #00d3c7;
	border: 1px solid #00d3c7;
}

.invoices-tabs>ul>li>a:hover {
	color: #3a57e8;
}

a.invoices-settings-icon:hover {
	color: #00d3c7;
}

a.btn.delete-invoice-btn:hover {
	background: #474d52;
}

a.btn.save-invoice-btn:hover {
	background: #00d3c7;
}

a.invoices-preview-link:hover {
	color: #00d3c7;
}

li.breadcrumb-item.invoices-breadcrumb-item:hover>a {
	color: #00d3c7;
}

li.breadcrumb-item.invoices-breadcrumb-item:hover>a i {
	background: #00d3c7;
}

.invoice-info>strong>a:hover {
	color: #00d3c7;
}

.invoice-inner-head span a:hover {
	color: #00d3c7;
}

.field-box>a:hover {
	background: #00d3c7;
}

.invoice-total-inner a:hover {
	color: #00d3c7;
}

h2.card-middle-avatar:hover>a {
	color: #00d3c7;
}

.upload-sign button:hover {
	background: #00d3c7;
}

.payment-details:hover {
	background: #00d3c7;
}

.invoices-upload-btn:hover .upload {
	background-color: #00d3c7;
}

.invoice-setting-btn .cancel-btn:hover {
	background-color: #474d52;
}

.invoice-setting-btn button:last-child:hover {
	background-color: #00d3c7;
}

.settings-btns button:nth-child(1):hover {
	background-color: #00d3c7;
}

.settings-btn:hover .upload {
	background-color: #00d3c7;
}

.nav-tabs.menu-tabs .nav-link:hover {
	background: #3a57e8;
	color: #fff;
}

.form-row.links-cont a:hover {
	background: #00d3c7;
}

.form-row.links-cont button:hover {
	background: #00d3c7;
}

a.btn.add-links:hover {
	background: #00d3c7;
}

.breadcrumb-item a:hover {
	color: #00d3c7;
}

.breadcrumb-item.active {
	color: rgba(46, 55, 164, 0.5);
}

.breadcrumb-item+.breadcrumb-item::before {
	display: none;
}

.breadcrumb-item+.breadcrumb-item i {
	color: #3a57e8;
}

/*-----------------
	25. Doctors
-----------------------*/

.doctor-img {
	cursor: pointer;
	height: 80px;
	margin: 0 auto 15px;
	position: relative;
	width: 80px;
}

.doctor-img .avatar {
	font-size: 24px;
	height: 80px;
	line-height: 80px;
	margin: 0;
	width: 80px;
}

.doc-prof {
	color: #777;
	font-size: 12px;
	margin-bottom: 10px;
}

.doctor-name {
	margin: 0;
}

.doctor-name a {
	color: #333;
}

.see-all {
	margin-top: 30px;
	text-align: center;
}

.see-all .see-all-btn {
	border: 1px solid #e2e2e2;
	border-radius: 5px;
	box-shadow: 0 0 15px rgba(0, 0, 0, 0.1);
	color: #777;
	display: inline-block;
	padding: 10px 20px;
}

.comman-table.custom-table thead tr th,
.comman-table.custom-table tbody tr td {
	color: #333448;
	font-size: 14px;
	font-weight: 500;
}

.comman-table.custom-table thead tr th {
	font-weight: 600;
}

.show-entire .dataTables_length {
	display: none;
}

.doctor-table-blk h3 {
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0;
}

.doctor-table-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}

.doctor-search-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	flex-wrap: wrap;
}

.doctor-search-blk .top-nav-search {
	margin-left: 15px;
}

.doctor-search-blk .top-nav-search form {
	margin: 0px;
}

.add-group {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.add-group .btn-primary {
	background: rgba(58 87 232 / 6%);
	border-radius: 12px;
	color: #3a57e8;
	width: 40px;
	height: 40px;
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.add-group .btn-primary:hover {
	border: 0;
	background: #3a57e8;
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
}

.add-group .btn-primary:hover img {
	filter: invert(1) brightness(100);
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
}

.table.comman-table>thead>tr>th,
.table.comman-table>tbody>tr>td {
	padding: 15px 15px;
}

.card-table .card-body {
	padding: 0;
}

.page-table-header {
	padding: 15px 15px 0px 15px;
}

.card-table .dataTables_info {
	padding-left: 15px;
	font-size: 14px;
}

.profile-image a {
	color: #333448;
}

.profile-image a:hover {
	color: #3a57e8;
}

/*-----------------
	26. Add Doctor
-----------------------*/

.profile-upload {
	display: flex;
}

.upload-img {
	margin-right: 10px;
}

.upload-img img {
	border-radius: 4px;
	height: 40px;
	width: 40px;
}

.upload-input {
	width: 100%;
}

.gen-label {
	display: block;
	margin-bottom: 18px;
}

.submit-btn {
	border-radius: 50px;
	color: #fff;
	font-size: 15px;
	font-weight: 500;
	min-width: 200px;
	padding: 8px 20px;
	text-transform: uppercase;
}

.delete-modal .modal-body .btn {
	font-size: 16px;
	font-weight: bold;
	text-transform: uppercase;
	width: 90px;
	color: #333;
}

.delete-modal .modal-body .btn.btn-danger {
	color: #fff;
}

.delete-modal .modal-body>h3 {
	font-size: 16px;
	font-weight: bold;
	margin: 15px 0 0;
}

.custom-badge {
	border-radius: 8px;
	display: inline-block;
	font-size: 12px;
	min-width: 115px;
	padding: 5px 15px;
	text-align: center;
	border: 0;
}

.status-red,
a.status-red {
	background-color: #ffe5e6;
	color: #fe0000;
}

.status-green,
a.status-green {
	background: rgba(0, 211, 199, 0.1);
	color: #00D3C7;
}

.status-orange,
a.status-orange {
	background-color: #fef5e4;
	color: #ff9b01;
}

.status-blue,
a.status-blue {
	background-color: #e5f3fe;
	color: #008cff;
}

.status-purple,
a.status-purple {
	background-color: #f3e7fd;
	color: #8f13fd;
}

.status-pink,
a.status-pink {
	background-color: #ffe5f6;
	color: #ff01a2;
}

.status-grey,
a.status-grey {
	background-color: #ddd;
	color: #818181;
}

.btn-grey {
	background-color: #b2b2b2;
	border: 1px solid #b2b2b2;
}

.modal-backdrop {
	background-color: #fff;
}

.modal-backdrop.show {
	opacity: 0.9;
}

.invoices-view {
	width: 70%;
	float: right;
}

.local-forms.input-block {
	position: relative;
	margin-bottom: 30px;
}

.local-forms label {
	font-size: 12px;
	color: #333448;
	font-weight: 500;
	position: absolute;
	top: -10px;
	left: 10px;
	background: #fff;
	margin-bottom: 0;
	padding: 0px 5px;
	z-index: 99;
}

.local-forms .select2-container .select2-selection--single {
	height: 45px;
}

.local-forms .select2-container--default .select2-selection--single .select2-selection__rendered {
	line-height: 45px;
}

.local-forms .select2-container--default .select2-selection--single .select2-selection__arrow {
	height: 42px;
}

.form-heading h4 {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 30px;
}

.select-gender .gen-label {
	margin-bottom: 5px;
	color: #333448;
	font-size: 12px;
	font-weight: 500;
}

.select-gender .form-check-label {
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
	font-size: 14px;
}

.select-gender .form-check-input {
	width: 12px;
	height: 12px;
	margin-right: 5px;
	vertical-align: middle;
	margin-top: 0;
}

.local-top-form {
	position: relative
}

.local-top-form .local-top {
	font-size: 12px;
	color: #333448;
	font-weight: 500;
	position: absolute;
	top: -10px;
	left: 10px;
	background: #fff;
	margin-bottom: 0;
	padding: 0px 5px;
	z-index: 99;
}

.settings-btn.upload-files-avator .upload {
	width: 148px;
	background: #F4F5FA;
	color: #3a57e8;
	font-size: 14px;
	font-weight: 500;
	right: -2px;
	top: -2px;
	height: 46px;
}

.settings-btn.upload-files-avator {
	min-height: 45px;
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
}

.doctor-submit .btn-primary {
	min-width: 131px;
	font-size: 14px;
	font-weight: 500;
	border-radius: 12px;
	padding: 10px 15px;
}

.doctor-submit .cancel-form {
	background: rgba(51, 52, 72, 0.05);
	color: #333448;
}

.doctor-submit .cancel-form:hover {
	background: #3a57e8;
	color: #fff;
	border: 1px solid #3a57e8;
}

.calendar-icon:after {
	color: #333448;
	content: '\f073';
	display: block;
	font-family: "Font Awesome 6 Free";
	font-size: 16px;
	font-weight: 600;
	margin: auto;
	position: absolute;
	right: 15px;
	bottom: 10px;
}

.top-nav-search.table-search-blk .btn {
	min-height: 45px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

/*-----------------
	Doctor Profile
-----------------------*/

.doctor-profile-head {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 10px;
}

.profile-bg-img img {
	width: 100%;
	border-radius: 10px;
}

.profile-user-box {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	padding-left: 30px;
}

.profile-user-img {
	margin-right: 20px;
	position: relative;
	top: -30px;
}

.profile-user-img img {
	border-radius: 50%;
	width: 141px;
}

.names-profiles h4 {
	font-size: 18px;
	font-weight: 500;
	margin-bottom: 3px;
}

.names-profiles h5 {
	font-size: 14px;
	font-weight: 500;
	color: #3a57e8;
	margin-bottom: 0;
}

.profile-edit-icon {
	position: absolute;
	border-radius: 50px;
	bottom: 0;
	left: 50%;
	-webkit-transform: translate(-50%, -50%);
	-ms-transform: translate(-50%, -50%);
	transform: translate(-50%, -50%);
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	transition: all 0.5s ease;
	-moz-transition: all 0.5s ease;
	-o-transition: all 0.5s ease;
	-ms-transition: all 0.5s ease;
	-webkit-transition: all 0.5s ease;
}

.profile-edit-icon img {
	width: 25px;
}

.follow-group {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.doctor-follows {
	text-align: center;
}

.doctor-follows h5 {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0;
}

.doctor-follows h4 {
	font-size: 20px;
	font-weight: 600;
	margin-bottom: 0;
}

.follow-btn-group {
	width: 100%;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.follow-btn-group .btn-info {
	min-width: 127px;
	font-size: 16px;
	font-weight: 500;
	color: #fff;
	border-radius: 10px;
	padding: 9px 15px;
}

.follow-btn-group .follow-btns {
	background: #3a57e8;
	border: 1px solid #3a57e8;
	margin-right: 15px;
}

.follow-btn-group .follow-btns:hover {
	background: #00D3C7;
	border: 1px solid #00D3C7;
}

.follow-btn-group .message-btns {
	background: #00D3C7;
	border: 1px solid #00D3C7;
}

.follow-btn-group .message-btns:hover {
	background: #3a57e8;
	border: 1px solid #3a57e8;
}

.personal-activity {
	margin-bottom: 20px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.views-personal {
	margin-left: 10px;
}

.views-personal h5 {
	color: rgba(51, 53, 72, 0.5);
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
}

.views-personal h4 {
	font-size: 14px;
	font-weight: 500;
	margin-bottom: 0;
}

.personal-icons {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	border-radius: 8px;
	width: 40px;
	height: 40px;
}

.personal-icons i {
	color: #3D5EE1;
}

.doctor-personals-grp .card {
	border-radius: 10px;
	box-shadow: none;
}

.heading-detail h4 {
	font-size: 16px;
	font-weight: 500;
	margin-bottom: 25px;
}

.heading-detail p {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
}

.hello-park h5 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 20px;
	padding-bottom: 20px;
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
}

.hello-park p {
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}

.skills-head {
	margin-bottom: 10px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.skills-head h5 {
	margin-bottom: 0;
	font-size: 15px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}

.skills-head p {
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
	font-size: 15px;
	font-weight: 500;
}

.skill-statistics {
	margin-bottom: 25px;
}

.skill-statistics .progress {
	height: 4px;
}

.bg-operations {
	background: #3a57e8;
}

.bg-statistics {
	background: #00D3C7;
}

.bg-haemoglobin {
	background: #FF3667;
}

.bg-endoscopic {
	background: #FFBF42;
}

.bg-visit {
	background: #333548;
}

.setting-form-blk .local-forms label {
	font-size: 12px;
	color: rgba(51, 52, 72, 0.5);
}

.setting-form-blk .local-forms .form-control::placeholder {
	color: rgba(51, 52, 72, 0.5);
	font-size: 14px;
}

.about-info h4 {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	font-size: 18px;
	font-weight: 500;
}

.about-info h4 i {
	color: #8C8C8C;
	background: rgba(51, 53, 72, 0.05);
	border-radius: 10px;
	width: 31px;
	height: 31px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.about-info {
	margin-bottom: 25px;
}

.doctor-up-files label {
	font-size: 15px;
	font-weight: 500;
}

.doctor-up-files label.file-upload.image-upbtn {
	background: #444;
	border: 1px solid #444;
	border-radius: 8px;
	color: #fff;
	padding: 6px 19px;
	font-size: 14px;
	font-weight: 500;
	cursor: pointer;
}

.doctor-up-files label.file-upload.image-upbtn:hover {
	background: #000;
	border: 1px solid #000;
}

.doctor-up-files label.file-upload {
	position: relative;
	overflow: hidden;
}

.doctor-up-files label.file-upload input[type="file"] {
	position: absolute;
	top: 0;
	right: 0;
	min-width: 100%;
	min-height: 100%;
	font-size: 100px;
	text-align: right;
	filter: alpha(opacity=0);
	opacity: 0;
	outline: none;
	background: white;
	cursor: inherit;
	display: block;
}

.doctor-up-files.profile-edit-icon label.file-upload.profile-upbtn {
	cursor: pointer;
}

.list-space {
	padding: 0;
	margin: 0;
}

.about-me-list ul li {
	list-style: none;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 30px;
}

.about-me-list ul li:last-child {
	margin-bottom: 0;
}

.about-me-list ul li h4 {
	min-width: 50%;
	margin-bottom: 0;
	font-size: 15px;
	font-weight: 500;
}

.about-me-list ul li span {
	min-width: 50%;
	font-size: 14px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}

.tab-content-set {
	border-bottom: 4px solid rgba(58 87 232 / 6%);
	padding-bottom: 25px;
	margin-bottom: 25px;
}

.tab-content-set ul li a.active::after,
.tab-content-set ul li a:hover::after {
	position: absolute;
	content: "";
	background: #3a57e8;
	width: 100%;
	height: 4px;
	left: 0;
	bottom: -29px;
}

.tab-content-set ul li a.active,
.tab-content-set ul li a:hover {
	color: #3a57e8;
}

.tab-content-set ul li a.active .set-about-icon,
.tab-content-set ul li a:hover .set-about-icon {
	background: rgba(58 87 232 / 6%);
}

.tab-content-set ul li a.active .set-about-icon img,
.tab-content-set ul li a:hover .set-about-icon img {
	filter: invert(13%) sepia(85%) saturate(7478%) hue-rotate(266deg) brightness(50%) contrast(340%);
}

.tab-content-set li a {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	color: rgba(51, 53, 72, 0.5);
	font-size: 15px;
	font-weight: 600;
	position: relative;
}

.tab-content-set li {
	padding-right: 20px;
}

.set-about-icon {
	background: rgba(51, 53, 72, 0.05);
	border-radius: 8px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.detail-personal h2 {
	font-size: 15px;
	font-weight: 500;
}

.detail-personal h3 {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
	margin-bottom: 0;
}

.personal-list-out {
	margin-bottom: 30px;
}

.profile-table.custom-table thead tr th,
.profile-table.custom-table tbody tr td {
	font-size: 14px;
	color: #333548;
	font-weight: 500;
	padding: 10px;
}

.profile-table.custom-table thead tr th {
	color: #333548;
}

.profile-table.custom-table tbody tr td {
	color: rgba(51, 53, 72, 0.5);
}

.profile-table.custom-table tbody tr {
	box-shadow: none;
}

.profile-check-blk .remember-me {
	margin-bottom: 20px;
}

.profile-check-blk .custom_check input:checked~.checkmark {
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.profile-check-blk .form-heading h4 {
	font-size: 16px;
}

.patient-profile-table tbody tr td:nth-child(4) {
	color: rgba(51, 52, 72, 0.5);
}

/*-----------------
	Staffs
-----------------------*/

.staff-search-table {
	padding: 0px 15px;
	margin-top: 30px;
}

.submit-list-form {
	width: 100%;
}

.status-staff {
	background: #FFFFFF;
	border: 1px solid rgba(46, 55, 164, 0.1);
	box-shadow: 5px 5px 20px rgba(51, 52, 72, 0.05);
	border-radius: 12px;
	padding: 0;
}

.status-staff .dropdown-item {
	border-bottom: 1px solid #EBEBF6;
	font-size: 12px;
	padding: 10px;
	text-align: center;
}

.status-staff .dropdown-item:last-child {
	border: 0;
}

/*-----------------
	27. Payslip
-----------------------*/

.payslip-title {
	margin-bottom: 20px;
	text-align: center;
	text-decoration: underline;
	text-transform: uppercase;
}

.pay-head-roll h5 {
	color: #3a57e8;
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 20px;
}

.invoice-counts {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.payroll-head-clinic {
	margin-bottom: 20px;
}

.payrolss-counts {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.payrolss-counts h5 {
	margin-bottom: 0;
	font-weight: 600;
	font-size: 16px;
}

.payslip-head-roll h5 {
	font-weight: 600;
	font-size: 18px;
	margin-bottom: 20px;
}

/*-----------------
	28. Attendance
-----------------------*/

.half-day {
	width: 15px;
}

/*-----------------
	29. Inbox
-----------------------*/

.table-inbox input[type="radio"],
.table-inbox input[type="checkbox"] {
	cursor: pointer;
}

.mail-list {
	list-style: none;
	padding: 0;
}

.mail-list>li>a {
	color: #333;
	display: block;
	padding: 10px;
}

.mail-list>li.active>a {
	color: #009efb;
	font-weight: bold;
}

.unread .name,
.unread .subject,
.unread .mail-date {
	color: #000;
	font-weight: 600;
}

.table-inbox .starred.fa-star {
	color: #ffd200;
}

.table.table-inbox>tbody>tr>td,
.table.table-inbox>tbody>tr>th,
.table.table-inbox>tfoot>tr>td,
.table.table-inbox>tfoot>tr>th,
.table.table-inbox>thead>tr>td,
.table.table-inbox>thead>tr>th {
	border-bottom: 1px solid #f2f2f2;
	border-top: 0;
}

.table-inbox {
	font-size: 14px;
	margin-bottom: 0;
}

.note-editor.note-frame {
	border: 1px solid #ccc;
	box-shadow: inherit;
}

.note-editor.note-frame .note-statusbar {
	background-color: #fff;
}

.note-editor.note-frame.fullscreen {
	top: 60px;
}

.mail-title {
	font-weight: bold;
	text-transform: uppercase;
}

.form-control.search-message {
	border-radius: 4px;
	margin-left: 5px;
	width: 180px;
	padding: 0.375rem 0.75rem;
	min-height: 35px;
	margin-bottom: 5px;
}

.table-inbox tr {
	cursor: pointer;
}

table.table-inbox tbody tr.checked {
	background-color: #ffffcc;
}

.mail-label {
	margin-right: 5px;
}

/*-----------------
	29. Mail View
-----------------------*/

.attachments {
	list-style: none;
	margin: 0;
	padding: 0;
}

.attachments li {
	border: 1px solid #eee;
	float: left;
	margin-bottom: 10px;
	margin-right: 10px;
	width: 200px;
}

.attach-file {
	color: #777;
	font-size: 70px;
	padding: 10px;
	text-align: center;
	min-height: 153px;
}

.attach-file>i {
	line-height: 133px;
}

.attach-info {
	background-color: #f4f4f4;
	padding: 10px;
}

.attach-filename {
	color: #777;
	font-weight: bold;
}

.attach-filesize {
	color: #999;
	font-size: 12px;
}

.attach-file img {
	height: auto;
	max-width: 100%;
}

.mailview-header {
	border-bottom: 1px solid #ddd;
	margin-bottom: 20px;
	padding-bottom: 15px;
}

.mailview-footer {
	border-top: 1px solid #ddd;
	margin-top: 20px;
	padding-top: 15px;
}

.mailview-footer .btn-white {
	min-width: 102px;
}

.sender-name {
	display: block;
}

.receiver-name {
	color: #777;
}

.right-action {
	text-align: right;
}

.mail-view-title {
	font-weight: 500;
	font-size: 24px;
	margin: 0;
}

.mail-view-action {
	float: right;
}

.mail-sent-time {
	float: right;
}

/*-----------------
	31. Blog
-----------------------*/

.blog {
	position: relative;
	margin: 0 0 25px;
	background: #FFFFFF;
	border-radius: 12px;
	padding: 20px;
}

.blog-image {
	overflow: hidden;
}

.blog-image,
.blog-image>a,
.blog-image img {
	display: block;
	position: relative;
	width: 100%;
	height: auto;
}

.blog-image img {
	-moz-transform: scaleY(1);
	-webkit-transform: scaleY(1);
	-o-transform: scaleY(1);
	-ms-transform: scaleY(1);
	transform: scaleY(1);
	-moz-transition: all 0.5s ease-in-out 0s;
	-ms-transition: all 0.5s ease-in-out 0s;
	-o-transition: all 0.5s ease-in-out 0s;
	-webkit-transition: all 0.5s ease-in-out 0s;
	transition: all 0.5s ease-in-out 0s;
	border-radius: 16px;
}

.blog-image a:hover img {
	-moz-transform: scale(1.1);
	-webkit-transform: scale(1.1);
	-o-transform: scale(1.1);
	-ms-transform: scale(1.1);
	transform: scale(1.1);
}

.blog-image {
	margin-bottom: 30px;
}

.blog-content {
	position: relative;
}

.blog-title {
	color: #000;
	font-weight: normal;
	margin: 0 0 20px;
}

.media {
	display: flex;
	align-items: center;
}

.blog-content p {
	color: rgba(51, 52, 72, 0.75);
	font-size: 14px;
	line-height: 25px;
	margin: 0 0 25px;
}

.read-more {
	color: #282628;
	display: inline-block;
	font-size: 14px;
	margin-bottom: 20px;
}

.read-more:hover {
	color: #009efb;
	margin-left: 10px;
	-moz-transition: all 0.2s linear 0s;
	-ms-transition: all 0.2s linear 0s;
	-o-transition: all 0.2s linear 0s;
	-webkit-transition: all 0.2s linear 0s;
	transition: all 0.2s linear 0s;
}

.read-more i {
	color: #3a57e8;
	font-size: 18px;
	margin-right: 3px;
}

.blog-info {
	border: 1px solid #eaeaea;
	color: #909090;
	font-size: 12px;
	margin-bottom: 0;
	padding: 12px 20px;
}

.blog-info a {
	color: #909090;
	margin-right: 5px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.blog-info a:last-child {
	margin-right: 0;
}

.blog-info a:hover {
	color: #00d3c7;
}

.blog-info i {
	color: rgba(51, 52, 72, 0.5);
	font-size: 18px;
	margin-right: 5px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
}

.post-left {
	float: right;
}

.post-right {
	float: left;
}

.post-left ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.post-left ul li {
	float: left;
	margin-right: 20px;
}

.post-left ul li:last-child {
	margin-right: 0;
}

.video {
	position: relative;
	padding-bottom: 56%;
	height: 0;
	overflow: hidden;
}

.video iframe,
.video object,
.video embed {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	border: none;
}

.widget {
	margin-bottom: 30px;
	background: #FFFFFF;
	border-radius: 10px;
	padding: 20px;
}

.widget h5 {
	color: #333548;
	font-size: 18px;
	font-weight: 500;
	margin: 0 0 20px;
}

.search-form .form-control {
	border: 1px solid #eaeaea;
	border-radius: 0;
	border-right: 0;
	box-shadow: inherit;
	height: 40px;
	color: #ababab;
}

.search-form .btn-primary {
	background-color: transparent;
	border-color: #eaeaea;
	border-left: none;
	color: #009efb;
	height: 40px;
	border-radius: 0;
}

.latest-posts {
	margin: 0;
	padding: 0;
}

.latest-posts li {
	display: table;
	width: 100%;
	padding-bottom: 15px;
	margin-bottom: 15px;
	border-bottom: 1px solid #eee;
}

.latest-posts li:last-child {
	padding-bottom: 0px;
	margin-bottom: 0px;
	border-bottom: none;
}

.post-thumb {
	width: 80px;
	float: left;
	overflow: hidden;
	border-radius: 16px;
}

.post-thumb a img {
	-moz-transform: scale(1);
	-webkit-transform: scale(1);
	-o-transform: scale(1);
	-ms-transform: scale(1);
	transform: scale(1);
	-moz-transition: all 0.3s ease-in-out 0s;
	-ms-transition: all 0.3s ease-in-out 0s;
	-o-transition: all 0.3s ease-in-out 0s;
	-webkit-transition: all 0.3s ease-in-out 0s;
	transition: all 0.3s ease-in-out 0s;
	border-radius: 16px;
}

.post-thumb a:hover img {
	-moz-transform: scale(1.2);
	-webkit-transform: scale(1.2);
	-o-transform: scale(1.2);
	-ms-transform: scale(1.2);
	transform: scale(1.2);
}

.post-info {
	margin-left: 95px;
}

.post-info h4 {
	font-size: 14px;
	font-weight: normal;
	line-height: 18px;
	margin: 0 0 10px;
}

.post-info h4 a {
	color: #333448;
	font-size: 14px;
	font-weight: 600;
}

.post-info p {
	color: #3a57e8;
	font-size: 12px;
	margin: 0;
	font-weight: 500;
}

.post-info p i {
	color: #3a57e8;
	font-size: 16px;
	margin-right: 4px;
	position: relative;
	top: 2px;
}

.categories {
	list-style: none;
	margin: 0;
	padding: 0;
}

.categories li {
	padding: 12px 0;
	font-size: 16px;
	color: #333448;
	font-weight: 600;
}

.categories li:last-child {
	padding-bottom: 0px;
	border-bottom: none;
}

.categories li a {
	color: #656565;
	font-size: 14px;
}

.categories li a:hover {
	color: #009efb;
	margin-left: 10px;
	-moz-transition: all 0.2s linear 0s;
	-ms-transition: all 0.2s linear 0s;
	-o-transition: all 0.2s linear 0s;
	-webkit-transition: all 0.2s linear 0s;
	transition: all 0.2s linear 0s;
}

.categories>li>a>i {
	color: #009efb;
	font-size: 18px;
	margin-right: 10px;
}

.tags {
	list-style: none;
	margin: 0;
	overflow: hidden;
	padding: 0;
}

.tags li {
	float: left;
}

.tag {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	color: #333448;
	display: inline-block;
	padding: 5px 10px;
	position: relative;
	margin: 0 10px 10px 0;
	text-decoration: none;
	-moz-transition: color 0.2s;
	-ms-transition: color 0.2s;
	-o-transition: color 0.2s;
	-webkit-transition: color 0.2s;
	transition: color 0.2s;
	font-size: 12px;
	font-weight: 500;
}

.tag:hover {
	background-color: #3a57e8;
	color: #fff;
}

.comment-by {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	font-size: 14px;
	line-height: 21px;
	margin: 0 0 10px;
}

.comments-list .comment-block p {
	font-size: 12px;
	line-height: 20px;
	margin: 0;
	text-align: justify;
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
}

blockquote p {
	font-style: italic;
	font-weight: 400;
}

.grid-blog .blog-title {
	font-size: 16px;
	margin: 0 0 10px;
}

.grid-blog .blog-title a {
	color: #333448;
	font-size: 16px;
	font-weight: 500;
}

.grid-blog .blog-content p {
	font-size: 14px;
	margin: 0 0 15px;
	color: rgba(51, 52, 72, 0.5);
}

.grid-blog .blog-info {
	border: 0;
	border-top: 1px solid #eaeaea;
	margin-bottom: 0;
	padding: 12px 0;
}

.grid-blog .blog-image {
	margin-bottom: 20px;
	border-radius: 16px;
}

.grid-blog .read-more {
	font-size: 14px;
	margin-bottom: 0px;
	color: #3a57e8;
	font-weight: 500;
}

.product-thumbnail {
	position: relative;
	margin-bottom: 0;
	margin-top: 10px;
}

.product-remove {
	position: absolute;
	top: -10px;
	right: -6px;
	color: #f06060;
	cursor: pointer;
}

.bootstrap-tagsinput {
	width: 100%;
	height: auto;
	box-shadow: inherit;
	border-radius: 8px;
	line-height: 30px;
}

.bootstrap-tagsinput .badge [data-role="remove"]:hover {
	box-shadow: inherit;
	color: #f00;
}

.blog-views {
	position: absolute;
	top: 20px;
	left: 15px;
	background: #F5F6FA;
	border-radius: 6px;
	padding: 4px 10px;
	display: flex;
	display: -ms-flexbox;
	align-items: center;
	font-size: 12px;
}

.blog-views h5 {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 600;
	margin-bottom: 0;
}

.view-blog-list.blog-views {
	bottom: 20px;
	top: inherit;
}

.blog-views li {
	color: #3a57e8;
	font-weight: 600;
}

.blog-views li:first-child {
	margin-right: 10px;
}

.blog-grp-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	margin-bottom: 25px;
}

.blog-img-blk {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
}

.content-blk-blog h4 a {
	font-size: 15px;
	font-weight: 600;
	color: #333448;
}

.content-blk-blog h4 {
	margin-bottom: 0;
}

.content-blk-blog h5 {
	font-size: 12px;
	font-weight: 500;
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
}

.blog-grp-blk span {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 500;
}

.blog-grp-blk img {
	width: 40px;
	height: 40px;
	border-radius: 50px;
}

/*-----------------
	32. Blog View
-----------------------*/

.blog-view .blog-title {
	font-size: 18px;
	font-weight: 500;
}

.blog-view .blog-info {
	border: 0 none;
	margin-bottom: 20px;
	padding: 0;
}

.social-share {
	float: left;
	list-style: none;
	margin: 5px 0 0;
	padding: 0;
}

.social-share>li {
	display: inline-block;
	float: left;
	margin-left: 10px;
	text-align: center;
}

.social-share>li:first-child {
	margin-left: 0;
}

.social-share>li>a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	color: #009efb;
	font-size: 22px;
	height: 40px;
	width: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.social-share>li>a:hover {
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.social-share>li>a:hover img {
	filter: invert(1) brightness(100);
}

.share-blogs a {
	background: rgba(51, 52, 72, 0.05);
	border-radius: 8px;
	color: #009efb;
	font-size: 22px;
	height: 40px;
	width: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.blog-share {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.widget h3 {
	color: #333448;
	font-size: 18px;
	margin: 0 0 20px;
}

.blog-reply>a {
	color: #3a57e8;
	font-size: 12px;
	font-weight: 500;
}

.blog-date {
	color: #999;
	font-size: 12px;
}

.comments-list {
	list-style: none;
	margin: 0;
	padding: 0;
}

.comments-list li {
	clear: both;
	padding: 10px 0 0 50px;
}

.comments-list li .comment {
	margin-bottom: 30px;
}

.comments-list li .comment-author {
	margin-left: -50px;
	position: absolute;
}

.comments-list li img.avatar {
	height: 40px;
	width: 40px;
	border-radius: 58px;
}

.blog-author-name {
	color: #009efb;
	font-size: 18px;
}

.text-red {
	color: #f00;
}

.new-comment label {
	font-size: 14px;
	font-weight: 500;
}

.new-comment .input-block {
	margin-bottom: 20px;
}

.comment-submit .btn {
	background-color: #009efb;
	border-color: #009efb;
	border-radius: 0;
	font-size: 18px;
	padding: 8px 26px;
	color: #fff;
}

.about-author-img {
	background-color: #fff;
	height: 120px;
	overflow: hidden;
	position: absolute;
	width: 120px;
}

.author-details {
	margin-left: 145px;
}

.about-author {
	min-height: 120px;
}

.author-details .blog-author-name {
	display: inline-block;
	margin-bottom: 10px;
}

.blog-navigation {
	text-align: right;
}

.read-blks a,
.date-blks li a {
	color: rgba(51, 52, 72, 0.5);
	font-weight: 600;
}

.authr-blog-group h2 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}

.authr-blog-group p {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	margin-bottom: 20px;
}

.authr-blog-group span {
	font-size: 12px;
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}

.social-blk {
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.social-blk li {
	padding: 0px 10px;
}

.social-blk li a:hover img {
	filter: invert(13%) sepia(85%) saturate(7478%) hue-rotate(266deg) brightness(50%) contrast(340%);
}

.week-list {
	color: rgba(51, 53, 72, 0.5);
	font-size: 10px;
	font-weight: 500;
}

.week-group h5 {
	margin-bottom: 0;
	font-weight: 500;
	font-size: 14px;
}

.share-blogs span {
	color: rgba(51, 52, 72, 0.5);
	font-size: 12px;
	font-weight: 600;
}

.list-add-blogs {
	margin-top: 25px;
}

.list-add-blogs ul li {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	padding: 5px 10px;
	margin-right: 10px;
	color: #333448;
	font-size: 12px;
	font-weight: 500;
}

.list-add-blogs ul li:hover {
	background: rgba(51, 52, 72, 0.3);
}

.list-add-blogs ul li:last-child {
	margin-right: 00px;
}

.relat-head {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
	border-bottom: 2px solid rgba(58 87 232 / 6%);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.relat-head h5 {
	margin-bottom: 0;
}

.relat-head a {
	font-weight: 500;
	font-size: 14px;
	color: #3a57e8;
}

.date-posts {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	margin-bottom: 10px;
}

.date-posts h5 {
	background: rgba(51, 52, 72, 0.1);
	border-radius: 8px;
	font-weight: 600;
	font-size: 10px;
	padding: 5px 10px;
	margin-bottom: 0;
}

.date-posts span {
	color: rgba(51, 52, 72, 0.5);
	font-weight: 500;
	font-size: 12px;
}

/*-----------------
	33. UI Kit
-----------------------*/

.pagination-box .pagination {
	margin-top: 0;
}

.tab-content {
	/* padding-top: 20px; */
}

/*-----------------
	34. Error
-----------------------*/

.error-pages {
	background: #fff;
}

.error-box {
	border-radius: 5px;
	line-height: 1;
	margin: 0 auto;
	max-width: 620px;
	padding: 50px 30px 55px;
	text-align: center;
	width: 100%;
}

.error-wrapper {
	margin: 0;
	color: #4F5155;
	-moz-box-align: center;
	-moz-box-pack: center;
	align-items: center;
	display: flex;
	justify-content: center;
	height: 100%;
}

.error-box h3 {
	font-size: 32px;
	font-weight: 600;
	margin-bottom: 10px;
}

.error-box p {
	margin-bottom: 40px;
	color: rgba(51, 52, 72, 0.5);
}

.error-box img {
	margin-bottom: 50px;
}

.error-box .btn {
	text-transform: capitalize;
	min-width: 179px;
	padding: 10px 15px;
	border-radius: 12px;
}

/*-----------------
	35. Lock Screen
-----------------------*/

.lock-user {
	margin-bottom: 20px;
}

.lock-user img {
	margin-bottom: 15px;
	width: 100px;
}

/*-----------------
	36. Voice call
-----------------------*/

.voice-call-avatar {
	flex-direction: column;
	display: flex;
	align-items: center;
	justify-content: center;
	flex: 2;
}

.voice-call-avatar .call-avatar {
	margin: 15px;
	width: 150px;
	height: 150px;
	border-radius: 100%;
	border: 1px solid rgba(0, 0, 0, 0.1);
	padding: 3px;
	background-color: #fff;
}

.call-duration {
	display: inline-block;
	font-size: 30px;
	margin-top: 4px;
	position: absolute;
	left: 0;
}

.voice-call-avatar .call-timing-count {
	padding: 5px;
}

.voice-call-avatar .username {
	font-size: 18px;
	text-transform: uppercase;
}

.call-icons {
	text-align: center;
	position: relative;
}

.call-icons .call-items {
	border-radius: 5px;
	padding: 0;
	margin: 0;
	list-style: none;
	display: inline-block;
}

.call-icons .call-items .call-item {
	display: inline-block;
	text-align: center;
	margin-right: 5px;
}

.call-icons .call-items .call-item:last-child {
	margin-right: 0;
}

.call-icons .call-items .call-item a {
	color: #777;
	border: 1px solid #ddd;
	width: 50px;
	height: 50px;
	line-height: 50px;
	border-radius: 50px;
	display: inline-block;
	font-size: 20px;
}

.call-icons .call-items .call-item a i {
	width: 18px;
	height: 18px;
}

.user-video {
	bottom: 0;
	left: 0;
	overflow: auto;
	position: absolute;
	right: 0;
	top: 0;
	z-index: 10;
}

.user-video img {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	display: block;
	margin: 0 auto;
}

.user-video video {
	width: auto;
	max-width: 100%;
	height: auto;
	max-height: 100%;
	display: block;
	margin: 0 auto;
}

.my-video {
	position: absolute;
	z-index: 99;
	bottom: 20px;
	right: 20px;
}

.my-video ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.my-video ul li {
	float: left;
	width: 120px;
	margin-right: 10px;
}

.my-video ul li img {
	border: 3px solid #fff;
	border-radius: 6px;
}

.end-call {
	position: absolute;
	top: 7px;
	right: 0;
}

.end-call a {
	color: #fff;
	border-radius: 50px;
	display: inline-block;
	background-color: #f06060;
	padding: 8px 25px;
	text-transform: uppercase;
}

.call-users {
	position: absolute;
	z-index: 99;
	bottom: 20px;
	right: 20px;
}

.call-users ul {
	margin: 0;
	padding: 0;
	list-style: none;
}

.call-users ul li {
	float: left;
	width: 80px;
	margin-left: 10px;
}

.call-users ul li img {
	border-radius: 6px;
	padding: 2px;
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.1);
}

.call-mute {
	width: 80px;
	height: 80px;
	background-color: rgba(0, 0, 0, 0.5);
	position: absolute;
	display: inline-block;
	text-align: center;
	line-height: 80px;
	border-radius: 6px;
	font-size: 30px;
	color: #fff;
	display: none;
	top: 0;
	border: 3px solid transparent;
}

.download-grp {
	display: flex;
	flex-wrap: wrap;
}

.call-users ul li a:hover .call-mute {
	display: block;
}

.call-details {
	margin: 10px 0 0px;
	display: flex;
}

.call-info {
	margin-left: 10px;
	width: 100%;
}

.call-user-details,
.call-timing {
	display: block;
	text-overflow: ellipsis;
	overflow: hidden;
	white-space: nowrap;
}

.call-description {
	white-space: nowrap;
	vertical-align: bottom;
}

.call-timing {
	color: #a0a0a2;
	display: flex;
	font-size: 14px;
	margin-top: 1px;
	overflow: hidden;
	white-space: pre;
}

/*-----------------
	37. Video Call
-----------------------*/

.content-full {
	height: 100%;
	position: relative;
	width: 100%;
}

.video-window .fixed-header {
	padding: 0;
	border: 0;
}

.video-window .fixed-header .nav>li>a {
	padding: 19px 15px;
}

/*-----------------
	38. Incoming Call
-----------------------*/

.incoming-btns {
	margin-top: 20px;
}

.modal.custom-modal {
	background-color: rgba(0, 0, 0, 0.66);
}

.custom-modal .modal-content {
	border: 0;
	background-color: #fff;
}

.custom-modal .profile-widget {
	margin-bottom: 0;
}

.modal.custom-modal.modal-bg {
	background-color: rgba(0, 0, 0, 0.66);
}

.custom-modal.modal-bg .modal-content {
	background-color: #fff;
	text-align: center;
	border-radius: 10px;
}

.custom-modal .modal-body {
	padding: 30px;
}

.form-header {
	text-align: center;
	margin-bottom: 30px;
}

/*-----------------
	39. Notification settings
-----------------------*/

.notification-list .list-group-item {
	padding: 15px;
}

.notification-list .status-toggle {
	float: right;
}

.invoice-load-btn {
	text-align: center;
	margin-top: 30px;
	margin-bottom: 30px;
}

.invoice-load-btn .btn {
	font-weight: 700;
	font-size: 14px;
	color: #009efb;
	min-width: 170px;
	padding: 10px 15px;
	background: #FFFFFF;
	border: 2px solid #009efb;
	border-radius: 6px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
}

.invoice-load-btn .btn:hover span {
	border: 3px solid #ffffff7a;
	border-right-color: #fff;
}

.invoice-load-btn .btn:hover {
	background: #009efb;
	color: #fff;
}

.invoice-load-btn .btn span {
	display: inline-block;
	width: 25px;
	height: 25px;
	margin-right: 8px;
	vertical-align: 0;
	border: 3px solid #9a55ff21;
	border-right-color: #009efb;
	border-radius: 50%;
	-webkit-animation: .75s linear infinite spinner-border;
	animation: .75s linear infinite spinner-border;
}

.invoices-grid-card .card-footer .badge {
	border-radius: 6px;
	font-size: 13px;
	font-weight: 400;
	padding: 7px 18px;
}

.invoices-grid-card .bg-success-dark {
	background: #008F64;
}

.invoices-grid-card .bg-success-dark {
	background: #008F64;
}

.invoices-grid-card .bg-danger-dark {
	background: #FF0000;
}

.invoices-grid-card .bg-secondary-dark {
	background: #009efb;
}

.invoices-grid-card .bg-primary-dark {
	background: #2196f3;
}

.invoices-grid-card .text-sm {
	font-size: 14px;
}

.invoices-page-header {
	background: #FFFFFF;
	border-radius: 10px;
	padding: 12px;
}

.page-header .breadcrumb {
	background-color: transparent;
	color: #6c757d;
	font-size: 15px;
	font-weight: 500;
	margin-bottom: 0;
	padding: 0;
}

.invoices-page-header .invoices-breadcrumb-item i {
	color: #fff;
	border-radius: 50%;
	width: 20px;
	height: 20px;
	font-size: 10px;
	margin-right: 10px;
	background: #3a57e8;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.invoices-create-btn .invoices-preview-link {
	font-weight: 500;
	color: #3a57e8;
	margin-right: 30px;
	font-size: 15px;
}

.invoices-create-btn .delete-invoice-btn {
	background: #6c757d;
	margin-right: 10px;
}

.invoices-create-btn .btn {
	font-weight: 500;
	font-size: 15px;
	color: #fff;
	border-radius: 8px;
	padding: 10px 0px;
	min-width: 160px;
	position: relative;
}

.check:checked+.checktoggle {
	background-color: #009efb;
	border: 1px solid #009efb;
}

.payment-details {
	width: 266px;
	border-radius: 4px;
	padding: 15px;
	background: #3a57e8;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.payment-details p {
	color: #fff;
	max-width: 140px;
	font-weight: 400;
	margin-bottom: 0;
}

.invoices-create-btn .save-invoice-btn {
	background: #3a57e8;
}

.invoices-add-card {
	background: #FFFFFF;
	border-radius: 10px;
}

.invoices-main-form {
	padding-bottom: 15px;
	margin-bottom: 30px;
	border-bottom: 1px solid #E5E5E5;
}

.invoices-main-form label {
	font-size: 14px;
}

.multipleSelection {
	position: relative;
	margin-bottom: 20px;
}

.invoices-form .multipleSelection .selectBox {
	border: 2px solid #3a57e8;
	border-radius: 6px;
}

.multipleSelection #checkBoxes-one {
	display: none;
	position: absolute;
	width: 100%;
	left: 0;
	z-index: 1;
	margin-top: 10px;
	padding: 20px;
	background: #FFFFFF;
	border: 1px solid #F2ECFF;
	box-shadow: 0px 4px 44px rgb(231 234 252 / 75%);
	border-radius: 6px;
}

.invoice-details-title {
	font-weight: 500;
	font-size: 18px;
	color: #1B2559;
	margin-bottom: 0.5rem;
}

.invoice-details-box {
	background: #FFFFFF;
	border: 1px solid #E5E5E5;
	border-radius: 10px;
}

.invoice-inner-head {
	padding: 26px;
	border-bottom: 1px solid #E5E5E5;
}

.invoice-inner-head span {
	color: #1B2559;
	font-size: 14px;
}

.invoice-inner-head span a {
	font-weight: 500;
	color: #3a57e8;
}

.invoice-inner-footer {
	padding: 0;
}

.invoice-inner-date {
	padding: 26px;
	border-right: 1px solid #E5E5E5;
}

.payment-details {
	width: 266px;
	border-radius: 4px;
	padding: 15px;
	background: #3a57e8;
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.payment-details p {
	color: #fff;
	max-width: 140px;
	font-weight: 400;
	margin-bottom: 0;
}

.payment-details a {
	font-size: 26px;
	color: #fff;
}

.invoice-inner-footer .form-control {
	position: absolute;
	color: #009efb;
	background: transparent;
	border: 0;
	display: inline-block;
	width: auto;
	height: auto;
	padding: 0 10px;
}

.invoice-inner-footer span {
	font-weight: 500;
	color: #1B2559;
	position: relative;
}

.invoice-inner-datepic {
	border: 0;
	padding-left: 0;
}

.invoices-form .form-control {
	height: 50px;
	border: 1px solid #E5E5E5;
	border-radius: 6px;
}

.invoice-info {
	margin-bottom: 20px;
}

.invoice-item .customer-text {
	font-size: 18px;
	color: #000;
	font-weight: 600;
	margin-bottom: 16px;
	display: block;
}

.invoice-item .customer-text a {
	font-size: 14px;
	color: #009efb;
	margin-left: 12px;
}

.invoice-item .invoice-details-two {
	text-align: left;
	color: #000;
	float: left;
}

.invoice-add-table h4 {
	font-weight: 600;
	font-size: 18px;
	color: #3a57e8;
	margin-bottom: 30px;
}

.invoice-add-table .add-btns {
	color: #3a57e8;
}

.invoice-add-table .copy-btn {
	color: #C4C4C4;
}

.invoice-add-table .remove-btn {
	color: #FF0000;
}

.invoice-fields .field-title {
	font-weight: 600;
	font-size: 16px;
	color: #1B2559;
	margin-bottom: 15px;
}

.field-box {
	padding: 15px;
	background: #FFFFFF;
	border: 1px solid #E5E5E5;
	border-radius: 4px;
}

.field-box p {
	font-weight: 500;
	font-size: 14px;
	color: #1B2559;
	margin-bottom: 10px;
}

.field-box .btn {
	min-width: 266px;
	border-radius: 4px;
	padding: 30px 0;
}

.invoice-faq .faq-tab {
	padding-top: 10px;
}

.faq-tab .panel-title {
	background: #FFFFFF;
	border: 1px solid #E5E5E5;
	border-radius: 4px;
	padding: 10px 20px;
	margin-bottom: 0px;
	position: relative;
	font-size: 14px;
}

.faq-tab .panel-title a {
	color: #C4C4C4;
}

.faq-tab .panel-title a.collapsed::after {
	content: '\f067';
	font-family: 'Font Awesome 5 Free';
	position: absolute;
	right: 20px;
	top: 10px;
	color: #f09e9e;
	font-weight: 600;
	font-size: 14px;
}

.faq-tab .panel-title a:not(.collapsed)::after {
	color: #FF0000;
}

.invoice-total-card .invoice-total-title {
	font-weight: 600;
	font-size: 16px;
	color: #1B2559;
	margin-bottom: 15px;
}

.invoice-total-box {
	background: #FFFFFF;
	border: 1px solid #E5E5E5;
	border-radius: 4px;
}

.invoice-total-inner {
	padding: 15px;
}

.invoice-total-box p {
	color: #1B2559;
	margin-bottom: 20px;
	position: relative;
	text-align: initial;
	font-size: 14px;
}

.invoice-total-box p span {
	float: right;
}

.invoice-total-box .add-links {
	font-weight: 500;
	color: #009efb;
	margin-bottom: 20px;
	display: block;
}

.invoice-total-box .service-trash-one {
	margin-top: 10px;
	color: #1B2559;
}

.invoice-total-footer {
	border-top: 1px solid #E5E5E5;
	padding: 15px;
}

.invoice-total-footer h4 {
	font-size: 16px;
	margin-bottom: 0;
	color: #3a57e8;
	text-align: initial;
}

.invoice-total-footer h4 span {
	float: right;
}

.upload-sign {
	float: right;
	margin-top: 20px;
}

.service-upload {
	border: 2px dashed #E5E5E5;
	text-align: center;
	padding: 30px 0;
	background-color: #fff;
	position: relative;
	width: 330px;
}

.service-upload span {
	font-size: 15px;
	color: #858585;
	display: block;
}

.service-upload input[type="file"] {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	cursor: pointer;
}

.upload-sign .btn {
	border-radius: 8px;
	min-width: 198px;
	padding: 10px 0;
}

.invoice-total-box .service-amount {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: space-between;
	-webkit-justify-content: space-between;
	-ms-flex-pack: space-between;
}

.invoice-total-box .service-trash,
.invoice-total-box .service-trash1 {
	margin-bottom: 10px;
	color: #1B2559;
}

#show-invoices {
	display: none;
}

.invoice-total-box .service-trash i {
	color: #EC1361;
}

.check:checked+.checktoggles {
	background-color: #009efb;
	border: 1px solid #009efb;
}

.check:checked+.checktoggles:after {
	background-color: #fff;
	left: 100%;
	transform: translate(calc(-100% - 5px), -50%);
}

.checktoggles:after {
	content: ' ';
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(5px, -50%);
	width: 8px;
	height: 8px;
	background-color: #fff;
	border-radius: 50%;
	transition: left 300ms ease, transform 300ms ease;
}

.checktoggles {
	background-color: #C4C4C4;
	border: 1px solid #C4C4C4;
	border-radius: 12px;
	cursor: pointer;
	font-size: 0;
	height: 15px;
	margin-left: 10px;
	top: 3px;
	margin-bottom: 0;
	position: absolute;
	width: 30px;
	display: inline-block;
}

.invoice-total-box .add-links1,
.add-links-one {
	font-weight: 500;
	color: #3a57e8;
	margin-bottom: 20px;
	display: block;
	font-size: 14px;
}

.invoice-add-table th {
	background: #F8F9FA;
	padding: 15px;
	font-size: 14px;
}

.table>:not(:first-child) {
	border-top: 0;
}

td.add-remove {
	padding: 20px;
}

.add-remove i {
	font-size: 18px;
	cursor: pointer;
}

.bank-details .modal-content {
	border: 1px solid #F2ECFF;
	border-radius: 6px;
}

.bank-details .modal-header {
	border: 0;
	justify-content: space-between;
	padding: 30px;
	align-items: center;
	display: flex;
	border-bottom: 1px solid #E5E5E5;
}

.bank-details .close {
	background: transparent;
	border: 0;
	color: #1B2559;
	font-size: 28px;
	line-height: normal;
	top: 20px;
	width: auto;
	height: auto;
	right: 20px;
}

.bank-details .modal-body {
	padding-bottom: 10px;
	border-bottom: 1px solid #E5E5E5;
}

.bank-details .bank-inner-details .form-control {
	height: 50px;
}

.bank-details .modal-footer {
	justify-content: end;
	padding: 30px;
}

.bank-details .modal-footer>* {
	margin: 0;
}

.bank-details-btn .bank-cancel-btn {
	background: #1B2559;
}

.bank-details-btn .bank-save-btn {
	background: #3a57e8;
}

.bank-details-btn .btn {
	min-width: 160px;
	border-radius: 8px;
	padding: 10px 0;
	color: #fff;
}

.invoice-inner-footer .form-control {
	position: relative;
	color: #009efb;
	background: transparent;
	border: 0;
	display: inline-block;
	width: 120px;
	height: auto;
	padding: 0 10px;
}

.invoice-inner-footer span {
	font-weight: 500;
	color: #1B2559;
	position: relative;
	display: flex;
	align-items: center;
	font-size: 13px;
}

.invoice-inner-date {
	padding: 8px 15px;
	border-right: 1px solid #E5E5E5;
}

.invoice-info-card {
	border-radius: 14px;
}

.invoice-item-one {
	border-bottom: 1px solid rgba(231, 234, 252, 0.75);
}

.faq-tab .panel-title a:hover {
	color: #1B2559;
}

.faq-tab .panel-title a:not(.collapsed)::after {
	color: #FF0000;
}

.faq-tab .panel-title a::after {
	content: '\f068';
	font-family: 'Font Awesome 5 Free';
	position: absolute;
	right: 20px;
	top: 10px;
	color: #f09e9e;
	font-weight: 600;
	font-size: 14px;
}

.faq-tab .panel-body textarea {
	min-height: 100px;
	border: 0;
	border-radius: 0 0 4px 4px;
}

.faq-tab .panel-body {
	padding: 10px 20px;
	border: 1px solid #E5E5E5;
}

.inovices-month-info {
	padding-top: 50px;
}

.invoice-add-table {
	padding-top: 20px;
	padding-bottom: 30px;
}

.invoice-item .invoice-logo {
	margin-bottom: 30px;
}

.invoice-item .invoice-logo img {
	width: auto;
	max-height: 52px;
}

.invoice-item .invoice-text h2 {
	color: #272b41;
	font-size: 36px;
	font-weight: 600;
}

.invoice-item .invoice-details {
	text-align: right;
	font-weight: 400
}

.invoice-item .invoice-details strong {
	color: #272b41;
}

.invoice-item .invoice-details-two {
	text-align: left;
	color: #000;
	font-size: 13px;
}

.invoice-item .invoice-text {
	padding-top: 42px;
	padding-bottom: 36px
}

.invoice-item .invoice-text h2 {
	font-weight: 400
}

.invoice-info {
	margin-bottom: 20px;
}

.invoice-info p {
	margin-bottom: 0;
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
}

.invoice-info.invoice-info2 {
	text-align: right;
}

.invoice-item .customer-text {
	font-size: 20px;
	color: #000;
	font-weight: 600;
	margin-bottom: 16px;
	display: block
}

.invoice-item .customer-text a {
	font-size: 14px;
	color: #3a57e8;
	margin-left: 12px;
}

.invoice-table tr th,
.invoice-table tr td,
.invoice-table-two tr th,
.invoice-table-two tr td {
	color: #272b41;
	font-weight: 600;
	padding: 15px 20px;
	line-height: inherit
}

.invoice-table tr td,
.invoice-table-two tr td {
	font-weight: 500;
}

.invoice-table-two {
	margin-bottom: 0
}

.invoice-table-two tr th,
.invoice-table-two tr td {
	border-top: 0;
}

.invoice-table-two tr td {
	text-align: right
}

.invoice-info h5 {
	font-size: 16px;
	font-weight: 500;
}

.other-info {
	margin-top: 10px;
}

.file {
	visibility: hidden;
	position: absolute;
}

.btn-group,
.btn-group-vertical {
	position: relative;
	display: -inline-flexbox;
	display: inline-flex;
	vertical-align: middle;
}

.font-size-14 {
	font-size: 14px;
}

.invoice-info-card {
	border-radius: 14px;
}

.invoice-item-one {
	border-bottom: 1px solid rgba(231, 234, 252, 0.75);
}

.invoice-item-one .invoice-info {
	margin-bottom: 30px;
	text-align: right;
}

.customer-text-one {
	font-size: 16px;
	color: #1B2559;
	font-weight: 600;
	display: block;
	margin-bottom: 10px;
}

.invoice-name {
	color: #1B2559;
	font-size: 14px;
	font-weight: 600;
	margin-bottom: 10px;
}

.invoice-item-one .invoice-details {
	color: #1B2559;
	font-weight: 400;
}

.invoice-head h2 {
	font-weight: 600;
	font-size: 22px;
	color: #1B2559;
	text-transform: uppercase;
	margin-bottom: 0;
}

.invoice-head {
	margin-bottom: 30px;
}

.invoice-head p {
	font-weight: 400;
	font-size: 16px;
	color: #1B2559;
	margin-bottom: 0;
}

.invoice-item-two {
	padding-top: 30px;
	padding-bottom: 30px;
}

.invoice-item-two .invoice-details {
	color: #1B2559;
	font-weight: 400;
	width: 100%;
}

.invoice-item-box {
	background: #55ddff30;
	border-radius: 5px;
	padding: 15px;
	width: 200px;
	float: right;
	margin-top: 20px;
}

.invoice-item-box p {
	color: #1B2559;
	font-weight: 400;
	margin-bottom: 10px;
}

.invoice-issues-box {
	background: #3a57e8;
	border-radius: 10px;
	text-align: center;
	padding: 10px;
	margin-bottom: 30px;
}

.invoice-issues-date {
	padding-top: 20px;
	padding-bottom: 20px;
}

.invoice-issues-date p {
	font-weight: 600;
	font-size: 14px;
	color: #FFFFFF;
	margin-bottom: 0;
}

.invoice-table-wrap {
	margin-bottom: 30px;
}

.invoice-table>thead>tr>th {
	background: #F5F7FF;
	border-top: 0;
	font-weight: 500;
	font-size: 14px;
	color: #1B2559;
}

.invoice-table>tbody>tr>td {
	font-weight: 400;
	color: #1B2559;
	padding: 15px 20px;
	font-size: 14px;
}

.invoice-terms {
	margin-bottom: 30px;
}

.invoice-total-inner input[type="checkbox"] {
	display: none;
}

.invoice-terms h6 {
	font-weight: 500;
	font-size: 15px;
	color: #1B2559;
	margin-bottom: 6px;
}

.invoice-terms p {
	font-weight: 400;
	font-size: 14px;
	color: #8F9BBA;
}

.invoice-sign {
	padding-top: 30px;
}

.invoice-sign span {
	color: #1B2559;
	margin-top: 18px;
}

.invoice-item-bg {
	background: #3a57e8;
	border-radius: 10px;
	margin-top: 30px;
	margin-bottom: 30px;
}

.invoice-circle-img {
	position: relative;
}

.invoice-circle-img .invoice-circle1 {
	position: absolute;
	left: 0;
	opacity: 0.1;
}

.invoice-circle-img .invoice-circle2 {
	position: absolute;
	right: 0;
	opacity: 0.1;
}

.invoice-item-bg .invoice-info {
	border-right: 1px solid #fff;
	padding: 30px;
	margin-top: 20px;
	text-align: initial;
	display: flow-root;
}

.invoice-payment-box {
	text-align: left;
}

.invoice-item-bg .customer-text-one {
	color: #fff;
}

.invoice-item-bg .invoice-name {
	color: #fff;
}

.invoice-item-bg .invoice-details-two {
	color: #fff;
}

.invoice-item-bg .invoice-info-one p {
	color: #fff;
	margin-bottom: 10px;
}

.invoice-sign-box {
	margin-top: 30px;
	text-align: initial;
}

.invoice-payment-box h4 {
	font-weight: 600;
	font-size: 16px;
	color: #1B2559;
	margin-bottom: 16px;
}

.invoice-payment-box .payment-details {
	background: transparent;
	border: 2px dashed #009efb;
}

.invoice-payment-box .payment-details p {
	font-weight: 600;
	font-size: 15px;
	color: #1B2559;
}

.invoices-preview .modal-body {
	padding: 0;
}

.settings-menu {
	margin-bottom: 30px;
}

.settings-menu ul {
	display: block;
	padding: 0;
	list-style: none;
	margin-bottom: 0;
}

.settings-menu ul li a.active {
	color: #3a57e8 !important;
	border: 0;
}

.settings-menu ul li {
	margin-bottom: 15px;
}

.settings-menu ul li:last-child {
	margin-bottom: 0;
}

.settings-menu ul li a {
	color: #1B2559;
	padding: 0;
	border: 0 !important;
	display: inline-block;
}

.invoices-upload-btn {
	border: 1px solid #dee2e6;
	border-radius: 6px;
	color: #000000;
	cursor: pointer;
	font-weight: 400;
	padding: 15px 15px;
	position: relative;
	width: 100%;
	height: 50px;
}

.invoices-upload-btn .upload {
	position: absolute;
	background: #3a57e8;
	border-radius: 4px;
	right: 6px;
	top: 8px;
	width: 136px;
	height: 32px;
	font-size: 14px;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
}

.invoices-upload-btn .hide-input {
	position: relative;
	z-index: 1;
	cursor: pointer;
	min-height: auto;
	padding-left: 4px;
	padding-top: 0;
	line-height: 10px;
	width: 100%;
	opacity: 0;
}

.invoice-setting-btn .cancel-btn {
	background: #6c757d;
}

.invoice-setting-btn .btn {
	min-width: 160px;
	padding: 10px 0;
	color: #fff;
	border-radius: 8px;
	border: 0;
}

.invoice-setting-btn {
	display: flex;
	align-items: center;
	justify-content: end;
}

.paid-continue-btn {
	background-color: #3a57e8;
	border: 1px solid #3a57e8;
	border-radius: 5px;
	color: #fff;
	display: block;
	font-size: 18px;
	font-weight: 400;
	padding: 10px 20px;
	text-align: center;
}

.paid-cancel-btn {
	background-color: #fff;
	border: 1px solid #3a57e8;
	border-radius: 5px;
	color: #3a57e8;
	display: block;
	font-size: 18px;
	font-weight: 400;
	padding: 10px 20px;
	text-align: center;
}

.invoices-page-header .invoices-breadcrumb-item a {
	font-weight: 500;
	color: #3a57e8;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.page-header {
	margin: 0;
    margin-bottom: 1.875rem;
    border: unset;
}

.invoices-table.custom-table tbody tr {
	box-shadow: none;
}

.invoices-table.custom-table tbody tr td {
	vertical-align: middle;
}

.invoices-table.custom-table thead tr th {
	color: #333448;
}

.add-table-invoice {
	background: rgba(58 87 232 / 6%);
	border-radius: 12px;
	width: 40px;
	height: 40px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
}

.add-table-invoice i {
	color: #3a57e8;
}

.grand-totals tr td:first-child {
	width: 75%;
}

.custom-table .bold-total td {
	font-weight: 600;
}

.custom-table .bold-total .form-control {
	font-weight: 600;
}

.invoice-clinic li {
	color: rgba(51, 53, 72, 0.5);
	font-size: 14px;
	font-weight: 500;
}

.invoice-details h3 {
	font-size: 14px;
	font-weight: 700;
}

.invoice-details h4 {
	font-size: 14px;
	font-weight: 600;
}

.invoice-details h4 span {
	font-weight: 500;
	color: rgba(51, 53, 72, 0.5);
}

.bold-total-invoice h5 {
	font-size: 22px;
	color: #333448;
	font-weight: 600;
}

.total-fonts tr td {
	color: rgba(51, 53, 72, 0.5);
	font-weight: 500;
}

.invoice-head-clinic {
	border-bottom: 2px solid rgba(46, 55, 164, 0.1);
	padding-bottom: 20px;
	margin-bottom: 20px;
}

.invoice-counts h4 {
	font-size: 16px;
	font-weight: 600;
	margin-bottom: 0;
}

.invoice-counts h4 span {
	font-size: 15px;
	font-weight: 500;
	color: rgb(51 53 72 / 50%);
}

.invoice-counts a {
	padding: 3px 23px;
	font-size: 15px;
	border-radius: 8px;
	margin-left: 15px;
}

/*-----------------
	40. Chat Sidebar
-----------------------*/

.chat-sidebar {
	background-color: #fff;
	border-left: 1px solid #eaeaea;
	width: 300px;
}

.chat-sidebar .chat-contents {
	background-color: #fff;
}

.chat-sidebar .chat-left .chat-content {
	border: 0;
	padding: 0;
	border-radius: 0 !important;
	background-color: transparent;
	max-width: 100%;
}

.chat-sidebar .chat-left .chat-body {
	margin-left: 50px;
	padding-right: 0;
}

.chat-sidebar .chat-date {
	background-color: #fff;
}

.chat-sidebar .chats {
	padding: 15px 15px 30px;
}

.chat-sidebar .avatar {
	width: 30px;
	height: 30px;
	line-height: 30px;
}

.chat-sidebar .chat.chat-left {
	margin-bottom: 20px;
}

.chat-sidebar .chat.chat-left:last-child {
	margin-bottom: 0;
}

.chat-sidebar .chat-left .chat-time {
	color: #888;
	display: inline-block;
	font-size: 11px;
}

.chat-sidebar .chat-content>p {
	font-size: 13px;
	margin-bottom: 0;
}

.chat-sidebar.opened {
	margin-right: 0;
}

/*-----------------
	41. Gallery
-----------------------*/

.lg-backdrop {
	z-index: 1041;
}

#lightgallery .img-thumbnail {
	box-shadow: 0 6px 15px rgba(36, 37, 38, 0.08);
}

/*-----------------
   42. Settings
-----------------------*/

.settings-menu-links .nav-tabs.menu-tabs {
	border: none;
	margin-bottom: 20px;
	margin-top: 20px;
}

.nav-tabs.menu-tabs .nav-item {
	padding-right: 10px;
	margin-bottom: 10px;
	display: inline-block;
}

.nav-tabs.menu-tabs .nav-item.active .nav-link {
	color: #fff;
	background: #3a57e8;
}

.nav-tabs.menu-tabs .nav-link {
	position: relative;
	border: none;
	outline: none;
	display: inline-flex;
	align-items: center;
	background: transparent;
	font-weight: 400;
	font-size: 14px;
	padding: 10px 20px;
	border-radius: 5px;
	color: #fff;
	background: rgb(46 55 164 / 53%);
}

.card .card-header .card-title {
	margin-bottom: 0;
	font-size: 16px;
	font-weight: 600;
}

.settings-form {
	margin-top: 20px;
}

.settings-label {
	margin-bottom: 10px;
	font-size: 13px;
}

.settings-btn {
	border: 1px solid #D7D7D7;
	border-radius: 5px;
	color: #000000;
	cursor: pointer;
	font-weight: 400;
	padding: 15px 15px;
	position: relative;
	width: 100%;
	height: 46px;
}

.settings-btn .hide-input {
	position: relative;
	z-index: 1;
	cursor: pointer;
	min-height: auto;
	padding-left: 4px;
	padding-top: 0;
	line-height: 10px;
	width: 100%;
	opacity: 0;
}

.settings-btn .upload {
	position: absolute;
	z-index: 11;
	background: #3a57e8;
	border-radius: 5px;
	right: 2px;
	top: 1.5px;
	width: 41px;
	height: 41px;
	font-size: 20px;
	cursor: pointer;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #fff;
}

.settings-size {
	font-size: 13px;
	color: #131523;
	font-style: italic;
	margin-top: 10px;
	margin-bottom: 0;
}

.settings-size span {
	font-weight: 700;
}

.upload-images {
	background: rgba(255, 255, 255, 0.8);
	border: 1px solid #E4E4E4;
	border-radius: 5px;
	display: flex;
	margin-top: 30px;
	width: 196px;
	height: 78px;
	justify-content: space-around;
	align-items: center;
	position: relative;
	margin-bottom: 24px;
}

.upload-images img {
	max-height: 45px;
	width: auto;
}

.upload-images .btn-icon {
	color: #00d3c7;
	font-size: 16px;
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	text-align: center;
	position: absolute;
	padding: 0;
	width: 20px;
	height: 20px;
	display: -ms-inline-flexbox;
	display: inline-flex;
	right: 0px;
	top: 0px;
	justify-content: center;
	-webkit-justify-content: center;
}

.invoice-load-btn {
	text-align: center;
	margin-top: 30px;
	margin-bottom: 30px;
}

.invoice-load-btn .btn {
	font-weight: 700;
	font-size: 14px;
	color: #00d3c7;
	min-width: 170px;
	padding: 10px 15px;
	background: #FFFFFF;
	border: 2px solid #00d3c7;
	border-radius: 6px;
	display: inline-flex;
	justify-content: center;
	align-items: center;
}

.invoice-load-btn .btn span {
	display: inline-block;
	width: 25px;
	height: 25px;
	margin-right: 8px;
	vertical-align: 0;
	border: 3px solid rgb(0 211 199 / 57%);
	border-right-color: #00d3c7;
	border-radius: 50%;
	-webkit-animation: .75s linear infinite spinner-border;
	animation: .75s linear infinite spinner-border;
}

.upload-size {
	width: 82px;
	height: 82px;
}

.check {
	display: block;
	margin: 0;
	padding: 0;
	width: 0;
	height: 0;
	visibility: hidden;
	opacity: 0;
	pointer-events: none;
	position: absolute;
}

.checktoggle {
	background-color: #fff;
	border: 1px solid rgba(0, 0, 0, 0.25);
	border-radius: 12px;
	cursor: pointer;
	display: block;
	font-size: 0 !important;
	height: 24px;
	margin-bottom: 0;
	position: relative;
	width: 48px;
}

.checktoggle:after {
	content: ' ';
	display: block;
	position: absolute;
	top: 50%;
	left: 0;
	transform: translate(5px, -50%);
	width: 16px;
	height: 16px;
	background-color: rgba(0, 0, 0, 0.25);
	border-radius: 50%;
	transition: left 300ms ease, transform 300ms ease;
}

.check:checked+.checktoggle {
	background-color: #3a57e8;
	border: 1px solid #3a57e8;
}

.star-red {
	color: #ff0000;
}

form .btn-gradient-primary {
	font-size: 14px;
	padding: 8px 40px;
	color: #fff;
}

form .btn-secondary {
	font-size: 14px;
	padding: 7px 30px;
	color: #fff;
}

.check:checked+.checktoggle:after {
	background-color: #fff;
	left: 100%;
	transform: translate(calc(-100% - 5px), -50%);
}

.card-header {
	padding: 15px;
}

.settings-form .custom_radio {
	color: #000;
	display: inline-block;
	position: relative;
	font-size: 14px;
	font-size: 0.9375rem;
	padding-left: 30px;
	margin-bottom: 0px;
	cursor: pointer;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
}

.custom_radio input {
	position: absolute;
	opacity: 0;
	cursor: pointer;
	height: 0;
	width: 0;
}

.settings-form .custom_radio .checkmark {
	position: absolute;
	top: 0;
	left: 0;
	height: 20px;
	width: 20px;
	background-color: #fff;
	border: 1px solid #3a57e8;
	border-radius: 50%;
}

.custom_radio input:checked~.checkmark::after {
	-webkit-transform: scale(1);
	-moz-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
	opacity: 1;
	visibility: visible;
}

.settings-form .custom_radio .checkmark:after {
	display: block;
	content: "";
	position: absolute;
	opacity: 0;
	top: 3px;
	left: 3px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: #3a57e8;
	-moz-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	-webkit-transition: all 0.3s ease-in-out;
	-ms-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.settings-form .social-icon {
	width: 50px;
	height: 42px;
	margin-right: 6px;
	color: #fff;
	background: #3a57e8;
	border: 1px solid #3a57e8;
	border-radius: 5px;
	font-size: 20px;
	display: flex;
	justify-content: space-around;
	align-items: center;
	position: relative;
	padding: 4px;
}

.settings-form .links-cont .social-icon::after {
	content: "";
	border-top: 0.2em solid;
	border-right: 0.2em solid transparent;
	border-bottom: 0;
	border-left: 0.2em solid transparent;
	margin-left: 4px;
}

.settings-form .trash {
	-webkit-box-align: center;
	-ms-flex-align: center;
	align-items: center;
	height: 42px;
	width: 46px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	justify-content: center;
	-webkit-justify-content: center;
	-ms-flex-pack: center;
	background-color: #3a57e8;
	color: #fff;
	position: relative;
	font-size: 16px;
	margin-left: 6px;
}

.add-links {
	background-color: #3a57e8;
	color: #fff !important;
	font-size: 13px;
	font-weight: 700;
	padding: 10px 26px;
	border-radius: 4px;
}

.bootstrap-tagsinput input {
	border: none;
	box-shadow: none;
	outline: none;
	background-color: transparent;
	padding: 0 6px;
	margin: 0;
	width: auto;
	max-width: inherit;
}

.bootstrap-tagsinput input::placeholder {
	font-size: 14px;
}

.settings-form .bootstrap-tagsinput .tag {
	margin-right: 5px;
	margin-bottom: 0px;
	color: #000000;
	background: #E4E4E4 !important;
	border-radius: 0px;
	font-size: 14px;
	font-weight: 500;
	padding: 7px 15px;
}

.settings-form .bootstrap-tagsinput {
	display: block;
	color: #333;
	background: #FFFFFF;
	border: 1px solid #D7D7D7;
	box-shadow: unset;
	min-height: 46px;
	padding-top: 4px;
	padding-left: 5px;
	padding-right: 10px;
	padding-bottom: 4px;
}

.form-row.links-cont {
	margin-bottom: 0px;
}

textarea.form-control {
	resize: vertical;
}

textarea.form-control {
	height: auto;
}

.settings-form .input-block label {
	margin-bottom: 10px;
	font-size: 13px;
}

.card.invoices-grid-card .card-footer {
	background-color: #fff;
}

.card-block tr th,
.card-block tr td {
	font-size: 14px;
}

.modal-body label {
	font-size: 13px;
}

.avatar {
	width: 34px;
	height: 34px;
}

.avatar-xs {
	width: 1.65rem;
	height: 1.65rem;
}

.avatar-sm {
	width: 2.5rem;
	height: 2.5rem;
}

.avatar-xs {
	width: 1.65rem;
	height: 1.65rem;
}

.avatar-xxl {
	width: 8rem;
	height: 8rem;
}

.avatar-xl {
	width: 5rem;
	height: 5rem;
}

.avatar-lg {
	width: 3.75rem;
	height: 3.75rem;
}

.avatar.shape {
	border-radius: 6px;
}

.avatar.shape img {
	border-radius: 6px;
}

.avatar.avatar-online::before {
	width: 25%;
	height: 25%;
	border-radius: 50%;
	content: "";
	border: 2px solid #ffffff;
	position: absolute;
	right: 0;
	bottom: 0;
	background-color: #55ce63;
}

.avatar.avatar-offline::before {
	width: 25%;
	height: 25%;
	border-radius: 50%;
	content: "";
	border: 2px solid #ffffff;
	position: absolute;
	right: 0;
	bottom: 0;
	background-color: #f62d51;
}

.avatar.avatar-away::before {
	width: 25%;
	height: 25%;
	border-radius: 50%;
	content: "";
	border: 2px solid #ffffff;
	position: absolute;
	right: 0;
	bottom: 0;
	background-color: #ffbc34;
}

.avatar-group .avatar {
	margin-right: 0;
	margin-left: -10px;
}

.avatar-group .avatar:first-child {
	margin-right: 0;
	margin-left: 0;
}

.note-editor.note-frame .note-statusbar {
	border-top: 0;
}

.bootstrap-datetimepicker-widget {
	font-size: 13px;
}

.bootstrap-datetimepicker-widget table td.today:before {
	border-bottom-color: #7638ff;
}

.bg-primary-light {
	background-color: rgba(17, 148, 247, 0.12) !important;
	color: #2196f3 !important;
}

.bg-danger-light {
	background-color: rgb(255 218 218 / 49%) !important;
	color: #FF0000 !important;
}

.bg-purple-light {
	background-color: rgba(197, 128, 255, 0.12) !important;
	color: #c580ff !important;
}

.bg-default-light {
	background-color: rgba(40, 52, 71, 0.12) !important;
	color: #283447 !important;
}

.card-two {
	border: 1px solid #DBDFEA;
	border-radius: 5px;
}

.badge-soft-primary {
	color: #405189;
	background-color: rgba(64, 81, 137, .1);
}

.badge-soft-secondary {
	color: #3577f1;
	background-color: rgba(53, 119, 241, .1);
}

.badge-soft-success {
	color: #0ab39c;
	background-color: rgba(10, 179, 156, .1);
}

.badge-soft-info {
	color: #299cdb;
	background-color: rgba(41, 156, 219, .1);
}

.badge-soft-warning {
	color: #f7b84b;
	background-color: rgba(247, 184, 75, .1);
}

.badge-soft-danger {
	color: #f06548;
	background-color: rgba(240, 101, 72, .1);
}

.badge-soft-dark {
	color: #212529;
	background-color: rgba(33, 37, 41, .1);
}

.badge-soft-light {
	color: #f3f6f9;
	background-color: rgba(243, 246, 249, .1);
}

.badge-outline-primary {
	color: #405189;
	border: 1px solid #405189;
	background-color: transparent;
}

.badge-outline-secondary {
	color: #3577f1;
	border: 1px solid #3577f1;
	background-color: transparent;
}

.badge-outline-success {
	color: #0ab39c;
	border: 1px solid #0ab39c;
	background-color: transparent;
}

.badge-outline-info {
	color: #299cdb;
	border: 1px solid #299cdb;
	background-color: transparent;
}

.badge-outline-warning {
	color: #f7b84b;
	border: 1px solid #f7b84b;
	background-color: transparent;
}

.badge-outline-danger {
	color: #f06548;
	border: 1px solid #f06548;
	background-color: transparent;
}

.badge-outline-dark {
	color: #212529;
	border: 1px solid #212529;
	background-color: transparent;
}

.badge-outline-light {
	color: #f3f6f9;
	border: 1px solid #f3f6f9;
	background-color: transparent;
}

.badge-gray-outline {
	background-color: #fff;
	border: 1px solid blue;
	color: gray;
}

.badge-gradient-primary {
	background: linear-gradient(135deg, #405189 0, #0ab39c 100%);
}

.badge-gradient-secondary {
	background: linear-gradient(135deg, #3577f1 0, #299cdb 100%);
}

.badge-gradient-success {
	background: linear-gradient(135deg, #0ab39c 0, #f7b84b 100%);
}

.badge-gradient-danger {
	background: linear-gradient(135deg, #f06548 0, #3577f1 100%);
}

.badge-gradient-warning {
	background: linear-gradient(135deg, #f7b84b 0, #eb990a 100%);
}

.badge-gradient-info {
	background: linear-gradient(135deg, #299cdb 0, #0ab39c 100%);
}

.badge-gradient-dark {
	background: linear-gradient(135deg, #212529 0, #405189 100%);
}

.breadcrumb.breadcrumb-colored {
	padding: 15px;
	border-radius: 5px;
}

.breadcrumb.breadcrumb-colored.bg-primary {
	background: #3a57e8 !important;
}

.breadcrumb.breadcrumb-colored.bg-primary li {
	color: #fff;
}

.breadcrumb.breadcrumb-colored.bg-primary li a {
	color: #fff;
}

.breadcrumb.breadcrumb-colored.bg-secondary {
	background: #00D3C7 !important;
}

.irs--flat .irs-bar,
.irs--flat .irs-from,
.irs--flat .irs-to,
.irs--flat .irs-single {
	background: #3a57e8;
}

.irs--flat .irs-handle>i:first-child {
	background: #3a57e8;
}

.irs--sharp .irs-handle,
.irs--sharp .irs-from,
.irs--sharp .irs-to,
.irs--sharp .irs-single,
.irs--sharp .irs-min,
.irs--sharp .irs-max {
	background: #00D3C7;
}

.irs--sharp .irs-handle>i:first-child {
	border-top-color: #00D3C7;
}

.ribbon-primary {
	background: #3a57e8;
}

.ribbon-primary.ribbon-corner:before {
	border-top-color: #3a57e8;
	border-left-color: #3a57e8;
}

.ribbon-primary.ribbon-corner.ribbon-right:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
}

.ribbon-primary.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3a57e8;
}

.ribbon-primary.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #43f;
	border-right-color: #43f;
}

.ribbon-primary.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #43f;
	border-left-color: #43f;
}

.ribbon-primary.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #43f;
	border-right-color: #43f;
}

.ribbon-primary.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #43f;
	border-right-color: transparent;
	border-left-color: #43f;
}

.ribbon-bookmark.ribbon-primary:before {
	border-color: #3a57e8;
	border-right-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-primary:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-secondary:before {
	border-right-color: #f73164;
	border-left-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-success:before {
	border-right-color: #51bb25;
	border-left-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-danger:before {
	border-right-color: #dc3545;
	border-left-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-info:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-light:before {
	border-right-color: #f4f4f4;
	border-left-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-dark:before {
	border-right-color: #2c323f;
	border-left-color: transparent;
}

.ribbon-bookmark.ribbon-right.ribbon-warning:before {
	border-right-color: #f8d62b;
	border-left-color: transparent;
}

.ribbon-bookmark.ribbon-secondary:before {
	border-color: #f73164;
	border-right-color: transparent;
}

.ribbon-bookmark.ribbon-success:before {
	border-color: #51bb25;
	border-right-color: transparent;
}

.ribbon-bookmark.ribbon-danger:before {
	border-color: #dc3545;
	border-right-color: transparent;
}

.ribbon-bookmark.ribbon-info:before {
	border-color: #3a57e8;
	border-right-color: transparent;
}

.ribbon-bookmark.ribbon-light:before {
	border-color: #f4f4f4;
	border-right-color: transparent;
}

.ribbon-bookmark.ribbon-dark:before {
	border-color: #2c323f;
	border-right-color: transparent;
}

.ribbon-bookmark.ribbon-warning:before {
	border-color: #f8d62b;
	border-right-color: transparent;
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-primary:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-primary:before {
	border-right-color: #3a57e8;
	border-bottom-color: transparent;
}

.ribbon-secondary {
	background: #f73164;
	background: #f73164;
}

.ribbon-secondary.ribbon-corner:before {
	border-top-color: #f73164;
	border-left-color: #f73164;
}

.ribbon-secondary.ribbon-corner.ribbon-right:before {
	border-right-color: #f73164;
	border-left-color: transparent;
}

.ribbon-secondary.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f73164;
}

.ribbon-secondary.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #ec0944;
	border-right-color: #ec0944;
}

.ribbon-secondary.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #ec0944;
	border-left-color: #ec0944;
}

.ribbon-secondary.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #ec0944;
	border-right-color: #ec0944;
}

.ribbon-secondary.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #ec0944;
	border-right-color: transparent;
	border-left-color: #ec0944;
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-secondary:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-secondary:before {
	border-right-color: #f73164;
	border-bottom-color: transparent;
}

.ribbon-success {
	background: #51bb25;
	background: #51bb25;
}

.ribbon-success.ribbon-corner:before {
	border-top-color: #51bb25;
	border-left-color: #51bb25;
}

.ribbon-success.ribbon-corner.ribbon-right:before {
	border-right-color: #51bb25;
	border-left-color: transparent;
}

.ribbon-success.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #51bb25;
}

.ribbon-success.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #3f901d;
	border-right-color: #3f901d;
}

.ribbon-success.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #3f901d;
	border-left-color: #3f901d;
}

.ribbon-success.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3f901d;
	border-right-color: #3f901d;
}

.ribbon-success.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #3f901d;
	border-right-color: transparent;
	border-left-color: #3f901d;
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-success:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-success:before {
	border-right-color: #51bb25;
	border-bottom-color: transparent;
}

.ribbon-danger {
	background: #dc3545;
	background: #dc3545;
}

.ribbon-danger.ribbon-corner:before {
	border-top-color: #dc3545;
	border-left-color: #dc3545;
}

.ribbon-danger.ribbon-corner.ribbon-right:before {
	border-right-color: #dc3545;
	border-left-color: transparent;
}

.ribbon-danger.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #dc3545;
}

.ribbon-danger.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #bd2130;
	border-right-color: #bd2130;
}

.ribbon-danger.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #bd2130;
	border-left-color: #bd2130;
}

.ribbon-danger.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #bd2130;
	border-right-color: #bd2130;
}

.ribbon-danger.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #bd2130;
	border-right-color: transparent;
	border-left-color: #bd2130;
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-danger:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-danger:before {
	border-right-color: #dc3545;
	border-bottom-color: transparent;
}

.ribbon-info {
	background: #3a57e8;
	background: #3a57e8;
}

.ribbon-info.ribbon-corner:before {
	border-top-color: #3a57e8;
	border-left-color: #3a57e8;
}

.ribbon-info.ribbon-corner.ribbon-right:before {
	border-right-color: #3a57e8;
	border-left-color: transparent;
}

.ribbon-info.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #3a57e8;
}

.ribbon-info.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #9106e7;
	border-right-color: #9106e7;
}

.ribbon-info.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #9106e7;
	border-left-color: #9106e7;
}

.ribbon-info.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #9106e7;
	border-right-color: #9106e7;
}

.ribbon-info.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #9106e7;
	border-right-color: transparent;
	border-left-color: #9106e7;
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-info:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-info:before {
	border-right-color: #3a57e8;
	border-bottom-color: transparent;
}

.ribbon-light {
	background: #f4f4f4;
	background: #f4f4f4;
}

.ribbon-light.ribbon-corner:before {
	border-top-color: #f4f4f4;
	border-left-color: #f4f4f4;
}

.ribbon-light.ribbon-corner.ribbon-right:before {
	border-right-color: #f4f4f4;
	border-left-color: transparent;
}

.ribbon-light.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f4f4f4;
}

.ribbon-light.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #dbdbdb;
	border-right-color: #dbdbdb;
}

.ribbon-light.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #dbdbdb;
	border-left-color: #dbdbdb;
}

.ribbon-light.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #dbdbdb;
	border-right-color: #dbdbdb;
}

.ribbon-light.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #dbdbdb;
	border-right-color: transparent;
	border-left-color: #dbdbdb;
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-light:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-light:before {
	border-right-color: #f4f4f4;
	border-bottom-color: transparent;
}

.ribbon-dark {
	background: #2c323f;
	background: #2c323f;
}

.ribbon-dark.ribbon-corner:before {
	border-top-color: #2c323f;
	border-left-color: #2c323f;
}

.ribbon-dark.ribbon-corner.ribbon-right:before {
	border-right-color: #2c323f;
	border-left-color: transparent;
}

.ribbon-dark.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #2c323f;
}

.ribbon-dark.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #171a21;
	border-right-color: #171a21;
}

.ribbon-dark.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #171a21;
	border-left-color: #171a21;
}

.ribbon-dark.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #171a21;
	border-right-color: #171a21;
}

.ribbon-dark.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #171a21;
	border-right-color: transparent;
	border-left-color: #171a21;
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-dark:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-dark:before {
	border-right-color: #2c323f;
	border-bottom-color: transparent;
}

.ribbon-warning {
	background: #f8d62b;
	background: #f8d62b;
}

.ribbon-warning.ribbon-corner:before {
	border-top-color: #f8d62b;
	border-left-color: #f8d62b;
}

.ribbon-warning.ribbon-corner.ribbon-right:before {
	border-right-color: #f8d62b;
	border-left-color: transparent;
}

.ribbon-warning.ribbon-corner.ribbon-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #f8d62b;
}

.ribbon-warning.ribbon-clip:before {
	border-color: transparent;
	border-top-color: #e8c308;
	border-right-color: #e8c308;
}

.ribbon-warning.ribbon-clip-right:before {
	border-right-color: transparent;
	border-top-color: #e8c308;
	border-left-color: #e8c308;
}

.ribbon-warning.ribbon-clip-bottom:before {
	border-top-color: transparent;
	border-bottom-color: #e8c308;
	border-right-color: #e8c308;
}

.ribbon-warning.ribbon-clip-bottom-right:before {
	border-top-color: transparent;
	border-bottom-color: #e8c308;
	border-right-color: transparent;
	border-left-color: #e8c308;
}

.ribbon-bookmark.ribbon-vertical-left.ribbon-warning:before,
.ribbon-bookmark.ribbon-vertical-right.ribbon-warning:before {
	border-right-color: #f8d62b;
	border-bottom-color: transparent;
}

.ribbon-wrapper {
	position: relative;
	padding-top: 40px;
}

.ribbon-wrapper .card-body,
.ribbon-vertical-left-wrapper .card-body,
.ribbon-vertical-right-wrapper .card-body {
	position: unset;
}

.ribbon {
	padding: 0 20px;
	height: 30px;
	line-height: 30px;
	clear: left;
	position: absolute;
	top: 12px;
	left: 0px;
	color: #fff;
	z-index: 1;
}

.ribbon-right {
	left: auto;
	right: -2px;
}

.ribbon-vertical-left-wrapper {
	padding-left: 40px;
	position: relative;
}

.ribbon-vertical-left {
	clear: none;
	padding: 0 5px;
	height: 70px;
	width: 30px;
	line-height: 70px;
	text-align: center;
	left: 12px;
	top: -2px;
}

.ribbon-vertical-right-wrapper {
	padding-right: 40px;
}

.ribbon-vertical-right {
	clear: none;
	padding: 0 5px;
	height: 70px;
	width: 30px;
	line-height: 70px;
	text-align: center;
	top: -2px;
	left: auto;
	right: 12px;
}

.timeline {
	position: relative;
	padding: 20px 0 20px;
	list-style: none;
	max-width: 1200px;
	margin: 0 auto;
}

.timeline:before {
	content: " ";
	position: absolute;
	top: 0;
	bottom: 0;
	left: 50%;
	width: 3px;
	margin-left: -1.5px;
	background-color: #e9ecef;
}

.timeline>li {
	position: relative;
	margin-bottom: 20px;
}

.timeline>li:after {
	clear: both;
	clear: both;
}

.timeline>li>.timeline-panel {
	float: left;
	position: relative;
	width: 46%;
	padding: 20px;
	border: 1px solid #e9ecef;
	border-radius: 0.25rem;
	-webkit-box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
	box-shadow: 0 1px 6px rgba(0, 0, 0, 0.05);
}

.timeline>li>.timeline-panel:before {
	content: " ";
	display: inline-block;
	position: absolute;
	top: 26px;
	right: -8px;
	border-top: 8px solid transparent;
	border-right: 0 solid #e9ecef;
	border-bottom: 8px solid transparent;
	border-left: 8px solid #e9ecef;
}

.timeline>li>.timeline-panel:after {
	content: " ";
	display: inline-block;
	position: absolute;
	top: 27px;
	right: -7px;
	border-top: 7px solid transparent;
	border-right: 0 solid #fff;
	border-bottom: 7px solid transparent;
	border-left: 7px solid #fff;
}

.timeline>li>.timeline-badge {
	z-index: 1;
	position: absolute;
	top: 16px;
	left: 50%;
	width: 50px;
	height: 50px;
	margin-left: -25px;
	border-radius: 50% 50% 50% 50%;
	text-align: center;
	font-size: 1.4em;
	line-height: 50px;
	color: #fff;
	overflow: hidden;
}

.timeline>li.timeline-inverted>.timeline-panel {
	float: right;
}

.timeline>li.timeline-inverted>.timeline-panel:before {
	right: auto;
	left: -8px;
	border-right-width: 8px;
	border-left-width: 0;
}

.timeline>li.timeline-inverted>.timeline-panel:after {
	right: auto;
	left: -7px;
	border-right-width: 7px;
	border-left-width: 0;
}

.timeline>li:before,
.timeline>li:after {
	content: " ";
	display: table;
	content: " ";
	display: table;
}

.timeline-badge.primary {
	background-color: #fb9678;
}

.timeline-badge.success {
	background-color: #00c292;
}

.timeline-badge.warning {
	background-color: #fec107;
}

.timeline-badge.danger {
	background-color: #e46a76;
}

.timeline-badge.info {
	background-color: #03a9f3;
}

.timeline-title {
	margin-top: 0;
	color: inherit;
	font-weight: 400;
}

.timeline-body>p,
.timeline-body>ul {
	margin-bottom: 0;
}

.timeline-body>p+p {
	margin-top: 5px;
}

.cd-horizontal-timeline {
	opacity: 0;
	margin: 2em auto;
	-webkit-transition: opacity 0.2s;
	-moz-transition: opacity 0.2s;
	transition: opacity 0.2s;
}

.cd-horizontal-timeline .events {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 30px;
	height: 2px;
	background: #dfdfdf;
	-webkit-transition: -webkit-transform 0.4s;
	-moz-transition: -moz-transform 0.4s;
	transition: transform 0.4s;
}

.cd-horizontal-timeline .events a {
	padding-bottom: 6px;
	color: #3a57e8;
	position: absolute;
	bottom: 0;
	z-index: 2;
	text-align: center;
	font-size: 14px;
	padding-bottom: 15px;
	-webkit-transform: translateZ(0);
	-moz-transform: translateZ(0);
	-ms-transform: translateZ(0);
	-o-transform: translateZ(0);
	transform: translateZ(0);
}

.cd-horizontal-timeline .events a.selected {
	pointer-events: none;
}

.cd-horizontal-timeline .events a.selected::after {
	border-color: #3a57e8;
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.cd-horizontal-timeline .events a::after {
	content: "";
	position: absolute;
	left: 50%;
	right: auto;
	-webkit-transform: translateX(-50%);
	-moz-transform: translateX(-50%);
	-ms-transform: translateX(-50%);
	-o-transform: translateX(-50%);
	transform: translateX(-50%);
	bottom: -5px;
	height: 12px;
	width: 12px;
	border-radius: 50%;
	border: 2px solid #dfdfdf;
	background-color: #f8f8f8;
	-webkit-transition: background-color 0.3s, border-color 0.3s;
	-moz-transition: background-color 0.3s, border-color 0.3s;
	transition: background-color 0.3s, border-color 0.3s;
}

.cd-horizontal-timeline .events a.older-event::after {
	border-color: #3a57e8;
}

.cd-horizontal-timeline .m-t-40 {
	margin-top: 25px !important;
}

.cd-horizontal-timeline table {
	border-collapse: collapse;
	border-spacing: 0;
}

.cd-horizontal-timeline::before {
	content: "mobile";
	display: none;
}

.cd-horizontal-timeline.loaded {
	opacity: 1;
}

.cd-horizontal-timeline .timeline {
	position: relative;
	height: 100px;
	width: 90%;
	max-width: 800px;
	margin: 0 auto;
}

.cd-horizontal-timeline .timeline:before {
	content: " ";
	display: none;
	bottom: 0;
	left: 0%;
	width: 0px;
	margin-left: -1.5px;
	background-color: #eeeeee;
}

.cd-horizontal-timeline .events-wrapper {
	position: relative;
	height: 100%;
	margin: 0 40px;
	overflow: hidden;
}

.cd-horizontal-timeline .events-wrapper::before {
	left: 0;
}

.cd-horizontal-timeline .events-wrapper::after {
	right: 0;
}

.cd-horizontal-timeline .filling-line {
	position: absolute;
	z-index: 1;
	left: 0;
	top: 0;
	height: 100%;
	width: 100%;
	background-color: #3a57e8;
	-webkit-transform: scaleX(0);
	-moz-transform: scaleX(0);
	-ms-transform: scaleX(0);
	-o-transform: scaleX(0);
	transform: scaleX(0);
	-webkit-transform-origin: left center;
	-moz-transform-origin: left center;
	-ms-transform-origin: left center;
	-o-transform-origin: left center;
	transform-origin: left center;
	-webkit-transition: -webkit-transform 0.3s;
	-moz-transition: -moz-transform 0.3s;
	transition: transform 0.3s;
}

.cd-horizontal-timeline .events-content {
	position: relative;
	width: 100%;
	margin: 2em 0;
	overflow: hidden;
	-webkit-transition: height 0.4s;
	-moz-transition: height 0.4s;
	transition: height 0.4s;
}

.cd-horizontal-timeline .events-content li {
	position: absolute;
	z-index: 1;
	width: 100%;
	left: 0;
	top: 0;
	-webkit-transform: translateX(-100%);
	-moz-transform: translateX(-100%);
	-ms-transform: translateX(-100%);
	-o-transform: translateX(-100%);
	transform: translateX(-100%);
	padding: 0 5%;
	opacity: 0;
	-webkit-animation-duration: 0.4s;
	-moz-animation-duration: 0.4s;
	animation-duration: 0.4s;
	-webkit-animation-timing-function: ease-in-out;
	-moz-animation-timing-function: ease-in-out;
	animation-timing-function: ease-in-out;
}

.cd-horizontal-timeline .events-content li.selected {
	position: relative;
	opacity: 1;
	-webkit-transform: translateX(0);
	-moz-transform: translateX(0);
	-ms-transform: translateX(0);
	-o-transform: translateX(0);
	transform: translateX(0);
}

.cd-horizontal-timeline .events-content li>* {
	max-width: 800px;
	margin: 0 auto;
}

.cd-horizontal-timeline .events-content h2 {
	font-weight: 600;
	margin-bottom: 0px;
}

.cd-horizontal-timeline .events-content em {
	display: block;
	font-style: italic;
	margin: 10px auto;
}

.cd-horizontal-timeline .events-content em::before {
	content: "- ";
}

.cd-horizontal-timeline .events-content p {
	font-size: 16px;
}

.cd-horizontal-timeline .filling-line,
.cd-horizontal-timeline .events a.selected::after {
	background: #3a57e8;
}

.cd-horizontal-timeline ol,
.cd-horizontal-timeline ul {
	list-style: none;
}

.cd-timeline-navigation a:hover,
.cd-timeline-navigation a:focus {
	border-color: #3a57e8;
}

.cd-horizontal-timeline a,
.cd-horizontal-timeline a:hover,
.cd-horizontal-timeline a:focus {
	color: #3a57e8;
}

.cd-horizontal-timeline blockquote,
.cd-horizontal-timeline q {
	quotes: none;
}

.cd-horizontal-timeline blockquote:before,
.cd-horizontal-timeline blockquote:after,
.cd-horizontal-timeline q:before,
.cd-horizontal-timeline q:after {
	content: "";
	content: none;
}

.cd-horizontal-timeline .events-wrapper::after,
.cd-horizontal-timeline .events-wrapper::before {
	content: "";
	position: absolute;
	z-index: 2;
	top: 0;
	height: 100%;
	width: 20px;
}

.no-touch .cd-horizontal-timeline .events a:hover::after {
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.no-touch .cd-timeline-navigation a:hover {
	border-color: #7b9d6f;
}

.no-touch .cd-timeline-navigation a.inactive:hover {
	border-color: #dfdfdf;
}

.cd-timeline-navigation a {
	position: absolute;
	z-index: 1;
	top: 50%;
	bottom: auto;
	-webkit-transform: translateY(-50%);
	-moz-transform: translateY(-50%);
	-ms-transform: translateY(-50%);
	-o-transform: translateY(-50%);
	transform: translateY(-50%);
	height: 34px;
	width: 34px;
	border-radius: 50%;
	border: 2px solid #dfdfdf;
	overflow: hidden;
	color: transparent;
	text-indent: 100%;
	white-space: nowrap;
	-webkit-transition: border-color 0.3s;
	-moz-transition: border-color 0.3s;
	transition: border-color 0.3s;
}

.cd-timeline-navigation a::after {
	content: "";
	position: absolute;
	height: 16px;
	width: 16px;
	left: 50%;
	top: 50%;
	bottom: auto;
	right: auto;
	-webkit-transform: translateX(-50%) translateY(-50%);
	-moz-transform: translateX(-50%) translateY(-50%);
	-ms-transform: translateX(-50%) translateY(-50%);
	-o-transform: translateX(-50%) translateY(-50%);
	transform: translateX(-50%) translateY(-50%);
	background: url(../img/arrow.svg) no-repeat 0 0;
}

.cd-timeline-navigation a.prev {
	left: 0;
	-webkit-transform: translateY(-50%) rotate(180deg);
	-moz-transform: translateY(-50%) rotate(180deg);
	-ms-transform: translateY(-50%) rotate(180deg);
	-o-transform: translateY(-50%) rotate(180deg);
	transform: translateY(-50%) rotate(180deg);
}

.cd-timeline-navigation a.next {
	right: 0;
}

.cd-timeline-navigation a.inactive {
	cursor: not-allowed;
}

.cd-timeline-navigation a.inactive::after {
	background-position: 0 -16px;
}

.cd-horizontal-timeline .events-content li.enter-right,
.cd-horizontal-timeline .events-content li.leave-right {
	-webkit-animation-name: cd-enter-right;
	-moz-animation-name: cd-enter-right;
	animation-name: cd-enter-right;
}

.cd-horizontal-timeline .events-content li.enter-left,
.cd-horizontal-timeline .events-content li.leave-left {
	-webkit-animation-name: cd-enter-left;
	-moz-animation-name: cd-enter-left;
	animation-name: cd-enter-left;
}

.cd-horizontal-timeline .events-content li.leave-right,
.cd-horizontal-timeline .events-content li.leave-left {
	-webkit-animation-direction: reverse;
	-moz-animation-direction: reverse;
	animation-direction: reverse;
}

.cd-horizontal-timeline .events-content em,
.cd-horizontal-timeline .events-content p {
	line-height: 30px;
}

.h-250 {
	height: 250px;
}

.icons-list {
	padding: 0;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	flex-wrap: wrap;
}

.icons-list li {
	display: block;
	width: 40px;
	height: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50%;
	font-size: 18px;
	border-radius: 50px;
	box-shadow: 0px 2px 3px rgb(215, 197, 255);
	border: 1px solid #e6ebf1;
	color: #3a57e8;
	margin: 5px;
}

.custom-file-container {
	box-sizing: border-box;
	position: relative;
	display: block;
}

.custom-file-container label {
	color: #3a57e8;
}

.custom-file-container__custom-file {
	box-sizing: border-box;
	position: relative;
	display: inline-block;
	width: 100%;
	height: calc(2.25rem + 2px);
	margin-bottom: 0;
	margin-top: 5px;
}

.custom-file-container__custom-file:hover {
	cursor: pointer;
}

.custom-file-container__custom-file__custom-file-input {
	box-sizing: border-box;
	min-width: 14rem;
	max-width: 100%;
	height: calc(2.25rem + 2px);
	margin: 0;
	opacity: 0;
}

.custom-file-container__custom-file__custom-file-input:focus~span {
	outline: 1px dotted #dddde0;
	outline: 0px auto -webkit-focus-ring-color;
}

.custom-file-container__custom-file__custom-file-control {
	box-sizing: border-box;
	position: absolute;
	top: 0;
	right: 0;
	left: 0;
	z-index: 1;
	height: auto;
	overflow: hidden;
	line-height: 1.5;
	user-select: none;
	background-clip: padding-box;
	border-radius: 0.25rem;
	height: auto;
	border: 1px solid #f1f2f3;
	color: #3b3f5c;
	font-size: 15px;
	padding: 8px 10px;
	letter-spacing: 1px;
	background-color: #f1f2f3;
}

.custom-file-container__custom-file__custom-file-control__button {
	box-sizing: border-box;
	position: absolute;
	top: 0;
	right: 0;
	z-index: 6;
	display: block;
	height: auto;
	padding: 10px 16px;
	line-height: 1.25;
	background-color: #bdbdbd;
	color: #ffffff;
	border-left: 1px solid #e0e6ed;
	box-sizing: border-box;
}

.custom-file-container__image-preview {
	box-sizing: border-box;
	margin-top: 54px;
	margin-bottom: 40px;
	height: 250px;
	width: 100%;
	border-radius: 4px;
	background-size: contain;
	background-position: center center;
	background-repeat: no-repeat;
	background-color: #ffffff;
	overflow: auto;
	padding: 15px;
	-webkit-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.custom-file-container__image-multi-preview {
	position: relative;
	box-sizing: border-box;
	border-radius: 6px;
	background-size: cover;
	background-position: center center;
	background-repeat: no-repeat;
	float: left;
	margin: 1.858736%;
	width: 29.615861214%;
	height: 90px;
	box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.25);
	-webkit-transition: all 0.2s ease;
	-ms-transition: all 0.2s ease;
	transition: all 0.2s ease;
}

.custom-file-container__image-multi-preview__single-image-clear {
	background: #ffffff;
	width: 20px;
	height: 20px;
	border-radius: 50%;
	text-align: center;
	margin-top: -6px;
	border-radius: 50%;
	box-shadow: 0 4px 10px 0 rgba(51, 51, 51, 0.25);
	position: absolute;
	left: -6px;
}

.custom-file-container__image-multi-preview__single-image-clear:hover {
	background: #cbcbbd;
	cursor: pointer;
}

.custom-file-container__image-multi-preview__single-image-clear__icon {
	color: #3a57e8;
	display: block;
	margin-top: -2px;
}

.note-editor.card {
	padding: 0.5rem;
	margin-bottom: 0;
}

.note-toolbar.card-header {
	padding: 0;
	padding-bottom: 0.5rem;
}

.nav.nav-pills.navtab-bg.nav-justified .nav-link {
	background: linear-gradient(135deg, #61c79738, #6a3ef62e);
	color: #3a57e8;
	border-radius: 50px;
	padding: 10px 0;
	font-size: 15px;
}

.nav-pills .nav-link.active {
	/* background: #3a57e8 !important; */
	background: linear-gradient(135deg, #61c797, #6a3ef6) !important;
	color: #fff !important;
	border-radius: 50px;
}

.navtab-bg li {
	margin-right: 5px;
}

.btn-outline-light,
.btn:disabled {
	color: #ababab;
	border-color: #e6e6e6;
}

.card-buttons .btn.btn-secondary {
	background: #00d3c7 !important;
	border-color: #00d3c7;
}

.note-editor.note-frame .note-statusbar .note-resizebar {
	padding-top: 0;
	height: 0;
	width: 100%;
	cursor: ns-resize;
	background: transparent;
	border: 0;
}

.wizard .nav-tabs {
	position: relative;
	margin-top: 20px;
	border: 0;
	margin-bottom: 30px;
}

.wizard .nav-item {
	position: relative;
}

.wizard .nav-item .nav-link {
	width: 56px;
	height: 56px;
	content: "";
	position: absolute;
	background: #fff;
	left: 50%;
	color: #5156be;
	top: 50%;
	font-size: 20px;
	-webkit-transform: translateY(-50%);
	transform: translateY(-50%);
	border: 1px solid rgba(81, 86, 190, 0.2);
}

.wizard .nav-tabs li:first-child::after {
	display: none;
}

.wizard .nav-item .nav-link.active {
	background: #e9e9ef;
	color: #5156be;
	border: 1px solid rgba(81, 86, 190, 0.2);
}

.wizard .nav-tabs li:after {
	content: "";
	width: 75%;
	position: absolute;
	margin-left: auto;
	margin-right: auto;
	background: #e9e9ef;
	height: 2px;
	left: -30%;
	top: 38%;
	z-index: 1;
}

.alertify .ajs-footer {
	border-top: 1px solid #eee;
}

.alertify .ajs-footer .ajs-buttons .ajs-button {
	font-weight: 500;
	background-color: transparent;
	color: #000;
	border: 0;
	font-size: 14px;
	font-weight: 700;
	text-transform: uppercase;
}

.alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
	color: #3a57e8;
}

.alertify .ajs-footer .ajs-buttons.ajs-primary {
	text-align: right;
}

.alertify .ajs-body .ajs-content .ajs-input {
	display: block;
	width: 100%;
	padding: 8px;
	margin: 4px;
	border-radius: 2px;
	border: 1px solid #ccc;
}

.alertify .ajs-body .ajs-content .ajs-input:focus-visible {
	outline: 0;
}

.alertify .ajs-commands {
	right: 4px;
	left: auto;
	margin: -14px 0 0 24px;
}

.alertify .ajs-header {
	border-bottom: 1px solid #eee;
}

.alertify-notifier .ajs-message {
	background-color: #3a57e8;
	border-color: #3a57e8;
	color: #ffffff;
	text-shadow: none !important;
}

.alertify-notifier .ajs-message.ajs-success {
	background-color: #26af48;
	border-color: #26af48;
}

.alertify-notifier .ajs-message.ajs-error {
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.alertify-notifier .ajs-message.ajs-warning {
	background-color: #ffbf53;
	border-color: #ffbf53;
}

.alertify-notifier.ajs-right {
	right: 10px;
	left: auto;
}

.alertify-notifier.ajs-right .ajs-message {
	right: -320px;
	left: auto;
}

.alertify-notifier.ajs-right .ajs-message.ajs-visible {
	right: 290px;
	left: auto;
}

.alertify-notifier.ajs-left {
	left: 10px;
	right: auto;
}

.alertify-notifier.ajs-left .ajs-message {
	left: -300px;
	right: auto;
}

.alertify-notifier.ajs-left .ajs-message.ajs-visible {
	left: 0;
	right: auto;
}

body[data-layout-mode=dark] .alertify .ajs-dialog {
	background-color: #313533;
}

body[data-layout-mode=dark] .alertify .ajs-body {
	color: #adb5bd;
}

body[data-layout-mode=dark] .alertify .ajs-body .ajs-content .ajs-input {
	color: #adb5bd;
	background-color: #363a38;
	border: 1px solid #3b403d;
}

body[data-layout-mode=dark] .alertify .ajs-footer .ajs-buttons .ajs-button {
	color: #adb5bd;
}

body[data-layout-mode=dark] .alertify .ajs-footer .ajs-buttons .ajs-button.ajs-ok {
	color: #3a57e8;
}

body[data-layout-mode=dark] .alertify .ajs-footer,
body[data-layout-mode=dark] .alertify .ajs-header {
	color: #ced4da;
	background-color: #313533;
	border-color: #3b403d;
}

.swal2-actions button {
	margin-right: 10px;
}

.select2-container {
	min-width: 100% !important;
	width: auto !important;
}

.breadcrumb {
	position: relative;
}

.card-buttons .breadcrumb .breadcrumb-item {
	position: relative;
}

.card-buttons .breadcrumb .breadcrumb-item+.breadcrumb-item::before {
	float: left;
	padding-right: 0.5rem;
	color: #6c757d;
	content: "/";
	display: block;
	padding-right: 5px;
}

.card-buttons .breadcrumb.breadcrumb-dot .breadcrumb-item+.breadcrumb-item::before {
	content: ".";
	font-size: 25px;
	position: relative;
	top: -13px;
}

.card-buttons .breadcrumb {
	background-color: transparent;
	color: #6c757d;
	font-size: 16px;
	font-weight: 500;
	margin: 0;
	padding: 0;
}

.card-buttons .breadcrumb-colored {
	margin: 0 0 10px;
	padding: 12px 16px;
	border-radius: 4px;
}

.btn-primary span {
	color: #fff;
}

.btn.btn-primary:disabled {
	color: #fff;
}

.swal2-header .swal2-title {
	font-size: 22px;
}

.auth-logo {
	display: flex;
	justify-content: center;
}

.modal-dialog.modal-bottom {
	display: flex;
	align-items: end;
	height: 90%;
}

.modal-dialog.modal-right {
	margin-right: 50px;
}

.sidebar .logout-btn {
	margin-top: 0;
}

table.dataTable>thead>tr>th,
table.dataTable>thead>tr>td {
	border-bottom: 1px solid #fff;
}

.dataTables_paginate .paginate_button {
	background: #e9ecef !important;
}

.dataTables_paginate .paginate_button.previous {
	border-radius: 5px 0 0 5px;
}

.dataTables_paginate .paginate_button.next {
	border-radius: 0 5px 5px 0;
}

#DataTables_Table_0_wrapper .dt-layout-row:first-child {
	display: none;
}

#DataTables_Table_0_wrapper .dt-layout-row:last-child {
	padding: 0 20px;
}

#DataTables_Table_1_wrapper .dt-layout-row:first-child {
	display: none;
}

#DataTables_Table_1_wrapper .dt-layout-row:last-child {
	padding: 0 20px;
}

div.dt-container.dt-empty-footer tbody>tr:last-child>* {
	border-bottom: unset;
}

.dt-paging-button.disabled.first,
.dt-paging-button.disabled.last {
	display: none !important;
}

.dt-paging-button.previous {
	background: #e9ecef !important;
	padding: 5px 15px;
	font-size: 14px;
	border-radius: 5px 0 0 5px !important;
	margin: 0 !important;
}

.dt-paging-button.next {
	background: #e9ecef !important;
	padding: 5px 15px;
	font-size: 14px;
	margin: 0 !important;
	border-radius: 0 5px 5px 0 !important;
}

div.dt-container .dt-paging .dt-paging-button.current {
	background: #3a57e8 !important;
	border-color: #3a57e8 !important;
	padding: 0;
	color: #fff !important;
	padding: 5px 15px !important;
	margin: 0 !important;
}

div.dt-container .dt-paging .dt-paging-button.current:hover {
	background: #00d3c7 !important;
	border-color: #00d3c7 !important;
	color: #fff !important;
}

.datatable tr th:hover {
	outline: 0 !important;
}

#DataTables_Table_0_info {
	font-size: 14px;
}

.swal2-actions .swal2-confirm.btn:active {
	background-color: #3a57e8;
	border-color: #3a57e8;
}

.swal2-confirm {
	margin-right: 5px;
}

button.swal2-confirm {
	background: #3a57e8;
	border: 1px solid #3a57e8;
	color: #fff;
	border-radius: 5px;
	padding: 0.5rem 0.85rem;
	font-size: 14px;
	transition: all 0.5s;
	font-weight: 500;
}

button.swal2-cancel {
	background: #E70D0D;
	border: 1px solid #E70D0D;
	color: #fff;
	border-radius: 5px;
	padding: 0.5rem 0.85rem;
	font-size: 14px;
	transition: all 0.5s;
	font-weight: 500;
}


ul.nav.nav-pills.navtab-bg.nav-justified {
	width: 40%;
	margin: 0 auto;
	position: relative;
	z-index: 99;
	font-weight: 500;
}

.my-tasks-count-container {
	height: 100%;
	width: 150px;
	background: #fff0de;
	border-radius: 12px;
	display: grid;
	padding: 1rem;
	box-sizing: border-box;
	align-content: space-between;
	gap: 40px;
}

.newgen-image-tasks {
	background: url(../img/tasks.svg) no-repeat center;
	background-size: contain;
}

.newgen-image-tasks {
	width: 80px;
	height: 80px;
	margin-left: -7px;
}

.newgen-heading-medium {
	font-size: 30px;
	line-height: 44px;
	font-weight: 400;
}

.newgen-text-orange-500 {
	color: #e0741b;
}

.newgen-label-small {
	font-size: 12px;
	line-height: 18px;
	font-weight: 600;
}

.newgen-text-secondary-600 {
	color: #171e25;
}

.review-count {
	margin-bottom: 15px;
}

.card.top-departments {
	/* margin: 5px; */
	padding: 10px;
	display: flex;
	flex-direction: row;
	width: 100%;
	gap: 10px;
}

.my-tasks-list-wrapper {
	height: 100%;
	/* padding: 8px 0 20px 8px; */
	box-sizing: border-box;
	display: flex;
}

.my-tasks-list-container {
	width: 100%;
	border: 1px solid #e4e9f0;
	border-radius: 11px;
	position: relative;
	overflow-y: hidden;
	padding-right: 0px;
	box-sizing: border-box;
}

.my-individual-task {
	padding: 0 18px;
	cursor: pointer;
	display: flex;
	gap: 16px;
	background: #fff;
	margin: 10px;
	border-radius: 10px;
}

.my-individual-task.ng-scope.monitor.bg-blue {
	background: #3a57e81c;
}

.my-individual-task.bg-green {
	background: #dcfce7;
}

.my-individual-task.bg-purple {
	background: #fbf0ff;
}

.my-individual-task.ng-scope.monitor a {
	display: block;
	width: 100%;
}

.my-individual-task .task-info-container {
	padding: 10px 0;
	width: 100%;
}

.my-individual-task .my-individual-task-header {
	display: flex;
	justify-content: space-between;
	align-items: center;
}


.newgen-title-small {
	font-size: 20px;
	line-height: 30px;
	font-weight: 600;
}

.newgen-text-secondary-500 {
	color: #394657;
}

.newgen-label-large {
	font-size: 16px;
	line-height: 24px;
	font-weight: 600;
}

.newgen-btn-tertiary {
	color: #3e5ecc;
	cursor: pointer;
}

.newgen-secondary-400.newgen-text-secondary-400.ng-binding {
	color: green;
}

.my-individual-task:hover {
	background-color: #edf3ff;
}

.newgen-image-celebrating {
	background: url(../img/bg-birthday.png), #fff;
	background-size: contain;
	background-position: top;
	background-repeat: no-repeat;
	border-radius: 20px;
}

.carousel-inner {
	position: relative;
	width: 100%;
	overflow: hidden;
}

.birthday-aniversary-card {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	padding: 27px 24px 40px 24px;
	border-radius: 12px;
	box-sizing: border-box;
	background-position: top;
}

img.birthday-aniversar-user-photo {
	border-radius: 50%;
	width: 108px;
	height: 108px;
	margin-bottom: 12px;
}

.birthday-aniversar-info-container {
	padding: 16px 0;
	border-radius: 10px;
	width: 100%;
	display: flex;
	text-align: center;
	justify-content: center;
	flex-wrap: wrap;
	flex-direction: column;
	gap: 14px;
	align-items: center;
	/* background-color: #f5feff; */
}

.newgen-title-small {
	font-size: 20px;
	line-height: 30px;
	font-weight: 600;
}

.section3 h2 {
	font-size: 23px;
	color: #000;
	margin-bottom: 16px;
}

.section3 .help-links {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.section3 .help-links span {
	background: #fff;
	border: 1px solid #ccc;
	padding: 8px 12px;
	border-radius: 20px;
	font-size: 14px;
	cursor: pointer;
}

.right-panel {
	background: #fff;
	border-radius: 12px;
	padding: 20px;
	margin-bottom: 20px;
}

.arrow-flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
	/* margin-bottom: 17px; */
}

.right-panel .arrow-flex h2 {
	font-size: 20px;
}

.updated-list {
	padding: 10px;
	background-color: #3e5ecf1f;
	border-radius: 8px;
	margin-top: 10px;
}

.updated-list h5 {
	font-size: 15px;
}

.updated-list p {
	margin: 0;
}

.updated-list p {
	font-size: 14px;
}

.dash-icon {
	display: flex;
	justify-content: space-between;
}

.arrow-icon-cross {
	opacity: 0;
	visibility: hidden;
	transition: .3s all ease;
}

.dash-widget:hover .arrow-icon-cross {
	opacity: 1;
	visibility: visible;
	transition: .3s all ease;
}

.arrow-icon-cross i {
	font-size: 20px;
}

h2.mb-0.logo-text {
	font-size: 28px;
}

#app {
	font-size: 26px;
	font-weight: 600;
	margin-bottom: 10px;
	background-image: linear-gradient(-225deg, #3b4452 0%, #3b4452 29%, #3b4452 67%, #3b4452 100%);
	background-clip: border-box;
	text-fill-color: transparent;
	background-clip: text;
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
	text-fill-color: transparent;
	animation: textclip 2s linear infinite;
}

@keyframes textclip {
	to {
		background-position: 200% center;
	}
}

.mini-sidebar .Employ-Mint {
	font-size: 14px !important;
}

.toggle-theme {
	display: none;
}

span.employee-year-chart {
	text-align: center;
	display: block;
	font-size: 14px;
}

.reviews-task {
	display: flex;
	gap: 20px;
}

ul.nav.nav-tabs.twitter-bs-wizard-nav.nav-pills.nav-justified {
	border-bottom: none;
}

.top-add-line p {
	color: #1e1e1ebf;
}

span.hide-helps a {
	/* word-break: normal; */
	display: block;
	white-space: nowrap;
	font-weight: 500;
}

.twitter-bs-wizard a.nav-link.active {
	background: unset !important;
	color: unset !important;
	border-radius: unset !important;

}

table.table.table-bordered.mb-0.employ-added td {
	text-align: center;
	width: 50%;
	font-weight: 500;
}

table.table.table-bordered.mb-0.employ-added td span {
	color: #3a57e8;
	text-align: right;
}

ul.pager.wizard.twitter-bs-wizard-pager-link.added-epmloye-btn {
	display: flex;
	justify-content: left;
	gap: 16px;
}

ul.pager.wizard.twitter-bs-wizard-pager-link.added-epmloye-btn li {
	list-style-type: none;
}

.added-employ {
	display: grid;
	grid-template-columns: 50% 50%;
	text-align: left;
	gap: 1%;
}

.auth-bg .login-backgrounds {
	background: #ECEDF7;
}

.auth-bg .login-backgrounds .authentication-card {
	padding: 10px 40px;
}

.auth-bg .login-backgrounds .cover-img {
	position: absolute;
	bottom: 0px;
	right: 0px;
}

.auth-bg .login-backgrounds .authentication-card .authen-overlay-item {
	border-radius: 15px;
	padding: 30px 40px 0px;
	position: relative;
	z-index: 1;
	backdrop-filter: blur(10px);
	border: 1px solid rgba(6, 174, 212, 0.7019607843);
	max-width: 800px;
	margin: 0 auto;
}

.auth-bg .login-backgrounds .authentication-card .authen-overlay-item .authen-head {
	width: 100%;
	max-width: 700px;
	margin: auto;
}

.auth-bg .login-backgrounds .authentication-card .authen-overlay-item .authen-overlay-img {
	max-width: 700px;
}

.auth-bg .login-backgrounds .authentication-card .authen-overlay-item .authen-overlay-img img {
	width: 100%;
}

.bg-primary {
	background-color: #2e37a4 !important;
	border: 1px solid #3553e2 !important;
	color: #FFF;
}

.mx-auto.mb-4.text-center.login-page img {
	width: 200px;
}

form.d-flex.justify-content-center.align-items-center {
	padding: 30px 0;
}

.mx-auto.mb-4.text-center.login-page img {
	width: 150px;
}

.btn:hover {
	background-color: white;
}

a.dropdown-toggle.btn.btn-white.d-inline-flex.align-items-center img {
	width: 16px;
}

.avatar.avatar-xl.ep-detail {
	width: 6.6rem;
	height: 6.6rem;
}

.p-3.border-bottom p {
	margin-bottom: 0;
}

.accordion-body h6 {
	color: black;
	font-size: 14px;
	word-break: break-word;
}

.modal {
	background-color: #0000008a;
	/* opacity: 0.1; */
}

.tab-content.custom-accordion-items {
	padding-top: 0;
}

.three-blocks {
	animation: float 4s ease-in-out infinite;
}

.three-blocks-x {
	animation: float-x 4s ease-in-out infinite;
}

@keyframes float-x {

	0%,
	100% {
		transform: translate(0, 0);
	}

	50% {
		transform: translate(14px, 16px);
	}
}

@keyframes float {

	0%,
	100% {
		transform: translateY(0);
	}

	50% {
		transform: translateY(-10px);
	}
}


.login-backgrounds.login-covers.bg-primary.d-lg-flex.align-items-center.justify-content-center.d-none.flex-wrap.p-4.position-relative.h-100.z-0 {
	overflow: hidden;
}

.testi-contain.text-center img {
	width: 100%;
}

.accordion-button h5 {
	margin-bottom: 0;
}

.address-head {
	font-size: 15px;
	color: black;
	font-weight: 300;
}

a.btn.btn-sm.btn-icon.ms-auto.edit-img {
	float: right;
	font-size: 17px;
	position: absolute;
	top: 10px;
	Right: 10px;
}

.dropdown .dropdown-toggle.emp-type {
	padding-left: 0;
}

.es-search {
	width: 300px;
	height: 46px;
	border: 1px solid #c8d3de;
	border-radius: 12px;
	box-shadow: none;
	display: flex;
	padding: 5px 10px;
	position: relative;
}

ul.list-group.position-absolute.w-100.shadow.z-3 {
	left: 0;
	top: 45px;
}

.back-login {
	font-size: 13px;
	padding-left: 5px;
}

.back-login i {
	font-size: 13px;
}


ul.nav.nav-tabs.twitter-bs-wizard-nav.nav-pills.nav-justified li button.active {
	background: none !important;
}

.es-search .es-employee-photo {
	background-image: url(../img1/default-emp-icon.svg);
	background-repeat: no-repeat;
	margin-top: 1px;
	width: 45px;
	height: 35px;
	background-size: 32px;
}

.es-search .es-autocomplete {
	margin-top: 10px;
	margin-bottom: 10px;
	border: 0;
	align-self: center;
	border-color: transparent;
	text-decoration: auto;
	box-shadow: none;
	font-size: 15px;
	width: 100%;
}

.es-search .es-icon-search {
	padding-top: 32px;
	background-image: url(../img1/search-icon.svg);
	background-repeat: no-repeat;
	background-position: right;
	height: 14px;
	width: 14px;
	padding-left: 32px;
}

.es-search-emp {
	padding-bottom: 10px;
	font-size: 13px;
	font-weight: 500;
	margin-top: 10px;
}

thead.thead-light th {
	padding: 12px 26px !important;
	    background: transparent;
}

table#DataTables_Table_0 tbody tr td {
	padding: 12px 26px;
	text-align: center;
}

span.dt-column-order:before,
span.dt-column-order:before {
	color: black;
	opacity: 0.4 !important;
}

a.dropdown-toggle.btn.btn-white.d-inline-flex.align-items-center.no-drop-arrow {
	color: #3553e2;
	font-size: 16px;
	border: 1px solid #3553e2;
}

a.dropdown-toggle.btn.btn-white.d-inline-flex.align-items-center.no-drop-arrow:after {
	content: unset;
}



.tabingss a.nav-link {
	position: relative;
	/* padding: 8px 9px 22px 16px; */
	background-color: #fff;
	border-radius: 8px;
	flex: 1 1 12rem;
	height: 50px;
	text-align: left;
	border: 1px solid #C8D3DE;
	border-top: 1px solid #3a57e8 !important;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	font-size: 12px;
	color: #2f2f2f;
	gap: 4px;
}

.tabingss a.nav-link.active {
	position: relative;
	border-radius: 8px;
	flex: 1 1 12rem;
	text-align: left;
	height: 50px;
	width: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
}

li.nav-item.tabingss {}

ul.nav.nav-pills.nav-style-2.mb-3.tabingss1 {
	display: flex !important;
	flex-direction: row;
	flex-wrap: wrap;
	width: 100%;
}

.top-add-line.tabingss1 {}

a.dropdown-toggle.btn.btn-white.d-inline-flex.align-items-center.no-drop-arrow.aarow-vi:after {
	content: "\f078";
}

a.dropdown-toggle.btn.btn-white.d-inline-flex.align-items-center.no-drop-arrow.aarow-vi {
	font-size: 13px;
}

img.pro-img {
	width: 130px;
	margin-right: 100px;
}

table#DataTables_Table_0 {
	min-height: 200px;
}

.card-header.d-flex.align-items-center.justify-content-right.w-100.row-gap-3.border-bottom {
	justify-content: right;
}

.helpdesk-card {
	max-width: 500px;
	margin: auto;
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
	padding: 24px;
	transition: all 0.3s ease-in-out;
}

.helpdesk-card .helpdesk-header {
	margin-bottom: 24px;
}

.helpdesk-card .helpdesk-header h4 {
	margin: 0;
	font-size: 18px;
	color: #333;
	font-weight: 600;
}

.helpdesk-card .stat-change {
	font-size: 14px;
	color: #1212125;

}

.stats {
	display: flex;
	justify-content: space-between;
	gap: 20px;
}

.stat-box {
	flex: 1;
	text-align: center;
	padding: 20px;
	border-radius: 10px;
	background: #f1f4ff;
	transition: 0.3s;
}

.stat-box:hover {
	background: #e0e7ff;
	transform: translateY(-3px);
}

.stat-box .number {
	font-size: 32px;
	font-weight: 700;
	color: #3b82f6;
}

.stat-box .label {
	margin-top: 6px;
	font-size: 14px;
	color: #555;
}

span.stat-change span {
	color: green;
}

.input-group:focus {
	border-color: #3a57e8;
}

.apexcharts-legend.apexcharts-align-center.apx-legend-position-right {
	display: none;
}

.d-flex.chart-detailss {
	justify-content: between;
	align-items: center;
}

.card-header.side-detail.p-0 p {
	font-size: 14px;
	line-height: 20px;
}

.d-flex.chart-detailss {
	padding: 10px;
}

span.empty-state-msg {
	display: block;
	text-align: center;
	font-size: 15px;
}

.d-flex.confirmation {
	flex-direction: column;
	align-items: center;
	justify-content: center;
	height: 100%;
}

a.list-emoloy h6 {
	color: #181818;
}

a.list-emoloy p {
	color: #474c54;
}

.card .card-header.add {
	padding: 15px 20px;
}

.input-group>.form-control:focus,
.input-group>.form-floating:focus-within,
.input-group>.form-select:focus {
	z-index: 0;
}

.swiper-slide.swiper-slide-active.birthday-aniversary-card {
	display: flex;
}


.twitter-bs-wizard .twitter-bs-wizard-pager-link {
	display: flex;
	justify-content: space-between;
}

.month-selector {
	background-color: #fff;
	padding: 20px;
	border-radius: 6px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
	overflow-x: auto;
}

.month-item {
	padding: 10px 16px;
	text-align: center;
	margin-right: 10px;
	border-radius: 6px;
	cursor: pointer;
	color: #6c757d;
	min-width: 60px;
	transition: all 0.2s ease-in-out;
}

.month-item.active {
	background-color: #3b6ef6;
	color: white;
	font-weight: bold;
}

.month-item small {
	display: block;
	font-size: 12px;
}

.dummy-content {
	margin-top: 30px;
	padding: 20px;
	border-radius: 6px;
	background: #eef3ff;
	font-weight: 500;
}

/* Scroll on small screens */
.month-scroll {
	display: flex;
	flex-wrap: nowrap;
	overflow-x: auto;
	justify-content: space-between;
}

.month-scroll::-webkit-scrollbar {
	display: none;
}

.form-group-select-search {
	display: flex;
	justify-content: right;
}


.leave-container h2 {

	font-size: 18px;
	font-weight: 600;
	margin-bottom: 0px;
}

.chart-legend {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	margin-top: 0px;
	gap: 30px;
}

.legend-item {
	display: flex;
	align-items: center;
	font-size: 14px;
	background: #f2f4f7;
	border-radius: 8px;
	padding: 6px 10px;
}

.legend-color {
	width: 12px;
	height: 12px;
	border-radius: 50%;
	margin-right: 8px;
}

canvas {
	max-width: 100%;
}

.leave-container {
	background: #fff;
	border-radius: 12px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.05);
	padding: 30px 20px;
}

.form-group-select-search1 {
	display: flex;
	justify-content: space-between;
	align-items: center;
	margin-bottom: 30px;

}

.leave-count {
	background-color: #007BFF;
	/* Bootstrap blue */
	color: #fff;
	padding: 2px 6px;
	border-radius: 4px;
	font-size: 12px;
	display: inline-block;
	margin-top: 0px;
	width: 100%;
}

.fc .fc-daygrid-day-bg .fc-bg-event {
	z-index: 6;
	background: none;
}

.fc-daygrid-day-number {
	display: block;
}

#leave-details {
	/* border-left: 1px solid #ddd; */
	padding: 10px;
	background: #ffffff;
	min-height: 436px;
	border-radius: 12px;
}

.justify-content-right {
	justify-content: right !important;
}

.side-filter {
	padding: 5px 10px;
	border: 2px solid rgba(46, 55, 164, 0.1);
	border-radius: 10px;
	background: white;
	font-size: 16px;
}




.section-title {
	font-weight: 600;
	font-size: 20px;
	margin-bottom: 10px;
}

.filter-section {}

.filter-section .form-control {
	border-radius: 8px;
}

.summary-boxes {
	display: flex;
	justify-content: space-between;
	background: white;
	padding: 15px;
	border-radius: 0 0 8px 8px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
	margin-bottom: 20px;
	text-align: center;
}

.summary-boxes div {
	flex: 1;
}

.summary-boxes div:not(:last-child) {
	border-right: 1px solid #e5e5e5;
}

.summary-percentage {
	font-weight: 600;
	font-size: 18px;
}

.summary-label {
	font-size: 14px;
	color: #6c757d;
}

.status-cards {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 15px;
}

.card-box1 {
	background: white;
	border-radius: 8px;
	box-shadow: 0 2px 4px rgba(0, 0, 0, 0.05);
	padding: 15px 12px;
	display: flex;
	flex-direction: column;
	height: 100%;
}

.card-header1 {
	font-weight: 500;
	margin-bottom: 15px;
	display: flex;
	justify-content: space-between;
	align-items: center;
	border-bottom: 1px solid grey;
	padding-bottom: 10px; 
}

.table-responsive {
	overflow-y: auto;
	max-height: 400px; 
}

table {
	width: 100%;
	font-size: 14px;
}

th {
	background: #f9f9f9;
	font-weight: 600;
	color: #6c757d;
}

td small {
	color: #6c757d;
}

.badge-approved {
	background: #28a745;
	color: white;
	padding: 2px 8px;
	border-radius: 12px;
	font-size: 12px;
	display: inline-block;
}

.badge-applied {
	background: #0d6efd;
	color: white;
	padding: 2px 8px;
	border-radius: 12px;
	font-size: 12px;
	display: inline-block;
}

.employee-details {
	background: #f8f9fa;
	padding: 10px;
	margin-top: 8px;
	border-radius: 5px;
	display: none;
}

.employee-details td {
	padding-top: 14px !important;
	padding-left: 19px !important;
}

.toggle-details {
	cursor: pointer;
	position: relative;
}

.dropdown-icon {
	float: right;
	font-size: 10px;
	color: #6c757d;
	border: 1px solid grey;
	border-radius: 50%;
	width: 17px;
	height: 17px;
	display: flex;
	justify-content: center;
	align-items: center;
	transition: .5s all ease;
}

i.bi.dropdown-icon.bi-chevron-up {
	color: #3a57e8;
	border: 1px solid #3a57e8;
}

.bg-secondary-50 {
	--tw-bg-opacity: 1;
	background-color: rgb(247 247 247 / var(--tw-bg-opacity, 1));
	padding: 8px
}

tr.toggle-details td {
	padding: 10px 10px !important;
}

.summary-section-title {
	border-bottom: 1px solid #e5e5e5;
	padding: 10px;
	text-align: center;
	background: white;
	border-radius: 8px 8px 0 0;
}











.summary-box {
	background-color: #fff;
	border: 1px solid #dee2e6;
	padding: 15px;
	border-radius: 8px;
	height: 100%;
}

.summary-box h2 {
	font-size: 32px;
	margin-bottom: 10px;
}

.summary-box small {
	color: #6c757d;
}

.summary-table td {
	padding: 6px 10px;
}

canvas {
	width: 100% !important;
	height: auto !important;
}

.tabs-and-btn {
	background: white;
	padding: 20px;
	border-radius: 12px;
}

.drag-upload-btn {
	font-size: 12px;
	font-weight: 600;
	background: #FFF;
	border: 1px dashed #E9EDF4;
	border-radius: 5px;
	padding: 6px 16px;
	position: relative;
	transition: all 0.5s;
}

.drag-upload-btn input {
	opacity: 0;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	cursor: pointer;
}

.justify-content-left {
	justify-content: left !important;
}

.notes {
	font-size: 13px;
	color: #323232;
}

.emp-name {
	text-align: left;
	font-weight: 500;
}

.subtext {
	display: block;
	font-size: 11px;
	color: #3a57e8;
}

.legend1 {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin-top: 20px;
	margin-bottom: 30px;
}

.legend-item {
	display: flex;
	align-items: center;
	font-size: 12px;
	gap: 6px;
}

.legend-color {
	width: 18px;
	height: 18px;
	border-radius: 3px;
}

.GL {
	background-color: #fce8b2 !important;
}

.OFF {
	background-color: #dbe2ea !important;
}

.SS {
	background-color: #f9dede !important;
}

.MCL {
	background-color: #ffb3b3 !important;
}

.legend-color.OFF {
	background-color: #9e9e9e !important;
}

/* Gray */
.legend-color.SS {
	background-color: #ff9800 !important;
}

/* Orange */
.legend-color.GL {
	background-color: #4caf50 !important;
}

/* Green */
.legend-color.CGDA {
	background-color: #2196f3 !important;
}

/* Blue */
.legend-color.C1 {
	background-color: #3f51b5 !important;
}

/* Indigo */
.legend-color.DS {
	background-color: #e91e63 !important;
}

/* Pink */
.legend-color.BABD {
	background-color: #009688 !important;
}

/* Teal */
.legend-color.D {
	background-color: #673ab7 !important;
}

/* Deep Purple */
.legend-color.USIT {
	background-color: #f44336 !important;
}

/* Red */
.legend-color.FS {
	background-color: #00bcd4 !important;
}

/* Cyan */

tr.th-shift-roaster th {
	background: #a7ccdb !important;
}

span.weekdays-c {
	font-size: 12px;
	color: #3a57e8;
}

table.table.shift-table thead {
	position: sticky;
	top: -21px;
}

.dropdown-wrapper {
	position: relative;
	margin: 0px;
}

.custom-dropdown {
	position: relative;
	width: 220px;
	padding: 8px 30px 8px 60px;
	/* leave space for 'Month:' */
	background: #fff;
	cursor: pointer;
}

.custom-dropdown::before {
	content: "Month:";
	position: absolute;
	left: 10px;
	top: 50%;
	transform: translateY(-50%);
	color: #555;
	pointer-events: none;
}

.custom-dropdown::after {
	content: "\f107";
	font-family: FontAwesome;
	position: absolute;
	right: 10px;
	top: 50%;
	transform: translateY(-50%);
	font-size: 12px;
	color: #666;
	pointer-events: none;
}

.year-list {
	display: none;
	position: absolute;
	top: 100%;
	left: 0;
	background: white;
	width: 100%;
	border: 1px solid #ccc;
	border-top: none;
	z-index: 10;
}

.dropdown-wrapper:hover .year-list {
	display: block;
}

.year-item {
	position: relative;
	padding: 8px 10px;
	background: #fff;
	border-bottom: 1px solid #eee;
	white-space: nowrap;
}

.year-item:hover {
	background: #f5f5f5;
}

.month-submenu {
	position: absolute;
	top: 0;
	left: 100%;
	background: #fff;
	border: 1px solid #ccc;
	display: none;
	min-width: 140px;
	z-index: 11;
}

.year-item:hover .month-submenu {
	display: block;
}

.month-submenu div {
	padding: 8px 10px;
	white-space: nowrap;
}

.month-submenu div:hover {
	background-color: #f0f0f0;
}

.form-group-select-search2 {
	display: flex;
	align-items: center;
	justify-content: left;
	gap: 16px;
	margin-bottom: 25px;
}

a.dropdown-toggle.btn.btn-white.d-inline-flex.align-items-center.no-drop-arrow.rotate-arrow {
	height: 38px;
}

.w-30 {
	width: 30% !important;
}

.dash-widget.align-items-center.justify-content-center .dash-icon i {
	font-size: 22px;
	opacity: 0.8;
}




.search-bar1 {
	display: flex;
	align-items: center;
	gap: 10px;
	margin-bottom: 20px;
}

.search-bar1 input {
	flex: 1;
	padding: 10px 15px;
	border-radius: 999px;
	border: 1px solid #ccc;
	font-size: 14px;
}

.tabs1 {
	display: flex;
	gap: 10px;
	margin-bottom: 20px;
	flex-wrap: wrap;
}

.tabs1 button {
	border: none;
	padding: 6px 16px;
	border-radius: 999px;
	background: #f1f1f1;
	font-size: 14px;
	cursor: pointer;
}

.tabs1 button.active {
	background: #e7f0ff;
	border: 1px solid #004aad;
	color: #004aad;
}

.card-grid1 {
	display: grid;
	grid-template-columns: repeat(auto-fill, minmax(160px, 1fr));
	gap: 15px;
	max-height: 300px;
	overflow-y: auto;
	padding-right: 5px;
}

.card1 {
	background: #f1f7fb;
	border-radius: 12px;
	padding: 15px;
	position: relative;
	min-height: 90px;
	display: flex;
	flex-direction: column;
	justify-content: space-between;
}

.card1[data-type="employee"] {
	background-color: #e8edff;
}

.card1[data-type="payroll"] {
	background-color: #ffeff9;
}

.card1[data-type="leave"] {
	background-color: #fff3f6;
}

.card1[data-type="other"] {
	background-color: #e6fff8;
}


.card1 .icon img {
	filter: brightness(0) saturate(100%) invert(11%) sepia(0%) saturate(19%) hue-rotate(164deg) brightness(103%) contrast(81%);
}

.card1 .icon {
	background: #ffcbd8;
	width: fit-content;
	padding: 8px 10px;
	border-radius: 9px;
}

.card1 .icon.blue {
	background: #b1bff1;
}

.card1 .title {
	font-size: 14px;
	font-weight: 500;
}

.star1 {
	position: absolute;
	top: 10px;
	right: 10px;
	cursor: pointer;
	font-size: 23px;
	color: #878787;
}

.star1.fav {
	color: #ffac1b;
}

/* Scrollbar */
.card-grid1::-webkit-scrollbar {
	width: 5px;
}

.card-grid1::-webkit-scrollbar-thumb {
	background: #ccc;
	border-radius: 4px;
}



.info-card {
	width: 100%;
	max-width: 400px;
	border: 1px solid #ddd;
	border-radius: 10px;
	padding: 20px;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
	font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
	background-color: #fff;
}

.info-card h4 {
	margin-bottom: 15px;
	font-size: 18px;
	color: #333;
}

.info-row {
	display: flex;
	justify-content: space-between;
	margin-bottom: 10px;
	font-size: 14px;
}

.info-label {
	color: #666;
	font-weight: 600;
}

.info-value {
	color: #000;
}

.table-section {
	display: flex;
	gap: 20px;
}





.table-section table {
	border-collapse: collapse;
	width: 100%;
	background: white;
	border-radius: 10px;
	overflow: hidden;
}



.table-section thead {
	background: #eef3fb;
	font-weight: 600;

}

.table-section th {
	background: #eef3fb;
}

.table-section th,
td {
	padding: 12px 16px;
	text-align: left;
	border-bottom: 1px solid #f1f1f1;
}

.table-section td small {
	display: block;
	color: #888;
}

.status-approved {
	background: #e6f7ed;
	color: #27a745;
	border: 1px solid #27a745;
	font-weight: 600;
	padding: 4px 10px;
	border-radius: 12px;
	font-size: 13px;
	text-align: center;
	display: inline-block;
}




.sidebar-filter {
	width: 300px;
	background: #fff;
	border-radius: 10px;

}

.swipe-upper {
	padding: 20px;
	padding-bottom: 1px;
	background: #eaf9ef;
	border-radius: 10px;
}

.filter-swipe-detail {
	padding: 20px;
	padding-top: 16px;
}

.filter-swipe-detail h6 {
	border-bottom: 1px solid #b2b2b2;
	padding-bottom: 4px;
	margin-bottom: 20px;
}

.sidebar-filter h4 {
	margin: 6px 0 5px;
	font-size: 13px;
}

.biometric-tag {
	background: #ffffff;
	color: green;
	display: inline-block;
	padding: 6px 12px;
	border-radius: 10px;
	font-size: 13px;
	margin-bottom: 15px;
	margin-left: 10px;
}

.filter-swipe-detail p {
	margin: 8px 0;
	font-size: 14px;
}

.footer-actions {
	margin-top: 20px;
	text-align: right;
}

.footer-actions button {
	padding: 8px 16px;
	margin-left: 10px;
	border: none;
	border-radius: 6px;
	cursor: pointer;
	font-weight: 600;
}

.footer-actions .reject {
	background: #fceaea;
	color: #c0392b;
}

.footer-actions .approve {
	background: #d4f6e5;
	color: #27a745;
}







.filters-swipes {
	display: flex;
	gap: 10px;
	padding: 20px 32px;
	background-color: #fff;
	border-radius: 12px;
	flex-wrap: wrap;
}

.filters-swipes input,
.filters-swipes select {}






.sidebar-employee-swipes {
	width: 300px;
	background: #ffffff;
	padding: 20px;
	height: 100%;
	position: fixed;
	top: 0;
	right: -320px;
	transition: 0.3s;
	z-index: 9999;
	overflow-y: auto;
}

.sidebar-employee-swipes.open {
	right: 0;
}

.sidebar-employee-swipes h4 {
	margin-top: 0;
	font-size: 16px;
}

.sidebar-employee-swipes label {
	font-weight: 500;
}

.sidebar-employee-swipes .close-btn {
	position: absolute;
	top: 15px;
	right: 15px;
	cursor: pointer;
	font-size: 18px;
}

.icon-button {
	background: #fff;
	border: 1px solid #ccc;
	border-radius: 6px;
	padding: 6px 10px;
	cursor: pointer;
}

.search-bar-swipes {
	display: flex;
	justify-content: center;
	align-items: end;
	gap: 10px;
}

.sidebar-employee-swipes h4 {
	border-bottom: 1px solid #c8c8c8;
	padding-bottom: 12px;
}

.close-btn {
	font-size: 20px;
}


.my-fav-cards {
	display: grid;
	grid-template-columns: 7% 29% 29% 29%;
	gap: 2%;
}






.attendance-muster .legend-section,
.override-section {
	margin-bottom: 30px;
}

.attendance-muster .legend-box {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
}

.attendance-muster .legend-item {
	padding: 6px 12px;
	border-radius: 20px;
	color: #fff;
	font-size: 12px;
	font-weight: 600;
	display: inline-flex;
	align-items: center;
}

.attendance-muster .Present {
	background: #4CAF50;
}

.attendance-muster .Leave {
	background: #2196F3;
}

.attendance-muster .Holiday {
	background: #9C27B0;
}

.attendance-muster .Absent {
	background: #F44336;
}

.attendance-muster .OffDay {
	background: #FF9800;
}

.attendance-muster .RestDay {
	background: #795548;
}

.attendance-muster .OnDuty {
	background: #3F51B5;
}

.attendance-muster .Unknown {
	background: #9E9E9E;
}

.attendance-muster .CL {
	background: #00BCD4;
}

.attendance-muster .EL {
	background: #8BC34A;
}

.attendance-muster .Deduction {
	background: #ff6f61;
}

.attendance-muster .Alert {
	background: #ffc107;
	color: #000;
}

.attendance-muster .Grace {
	background: #4db6ac;
}

.attendance-muster .Ignored {
	background: #90a4ae;
}

.attendance-muster .Override {
	background: #ba68c8;
}

.attendance-muster .Regularized {
	background: #64b5f6;
}



































/*-----------------
	43. Responsive
-----------------------*/


@media only screen and (min-width: 991px) {
	#toggle_btn {
		color: #fff;
		float: left;
		font-size: 20px;
		line-height: 70px;
		padding: 0 10px;
	}

	.user-active .call-imgs {
		width: 100%;
	}

	.join-video.user-active {
		height: auto;
	}

	.single-user .call-imgs {
		width: 100%;
	}

	.mini-sidebar .header-left .logo span {
		display: none;
	}

	.mini-sidebar .header .header-left {
		padding: 0 5px;
		width: 74px;
	}

	.mini-sidebar .sidebar {
		width: 74px;
	}

	.mini-sidebar.expand-menu .sidebar {
		width: 230px;
	}

	.mini-sidebar .menu-title {
		white-space: nowrap;
	}

	.mini-sidebar.expand-menu .menu-title {
		visibility: visible;
	}

	.modal-open .mini-sidebar .sidebar {
		z-index: 1051;
	}

	.mini-sidebar .sidebar .sidebar-menu ul>li>a span {
		display: none;
		transition: all 0.2s ease-in-out;
		opacity: 0;
	}

	.mini-sidebar.expand-menu .sidebar .sidebar-menu ul>li>a span {
		display: inline;
		opacity: 1;
	}

	.mini-sidebar .page-wrapper {
		margin-left: 60px;
	}

	.mini-sidebar .sidebar .sidebar-menu ul>li>a span.menu-side {
		display: -webkit-box;
		display: -ms-flexbox;
		display: flex;
		opacity: 1;
	}

	.mini-sidebar .sidebar-menu>ul>li>a {
		padding: 12px 10px;
	}

	.mini-sidebar.expand-menu .sidebar-menu>ul>li>a {
		padding: 12px 20px;
	}

	.mini-sidebar .sidebar-menu .logout-btn a {
		padding: 12px 10px;
	}

	.mini-sidebar.expand-menu .sidebar-menu .logout-btn a {
		padding: 12px 20px;
	}
}

@media only screen and (min-width: 768px) {
	.modal-md {
		width: 500px;
	}

	.nav-tabs.nav-justified.nav-tabs-top {
		border-bottom: 1px solid #ddd;
	}

	.nav-tabs.nav-justified.nav-tabs-top>li>a,
	.nav-tabs.nav-justified.nav-tabs-top>li>a:hover,
	.nav-tabs.nav-justified.nav-tabs-top>li>a:focus {
		border-width: 2px 0 0 0;
	}

	.nav-tabs.nav-tabs-top>li {
		margin-bottom: 0;
	}

	.nav-tabs.nav-tabs-top>li>a,
	.nav-tabs.nav-tabs-top>li>a:hover,
	.nav-tabs.nav-tabs-top>li>a:focus {
		border-width: 2px 0 0 0;
	}

	.nav-tabs.nav-tabs-top>li+li>a {
		margin-left: 1px;
	}

	.nav-tabs.nav-tabs-top>li>a.active,
	.nav-tabs.nav-tabs-top>li>a.active:hover,
	.nav-tabs.nav-tabs-top>li>a.active:focus {
		border-top-color: #3a57e8;
	}

	.nav-tabs.nav-tabs-bottom>li {
		margin-bottom: -1px;
	}

	.nav-tabs.nav-tabs-bottom>li>a.active,
	.nav-tabs.nav-tabs-bottom>li>a.active:hover,
	.nav-tabs.nav-tabs-bottom>li>a.active:focus {
		border-bottom-width: 2px;
		border-color: transparent;
		border-bottom-color: #009efb;
		background-color: transparent;
		transition: none 0s ease 0s;
		-moz-transition: none 0s ease 0s;
		-o-transition: none 0s ease 0s;
		-ms-transition: none 0s ease 0s;
		-webkit-transition: none 0s ease 0s;
	}

	.nav-tabs.nav-tabs-bottom>li {
		margin-bottom: -1px;
	}

	.nav-tabs.nav-tabs-bottom>li>a.active,
	.nav-tabs.nav-tabs-bottom>li>a.active:hover,
	.nav-tabs.nav-tabs-bottom>li>a.active:focus {
		border-bottom-width: 2px;
		border-color: transparent;
		border-bottom-color: #3a57e8;
		background-color: transparent;
		transition: none 0s ease 0s;
		-moz-transition: none 0s ease 0s;
		-o-transition: none 0s ease 0s;
		-ms-transition: none 0s ease 0s;
		-webkit-transition: none 0s ease 0s;
	}

	.nav-tabs.nav-tabs-solid {
		background-color: #fafafa;
		border: 0;
	}

	.nav-tabs.nav-tabs-solid>li {
		margin-bottom: 0;
	}

	.nav-tabs.nav-tabs-solid>li>a {
		border-color: transparent;
	}

	.nav-tabs.nav-tabs-solid>li>a:hover,
	.nav-tabs.nav-tabs-solid>li>a:focus {
		background-color: #f5f5f5;
	}

	.nav-tabs.nav-tabs-solid>.open:not(.active)>a {
		background-color: #f5f5f5;
		border-color: transparent;
	}

	.nav-tabs-justified.nav-tabs-top {
		border-bottom: 1px solid #ddd;
	}

	.nav-tabs-justified.nav-tabs-top>li>a,
	.nav-tabs-justified.nav-tabs-top>li>a:hover,
	.nav-tabs-justified.nav-tabs-top>li>a:focus {
		border-width: 2px 0 0 0;
	}
}

@media only screen and (max-width: 1199.98px) {
	.profile-user-img img {
		width: 90px;
	}

	.profile-edit-icon img {
		width: 25px;
	}

	.follow-btn-group .btn-info {
		min-width: auto;
	}

	.profile-table.custom-table thead tr th,
	.profile-table.custom-table tbody tr td {
		padding: 10px;
	}

	.invoices-view {
		width: 90%;
		float: right;
	}

	.invoices-tabs ul li {
		margin-right: 10px;
	}

	.invoices-tabs ul li a {
		font-size: 14px;
	}

	.login-wrap-bg {
		padding: 15px 50px 15px;
	}

	.login-wrapper .loginbox .login-right {
		padding: 30px;
	}

	.morning-user {
		padding: 30px 0px 30px 30px;
	}

	.morning-user h2 {
		font-size: 28px;
		font-weight: 600;
	}

	.border-right-bg:before {
		display: none;
	}

	.border-right-bg {
		margin-bottom: 10px;
	}

	.wallet-widget .circle-bar>div canvas {
		width: 140px !important;
		height: 140px !important;
	}

	.meeting .join-video {
		height: 320px;
	}

	.join-video.single-user {
		height: auto;
	}
}

@media only screen and (max-width: 991.98px) {
	.profile-rightbar {
		display: inline-block !important;
	}

	div.dataTables_wrapper div.dataTables_info {
		padding-bottom: 0.85em;
	}

	.chat-profile-view {
		display: none;
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
		right: 0;
		transform: translateX(0px);
		z-index: 1041;
		width: 300px;
		position: fixed;
		margin-right: -300px;
		display: table-cell;
		top: 0;
		padding-bottom: 60px;
		margin-top: 50px;
	}

	.message-view.chat-view {
		width: 100%;
	}

	.slide-nav .page-wrapper {
		left: 225px;
		margin-left: 0;
	}

	.chat-main-row {
		left: 0;
	}

	.header .header-left {
		position: absolute;
		width: 100%;
	}

	.mobile_btn {
		display: block;
	}

	.page-title-box {
		display: none;
	}

	.sidebar {
		margin-left: -225px;
		width: 225px;
	}

	.page-wrapper {
		margin-left: 0;
		padding-left: 0;
		padding-right: 0;
	}

	.slide-nav .sidebar {
		margin-left: 0;
	}

	a.mobile_btn {
		color: #fff;
		font-size: 24px;
		height: 70px;
		left: 0;
		line-height: 70px;
		padding: 0 20px;
		position: absolute;
		top: 0;
		width: 60px;
		z-index: 10;
	}

	.slide-nav .page-wrapper {
		left: 225px;
		margin-left: 0;
	}

	.invoices-view {
		width: 100%;
		float: none;
	}

	#toggle_btn {
		display: none;
	}

	.sidebar {
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
	}

	.page-wrapper {
		-webkit-transition: all 0.4s ease;
		-moz-transition: all 0.4s ease;
		transition: all 0.4s ease;
	}

	/* invoice */
	.app-listing li {
		width: 49%;
		display: inline-block;
	}

	.app-listing {
		display: inline-block;
	}

	.multipleSelection #checkBoxes,
	.SortBy #checkBox {
		width: 100%;
	}

	.inovices-month-info {
		padding-top: 20px;
	}

	.invoice-inner-date {
		padding: 10px;
	}

	.invoice-inner-date.invoice-inner-datepic {
		padding: 10px 0;
	}

	.field-box .btn {
		min-width: auto;
		border-radius: 4px;
		padding: 10px;
	}

	.invoice-inner-head {
		padding: 10px;
		border-bottom: 1px solid #E5E5E5;
	}

	.invoice-circle-img {
		display: none;
	}

	.invoice-item-bg .invoice-info {
		border-right: 1px solid #fff;
		padding: 10px 30px;
		margin-top: 20px;
	}

	.invoice-item-bg .invoice-info {
		border-right: 1px solid #fff;
		padding: 10px 30px;
		margin-top: 0;
	}

	.invoice-info {
		margin-bottom: 0;
	}

	.payment-details {
		width: auto;
	}

	.invoices-preview .modal-dialog {
		max-width: 700px;
	}

	.invoice-item-one .invoice-info {
		text-align: left;
	}

	.invoice-head h2 {
		font-size: 16px;
	}

	.invoice-head p {
		font-size: 14px;
	}

	.invoice-payment-box .payment-details {
		margin-bottom: 20px;
	}

	.invoice-faq .faq-tab {
		padding-bottom: 10px;
	}

	.service-upload {
		padding: 30px 0;
		width: auto;
	}

	.invoice-inner-date.invoice-inner-datepic {
		padding: 10px;
	}

	.bank-details-btn .btn {
		min-width: auto;
		padding: 10px;
	}

	.invoice-info-card .invoice-item-one .invoice-info {
		text-align: right;
	}

	.login-wrap {
		display: none;
	}

	.account-logo,
	.login-wrapper .loginbox .login-right h2,
	.login-wrapper .loginbox .login-right .forgotpass,
	.login-btn {
		margin-bottom: 25px;
	}

	.login-wrapper .loginbox .login-right h2 {
		font-size: 20px;
	}

	.error-box h3 {
		font-size: 26px;
	}

	.mob-view {
		display: none;
	}

	.logo {
		justify-content: center;
		-webkit-justify-content: center;
		-ms-flex-pack: center;
	}

	.morning-user {
		padding: 25px 0px 25px 25px;
	}

	.morning-user h2 {
		font-size: 26px;
	}

	.user-menu.nav li {
		margin-right: 6px;
	}

	.profile-user-img img {
		width: 60px;
	}

	.profile-edit-icon img {
		width: 15px;
	}

	.names-profiles h4 {
		font-size: 14px;
	}

	.names-profiles h5 {
		font-size: 12px;
	}

	.doctor-follows h5 {
		font-size: 12px;
	}

	.doctor-follows h4 {
		font-size: 16px;
	}

	.follow-btn-group .btn-info {
		min-width: 90px;
		font-size: 12px;
		padding: 4px 15px;
	}

	.meeting .join-video {
		height: 320px;
	}

	.join-video.single-user {
		height: auto;
	}

	.feather-chevron-right:before {
		top: 2px;
		position: relative;
	}
}

@media only screen and (max-width: 767.98px) {
	.table .invoice-link {
		font-size: 14px;
	}

	div.dataTables_wrapper div.dataTables_paginate ul.pagination {
		padding-bottom: 15px;
		justify-content: center;
	}

	.profile-info-left {
		border-right: none;
		border-bottom: 2px dashed #ccc;
		margin-bottom: 20px;
		padding-bottom: 20px;
	}

	.navbar-nav .open .dropdown-menu {
		float: left;
		position: absolute;
	}

	.notifications {
		right: -48px;
	}

	.notifications:before,
	.notifications:after {
		right: 60px;
	}

	.modal-body.card-box {
		background-color: #fff;
		border: none;
		border-radius: inherit;
		box-shadow: unset;
		margin-bottom: 0;
		padding: 15px;
	}

	.roles-menu {
		margin-bottom: 20px;
	}

	.left-action {
		text-align: center;
		margin-bottom: 15px;
	}

	.right-action {
		text-align: center;
	}

	.top-action-left .float-left {
		float: none !important;
	}

	.top-action-left .btn-group {
		margin-bottom: 15px;
	}

	.top-action-right {
		text-align: center;
	}

	.top-action-right a.btn.btn-white {
		margin-bottom: 15px;
	}

	.mail-sent-time {
		float: left;
		margin-top: 10px;
		width: 100%;
	}

	.nav-tabs.nav-justified {
		border-bottom: 1px solid #ddd;
	}

	.nav-tabs.nav-justified>li>a.active,
	.nav-tabs.nav-justified>li>a.active:hover,
	.nav-tabs.nav-justified>li>a.active:focus {
		border-color: transparent transparent transparent #009efb;
		border-left-width: 2px;
	}

	.nav-tabs {
		border-bottom: 0;
		position: relative;
		background-color: #fff;
		padding: 5px 0;
		border: 1px solid #ddd;
		border-radius: 3px;
	}

	.nav-tabs .nav-item {
		margin-bottom: 0;
	}

	.nav-tabs>li>a {
		border-width: 2px;
		border-left-color: transparent;
	}

	.nav-tabs .nav-link {
		border-width: 2px;
	}

	.nav-tabs>li>a:hover,
	.nav-tabs>li>a:focus {
		background-color: #fafafa;
	}

	.nav-tabs .nav-item.show .nav-link,
	.nav-tabs .nav-link.active,
	.nav-tabs>li>a.active,
	.nav-tabs>li>a.active:hover,
	.nav-tabs>li>a.active:focus {
		background-color: #f5f5f5;
		border-color: transparent transparent transparent #009efb;
		border-left-width: 2px;
	}

	.nav-tabs>li.open:not(.active)>a,
	.nav-tabs>li.open:not(.active)>a:hover,
	.nav-tabs>li.open:not(.active)>a:focus {
		background-color: #fafafa;
	}

	.nav-tabs.nav-tabs-solid {
		padding: 5px;
	}

	.nav-tabs.nav-tabs-solid.nav-tabs-rounded {
		border-radius: 5px;
	}

	.nav-tabs.nav-tabs-solid>li>a {
		border-left-width: 0 !important;
	}

	.nav-tabs-justified {
		border-bottom: 1px solid #ddd;
	}

	.nav-tabs-justified>li>a.active,
	.nav-tabs-justified>li>a.active:hover,
	.nav-tabs-justified>li>a.active:focus {
		border-width: 0 0 0 2px;
		border-left-color: #009efb;
	}

	h1 {
		font-size: 2em;
	}

	h2 {
		font-size: 1.5em;
	}

	h3 {
		font-size: 1.17em;
	}

	h4 {
		font-size: 1.12em;
	}

	h5 {
		font-size: .83em;
	}

	h6 {
		font-size: .75em;
	}

	.page-title {
		font-size: 1.2em;
		padding-top: 10px;
	}

	.card-title {
		font-size: 1.12em;
	}

	.blog-view .blog-title {
		font-size: 18px;
	}

	.widget h3 {
		font-size: 18px;
	}

	.my-video ul li {
		width: 80px;
	}

	.voice-call-avatar .call-avatar {
		width: 120px;
		height: 120px;
	}

	.table-responsive {
		display: block;
		width: 100%;
		overflow-x: auto;
		-ms-overflow-style: -ms-autohiding-scrollbar;
	}

	.header .has-arrow .dropdown-toggle>span:nth-child(2) {
		display: none;
	}

	.header .has-arrow .dropdown-toggle:after {
		display: none;
	}

	.btn-white {
		margin: 0px;
	}

	.login-wrapper .loginbox .login-right .forgotpass,
	.next-sign {
		display: block;
	}

	.remember-me {
		margin-bottom: 10px;
	}

	.login-right .btn-primary {
		font-size: 14px;
		padding: 7px 15px;
	}

	.account-subtitle {
		margin-bottom: 15px;
	}

	.login-wrap-bg {
		padding: 15px 20px 15px;
	}

	.login-wrapper .loginbox .login-right {
		padding: 20px;
	}

	.error-box h3 {
		font-size: 18px;
	}

	.error-box p {
		font-size: 14px;
	}

	.error-box img {
		margin-bottom: 25px;
	}

	.sucess-mail h4 {
		font-size: 22px;
	}

	.mobile-user-menu>a {
		color: #3a57e8;
	}

	.morning-img img {
		position: relative;
		width: 100%;
	}

	.good-morning-blk:before {
		display: none;
	}

	.morning-user {
		padding: 0;
	}

	.good-morning-blk {
		padding: 20px;
	}

	.morning-user h2 {
		font-size: 20px;
	}

	.morning-user p {
		font-size: 14px;
	}

	.page-header .breadcrumb {
		font-size: 14px;
	}

	.dash-content h4 {
		font-size: 14px;
		margin-bottom: 15px;
	}

	.dash-content h2 {
		font-size: 28px;
		margin-bottom: 15px;
	}

	.patient-visit {
		flex-wrap: wrap;
	}

	.chat-user-total {
		margin: 10px 0px;
	}

	.wallet-widget .circle-bar>div canvas {
		width: 100px !important;
		height: 100px !important;
	}

	.steps-history li,
	.doctor-date-list li {
		font-size: 12px;
	}

	.doctor-date-list li span {
		padding-left: 5px;
	}

	.border-right-bg:before {
		display: none;
	}

	.border-right-bg {
		margin-bottom: 10px;
	}

	.active-doctor {
		display: block;
	}

	.weight-blk {
		margin-bottom: 5px;
	}

	.treat-box {
		display: block;
	}

	.user-imgs-blk {
		margin-bottom: 10px;
	}

	.user-imgs-blk img {
		margin-right: 8px;
	}

	.profile-user-img img {
		width: 90px;
	}

	.profile-edit-icon img {
		width: 25px;
	}

	.doctor-follows h5 {
		font-size: 12px;
	}

	.doctor-follows h4 {
		font-size: 16px;
	}

	.follow-group {
		padding: 0px 15px;
	}

	.follow-btn-group .btn-info {
		font-size: 14px;
		padding: 6px 15px;
	}

	.follow-btn-group {
		margin: 15px 0px;
	}

	.names-profiles h4,
	.tab-content-set li a {
		font-size: 16px;
	}

	.tab-content-set ul li a.active::after,
	.tab-content-set ul li a:hover::after {
		display: none;
	}

	.tab-content-set li {
		margin-bottom: 15px;
	}

	.tab-content-set {
		padding: 0;
	}

	.detail-personal {
		margin-bottom: 15px;
	}

	.doctor-submit .btn-primary {
		min-width: 125px;
		font-size: 12px;
		border-radius: 12px;
		padding: 7px 15px;
		margin-bottom: 8px;
		margin-right: 0px !important;
	}

	.invoice-counts h4 {
		display: inline-block;
	}

	.activity-list::before {
		display: none;
	}

	.timeline-group-blk {
		display: block;
	}

	.comman-activitys {
		padding: 12px;
		margin-top: 5px;
	}

	.activity-sub-list li {
		margin-bottom: 10px;
	}

	.latest-posts-act .post-thumb {
		float: inherit;
		margin-bottom: 15px;
	}

	.latest-posts-act .post-info {
		margin-left: 0;
	}

	.blog-grp-blk {
		flex-wrap: wrap;
	}

	.blog-img-blk {
		margin-bottom: 5px;
	}

	.blog-grp-blk span {
		margin-left: auto;
	}

	.grid-blog .blog-title a {
		font-size: 15px;
	}

	.chat-search-group {
		display: block;
	}

	.chat-search-list ul {
		margin-top: 10px;
	}

	.chat-search-list ul li:first-child {
		margin-left: 0;
	}

	.inputgroups input[type="text"] {
		padding-right: 125px;
	}

	.settings-btn.upload-files-avator .upload {
		width: 120px;
		font-size: 12px;
	}

	.mailview-header,
	.send-user.send-user-name h4 {
		display: block;
	}

	.sender-info {
		margin-bottom: 10px;
	}

	.send-user.send-user-name h4 span {
		display: inline-block;
		margin: 0;
	}

	.mail-attach .msg-sub-list li {
		margin-bottom: 10px;
	}

	.forward-send .btn-primary {
		margin-bottom: 10px;
		width: 100%;
	}

	.chat-user-group.clinic-user {
		display: block !important;
	}

	.call-list-add {
		padding: 0;
	}

	.meeting .join-video {
		height: 116px;
	}

	.join-video.single-user {
		width: 100%;
	}

	.join-video.single-user {
		height: auto;
	}

	.meet-icons .meet-items .meet-item>a {
		width: 35px;
		height: 35px;
	}

	.end-call-chat .btn-primary {
		min-width: 90px;
		margin: 0px 5px;
		padding: 6px 13px;
		font-size: 14px;
	}

	.meet-icons .meet-items .meet-item,
	.action-items .action-item {
		margin-right: 5px;
	}

	.card {
		width: 100%;
	}

	.patient-structure h3 {
		font-size: 32px;
	}
}

@media only screen and (max-width: 575.98px) {
	.app-listing li {
		width: 100%;
	}

	.download-grp {
		margin-top: 10px;
	}

	.invoices-tabs ul li {
		margin-right: 0;
		display: block;
		margin-bottom: 14px;
	}

	.schedule-time {
		margin-bottom: 10px;
	}

	.invoices-tabs ul li a {
		padding-bottom: 0;
	}

	.invoices-settings-btn {
		justify-content: start;
	}

	.invoices-create-btn .btn {
		font-size: 14px;
		padding: 10px;
		min-width: auto;
	}

	.invoice-info-card .invoice-item-one .invoice-info {
		text-align: left;
	}

	.invoice-item .invoice-details {
		text-align: left;
		float: left;
	}

	.invoice-info.invoice-info2 {
		text-align: left;
	}

	.invoice-total-footer h4 {
		font-size: 14px;
	}

	.nav-tabs.menu-tabs .nav-link {
		padding: 10px;
	}

	ul.nav.nav-tabs.menu-tabs {
		padding: 10px;
	}

	.invoice-setting-btn .btn {
		min-width: auto;
		padding: 10px;
	}

	.contact-cat {
		padding-right: 70px;
	}

	.user-menu {
		display: none;
	}

	.mobile-user-menu {
		display: block;
	}

	.search-box {
		display: none;
	}

	.filter-row {
		margin-bottom: 15px;
	}

	.page-wrapper>.content {
		padding: 15px;
	}

	.profile-view .profile-basic {
		margin-left: 0;
	}

	.profile-img-wrap {
		position: relative;
		margin: 0 auto;
	}

	.profile-view .profile-img-wrap {
		margin: 0 auto 10px;
		height: 100px;
		width: 100px;
	}

	.profile-view .profile-img {
		height: 100px;
		width: 100px;
	}

	.profile-view .profile-img .avatar {
		font-size: 24px;
		height: 100px;
		line-height: 100px;
		margin: 0;
		width: 100px;
	}

	.profile-info-left {
		text-align: center;
	}

	.profile-basic {
		margin-left: 0;
		margin-top: 15px;
	}

	.page-title {
		font-size: 18px;
	}

	.fc-toolbar .fc-right {
		display: inline-block;
		float: none;
		margin: 10px auto 0;
		width: 200px;
		clear: both;
	}

	.fc-toolbar .fc-left {
		float: none;
		margin: 0 auto;
		width: 200px;
	}

	.upload-text {
		font-size: 18px;
	}

	.call-duration {
		display: block;
		margin-top: 0;
		margin-bottom: 10px;
		position: inherit;
	}

	.end-call {
		margin-top: 10px;
		position: inherit;
	}

	.chat-right .chat-content {
		max-width: 90%;
	}

	.chat-right .chat-body {
		padding-left: 0;
		padding-right: 0;
	}

	.chat-left .chat-content {
		max-width: 90%;
	}

	.chat-left .chat-body {
		padding-left: 0;
		padding-right: 0;
	}

	.chat-avatar .avatar {
		height: 20px;
		line-height: 20px;
		width: 20px;
	}

	.account-box {
		width: 100%;
		margin-bottom: 20px;
	}

	.content {
		padding: 0 50px;
	}

	.custom-menu.navbar-nav>li>a {
		margin-left: 10px;
	}

	.error-box h1 {
		font-size: 50px;
	}

	.submit-btn {
		min-width: 150px;
	}

	.ui-kit-wrapper button {
		margin-bottom: 5px;
	}

	.pagination>li>a,
	.pagination>li>span {
		padding: .5rem !important;
	}

	.invoice-item-box {
		float: left;
	}

	.wizard .nav-tabs li:after {
		display: none;
	}
}

@media only screen and (max-width: 479px) {
	.compose-btn button {
		padding: 0.365rem 0.5rem;
	}

	.doctor-search-blk .add-group {
		margin-top: 10px;
	}

	.doctor-search-blk .top-nav-search {
		margin-left: 0;
	}

	.attachments li {
		float: none;
		text-align: center;
		margin: 0 auto;
		margin-bottom: 10px;
	}

	.meeting .join-video {
		height: 100%;
	}

	.follow-btn-group .btn-info {
		min-width: auto;
	}
}




a.logo img {
	width: 115px;
}

.reports .tabingss a.nav-link {
	font-size: 14px;
	height: auto;
}

.tab-pane.reports {
	padding: 0px 16px;
}

.card-header.reports {
	background-color: #3553e2 !important;
	color: white;
}

.todo-inbox-check.d-flex.align-items-center {
	flex-wrap: wrap;
}

.list-group-item a {
	color: black;
}


.tab-content.mannual-override .bg-tab-pane {
	background: white;
	margin-top: 30px;
	border-radius: 12px;
	padding: 20px 20px;
}

.legend-item.Present.ss {
	background: #e9899a;
}

.legend-item.OffDay.grey {
	background: grey;
}

.legend-item.RestDay.gl {
	background: #ffc000;
}

.legend-item.RestDay.cgda {
	background: #ff6984;
}

.legend-item.RestDay.c1 {
	background: #ff9500;
}

.legend-item.RestDay.ds {
	background: #009aff;
}

.legend-item.RestDay.babd {
	background: blue;
}

.legend-item.RestDay.d {
	background: green;
}

.legend-item.RestDay.usit {
	background: pink;
}

.legend-item.RestDay.fs {
	background: #ff5500;
}

.form-check-input {
	border: var(--bs-border-width) solid #bfbfbf;
}

.mannual-override-table .table thead tr th {
	background: #fff;
}

.table-responsive.mannual-override-table tr td {
	text-align: center;
}

.form-control.datetimepicker {
	padding: 8px 30px;
}

.select2-container .select2-selection--single {
	border: 2px solid rgb(46 55 164 / 15%);
}

.mini-logo {
	display: none;
	width: 30px !important;
	margin-left: 8px;
}

.mini-sidebar .main-logo {
	display: none;
}

.mini-sidebar .mini-logo {
	display: block;
}

.banner-section-admin {
	background-position: right, right;
	background-size: contain;
	background-repeat: no-repeat;
	background-color: #ececfa !important;
	padding: 20px 26px 25px;
	position: relative;
	border-radius: 20px;
	box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
	height: 165px;
	background-image: url(../img/admin-banner.png);
	object-fit: cover;
}

.banner-section-admin h2 {
	color: #3b4452;
	font-weight: 600;
	font-size: 22px;
}

.xsd-wrap {
	display: flex;
	flex-direction: column;
	gap: 16px;
}

/* ---------- shared card shell ---------- */
.xsd-card {
	background: #fffbfb;
	border-radius: 20px;
	padding: 16px 14px 14px;
	box-shadow: 0 8px 22px rgba(30, 30, 60, 0.06);
}

.xsd-card__head {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 14px;
	padding: 0 4px;
	font-size: 14.5px;
	font-weight: 700;
	color: #1c1c2e;
}

.xsd-card__title {
	display: flex;
	align-items: center;
	gap: 7px;
	font-size: 14.5px;
	font-weight: 700;
	color: #1c1c2e;
}

.xsd-card__title .emoji {
	font-size: 15px;
	width: 24px;
	height: 24px;
	border-radius: 50%;
	background: #ffe4ea;
	display: flex;
	align-items: center;
	justify-content: center;
}

.xsd-card__title--purple .emoji {
	background: #ede4ff;
}

.xsd-btn svg {
	width: 16px;
	height: 16px;
	flex-shrink: 0;
}

.xsd-card__viewall {
	font-size: 12.5px;
	font-weight: 600;
	color: #6a5cf8;
	text-decoration: none;
}

/* ---------- inner tinted panel ---------- */
.xsd-panel {
	position: relative;
	border-radius: 16px;
	padding: 10px;
	overflow: hidden; 
}

.xsd-panel--pink {
	background: url(../img/birthday-bg.png);
    background-position: right, right;
    object-fit: fill;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #fde3e5;
}

.xsd-panel--purple { 
	background: url(../img/anniverasary-bg.png);
    background-position: right, right;
    object-fit: fill;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #ead9fa;
}

.xsd-confetti {
	position: absolute;
	inset: 0;
	pointer-events: none;
	z-index: 1;
}

.xsd-confetti span {
	position: absolute;
	display: block;
}

.xsd-confetti .sq {
	border-radius: 2px;
}

.xsd-confetti .ci {
	border-radius: 50%;
}

/* ---------- spotlight row ---------- */
.xsd-spotlight {
	display: flex;
	align-items: flex-start;
	gap: 10px;
	position: relative;
	z-index: 2;
}

.xsd-spotlight__avatar {
	width: 54px;
	height: 54px;
	border-radius: 50%;
	object-fit: cover;
	flex-shrink: 0;
	background: #ddd;
	border: 2.5px solid #ffffff;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
}

.xsd-spotlight__info {
	flex: 1;
	min-width: 0;
	padding-top: 1px;
}

.xsd-spotlight__name {
	font-size: 15px;
	font-weight: 700;
	color: #1c1c2e;
}

.xsd-spotlight__badge {
	display: inline-block;
	font-size: 10.5px;
	font-weight: 700;
	padding: 2px 10px;
	border-radius: 20px;
	margin-top: 5px;
}

.xsd-spotlight__badge--pink {
	background: #ffd7de;
	color: #d6336c;
}

.xsd-spotlight__badge--purple {
	background: #e3d6fd;
	color: #6c3ce9;
}

.xsd-spotlight__msg {
	font-size: 11.5px;
	color: #000;
	margin-top: 6px;
	line-height: 1.4;
}

.xsd-spotlight__deco {
	flex-shrink: 0;
	width: 82px;
	height: 82px;
	margin-top: -8px;
}

.xsd-spotlight__deco svg {
	width: 100%;
	height: 100%;
}

/* ribbon medal for anniversary years */
.xsd-ribbon {
	flex-shrink: 0;
	width: 66px;
	text-align: center;
	margin-top: -6px;
}

.xsd-ribbon svg {
	width: 100%;
	height: auto;
}

/* ---------- send wishes button ---------- */
.xsd-btn {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	width: 100%;
	border: none;
	border-radius: 14px;
	padding: 12px;
	font-size: 13.5px;
	font-weight: 700;
	color: #fff;
	cursor: pointer;
}

.xsd-btn--pink {
	background: #ff4d6d;
}

.xsd-btn--purple {
	background: #7c4dea;
}

/* ---------- latest updates ---------- */
.xsd-update {
	display: flex;
	align-items: center;
	gap: 12px;
	padding: 9px 10px;
	background: #eaf0ffb5;
	margin-top: 7px;
	border-radius: 10px;
}

.xsd-update+.xsd-update {
	border-top: 1px solid #f2f2f6;
}

.xsd-update__icon {
	width: 30px;
	height: 30px;
	border-radius: 8px;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	flex-shrink: 0;
	color: #fff;
}

.xsd-update__icon--blue {
	background: #5f8bff;
}

.xsd-update__icon--green {
	background: #43c98a;
}

.xsd-update__icon--gray {
	background: #b9bccb;
}

.xsd-update__body {
	flex: 1;
	min-width: 0;
}

.xsd-update__date {
	font-size: 11.5px;
	font-weight: 700;
	color: #1c1c2e;
	margin-bottom: 2px;
}

.xsd-update__title {
	font-size: 11.5px;
	color: #505054;
	line-height: 1.35;
}

.xsd-update__chevron {
	font-size: 25px;
	color: #000000;
	flex-shrink: 0;
}

.kw-section-title {
	font-size: 15px;
	font-weight: 700;
	color: #2b2560;
	margin-bottom: 14px;
}

/* ===== Favourites row ===== */
.kw-favourites {
	margin-bottom: 24px;
}

.kw-fav-grid {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 10px;
}

.kw-fav-card {
	/* background: #f2ecfd; */
	border-radius: 14px;
	padding: 15px 15px;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 12px;
	border: 1px solid #fff !important;
	box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}

.kw-fav-icon {
	width: 42px;
	height: 42px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
}

.kw-fav-icon svg {
	width: 22px;
	stroke: #fff;
	height: 22px;
}

.kw-fav-icon--purple {
	background: #7c3aed;
}

.kw-fav-icon--blue {
	background: #0049ff;
}

.kw-fav-icon--green {
	background: #4dc38b;
}

.kw-fav-icon--orange {
	background: #d97416;
}

.kw-fav-text {
	display: flex;
	flex-direction: column;
	gap: 3px;
	text-align: center;
}

.kw-fav-title {
	font-size: 12.5px;
	font-weight: 700;
	color: #241f5c;
}

.kw-fav-sub {
	font-size: 12.5px;
	font-weight: 500;
	color: #6f6a91;
}

/* ===== Bottom row: tasks + summary ===== */
.kw-bottom-row {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 12px;
}

/* My Tasks */
.kw-tasks-list {
	display: flex;
	flex-direction: column;
	gap: 12px;
}

.kw-task-card {
	border-radius: 14px;
	padding: 16px 18px;
	display: flex;
	/* align-items: center; */
	gap: 14px;
}

.kw-task-card--green {
	background: #eaf7ef;
}

.kw-task-card--purple {
	background: #f1ecfb;
}

.kw-task-icon {
	width: 34px;
	height: 34px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
}

.kw-task-icon svg {
	width: 26px;
	height: 26px;
}

.kw-task-info {
	flex: 1;
}

.kw-task-name {
	font-size: 13.5px;
	font-weight: 700;
	margin-bottom: 3px;
}

.kw-task-card--green .kw-task-name {
	color: #1c8a4c;
}

.kw-task-card--purple .kw-task-name {
	color: #6a3fd6;
}

.kw-task-desc {
	font-size: 12px;
	color: #6f6a91;
	font-weight: 500;
}

.kw-task-monitor {
	font-size: 12.5px;
	font-weight: 700;
	color: #4c3fd6;
	white-space: nowrap;
	cursor: pointer;
}

/* Quick Summary */
.kw-summary-grid {
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 11px;
}

.kw-summary-card {
	background: #ffffff;
	border-radius: 14px;
	padding: 16px 12px;
	/* display: flex; */
	text-align: center;
	gap: 14px;
	box-shadow: 0 1px 3px rgba(20, 20, 60, 0.04);
}

.kw-summary-icon {
	width: 32px;
	height: 32px;
	display: flex;
	align-items: center;
	justify-content: center;
	flex-shrink: 0;
	margin: 0 auto;
}

.kw-summary-icon svg {
	width: 24px;
	height: 24px;
}

.kw-summary-text {
	display: flex;
	flex-direction: column;
	gap: 3px;
}

.kw-summary-label {
	font-size: 12px;
	color: #6f6a91;
	font-weight: 500;
}

.kw-summary-value {
	font-size: 17px;
	font-weight: 700;
	color: #241f5c;
}
.kw-fav-card.kw-fav-card-purple {
    background: #f2ecfd;
}

.kw-fav-card.kw-fav-card-blue {
    background: #e0e9ff;
}

.kw-fav-card.kw-fav-card-green {
    background: #eaf7ef;
}

.kw-fav-card.kw-fav-card-orange {
    background: #fdf2e8;
}
.sidebar-menu li a img {
    filter: brightness(0) saturate(100%);
}
.leave-apply-banner 
 {
    background-position: right, right;
    background-size: contain;
    background-repeat: no-repeat;
    background-color: #f1eefe !important;
    padding: 16px 20px 25px;
    /* position: relative; */
    border-radius: 20px;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
    background-image: url(../img/apply-leave-banner.png);
    height: 120px;
}
.leave-bal-banner {
    background-color: #fdfcfd !important;
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
    background-image: url(../img/leave-cal.png);
    height: 132px;
}
.leave-apply-banner h2 {
    font-size: 20px;
}

.hrms-dashboard-topbar{

    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:28px;
    gap:20px;

}

.hrms-dashboard-greeting{

    display:flex;
    flex-direction:column;

}

.hrms-dashboard-title{

    font-size:28px;
    font-weight:700;
    color:#111827;
    margin-bottom:8px;

}

.hrms-dashboard-subtitle{

    font-size:15px;
    color:#6b7280;

}

.hrms-dashboard-topbar-actions{

    display:flex;
    align-items:center;
    gap:14px;

}

.hrms-dashboard-date-filter{

    height:46px;
    padding:0 18px;
    border:1px solid #e4e7ec;
    border-radius:10px;
    background:#fff;
    font-size:14px;
    color:#374151;
    min-width:220px;

}

.hrms-dashboard-download-report-btn{

    height: 46px;
    padding: 0 24px;
    border-radius: 10px;
    background: #2563eb;
    background: linear-gradient(135deg, #61c797, #6a3ef6);
    color: #fff;
    font-size: 14px;
    font-weight: 600;
    transition: .3s;
    border: 1px solid #fff;

}

.hrms-dashboard-download-report-btn:hover{

    background:#1d4ed8;

}

/*=========================
GRID
==========================*/

.hrms-dashboard-analytics-grid{

    display:grid;
    grid-template-columns:repeat(3,1fr);
    gap:24px;
    margin-bottom:30px;

}

/*=========================
COMMON CARD
==========================*/

.hrms-dashboard-service-card,
.hrms-dashboard-age-card,
.hrms-dashboard-gender-card{

    background:#fff;
    border-radius:18px;
    border:1px solid #edf1f5;
    padding:24px;
    box-shadow:0 10px 30px rgba(15,23,42,.05);
    transition:.35s;

}

.hrms-dashboard-service-card:hover,
.hrms-dashboard-age-card:hover,
.hrms-dashboard-gender-card:hover{

    transform:translateY(-5px);
    box-shadow:0 20px 45px rgba(0,0,0,.08);

}

.hrms-dashboard-card-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:18px;background: linear-gradient(135deg, #61c797, #6a3ef6);padding: 10px 15px;}

.hrms-dashboard-card-title{font-size:18px;font-weight:700;color: #ffffff;margin-bottom:5px;}

.hrms-dashboard-card-subtitle{font-size:13px;color: #ffffff;}

.hrms-dashboard-more-btn{
 width: 36px;
 height: 36px;
 border-radius: 50%;
 background: #f8fafc;
 color: #000000;
 font-size: 18px;
 transition: .3s;
 padding: 3px;
}

.hrms-dashboard-more-btn:hover{

    background:#eff6ff;
    color:#2563eb;

}

/*=========================
CHART
==========================*/

.hrms-dashboard-chart-area{

    height:260px;
    margin:15px 0;

}

.hrms-dashboard-chart-area canvas{

    width:100%!important;
    height:100%!important;

}

.hrms-dashboard-card-footer{

    margin-top:18px;
    font-size:14px;
    color:#64748b;
    line-height:24px;

}
.hrms-dashboard-card-footer strong{

    color:#2563eb;

}

/*=========================
GENDER CARD
==========================*/

.hrms-dashboard-gender-content{

    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    margin-top:10px;

}

.hrms-dashboard-gender-chart{

    width:170px;
    height:170px;

}

.hrms-dashboard-gender-illustration{

    width:150px;

}

.hrms-dashboard-gender-footer{

    margin-top:22px;
    display:flex;
    justify-content:space-between;
    gap:20px;

}

.hrms-dashboard-gender-item{

    display:flex;
    align-items:center;
    gap:8px;
    font-size:14px;
    color:#475569;
    font-weight:500;

}

.hrms-dashboard-gender-item strong{

    margin-left:auto;
    color:#111827;

}
.hrms-dashboard-male-dot{

    width:12px;
    height:12px;
    border-radius:50%;
    background:#2563eb;

}
.hrms-dashboard-female-dot{

    width:12px;
    height:12px;
    border-radius:50%;
    background:#22c55e;

}
/*==========================================
RESIGNATION SECTION
==========================================*/

.hrms-dashboard-resignation-wrapper{

    background:#ffffff;
    border:1px solid #e8edf5;
    border-radius:18px;
    padding:25px;
    box-shadow:0 10px 35px rgba(15,23,42,.05);
    overflow:hidden;

}

/*=========================
HEADER
==========================*/

.hrms-dashboard-resignation-header{

    display:flex;
    justify-content:space-between;
    align-items:center;
    margin-bottom:25px;
    gap:20px;

}

.hrms-dashboard-resignation-title{

    font-size:22px;
    font-weight:700;
    color:#111827;
    margin-bottom:8px;

}

.hrms-dashboard-resignation-subtitle{

    font-size:14px;
    color:#6b7280;

}

/*=========================
BUTTON
==========================*/

.hrms-dashboard-view-report-btn{

    height:46px;
    padding:0 22px;
    background:#2563eb;
    color:#fff;
    border-radius:10px;
    font-size:14px;
    font-weight:600;
    transition:.30s;

}

.hrms-dashboard-view-report-btn:hover{

    background:#1d4ed8;

}

/*=========================
TABLE
==========================*/

.hrms-dashboard-table-responsive{

    width:100%;
    overflow:auto;

}

.hrms-dashboard-table-responsive::-webkit-scrollbar{

    height:8px;

}

.hrms-dashboard-table-responsive::-webkit-scrollbar-thumb{

    background:#cbd5e1;
    border-radius:20px;

}

.hrms-dashboard-resignation-table{

    width:100%;
    min-width:1300px;
    border-collapse:collapse;

}

/*=========================
TABLE HEADER
==========================*/

.hrms-dashboard-resignation-table thead{

    background:#f8fafc;

}

.hrms-dashboard-resignation-table thead th{

    padding:16px;
    text-align:left;
    font-size:14px;
    font-weight:700;
    color:#475569;
    border-bottom:1px solid #e2e8f0;
    white-space:nowrap;

}

/*=========================
TABLE BODY
==========================*/

.hrms-dashboard-resignation-table tbody tr{

    transition:.25s;

}

.hrms-dashboard-resignation-table tbody tr:hover{

    background:#f8fbff;

}

.hrms-dashboard-resignation-table tbody td{

    padding:18px 16px;
    border-bottom:1px solid #eef2f7;
    font-size:14px;
    color:#374151;
    vertical-align:middle;
    white-space:nowrap;

}

/*=========================
EMPLOYEE
==========================*/

.hrms-dashboard-employee-info{

    display:flex;
    align-items:center;
    gap:12px;
    font-weight:600;

}

.hrms-dashboard-avatar{

    width:42px;
    height:42px;
    border-radius:50%;
    object-fit:cover;
    border:2px solid #eef2ff;

}

/*=========================
STATUS BADGES
==========================*/

.hrms-dashboard-status-notice,
.hrms-dashboard-status-completed,
.hrms-dashboard-status-progress,
.hrms-dashboard-status-draft{

    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:120px;
    height:34px;
    border-radius:30px;
    font-size:13px;
    font-weight:600;

}

/* Notice */

.hrms-dashboard-status-notice{

    background:#fff7ed;
    color:#ea580c;

}

/* Completed */

.hrms-dashboard-status-completed{

    background:#ecfdf5;
    color:#16a34a;

}

/* Progress */

.hrms-dashboard-status-progress{

    background:#eff6ff;
    color:#2563eb;

}

/* Draft */

.hrms-dashboard-status-draft{

    background:#f1f5f9;
    color:#64748b;

}

/*=========================
VIEW BUTTON
==========================*/

.hrms-dashboard-view-btn{

    width:85px;
    height:38px;
    background:#2563eb;
    color:#fff;
    border-radius:10px;
    font-size:14px;
    font-weight:600;
    transition:.3s;

}

.hrms-dashboard-view-btn:hover{

    background:#1d4ed8;
    transform:translateY(-2px);

}

/*=========================
ROW NUMBER
==========================*/

.hrms-dashboard-resignation-table tbody td:first-child{

    font-weight:700;
    color:#64748b;

}

/*=========================
TABLE LAST ROW
==========================*/

.hrms-dashboard-resignation-table tbody tr:last-child td{

    border-bottom:none;

}

/*=========================
SMOOTH EFFECT
==========================*/

.hrms-dashboard-resignation-wrapper,
.hrms-dashboard-service-card,
.hrms-dashboard-age-card,
.hrms-dashboard-gender-card{

    transition:.35s;

}

.hrms-dashboard-resignation-wrapper:hover{

    box-shadow:0 18px 45px rgba(15,23,42,.08);

}
/*==========================================
CARD ANIMATIONS
==========================================*/

.hrms-dashboard-service-card,
.hrms-dashboard-age-card,
.hrms-dashboard-gender-card,
.hrms-dashboard-resignation-wrapper{

    position:relative;
    overflow:hidden;

}

.hrms-dashboard-service-card::before,
.hrms-dashboard-age-card::before,
.hrms-dashboard-gender-card::before,
.hrms-dashboard-resignation-wrapper::before{

    content:"";
    position:absolute;
    top:0;
    left:-100%;
    width:100%;
    height:3px;
    background:linear-gradient(90deg,#2563eb,#60a5fa,#2563eb);
    transition:.6s;

}

.hrms-dashboard-service-card:hover::before,
.hrms-dashboard-age-card:hover::before,
.hrms-dashboard-gender-card:hover::before,
.hrms-dashboard-resignation-wrapper:hover::before{

    left:0;

}

/*==========================================
SCROLLBAR
==========================================*/

::-webkit-scrollbar{

    width:8px;
    height:8px;

}

::-webkit-scrollbar-track{

    background:#edf2f7;

}

::-webkit-scrollbar-thumb{

    background:#94a3b8;
    border-radius:50px;

}

::-webkit-scrollbar-thumb:hover{

    background:#2563eb;

}

/*==========================================
TABLE STICKY HEADER
==========================================*/

.hrms-dashboard-table-responsive{

    max-height:600px;

}

.hrms-dashboard-resignation-table thead th{

    position:sticky;
    top:0;
    z-index:10;
    background:#f8fafc;

}

/*==========================================
ROW HOVER
==========================================*/
.hrms-dashboard-resignation-table tbody tr{

    transition:.30s ease;

}
.hrms-dashboard-resignation-table tbody tr:hover{

    background:#eff6ff;
    transform:scale(1.003);

}
/*==========================================
BUTTON EFFECT
==========================================*/
.hrms-dashboard-download-report-btn,
.hrms-dashboard-view-report-btn,
.hrms-dashboard-view-btn{

    position:relative;
    overflow:hidden;

}
.hrms-dashboard-download-report-btn::after,
.hrms-dashboard-view-report-btn::after,
.hrms-dashboard-view-btn::after{

    content:"";
    position:absolute;
    width:0;
    height:100%;
    top:0;
    left:0;
    background:rgba(255,255,255,.15);
    transition:.4s;

}

.hrms-dashboard-download-report-btn:hover::after,
.hrms-dashboard-view-report-btn:hover::after,
.hrms-dashboard-view-btn:hover::after{

    width:100%;

}

/*==========================================
INPUT FOCUS
==========================================*/

.hrms-dashboard-date-filter{
    transition:.3s;
}
 

/*==========================================
AVATAR
==========================================*/

.hrms-dashboard-avatar{
    transition:.3s;
}

.hrms-dashboard-avatar:hover{
    transform:scale(1.08);
}

/*==========================================
TABLE TEXT
==========================================*/

.hrms-dashboard-resignation-table td{

    line-height:1.5;

}

/*==========================================
RESPONSIVE
==========================================*/

@media(max-width:1400px){

.hrms-dashboard-analytics-grid{

grid-template-columns:repeat(2,1fr);

}

.hrms-dashboard-gender-card{

grid-column:span 2;

}

}

@media(max-width:992px){

.hrms-dashboard-wrapper{

padding:20px;

}

.hrms-dashboard-topbar{

flex-direction:column;
align-items:flex-start;

}

.hrms-dashboard-topbar-actions{

width:100%;
flex-wrap:wrap;

}

.hrms-dashboard-date-filter{

width:100%;

}

.hrms-dashboard-download-report-btn{

width:100%;

}

.hrms-dashboard-view-report-btn{

width:100%;

}

.hrms-dashboard-resignation-header{

flex-direction:column;
align-items:flex-start;

}

.hrms-dashboard-analytics-grid{

grid-template-columns:1fr;

}

.hrms-dashboard-gender-card{

grid-column:auto;

}

.hrms-dashboard-gender-content{

flex-direction:column;

}

}

@media(max-width:768px){

.hrms-dashboard-wrapper{

padding:15px;

}

.hrms-dashboard-title{

font-size:24px;

}

.hrms-dashboard-card-title{

font-size:17px;

}

.hrms-dashboard-chart-area{

height:220px;

}

.hrms-dashboard-gender-chart{

width:150px;
height:150px;

}

.hrms-dashboard-gender-illustration{

width:120px;

}

.hrms-dashboard-resignation-table{

min-width:1100px;

}

}

@media(max-width:576px){

.hrms-dashboard-title{

font-size:21px;

}

.hrms-dashboard-subtitle{

font-size:13px;

}

.hrms-dashboard-card-footer{

font-size:13px;

}

.hrms-dashboard-view-btn{

width:70px;
height:34px;
font-size:13px;

}

.hrms-dashboard-status-notice,
.hrms-dashboard-status-completed,
.hrms-dashboard-status-progress,
.hrms-dashboard-status-draft{

min-width:95px;
font-size:12px;

}

}

/*==========================================
FADE ANIMATION
==========================================*/

@keyframes hrmsFadeUp{

0%{

opacity:0;
transform:translateY(20px);

}

100%{

opacity:1;
transform:translateY(0);

}

}

.hrms-dashboard-service-card{

animation:hrmsFadeUp .5s ease;

}

.hrms-dashboard-age-card{

animation:hrmsFadeUp .7s ease;

}

.hrms-dashboard-gender-card{

animation:hrmsFadeUp .9s ease;

}

.hrms-dashboard-resignation-wrapper{

animation:hrmsFadeUp 1.1s ease;

}

table.table.emp-table th {
    white-space: nowrap;
        padding: 12px 20px !important;
		background: transparent !important; 
		color: #fff;
}
table.table.emp-table td {
    white-space: nowrap;
        padding: 12px 20px !important; 
}
table.table.emp-table {
    position: relative;
}

thead.thead-light {
    position: sticky;
    top: 0; 
}
thead.thead-light tr{ 
	background: linear-gradient(135deg, #61c797, #6a3ef6);
}
.section-title {
      font-weight: 600;
      font-size: 20px;
      margin-bottom: 10px;
    }
    .filter-section {
    width: 30%;
}
    .filter-section .form-control {
      border-radius: 8px;
    }
    .summary-boxes {
      display: flex;
      justify-content: space-between;
      background: white;
      padding: 15px;
      border-radius: 0 0 8px 8px;
      box-shadow: 0 2px 4px rgba(0,0,0,0.05);
      margin-bottom: 20px;
      text-align: center;
    }
    .summary-boxes div {
      flex: 1;
    }
    .summary-boxes div:not(:last-child) {
      border-right: 1px solid #e5e5e5;
    }
    .summary-percentage {
      font-weight: 600;
      font-size: 18px;
    }
    .summary-label {
      font-size: 14px;
      color: #6c757d;
    }
    .status-cards {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 15px;
    }
	.card-box1 {
		background: #fff;
		border: 1px solid #ffffff !important;
		box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
		border-radius: 8px;
		padding: 15px 12px;
		display: flex;
		flex-direction: column;
		height: 100%;
	}
    .card-header1 {
      font-weight: 500;
    margin-bottom: 15px;
    display: flex;
    justify-content: space-between;
    align-items: center;
    border-bottom: 1px solid grey;
    padding-bottom: 10px; 
    }
    .table-responsive {
      overflow-y: auto;
      max-height: 400px;
	  background: white;
    /* padding: 20px;  */
    }
  
    td small {
      color: #6c757d;
    }
    .badge-approved {
      background: #28a745;
      color: white;
      padding: 2px 8px;
      border-radius: 12px;
      font-size: 12px;
      display: inline-block;
    }
    .badge-applied {
      background: #0d6efd;
      color: white;
      padding: 2px 8px;
      border-radius: 12px;
      font-size: 12px;
      display: inline-block;
    }
 .employee-details {
      background: #f8f9fa;
      padding: 10px;
      margin-top: 8px;
      border-radius: 5px;
      display: none;
    }
	.employee-details td {
    padding: 20px;
    /* padding-left: 19px !important; */
}
    .toggle-details {
      cursor: pointer;
      position: relative;
    }
    .dropdown-icon {
      float: right;
    font-size: 10px;
    color: #6c757d;
    border: 1px solid grey;
    border-radius: 50%;
    width: 17px;
    height: 17px;
    display: flex;
    justify-content: center;
    align-items: center;
    transition: .5s all ease;
    }

i.bi.dropdown-icon.bi-chevron-up {
    color: #3a57e8;
	border: 1px solid #3a57e8;
}
.bg-secondary-50 {
    --tw-bg-opacity: 1;
    background-color: rgb(247 247 247 / var(--tw-bg-opacity, 1));
	    padding: 8px
}

tr.toggle-details td {
    padding: 10px 10px !important;
}

.summary-section-title{
	border-bottom: 1px solid #e5e5e5;
    padding: 10px;
    text-align: center;
    background: white;
	border-radius: 8px 8px 0 0;
}
.att-who-is-in {
    height: 130px;
}
.text-start-1.who-in-is p {
    font-size: 12px;
}
table.table.table-sm.who-is-in-table thead tr {
    background-image: linear-gradient(135deg, #61c797, #6a3ef6) !important; 
}
table.table.table-sm.who-is-in-table thead tr th {
    background-color:transparent; 
	color: #fff;
}
:root{
    --eht-blue:#2f6fed;
    --eht-blue-light:#eaf1ff;
    --eht-green:#22a35a;
    --eht-green-light:#e7f8ee;
    --eht-red:#e5484d;
    --eht-red-light:#fdecec;
    --eht-purple:#8b5cf6;
    --eht-purple-light:#f1ebfe;
    --eht-orange:#f5a623;
    --eht-orange-light:#fef3e0;
    --eht-gray:#9aa4b2;
    --eht-gray-light:#f4f5f7;
    --eht-border:#e9ecf1;
    --eht-text:#1f2733;
    --eht-text-soft:#8a93a3;
  }
   
  .eht-table-scroll::-webkit-scrollbar {
    width: 6px;
    height: 4px;
}

.eht-table-scroll::-webkit-scrollbar-thumb {
    background: #b5b5b5;
    border-radius: 10px;
}

.eht-table-scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
}
  .eht-dashboard{
    max-width:1180px;
    margin:0 auto;
  }

  /* ===== Toolbar ===== */
  .eht-toolbar{
    display:flex;
    align-items:center;
    gap:12px;
    background:#fff;
    border:1px solid var(--eht-border);
    border-radius:14px;
    padding:12px 14px;
    margin-bottom:16px;
    flex-wrap:wrap;
  }
  .eht-field{
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--eht-border);
    border-radius:10px;
    padding:9px 12px;
    background:#fff;
    font-size:13.5px;
    color:var(--eht-text);
    white-space:nowrap;
  }
  .eht-field svg{flex-shrink:0;color:var(--eht-text-soft);}
  .eht-field.eht-select{cursor:pointer;}
  .eht-field.eht-search{flex:1;min-width:180px;}
  .eht-field.eht-search input{
    border:none;outline:none;font-size:13.5px;width:100%;color:var(--eht-text);background:transparent;
  }
  .eht-field.eht-search input::placeholder{color:var(--eht-text-soft);}
  .eht-chevron{margin-left:2px;}
  .eht-filters-btn{
    margin-left:auto;
    display:flex;align-items:center;gap:8px;
    border:1px solid var(--eht-blue);
    color:var(--eht-blue);
    background:#fff;
    border-radius:10px;
    padding:9px 16px;
    font-size:13.5px;
    font-weight:600;
    cursor:pointer;
  }

  /* ===== Stat cards ===== */
  .eht-stats-row{
    display:grid;
    grid-template-columns: repeat(5,1fr);
    gap: 8px;
    margin-bottom:18px;
  }
  .eht-stat-card{
    background:#fff;
    border:1px solid var(--eht-border);
    border-radius:14px;
    padding: 20px 12px;
    display:flex;
    align-items:center;
    gap: 10px;
	    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
  }
  .eht-stat-icon{
    width:42px;height:42px;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    flex-shrink:0;
  }
  .eht-stat-icon.eht-i-total{background:var(--eht-blue-light);color:var(--eht-blue);}
  .eht-stat-icon.eht-i-present{background:var(--eht-green-light);color:var(--eht-green);}
  .eht-stat-icon.eht-i-absent{background:var(--eht-red-light);color:var(--eht-red);}
  .eht-stat-icon.eht-i-leave{background:var(--eht-purple-light);color:var(--eht-purple);}
  .eht-stat-icon.eht-i-holiday{background:var(--eht-orange-light);color:var(--eht-orange);}
  .eht-stat-icon.eht-i-attendance{background:var(--eht-blue-light);color:var(--eht-blue);}
  .eht-stat-label{
    font-size: 12px;
    color: #000000;
    margin-bottom: 4px;
  }
  .eht-stat-value{
    font-size:20px;font-weight:700;line-height:1.1;
  }
  .eht-stat-sub{
    font-size:11.5px;font-weight:600;margin-left:4px;
  }
  .eht-stat-sub.eht-sub-green{color:var(--eht-green);}
  .eht-stat-sub.eht-sub-red{color:var(--eht-red);}
  .eht-stat-sub.eht-sub-orange{color:var(--eht-orange);}
  .eht-stat-sub.eht-sub-purple{color:var(--eht-purple);}
  .eht-stat-sub.eht-sub-blue{color:var(--eht-blue);}

  /* ===== Table card ===== */
  .eht-table-card{
    background:#fff;
    border:1px solid var(--eht-border);
    border-radius:14px;
    padding:18px 18px 10px;
  }
  .eht-table-scroll{
    overflow-x:auto;
  }
  .eht-table{
    border-collapse:separate;
    border-spacing:0;
    width:100%;
    min-width:1300px;
  }
  .eht-table thead th{
    font-size:11px;
    font-weight:600;
    color:var(--eht-text-soft);
    text-align:center;
    padding:6px 15px;
    border-bottom:1px solid var(--eht-border);
	    border-right: 1px solid var(--eht-border);
    white-space:nowrap;
  }
  .eht-th-emp{
    text-align:left !important;
    font-size:13px !important;
    color:var(--eht-text) !important;
    padding-left:4px !important;
    min-width:230px;
    width:230px;
  }

  /* ===== Sticky left column (Employee Details) ===== */
  .eht-sticky-left{
    position:sticky;
    left:0;
    z-index:3;
    background:#fff;
	    border-right: 1px solid #8a93a326;
  }
  .eht-sticky-left::after{
    content:"";
    position:absolute;
    top:0; right:-8px; bottom:0;
    width:8px;
    box-shadow:4px 0 8px -4px rgba(20,20,30,0.12);
    pointer-events:none;
  }

  /* ===== Sticky right columns (P L H A WO OFF %) ===== */
 
  .eht-day-head{
    line-height:1.5;
  }
  .eht-day-head.eht-weekend{
    background:var(--eht-red-light); 
    color:var(--eht-red) !important;
  }
  .eht-th-summary{
    min-width:44px;
    width:44px;
  }
  .eht-th-pct{min-width:76px;width:76px;}

  .eht-table tbody td{
    text-align:center;
    padding:14px 4px;
    border-bottom:1px solid var(--eht-border);
	    border-right: 1px solid var(--eht-border);
    font-size:12.5px;
  }
  .eht-emp-cell{
    text-align:left !important;
    display:flex;
    align-items:center;
    gap:10px;
    padding-left:4px !important;
  }
  .eht-avatar{
    width:38px;height:38px;
    border-radius:50%;
    display:flex;align-items:center;justify-content:center;
    font-weight:700;
    font-size:13px;
    flex-shrink:0;
  }
  .eht-avatar.eht-av-blue{background:#e3edff;color:#3b6fe0;}
  .eht-avatar.eht-av-teal{background:#dff5f1;color:#1ea390;}
  .eht-avatar.eht-av-purple{background:#efe7fe;color:#8b5cf6;}
  .eht-avatar.eht-av-orange{background:#feefdd;color:#e39a2a;}
  .eht-emp-name{
    font-weight:700;
    font-size:13px;
    color:var(--eht-text);
    display:flex;align-items:center;gap:6px;
  }
  .eht-emp-id{
    font-size:11px;
    font-weight:600;
    color:var(--eht-blue);
    background:var(--eht-blue-light);
    border-radius:5px;
    padding:1px 6px;
  }
  .eht-emp-role{
    font-size:11.5px;color:var(--eht-text-soft);margin-top:2px;
  }

  .eht-cell{
    display:flex;
    flex-direction:column;
    align-items:center;
    gap:2px;
  }
  .eht-dot{
    width:8px;height:8px;border-radius:50%;
  }
  .eht-label{
    font-size:10.5px;font-weight:600;
  }
  .eht-status-p .eht-dot{background:var(--eht-green);}
  .eht-status-p .eht-label{color:var(--eht-green);}
  .eht-status-a .eht-dot{background:var(--eht-red);}
  .eht-status-a .eht-label{color:var(--eht-red);}
  .eht-status-wo .eht-dot{background:var(--eht-orange);}
  .eht-status-wo .eht-label{color:var(--eht-orange);}
  .eht-status-cl .eht-dot,
  .eht-status-el .eht-dot{background:var(--eht-purple);}
  .eht-status-cl .eht-label,
  .eht-status-el .eht-label{color:var(--eht-purple);}
  .eht-status-empty{color:var(--eht-text-soft);font-weight:600;}

  .eht-col-divider{
    border-left:1px solid var(--eht-border);
  }
  .eht-pct-pill{
    display:inline-block;
    font-weight:700;
    font-size:12px;
    padding:4px 10px;
    border-radius:16px;
    background:var(--eht-green-light);
    color:var(--eht-green);
  }

  /* ===== Legend ===== */
  .eht-legend{
    display:flex;
    align-items:center;
    gap:26px;
    flex-wrap:wrap;
    padding:16px 6px 6px;
    font-size:12.5px;
    color:var(--eht-text-soft);
  }
  .eht-legend-item{
    display:flex;align-items:center;gap:7px;
  }
  .eht-legend-dot{
    width:9px;height:9px;border-radius:50%;
  }
  .eht-legend-dot.eht-ld-green{background:var(--eht-green);}
  .eht-legend-dot.eht-ld-red{background:var(--eht-red);}
  .eht-legend-dot.eht-ld-purple{background:var(--eht-purple);}
  .eht-legend-dot.eht-ld-orange{background:var(--eht-orange);}
  .eht-legend-dot.eht-ld-blue{background:var(--eht-blue);}
  .eht-legend-dot.eht-ld-gray{background:#c7cdd6;}

  @media (max-width:900px){
    .eht-stats-row{grid-template-columns:repeat(2,1fr);}
  }

   :root{
    --sr-green-bg:#e6f6ea;
    --sr-green-text:#1e8a3c;
    --sr-green-dot:#34a853;
    --sr-off-bg:#eef0f2;
    --sr-off-text:#6b7280;
    --sr-off-dot:#c6cbd1;
    --sr-cl-bg:#eef1fd;
    --sr-cl-text:#5b6bd9;
    --sr-cl-dot:#8b9cf0;
    --sr-el-bg:#fbeefb;
    --sr-el-text:#b355b3;
    --sr-el-dot:#e08fe0;
    --sr-weekend-bg:#f7f8fa;
    --sr-border:#e9ebee;
    --sr-text-main:#1f2430;
    --sr-text-muted:#8a8f99;
    --sr-blue:#3b6fe0;
  }

 

  .sr-breadcrumb{
    font-size:13px;
    color:var(--sr-text-muted);
    margin-bottom:16px;
  }
  .sr-breadcrumb .sr-crumb-current{
    color:var(--sr-text-main);
    font-weight:600;
  }

  .sr-card{
    background:#ffffff;
    border-radius:12px;
    padding:20px 20px 8px 20px;
    box-shadow:0 1px 2px rgba(16,24,40,0.04);
  }

  .sr-toolbar{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:20px;
    flex-wrap:wrap;
  }

  .sr-select-group{
    display:flex;
    align-items:center; 
    border:1px solid var(--sr-border);
    border-radius:8px;
    padding:8px 12px;
    font-size:13px;
    color:var(--sr-text-main);
    background:#fff;
    cursor:pointer;
  }
  .sr-select-group svg{flex-shrink:0;}
  .sr-select-group select{
    border:none;
    outline:none;
    background:transparent;
    font-size:13px;
    color:var(--sr-text-main);
    cursor:pointer;
    appearance:none;
    padding: 0 14px;
  }
  .sr-select-group .sr-caret{
    margin-left:-14px;
    pointer-events:none;
  }

  .sr-search-box{
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--sr-border);
    border-radius:8px;
    padding:8px 12px;
    flex:1;
    min-width:220px;
    max-width:360px;
  }
  .sr-search-box input{
    border:none;
    outline:none;
    font-size:13px;
    width:100%;
    color:var(--sr-text-main);
  }
  .sr-search-box input::placeholder{color:var(--sr-text-muted);}

  .sr-spacer{flex:1;}

  .sr-export-btn{
    display:flex;
    align-items:center;
    gap:8px;
    border:1px solid var(--sr-blue);
    color:var(--sr-blue);
    background:#fff;
    border-radius:8px;
    padding:9px 16px;
    font-size:13px;
    font-weight:600;
    cursor:pointer;
    white-space:nowrap;
  }
  .sr-export-btn:hover{background:#f2f6ff;}

  .sr-table-scroll{
    overflow-x:auto;
    padding-bottom:8px;
	border-top: 1px solid #e9ebee;
  }

  .sr-table{
    border-collapse:separate;
    border-spacing:0;
    width:100%;
    min-width:1400px;
  }

  .sr-table thead th{
    background:#fff;
    z-index:2;
    font-weight:600;
    font-size:11px;
    text-align:center;
    color:var(--sr-text-muted);
    padding: 12px 4px 12px 4px;
    border-bottom:1px solid var(--sr-border);
    border-right: 1px solid #e9ebee;
  }

  .sr-th-employee{
    text-align:left;
    padding-left:8px;
    min-width:220px;
    position:sticky;
    left:0;
    background:#fff;
    z-index:3;
    font-size:13px;
    color:var(--sr-text-muted);
    font-weight:600;
  }
  .sr-th-wd, .sr-th-off{
    min-width:44px;
  }

  .sr-day-head{
    min-width:38px;
  }
  .sr-day-num{
    display:block;
    font-size:12px;
    font-weight:700;
    color:var(--sr-text-main);
  }
  .sr-day-dow{
    display:block;
    font-size:10px;
    color:var(--sr-text-muted);
    font-weight:500;
  }
 .sr-day-head.sr-weekend {
    background: #ffcbcb;
}

  .sr-table tbody td{
    text-align:center;
    padding: 14px 4px;
    border-bottom:1px solid var(--sr-border);
    font-size:11px;
	border-right: 1px solid var(--sr-border);
  }

  .sr-table tbody tr:last-child td{
    border-bottom:none;
  }

  .sr-td-employee{
    text-align:left;
    position:sticky;
    left:0;
    background:#fff;
    z-index:1;
    padding:14px 8px;
    border-right: 1px solid #e9ebee;
  }

  .sr-emp-row{
    display:flex;
    align-items:center;
    gap:10px;
  }

  .sr-avatar{
    width:36px;
    height:36px;
    border-radius:50%;
    background:linear-gradient(135deg,#dbe4ff,#c3d0ff);
    color:#3b52b0;
    display:flex;
    align-items:center;
    justify-content:center;
    font-size:13px;
    font-weight:700;
    flex-shrink:0;
  }

  .sr-emp-name{
    font-size:13px;
    font-weight:700;
    color:var(--sr-text-main);
    line-height:1.3;
  }
  .sr-emp-id{
    font-weight:500;
    color:var(--sr-text-muted);
  }
.sr-emp-role 
 {
    font-size: 11.5px;
    color: var(--sr-text-muted); 
    margin-top: 4px;
    text-align: left;
}

  .sr-td-num{
    font-weight:700;
    font-size:13px;
    color:var(--sr-text-main);
  }

  .sr-day-cell{
    background:transparent;
  }
  .sr-day-cell.sr-weekend{
       background: #ffcbcb;
  }

  .sr-tag{
    display:inline-block;
    min-width:34px;
    padding:4px 6px;
    border-radius:6px;
    font-size:10.5px;
    font-weight:700;
    letter-spacing:0.2px;
  }
  .sr-tag-gs{background:var(--sr-green-bg);color:var(--sr-green-text);}
  .sr-tag-off {
    background: #ffcbcb;
    color: #F44336;
}
  .sr-tag-cl{background:var(--sr-cl-bg);color:var(--sr-cl-text);}
  .sr-tag-el{background:var(--sr-el-bg);color:var(--sr-el-text);}

  .sr-legend{
    display:flex;
    align-items:center;
    gap:24px;
    flex-wrap:wrap;
    padding:16px 8px 18px 8px;
    margin-top:4px; 
    font-size:12.5px;
    color:var(--sr-text-main);
  }
  .sr-legend-item{
    display:flex;
    align-items:center;
    gap:7px;
  }
  .sr-dot{
    width:10px;
    height:10px;
    border-radius:50%;
    display:inline-block;
  }
  .sr-dot-gs{background:var(--sr-green-dot);}
  .sr-dot-off{background:var(--sr-off-dot);}
  .sr-dot-cl{background:var(--sr-cl-dot);}
  .sr-dot-el{background:var(--sr-el-dot);}

    .sr-table-scroll::-webkit-scrollbar {
    width: 6px;
    height: 4px;
}

.sr-table-scroll::-webkit-scrollbar-thumb {
    background: #b5b5b5;
    border-radius: 10px;
}

.sr-table-scroll::-webkit-scrollbar-track {
    background: #f1f1f1;
}
th.sr-th-employee {
    font-size: 16px !important;
    color: #000 !important;
}

 :root {
      --trg-purple: #6C4FE0;
      --trg-purple-dark: #5B3EDC;
      --trg-purple-light: #EFEAFD;
      --trg-green: #1BAA6A;
      --trg-green-light: #E7F8EF;
      --trg-red: #E14848;
      --trg-red-light: #FDECEC;
      --trg-text-dark: #1E1B2E;
      --trg-text-muted: #8B87A0;
      --trg-border: #EDEBF5;
      --trg-bg: #F7F6FC;
    }
 
    /* Breadcrumb */
    .trg-breadcrumb {
      font-size: 13px;
      color: var(--trg-text-muted);
      margin-bottom: 18px;
    }

    .trg-breadcrumb a {
      color: var(--trg-purple);
      text-decoration: none;
      font-weight: 500;
    }

    .trg-breadcrumb .trg-sep {
      margin: 0 6px;
      color: #C9C5DA;
    }

    /* Header */
    .trg-header {
      position: relative;
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      margin-bottom: 26px;
      overflow: hidden;
    }

    .trg-header h1 {
      font-size: 26px;
      font-weight: 800;
      margin: 0 0 6px 0;
      letter-spacing: -0.3px;
    }

    .trg-header p {
      font-size: 14px;
      color: var(--trg-text-muted);
      margin: 0;
    }

    .trg-header-art {
      width: 120px;
      height: 90px;
      flex-shrink: 0;
    }

    /* Stat cards (also act as tabs) */
    .trg-stats {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 20px;
      margin-bottom: 26px;
    }

    .trg-stat-card {
      border-radius: 18px;
      padding: 20px 22px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      min-height: 96px;
      cursor: pointer;
      user-select: none;
      transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
      border: 2px solid var(--trg-border);
      background: #fff;
    }

    .trg-stat-card:hover {
      transform: translateY(-2px);
    }

    .trg-stat-card.trg-tab-active.trg-stat-pending {
      box-shadow: 0 12px 24px -8px rgba(108, 79, 224, 0.55);
    border-color: #673AB7;
    }

    .trg-stat-card.trg-tab-active.trg-stat-accepted {
      border-color: var(--trg-green);
      box-shadow: 0 10px 22px -10px rgba(27, 170, 106, 0.35);
    }

    .trg-stat-card.trg-tab-active.trg-stat-rejected {
      border-color: var(--trg-red);
      box-shadow: 0 10px 22px -10px rgba(225, 72, 72, 0.3);
    }

    .trg-stat-left {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .trg-stat-label-row {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 15px;
      font-weight: 600;
    }

    .trg-stat-pending .trg-stat-label-row {
      color: #673ab7;
    }
 
    .trg-stat-accepted .trg-stat-label-row {
      color: var(--trg-green);
    }

    .trg-stat-rejected .trg-stat-label-row {
      color: var(--trg-red);
    }

    .trg-stat-icon-badge {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .trg-stat-pending .trg-stat-icon-badge {
      background: var(--trg-purple-light);
      color: var(--trg-purple);
    }
 

    .trg-stat-accepted .trg-stat-icon-badge {
      background: var(--trg-green-light);
    }

    .trg-stat-rejected .trg-stat-icon-badge {
      background: var(--trg-red-light);
    }

    .trg-stat-number {
      font-size: 30px;
      font-weight: 800;
      line-height: 1;
    }

    .trg-stat-sub {
      font-size: 12px;
      font-weight: 500;
      color: var(--trg-text-muted);
    }

    .trg-stat-card.trg-tab-active.trg-stat-pending .trg-stat-sub {
      color: rgba(255, 255, 255, 0.75);
    }

    .trg-stat-right-icon {
      width: 46px;
      height: 46px;
      border-radius: 14px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      background: var(--trg-purple-light);
    }
 

    .trg-stat-accepted .trg-stat-right-icon {
      background: var(--trg-green-light);
    }

    .trg-stat-rejected .trg-stat-right-icon {
      background: var(--trg-red-light);
    }

    /* Table card */
    .trg-table-card {
      background: #fff;
      border-radius: 18px;
      border: 1px solid var(--trg-border);
      padding: 22px 24px 10px 24px;
    }

    .trg-table-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 18px;
    }

    .trg-table-title {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 16px;
      font-weight: 700;
    }

    .trg-table-title-icon {
      width: 32px;
      height: 32px;
      border-radius: 9px;
      background: var(--trg-purple-light);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .trg-table-total {
      font-size: 13px;
      font-weight: 700;
      color: var(--trg-purple);
    }

    /* Tab panels — each one holds its own fully static <table> */
    .trg-tab-panel {
      display: none;
    }

    .trg-tab-panel.trg-panel-active {
      display: block;
    }

    .trg-table {
      width: 100%;
      border-collapse: collapse;
      font-size: 13px;
    }

    .trg-table thead th {
      text-align: left;
      color: var(--trg-text-muted);
      font-weight: 600;
      font-size: 12px;
      padding: 10px 12px;
      border-bottom: 1px solid var(--trg-border);
      white-space: nowrap;
    }

    .trg-table tbody td {
      padding: 14px 12px;
      border-bottom: 1px solid var(--trg-border);
      vertical-align: middle;
      color: var(--trg-text-dark);
      white-space: nowrap;
    }

    .trg-table tbody tr:last-child td {
      border-bottom: none;
    }

    .trg-emp-cell {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .trg-avatar {
      width: 34px;
      height: 34px;
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 700;
      color: #fff;
    }

    .trg-emp-name {
      font-weight: 600;
      font-size: 13px;
      white-space: nowrap;
    }

    .trg-emp-role {
      font-size: 11.5px;
      color: var(--trg-text-muted);
    }

    .trg-mgr-cell {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .trg-mgr-avatar {
      width: 26px;
      height: 26px;
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 10px;
      font-weight: 700;
      color: #fff;
    }

    .trg-mgr-name {
      font-weight: 600;
      font-size: 12.5px;
    }

    .trg-mgr-role {
      font-size: 11px;
      color: var(--trg-text-muted);
    }

    .trg-email {
      color: var(--trg-text-muted);
      font-size: 12.5px;
    }

    .trg-status-badge {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 5px 12px;
      border-radius: 20px;
      font-size: 12px;
      font-weight: 600;
    }

    .trg-status-badge::before {
      content: '';
      width: 6px;
      height: 6px;
      border-radius: 50%;
    }

    .trg-status-badge.trg-status-pending {
      background: var(--trg-purple-light);
      color: var(--trg-purple);
    }

    .trg-status-badge.trg-status-pending::before {
      background: var(--trg-purple);
    }

    .trg-status-badge.trg-status-accepted {
      background: var(--trg-green-light);
      color: var(--trg-green);
    }

    .trg-status-badge.trg-status-accepted::before {
      background: var(--trg-green);
    }

    .trg-status-badge.trg-status-rejected {
      background: var(--trg-red-light);
      color: var(--trg-red);
    }

    .trg-status-badge.trg-status-rejected::before {
      background: var(--trg-red);
    }

    /* Action dropdown */
    .trg-action-dd {
      position: relative;
      display: inline-block;
    }

    .trg-action-btn {
      width: 30px;
      height: 30px;
      border-radius: 8px;
      border: 1px solid var(--trg-border);
      background: #fff;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--trg-purple);
      cursor: pointer;
    }

    .trg-action-btn:hover {
      background: var(--trg-purple-light);
    }

    .trg-action-btn.trg-open {
      background: var(--trg-purple-light);
      border-color: var(--trg-purple);
    }

    .trg-action-menu {
      position: absolute;
      top: 36px;
      right: 0;
      background: #fff;
      border: 1px solid var(--trg-border);
      border-radius: 12px;
      box-shadow: 0 14px 32px -10px rgba(30, 27, 46, 0.2);
      padding: 6px;
      min-width: 150px;
      z-index: 20;
      display: none;
    }

    .trg-action-menu.trg-show {
      display: block;
    }

    .trg-action-item {
      display: flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      border: none;
      background: none;
      text-align: left;
      padding: 8px 10px;
      border-radius: 8px;
      font-size: 12.5px;
      font-weight: 600;
      cursor: pointer;
      color: var(--trg-text-dark);
    }

    .trg-action-item:hover {
      background: var(--trg-bg);
    }

    .trg-action-item.trg-accept-item {
      color: var(--trg-green);
    }

    .trg-action-item.trg-reject-item {
      color: var(--trg-red);
    }

    .trg-action-item svg {
      flex-shrink: 0;
    }

    .trg-menu-btn {
      background: none;
      border: none;
      color: var(--trg-text-muted);
      cursor: pointer;
      padding: 4px;
    }

    /* Footer / pagination */
    .trg-table-footer {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 16px 4px 6px 4px;
      font-size: 12.5px;
      color: var(--trg-text-muted);
    }

    .trg-pagination {
      display: flex;
      align-items: center;
      gap: 6px;
    }

    .trg-page-arrow {
      width: 28px;
      height: 28px;
      border-radius: 8px;
      border: 1px solid var(--trg-border);
      background: #fff;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--trg-text-muted);
      cursor: pointer;
    }

    .trg-page-num {
      width: 28px;
      height: 28px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-weight: 600;
      background: var(--trg-purple);
      color: #fff;
      font-size: 12.5px;
    }

    .trg-per-page {
      display: flex;
      align-items: center;
      gap: 6px;
      border: 1px solid var(--trg-border);
      border-radius: 8px;
      padding: 5px 10px;
      font-weight: 600;
      color: var(--trg-text-dark);
    }
	select.emp-select {
    background: none;
    border: none;
    outline: none;
    width: 150px;
}
.leave-apply-banner.emp-banner {
    height: 200px;
}
.emp-banner input.es-autocomplete.ui-autocomplete-input {
    background: transparent;
}
.select-emp-d {
    border-bottom: 1px solid #fff;
    width: fit-content;
    padding: 6px 10px 6px 0;
    margin: 10px 0 15px;
    font-size: 15px;
    color: #000;
}
.dt-layout-cell-em.table-responsive {
    box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
    border-radius: 10px;
}
.dt-layout-cell-em td {
    padding: 12px 26px !important;
}
a.cancel {
    background: #d70808 !important;
    border-color: #d70808 !important;
    color: #fff !important;
}
ul.pager.wizard.twitter-bs-wizard-pager-link li {
    list-style: none;
    padding-left: 0 !important;
}

ul.pager.wizard.twitter-bs-wizard-pager-link {
    padding: 0;
}
.ant-steps-item-icon {
    width: 55px;
    height: 55px;
    margin: 0 auto;
    background: linear-gradient(135deg, #dbf5e9, #e8e1ff);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.ant-steps-item-title {
    color: #000;
    font-size: 16px;
    font-weight: 600;
    margin-top: 5px;
}
.ant-steps-item-icon svg {
    width: 23px;
    height: 27px;
    color: #000;
}
.ant-steps-item-container-1 .ant-steps-item-title::after {
position: absolute;
    top: 28px;
    inset-inline-start: 100%;
    display: block;
    width: 91px;
    height: 1px;
    background: rgba(5, 5, 5, 0.06);
    content: "";
}
.ant-steps-item-container-1{position: relative;}
h4.card-title {
    color: #000000;
    font-size: 18px;
    margin-bottom: 20px;
}
a.nav-link.border-0.active .ant-steps-item-icon {
	background: linear-gradient(135deg, #61c797, #6a3ef6);
}
a.nav-link.border-0.active .ant-steps-item-icon svg { 
    color: #ffffff;
}
 
 

.chart-wrapper canvas{
    width:100%!important;
    height:100%!important;
}

.gender-card {
	display: grid;
	grid-template-columns: 26% 40% 28%;
	gap: 30px;
	align-items: center;
}

.gender-left h3 {
	margin-bottom: 5px;
	font-size: 18px;
	font-weight: 700;
	color: #111827;
	margin-bottom: 5px;
}
.gender-left p{
color:#8b97b3;
margin-bottom:20px;
}

.chart-wrapper{
    position: relative;
    width: 210px;
    height: 210px;
    margin: auto;
}

.chart-center{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
text-align:center;
}

.chart-center span{font-size: 13px;color: #000000;}

.chart-center h2{margin-top:5px;font-size: 32px;font-weight:700;}

.gender-right{display:flex;flex-direction:column;gap: 11px;justify-content:center;}

.gender-box{display:flex;justify-content:space-between;align-items:center;padding: 15px 20px;border-radius:16px;background:#fff;box-shadow:0 6px 18px rgba(0,0,0,.06);}

.dot{
width:12px;
height:12px;
border-radius:50%;
display:inline-block;
margin-right:10px;
    margin-top: 3px;
}

.male{
background:#2F6BFF;
}

.female{
background:#1EC9A7;
}

.info-box{padding: 14px 18px;border-radius:16px;background:#EEF2FF;color:#4255ff;font-weight:600;}
.gender-flex {
    display: flex;
}

.gender-flex h4 {
    font-size: 14px;
    font-weight: 600;
}

.gender-flex h3 {
    font-size: 22px;
    font-weight: 600;
	    margin-bottom: 0;
}

.count h2 {
    font-size: 23px;
    font-weight: 600;
    margin-bottom: 1px;
}
.gender-sec-card 
 {
    gap: 30px;
    padding: 25px;
    background: #fff;
    border-radius: 18px; 
	position: relative;
	box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}
.gen-img img {
    width: 377px;
    position: absolute;
    bottom: 0;
    right: -37px;
}

/* today */
/* Help banner */
.emp-help-banner{
  /* background: linear-gradient(135deg, #EEF0FF 0%, #ffffff 100%); */
  border-radius:16px;
  padding: 16px 16px;
  position:relative;
  overflow:hidden;
  margin-bottom:20px;
  border: 1px solid #edebeb;
}
.emp-help-banner p{
  margin:0 0 4px;
  font-size:14px;
  color:#4B4E63; 
  line-height:1.5;
}
.emp-help-banner .emp-hide-help{
  position:absolute;
  top: 8px;
  right:24px;
  font-size:13px;
  font-weight:600;
  color:var(--emp-primary);
  cursor:pointer;
}
.emp-help-banner .emp-hide-help i{margin-left:4px;}
.emp-help-illustration{
  position:absolute;
  right:24px;
  top:8px;
  width:150px;
  opacity:.95;
  transition:opacity .2s ease;
}
.emp-help-body{
  max-height:200px;
  opacity:1;
  overflow:hidden;
  transition:max-height .3s ease, opacity .25s ease, margin .3s ease;
}
.emp-help-banner.emp-help-collapsed .emp-help-body{
  max-height:0;
  opacity:0;
}
.emp-help-banner.emp-help-collapsed .emp-help-illustration{
  opacity:0;
  pointer-events:none;
}
.emp-help-banner.emp-help-collapsed{
  padding-top:16px;
  padding-bottom:16px;
}
.emp-hide-help{
  user-select:none;
}
.emp-hide-help i{
  transition:transform .25s ease;
  display:inline-block;
}
.emp-help-banner.emp-help-collapsed .emp-hide-help i{
  transform:rotate(180deg);
}

/* Profile header */
.emp-profile-header{
  background: linear-gradient(135deg, #61c797, #6a3ef6);
  border-radius:16px;
  padding:20px 28px;
  display:flex;
  align-items:center;
  gap:20px;
  flex-wrap:wrap;
  margin-bottom: 15px;
}
.emp-avatar-wrap{
  width:72px;
  height:72px;
  border-radius:50%;
  background:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  flex-shrink:0;
  overflow:hidden;
  box-shadow:0 4px 10px rgba(0,0,0,.15);
}
.emp-avatar-wrap svg{width:100%;height:100%;}
.emp-header-name-block{
  display:flex;
  flex-direction:column;
  gap:6px;
  margin-right:auto;
}
.emp-header-name-row{
  display:flex;
  align-items:center;
  gap:10px;
}
.emp-header-name-row h2{
  color:#fff;
  font-size:20px;
  font-weight:700;
  margin:0;
}
.emp-id-pill{
  background:rgba(255,255,255,.25);
  color:#fff;
  font-size:11px;
  font-weight:700;
  padding:3px 10px;
  border-radius:20px;
}
.emp-role-pill{
  background:rgba(46,204,113,.9);
  color:#fff;
  font-size:12px;
  font-weight:600;
  padding:4px 12px;
  border-radius:20px;
  display:inline-flex;
  align-items:center;
  gap:5px;
  width:fit-content;
}
.emp-role-pill i{font-size:6px;}
.emp-header-stats{
  display:flex;
  gap:10px;
  flex-wrap:wrap;
}
.emp-stat-chip{
  background:rgba(255,255,255,.18);
  border-radius:10px;
  padding:8px 18px;
  min-width:110px;
}
.emp-stat-chip .emp-stat-label{
  font-size:11px;
  color:rgba(255,255,255,.75);
  display:block;
  margin-bottom:2px;
}
.emp-stat-chip .emp-stat-value{
  font-size:14px;
  font-weight:700;
  color:#fff;
  display:flex;
  align-items:center;
  gap:6px;
}
.emp-status-dot{
  width:7px;
  height:7px;
  border-radius:50%;
  background:#2ECC71;
  display:inline-block;
}

/* Generic card */
.emp-card{
  background:var(--emp-card-bg);
  border-radius:16px;
  border:1px solid var(--emp-border);
  padding: 20px;
  margin-bottom: 15px;
  box-shadow: 0px 0px 20px rgb(106 62 246 / 21%);
}
.emp-card-header{
  display:flex;
  align-items:center;
  justify-content:space-between;
  margin-bottom:18px;
}
.emp-card-title{
  font-size:15px;
  font-weight:700;
  margin:0;
  display:flex;
  align-items:center;
  gap:10px;
}
.emp-card-title .emp-icon-badge{
  width:32px;height:32px;
  border-radius:9px;
  display:flex;align-items:center;justify-content:center;
  font-size:14px;
  color:#fff;
}
.emp-edit-btn{
  border:1px solid var(--emp-border);
  background:#fff;
  font-size:13px;
  font-weight:600;
  color:var(--emp-text-dark);
  padding:6px 16px;
  border-radius:8px;
  display:flex;
  align-items:center;
  gap:6px;
}

/* Info grid */
.emp-info-grid{
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:24px 20px;
}
.emp-info-item{
  display:flex;
  gap:12px;
  align-items:flex-start;
}
.emp-info-icon{
  width:34px;height:34px;
  border-radius:9px;
  background:#F2F1FE;
  display:flex;align-items:center;justify-content:center;
  flex-shrink:0;
  font-size:14px;
  color:var(--emp-primary);
}
.emp-info-icon.emp-icon-pink{background:#FDEEF2;color:#F15B93;}
.emp-info-item .emp-info-label{
  font-size:12px;
  color:var(--emp-text-muted);
  display:block;
  margin-bottom:3px;
}
.emp-info-item .emp-info-value{
  font-size:14px;
  font-weight:600;
  color:var(--emp-text-dark);
}

/* Two column section (Job info / Salary info) */
.emp-two-col{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap: 15px;
  margin-bottom: 15px;
}
.emp-subgrid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:18px 14px;
}
.emp-subgrid .emp-info-label{
  font-size:12px;
  color:var(--emp-text-muted);
  display:block;
  margin-bottom:4px;
}
.emp-subgrid .emp-info-value{
  font-size:14px;
  font-weight:600;
  color:var(--emp-text-dark);
}
.emp-icon-badge.emp-badge-purple{background:linear-gradient(135deg,#8B7CF6,#6C5CE7);}
.emp-icon-badge.emp-badge-green{background:linear-gradient(135deg,#3FCE83,#22B36B);}

/* Documents */
.emp-doc-row{
  display:flex;
  gap: 12px;
  flex-wrap:wrap;
  align-items:center;
}
.emp-doc-chip{
  border:1px solid var(--emp-border);
  border-radius:12px;
  padding: 12px 12px;
  display:flex;
  align-items:center;
  gap:10px;
  min-width:160px;
  flex:1 1 160px;
}
.emp-doc-icon{
  width:30px;height:30px;
  border-radius:8px;
  display:flex;align-items:center;justify-content:center;
  font-size:13px;
  flex-shrink:0;
}
.emp-doc-icon.emp-doc-blue{background:#EAF0FE;color:#3E5FF5;}
.emp-doc-icon.emp-doc-pink{background:#FDEAF0;color:#F1518A;}
.emp-doc-icon.emp-doc-purple{background:#F1EEFE;color:#7B6CF6;}
.emp-doc-icon.emp-doc-gray{background:#F0F1F5;color:#7A7E91;}
.emp-doc-name{
  font-size: 12px;
  font-weight:700;
  color: #000000;
  display:block;
}
.emp-doc-status{
  font-size:11px;
  color:var(--emp-green);
  display:flex;
  align-items:center;
  gap:4px;
}
.emp-doc-status i{font-size:5px;}
.emp-doc-download{
  margin-left:auto;
  color:var(--emp-text-muted);
  font-size:13px;
}
.emp-view-all-btn{
  padding: 12px 18px;
    font-size: 13px;
    font-weight: 700;
    color: #fff;
    display: flex;
    align-items: center;
    gap: 8px;
    white-space: nowrap;
    border: 1px solid #fff;
    background: linear-gradient(135deg, #61c797, #6a3ef6);
    border-radius: 8px;
}

/* Quick info */
.emp-quick-grid{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:0;
  border:1px solid var(--emp-border);
  border-radius:14px;
  overflow:hidden;
}
.emp-quick-cell{
  padding:16px 18px;
  border-right:1px solid var(--emp-border);
  border-bottom:1px solid var(--emp-border);
}
.emp-quick-cell:nth-child(4n){border-right:none;}
.emp-quick-cell:nth-last-child(-n+4){border-bottom:none;}
.emp-quick-cell .emp-info-label{
  font-size:11.5px;
  color:var(--emp-text-muted);
  display:block;
  margin-bottom:4px;
}
.emp-quick-cell .emp-info-value{
  font-size:13.5px;
  font-weight:700;
  color:var(--emp-text-dark);
  display:flex;
  align-items:center;
  gap:6px;
}
.emp-section-title{
  font-size:15px;
  font-weight:700;
  margin-bottom:16px;
}

@media (max-width:768px){
  .emp-info-grid{grid-template-columns:1fr 1fr;}
  .emp-two-col{grid-template-columns:1fr;}
  .emp-subgrid{grid-template-columns:1fr 1fr;}
  .emp-quick-grid{grid-template-columns:repeat(2,1fr);}
  .emp-quick-cell:nth-child(4n){border-right:1px solid var(--emp-border);}
  .emp-quick-cell:nth-child(2n){border-right:none;}
  .emp-help-illustration{display:none;}
  .emp-profile-header{padding:20px;}
}
@media (max-width:480px){
  .emp-info-grid{grid-template-columns:1fr;}
  .emp-quick-grid{grid-template-columns:1fr;}
  .emp-quick-cell{border-right:none !important;}
}
:root{
  --emp-primary:#6C5CE7;
  --emp-primary-dark:#5844e0;
  --emp-blue:#3E5FF5;
  --emp-purple-grad-1:#7B6CF6;
  --emp-purple-grad-2:#5B4FE0;
  --emp-text-dark:#1F2233;
  --emp-text-muted:#9CA0B3;
  --emp-text-label:#A6A9BC;
  --emp-bg:#F4F5FA;
  --emp-card-bg:#FFFFFF;
  --emp-border:#EDEEF5;
  --emp-green:#2ECC71;
  --emp-badge-bg:#EDEBFF;
  --emp-badge-text:#6C5CE7;
}

.top-add-line h4 {
    font-size: 14px;
    margin-bottom: 10px;
}
.emp-avatar-wrap img {
    width: 100%;
}
a.profile-btn {
    color: #FFF;
    border: 1px solid #fff;
    padding: 12px;
    border-radius: 10px;
}
span.emp-icon-badge.emp-badge-orange {
    background: #694eea;
}