/*!
Author       : Dreamguys
Template Name: Preadmin - Bootstrap Admin Template
Version      : 1.0
*/

/*------------------------------------------------------------------

[Table of contents]

01. Common
02. Table
03. Helper Class
04. Bootstrap Classes
05. Animation
06. Header
07. Sidebar
08. Content
09. Login
10. Dashboard
11. Activity
12. Select2 - not required
13. Nav bar and Nav tabs
14. Holidays - not required
15. Edit Profile - not required
16. Chat - not required
17. Focus Label
18. Leave - not required
19. Employee
20. Events
21. Profile
22. Notifications
23. Roles & Permissions
24. Chat Right Sidebar
25. Projects
26. Invoice
27. Task
28. Project View
29. Payslip
30. Attendance
31. Ticket
32. Client Profile
33. Inbox
34. Mail View
35. Pricing
36. Blog
37. Blog View
38. UI Kit
39. Error
40. Lock Screen - not required
41. Countdown - not required
42. Voice call - not required
43. Video Call - not required
44. Incoming call - not required
45. Widgets - not required
46. Contacts
47. Notification settings
48. Add Product
49. Product
50. Product Details
51. Chat Sidebar
52. Gallery
53. Responsive


newly added
-----------
54. fonts
55. modal
56. box
57. form
58. button
59. icons
60. life cycle circle
61. search section
62. datepicker
63. select / multi select dropdown
64. font colour for hyperlinks
65. page loader
66. tree
67. Decrease Font
68. Calendar
69. Common Help
70. Grid Search Icon
71. Wizard UI
72. Document Upload UI
73. Panes UI
74. Sweet alert UI
75. Chat Bot UI
76. checkbox [input type ='checkbox']
77. Data Amount change into the panes
-------------------------------------------------------------------*/

/*------------------------------------------------------------------
[1. Common]
*/
form { margin-bottom: 0; }
html {height:100%;}
body{ 
	font-family: 'Roboto', sans-serif;/* background-color:#e3edf9; */ background-color:#ffffff; color:#000000; overflow: hidden auto; height:auto; display: flex; 
	flex-direction: column; min-height: 100vh; font-size: 0.9rem;
}
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 {text-decoration:none; /* color: #009ce7; */ color: #0000ff; /* font-weight:bold; */ outline: none;}
a:focus { }
.fontbold {font-weight: 500;}
.form-control {
	border-radius: 0;box-shadow: none;padding: 0.2rem; color:black!important; /* font-size:20px */font-size:0.9rem; 
	/* height: calc(2.2rem); */ /* border: 2px solid #ced4da */;
}
.form-control:focus {border-color: #3A84F3;box-shadow: none;outline: 0 none;}
a {/* color: #2483b1; */ color:#0000ff; font-weight: 500;}
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;}
input[type=text], input[type=password] {-webkit-appearance: none;-moz-appearance: none;appearance: none;}
.display-block {display: block;}
.btn.rounded {box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);}
textarea.note-text{height:auto !important; min-height: 32.75rem !important; overflow-y: auto !important;}
/* .form-control:disabled, .form-control[readonly] {background-color: #f6f6f6!important;} */
.box-toolbar a.parfw-add.disabled{pointer-events: none;opacity: 0.65;}
.box-toolbar button.btn:disabled {background: unset !important;color: transparent !important;}
.box-toolbar button.btn {background: unset;color: #3A84F3;padding:0 0px 7px 0;}
span.btn-icon {color: slategray!important;cursor: not-allowed !important;}
div.icon-content a button.btn:disabled,div.icon-content button.btn:disabled {background: transparent !important;color: slategray !important;padding: 0 0 0 0;}
div.icon-content a button.btn:not(:disabled),div.icon-content button.btn:not(:disabled) {background: transparent !important;padding: 0 0 0 0;}
div.input-group-append button.btn-date:disabled {cursor: not-allowed !important;color: slategray !important;}
div.input-group-append button.btn{padding: .270rem 0.65rem;}
[disabled="disabled"],[disabled=""]{color: #505154 !important;pointer-events: none;}
.box-toolbar a.accordion-toggle.minimize-box , .box-toolbar a.helpstyle {pointer-events: unset;}
[readonly=""], [readonly="readonly"] {cursor: not-allowed;color:#888;}
select[readonly=""], select[readonly="readonly"] {pointer-events: none;}
.hide{display: none !important;}
.btn:focus {box-shadow: unset !important;}
.mt-6{margin-top: 3.5rem !important;}
.mt-7{margin-top: 4.5rem !important;}
.viewCls{margin: 0.2rem;}
.InActiveReg {color:orangered;}
.select2-container a {font-weight: normal;}

/* for scroll bar */
::-webkit-scrollbar { width: 0.5rem; height: 0.5rem; }
::-webkit-scrollbar-track { background: #f1f1f1; }
::-webkit-scrollbar-thumb { background-color: #c3bebe; border-radius: 10px; border: 2px solid #f1f1f1; }
/* ::-webkit-scrollbar:hover { width: 0.75rem; height: 0.75rem; } */


/*------------------------------------------------------------------
[2. Table]
*/
.table {color:#000;}
.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: #00bf6f;}
table.table td h2 span {color: #9e9e9e;display: block;font-size: 12px;margin-top: 3px;}
.read_status{font-weight:501;}
.Key_value_status{font-weight:501;background-color: red !important;
color: #fff !important;}
.table_action_button{text-align: center!important;}
 /* footer button color change */
.submitandaddfoorcolor{background-color:#E46C0A!important;color:#fff;}
 /* display table and add icon */
.displaytable_add{
	border-radius: 50%;border: 1px solid;background-color: #3A84F3!important;color: white!important;padding: 0px 2px 0px 2px!important;
	height: 22px; width: 22px;
}
i.fa-trash-alt {text-decoration:none; color: gray;outline: none;}
i.fa-trash-alt:hover, i.fa-trash-alt:active, i.fa-trash-alt:focus {text-decoration:none; color: red;outline: none;}
/*------------------------------------------------------------------
[3. Helper Class]
*/
.p-0 {padding: 0 !important;}
.p-t-0 {padding-top: 0 !important;}
.m-r-5 {margin-right: 5px !important;}
.m-r-10 {margin-right: 10px !important;}
.m-r-15 {margin-right: 15px !important;}
.m-l-5 {margin-left: 5px !important;}
.m-l-15 {margin-left: 15px !important;}
.m-t-5 {margin-top: 5px !important;}
.m-t-0 {margin-top: 0 !important;}
.m-t-10 {margin-top: 10px !important;}
.m-t-15 {margin-top: 15px !important;}
.m-t-20 {margin-top: 20px !important;}
.m-t-30 {margin-top: 30px !important;}
.m-t-50 {margin-top: 50px !important;}
.m-b-0 {margin-bottom: 0 !important;}
.m-b-5 {margin-bottom: 5px !important;}
.m-b-10 {margin-bottom: 10px !important;}
.m-b-15 {margin-bottom: 15px !important;}
.m-b-20 {margin-bottom: 20px !important;}
.m-b-30 {margin-bottom: 30px !important;}
.w-md {min-width: 110px;}
.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: 1px solid #e7e7e7;border-radius: 4px;margin-bottom: 30px;padding:20px;position: relative;}
.card-title {color: #333;font-size:0.9rem;margin-bottom: 20px;}
.page-title {color: black;/* font-size:20px; */ font-size:0.9rem;font-weight: 501; margin-top: -10px; margin-bottom: 7px;}
.page-sub-title {color: #565656;/* font-size: 20px; */ font-size:0.9rem; font-weight: normal;margin-bottom: 20px;}
.cal-icon::after {
	background: transparent url("../img/calander.png") no-repeat scroll 0 0;bottom: 0;content: "";display: block;height: 19px;
	margin: auto;position: absolute;right: 15px;top: 0;width: 17px;
}
.cal-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-left {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);}
.text-moz-right{text-align: -moz-right;}

/*------------------------------------------------------------------
[4. Bootstrap Classes]
*/
/* .navmenu:hover{
	background-color: #3A84F3 !important;
	
/* } */
/* .navmenucolor:hover{
	color:white;
}  */
.btn{font-size:0.9rem !important; padding: .25rem 1.75rem; /* margin-right: 1rem !important; */ }
.btn-white {background-color: #fff;border: 1px solid #ccc;color: #333;}
.rounded, .circle {border-radius: 500px;}
/* .bg-primary, .badge-primary {background-color:#3A84F3 !important !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:pink;}
.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 {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-primary:hover, .btn-primary:focus, .btn-primary.active, .btn-primary:active, .open > .dropdown-toggle.btn-primary {background-color: #2d5dbf;border: 1px solid #2d5dbf;}
.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: #366dde;border: 1px solid #00b368;}
.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: #00bf6f;border-color: #00bf6f;}
.pagination > li > a, .pagination > li > span {color: #00bf6f;}
.page-item.active .page-link {background-color: #00bf6f;border-color: #00bf6f;}

.dropdown-menu {/* font-size: 20px; */ font-size:0.75rem;}
/* .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;}

.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: 30px;border:1px solid #e7e7e7;box-shadow: 0 6px 15px rgba(36, 37, 38, 0.08);}
.card-title {margin-bottom: 1.125rem;}
.dropdown-action .dropdown-toggle::after {display: none;}
.badge.badge-pill {border-radius: 10rem;}
.badge-primary {color: #fff;}
.btn.btn-rounded {border-radius:50px;}
.table .badge {font-weight:700;}
.table.dataTable {border-collapse: collapse !important;}
.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;}

/*------------------------------------------------------------------
[5. Animation]
*/

@-moz-keyframes pulse {
  0% {
    -moz-transform: scale(0);
    opacity: 0.0;
  }
  25% {
    -moz-transform: scale(0);
    opacity: 0.1;
  }
  50% {
    -moz-transform: scale(0.1);
    opacity: 0.3;
  }
  75% {
    -moz-transform: scale(0.5);
    opacity: 0.5;
  }
  100% {
    -moz-transform: scale(1);
    opacity: 0.0;
  }
}
@-webkit-keyframes pulse {
  0% {
    -webkit-transform: scale(0);
    opacity: 0.0;
  }
  25% {
    -webkit-transform: scale(0);
    opacity: 0.1;
  }
  50% {
    -webkit-transform: scale(0.1);
    opacity: 0.3;
  }
  75% {
    -webkit-transform: scale(0.5);
    opacity: 0.5;
  }
  100% {
    -webkit-transform: scale(1);
    opacity: 0.0;
  }
}
@-webkit-keyframes taskHighlighter {
    0% {
        background: #FEEB99;
    }
    100% {
        background: #fff;
    }
}
@keyframes taskHighlighter {
    0% {
        background: #FEEB99;
    }
    100% {
        background: #fff;
    }
}

/*------------------------------------------------------------------
[6. Header]
*/ 

 header.header-text{font-weight:700;}
 .row header.header-text {padding-left: 1.25rem !important; margin-top: 0.1rem !important;font-weight:700;}

.header {/* background-color: #5077a9; */ background-color: #ffffff; left: 0;position: fixed;right: 0;top: 0;z-index: 999; height: 3.625rem; }
.header .header-left {
	float: left; height:50px; width:40%; position: relative;text-align: center;z-index: 1; display: -webkit-inline-box;
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}

.logo {display: block;line-height: 50px;}
.header .navbar-nav .badge {position: absolute;right: 7px;top: 4px;}
/* 
.header .user-menu-header .selectview-menu {position: relative; transform: translate3d(0px, 48px, 0px) !important; }
.header .userMenu .dropdown-menu {position: relative; transform: translate3d(156px, 48px, 0px) !important; }
.header .quickAddDropdown .dropdown-menu {position: relative; transform: translate3d(-96px, 50px, 0px) !important; }

 */
.header .dropdown-menu > li > a {position: relative;}
.header .dropdown-toggle::after {display: none;}
.header .has-arrow .dropdown-toggle::after {display: inline-block;}

.page-title-box {border-radius: 0;height: 60px;margin-bottom: 0;padding: 17px 20px;}
.page-title-box h3 {color: #333;/* font-size: 20px; */ font-size:0.9rem; font-weight: normal;margin: 0;}

.user-menu {margin: 0;position:relative;z-index:99;	height: 49px;}
.user-menu.nav > li > a{ background-color: #ffffff; font-size:0.9rem; padding: 0px 0px; height: 28px; text-align: center; }
.user-menu-header .nav-link{padding:0.10rem 0.65rem 0.10rem 0.65rem !important;}

.usermenulabel { display: block; font-size: 0.7rem; /* line-height: 0.75rem; */ text-align: center; cursor: pointer; }
.usermenulabel a { color: #000000; }
/* .usermenulabel a:hover {background-color:#3A84F3 !important; color:white; }; */

.user-menu li.nav-item {padding-right: 0.35rem; }
/* .user-menu.nav > li > a:hover, .user-menu.nav > li > a:focus {background-color:#3A84F3 !important;color:white;}
.user-menu.nav > li > span:hover, .user-menu.nav > li > span:focus {background-color:#3A84F3 !important;color:white;} */
/* .user-menu li.nav-item.active { border-bottom: 2px solid #0000ff !important;} */
.user-img {display: inline-block;position: relative;}
.user-img .rounded-circle{border-radius: 25% !important;}
.user-img .status {border: 2px solid #fff;bottom: 0;height: 10px;position: absolute;right: 0;width: 10px;}
.user-menu .user-img .status {bottom: 10px;}
.user-menu .dropdown-menu {min-width: 136px;}
.user-menu .bg-primary {background-color:#00bf6f !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;}

.nav.user-menu.user-menu-header{display:flex!important;align-items:center!important;gap:10px!important;margin-right:20px;}
.nav.user-menu.user-menu-header .nav-item::after,.nav.user-menu.user-menu-header .nav-link::after,.nav-item.active::after,.navmenu.active::after{display:none!important;}
.nav.user-menu.user-menu-header .nav-item{border-bottom:none!important;box-shadow:none!important;}
.header-item{display:flex!important;align-items:center!important;justify-content:center!important;width:40px!important;height:40px!important;padding:0!important;margin:0 5px!important;position:relative;}
.header-icon-btn{display:flex!important;align-items:center;justify-content:center;width:40px!important;height:40px!important;padding:0!important;margin:0!important;border-radius:10px;transition:all .23s ease;}
.header-icon-img{width:18px;height:18px;object-fit:contain;transition:transform .18s cubic-bezier(.2,.9,.2,1);}
.profile-avatar-modern{width:34px;height:34px;border-radius:10px;background:linear-gradient(135deg,#6b8cff,#8d4bff);display:flex;align-items:center;justify-content:center;margin:0!important;transform:translateY(0);font-weight:600;transition:all .23s ease;}
.profile-avatar-modern:hover{background:linear-gradient(90deg,rgba(70,130,255,0.2) 0%,rgba(123,92,255,0.1) 50%,rgba(106,209,255,0.1) 100%);border-radius:10px;box-shadow:0 6px 14px rgba(31,57,125,0.05),inset 0 0 0 1px rgba(47,86,255,0.04);transform:translateY(-3px) scale(1.08);}
.profile-avatar-modern:hover span,.profile-avatar-modern:hover i,.profile-avatar-modern:hover svg{color:#000!important;filter:none!important;}
.header-arrow-btn{width:24px!important;height:40px!important;margin:0!important;padding:0!important;display:flex;align-items:center;justify-content:center;background:transparent!important;border:none!important;font-family:inherit!important;color:#0f1113!important;}
.header-arrow-btn:hover{background:linear-gradient(90deg,rgba(70,130,255,0.08) 0%,rgba(123,92,255,0.04) 50%,rgba(106,209,255,0.04) 100%);transform:translateY(-3px) scale(1.07);box-shadow:0 6px 14px rgba(31,57,125,0.05),inset 0 0 0 1px rgba(47,86,255,0.04);}
.nav.user-menu.float-right .nav-link{font-size:0!important;border-bottom:none!important;}
.userMenu .nav-link.user-link{display:flex!important;align-items:center!important;justify-content:center!important;padding:0!important;height:40px!important;line-height:normal!important;}
.userMenu .user-img{display:flex!important;align-items:center!important;justify-content:center!important;height:40px!important;}
.profile-avatar-modern{position:relative;top:0!important;margin:0!important;transform:translateY(0)!important;}
.userMenu .user-link span{font-size:16px!important;color:#000!important;}
.header-icon-btn{display:inline-flex!important;align-items:center;justify-content:center;width:40px;height:40px;padding:0;border-radius:10px;transition:transform .20s cubic-bezier(.2,.9,.2,1),box-shadow .18s ease,background .18s ease;background:transparent;margin-top:6px;margin-bottom:6px;}
.home-collapse-btn{width:32px;height:40px;padding:0;margin-left:6px;background:transparent;border:none;display:flex;align-items:center;justify-content:center;border-radius:8px;cursor:pointer;transition:transform .18s ease,box-shadow .18s ease,background .18s ease;margin-top:6px;margin-bottom:6px;}
.header-icon-btn:hover,.home-collapse-btn:hover{background:linear-gradient(90deg,rgba(70,130,255,0.2) 0%,rgba(123,92,255,0.1) 50%,rgba(106,209,255,0.1) 100%);box-shadow:0 6px 14px rgba(31,57,125,0.05),inset 0 0 0 1px rgba(47,86,255,0.04);}
.header-item{display:inline-flex;align-items:center;gap:6px;position:relative;}
.header-item{position:relative!important;z-index:2000;}
.header-item .dropdown-menu,.nav-item.navmenu.dropdown>.dropdown-menu{z-index:3000!important;}
@media(max-width:880px){.header-item .dropdown-menu,.nav-item.navmenu.dropdown>.dropdown-menu{top:calc(100% + 6px)!important;min-width:160px!important;}}
.userMenu:hover .profile-avatar-modern{color:#000!important;}
.nav-item.navmenu.active .header-icon-btn,.nav-item.navmenu.active>a.header-icon-btn,.nav-item.navmenu.active .user-link .profile-avatar-modern{background:rgba(21,101,192,0.15)!important;box-shadow:inset 0 0 0 1px rgba(21,101,192,0.25)!important;border-radius:10px!important;}
.nav-item.navmenu.active .header-icon-img{filter:brightness(0) saturate(100%) invert(26%) sepia(85%) saturate(2300%) hue-rate(199deg) brightness(95%) contrast(96%)!important;}
.header-item .dropdown-menu{z-index:3000!important;transform-origin:top right!important;}
.dropdown-menu.dropdown-plain{opacity:0;transform:scale(.92) translateY(-4px);transition:opacity .12s ease-out,transform .12s ease-out;min-width:220px!important;background:#fff!important;border:1px solid rgba(0,0,0,.1)!important;border-radius:12px!important;box-shadow:0 8px 24px rgba(0,0,0,.08)!important;padding:0!important;overflow:hidden!important;font-family:'Roboto',sans-serif!important;}
.show>.dropdown-menu.dropdown-plain,.dropdown-menu.dropdown-plain.show{opacity:1;transform:scale(1) translateY(0);}
.dropdown-menu.dropdown-plain .dropdown-item{padding:8px 16px!important;margin:0!important;border-radius:8px!important;font-size:15px!important;font-weight:500!important;color:#222!important;background:transparent!important;transition:background .15s ease,color .15s ease,padding-left .18s ease;}
.dropdown-menu.dropdown-plain .dropdown-item:hover,.dropdown-menu.dropdown-plain .dropdown-item:focus{background:rgba(0,0,0,.08)!important;color:#000!important;padding-left:22px!important;}
.dropdown-menu.dropdown-plain .dropdown-item.active{background:rgba(0,0,0,.1)!important;color:#000!important;}
.dropdown-menu.dropdown-plain .dropdown-item img,.dropdown-menu.dropdown-plain .dropdown-item i,.dropdown-menu.dropdown-plain .dropdown-item svg{display:none!important;}
.nav-item.navmenu.dropdown{position:relative!important;}
.nav-item.navmenu.dropdown .dropdown-menu{top:calc(100% + 8px)!important;right:0!important;left:auto!important;}
.dropdown-menu.dropdown-plain .dropdown-item.active{background:transparent!important;color:#222!important;}


/*------------------------------------------------------------------
[7. Sidebar]
*/
.sideMenu{
	top:60px; width:55px; z-index:1999; /* background-color:rgb(232, 232, 232); */ /* background-color: #e3edf9; */ background-color: #ffffff; 
	bottom:0; margin-top:0; position:fixed; left:0vh; margin-right: -110vh; -webkit-transition:all .4s ease; -moz-transition:all .4s ease; 
	transition:all .4s ease;
}
 
/*for sidebar scroll*/
.slimScrollBar{background-color: slategray !important; width: 0.8rem !important;}
.sidebar-overlay {
	display: none;position: fixed; height: 100%; left: 0; top:0; width: 100%;z-index: 1000;background-color: rgba(0, 0, 0, 0.2);
	overflow: hidden;
}
.sidebar-overlay.opened {display: block;}
.sidebarlabel { display: block; font-size: 0.8rem; line-height: 18px; border-bottom: gray solid thin;}
.sidebar{
	top:50px; width:6.5rem; z-index:1999; /* background-color:rgb(232, 232, 232); */ background-color: #ffffff; bottom:0; margin-top:0; 
	position:fixed; margin-left: 0vh; -webkit-transition:all .4s ease; -moz-transition:all .4s ease; transition:all .4s ease;
}
.admin-sidebar { width: 15% !important;}
.slide-nav .sidebar {width: 200px;}
.sidebar-help {
	top:50px; width:170px; z-index:99;background-color:rgb(232, 232, 232); bottom:0; margin-top:0; position:fixed; left:0vh; margin-left: 0;
	-webkit-transition:all .4s ease; -moz-transition:all .4s ease; transition:all .4s ease;
}

.sidebar-menu ul,.sidebar-menu>ul>li{ position:relative; }
.sidebar-inner{ height:100%; }
.sidebar-menu ul{ font-size:0.8rem; list-style-type:none; margin:0; padding:0;/*  overflow: hidden; */ height: 91vh; border-right: 1px solid rgba(208 210 210); }
.sidebar-menu li a{color:#000;display:block; font-size:0.8rem; height:auto; line-height:40px; text-align: center;}
.sidebar-menu li a:hover{/* color:#fff */}
.sidebar-menu li a>.badge{margin-top:10px;color:#fff;font-weight:700}
.sidebar-menu li a i.back-icon{margin-left:0}
.sidebar-menu li.active a{font-weight: bold; /* background-color:#5077a9;*/ background: #e0f0ff; color:#000;}
.menu-title{color:#000;font-size:13px;font-weight:500;line-height:40px;min-height:40px;padding:0 20px;text-transform:uppercase}
.menu-title>i{float:right;line-height:40px}
.sidebar-menu li.menu-title a{
	color:#ff9b44;display:inline-block;float:right;padding:0;
}
.sidebar-menu li.menu-title a.add-user-icon{
	background-color:#eee;border-radius:24px;color:#bbb;line-height:24px;min-height:24px;width:24px;text-align:center;margin-top:6px;
}
.sidebar-menu li.menu-title a.add-user-icon:hover{background-color:#00bf6f;color:#fff}
.sidebar-menu li.menu-title a.add-user-icon i{font-size:14px;margin-left:0;margin-right: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 li.menu-title a.btn:hover{color:#fff}
.sidebar-menu ul ul a.active{color:#00bf6f;text-decoration:underline}
.mobile-user-menu{
	color:#fff;display:none;font-size:24px;height:50px;line-height:50px;padding:0 20px;right:0;text-align:right;top:0;width:60px;z-index:10;
}
.mobile-user-menu>a{color:#333;padding:0}
.mobile-user-menu>a:hover{color:#333}
.mobile-user-menu>.dropdown-menu>a{line-height:23px}
.profile-rightbar{display:none!important;color:#00bf6f;font-size:26px;margin-left:15px}
/* .mobile_btn{display:none} */
#sidebar-menu ul ul a{display:block}
#sidebar-menu ul ul{background-color:#f4f4f4; height: auto;}
.sidebar-menu .menu-arrow{
	-webkit-transition:-webkit-transform .15s; -o-transition:-o-transform .15s; transition:transform .15s;position:absolute;
	display:inline-block; font-family:FontAwesome; text-rendering:auto; font-size:0.9rem; -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);
}
.sidebar-menu .menu-arrow:before{content:"\f105"}
.noti-dot:after,.noti-dot:before{content:'';position:absolute}
.sidebar-menu li a.subdrop .menu-arrow{
	-ms-transform:rotate(90deg);-webkit-transform:rotate(90deg);-o-transform:rotate(90deg);transform:rotate(90deg);
}
.noti-dot:before{
	width:5px;height:5px;border:5px solid #00bf6f;-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px;
	background-color:#00bf6f;z-index:10;right:37px;top:17px;
}
.noti-dot:after{
	border:4px solid #00bf6f;background:0 0;-webkit-border-radius:60px;-moz-border-radius:60px;border-radius:60px;height:24px;width:24px;
	-webkit-animation:pulse 3s ease-out;-moz-animation:pulse 3s ease-out;animation:pulse 3s ease-out;-webkit-animation-iteration-count:infinite;
	-moz-animation-iteration-count:infinite;animation-iteration-count:infinite;top:10px;right:30px;z-index:1;opacity:0;
}
.submenu:hover, .menu:hover{background: #646464; color: #fff;}
.submenu i, .menu i{font-size : 28px; margin: 12px 190px 4px 0px;}
.submenu-list i{padding: 0.25rem; font-size:0.9rem;}
.submenu-list a{font-weight: 501;background-color: rgb(252,229,214);}
.menu_color:hover{background-color: #646464;}


/*------------------------------------------------------------------
[8. Content]
*/
.main-wrapper { min-height:95vh; /* background-color:#e3edf9; */ /* background-color:#f5f5f5; */ background-color:#ffffff; }
.container-fluid { padding-left: 4px !important; padding-right: 0px !important;}
.page-wrapper {
	/* background-color:#e3edf9; */ /* background-color:#f5f5f5;*/ background-color:#f6f6f6; 
	/* left:4.5%; width:94.5%; top:3rem; */ /* position: relative */; 
	margin: 4rem 0rem 0rem 7.5rem; padding-right: 1rem;  -webkit-transition: all 0.4s ease;
	-moz-transition: all 0.4s ease; transition: all 0.4s ease;
}
.admin-page-wrapper { width: 85% !important; left: 15% !important;}
.page-wrapper-help {padding-left: 170px; /* padding-top: 0; */}

.page-footer {/* position: relative;  */width: 100%; bottom: 0;}


/*------------------------------------------------------------------
[9. Login]
*/
.container { display: flex; flex-direction: column; min-height: 100vh; }
.top-half {
  background-color: #315498; height: 50vh; padding: 5px; position: relative; display: flex; flex-direction: column; justify-content: flex-start;
}
.logo { width: 180px; margin-bottom: 20px; }
/* .platform-title { font-size: 2rem; color: #fff; font-weight: 500; position:relative; left: 3.8%; top: 30%; } */
.bottom-half { height: 65%; background-color: #ffffff; display: flex; align-items: center; justify-content: left; padding: 40px; }
.content-wrapper { display: flex; justify-content: space-between; align-items: center; width: 100%;  max-width: 1200px; }
.left-quote { flex: 1; padding-right: 40px; }
.quote-box { font-size: 16px; line-height: 1.8; font-weight: 400; /* border-left: 3px solid #102348; */  color: #1a1a1a; }
.quote-box-labels { font-size: 1rem; white-space: nowrap; text-align: left; }

.lines { margin-top: 20px; }
.line { display: inline-block; width: 25px; height: 3px; background-color: #ccc; margin-right: 5px; border-radius: 2px; }
.line.active { background-color: #102348; }
.right-login { flex: 1; display: flex; justify-content: center; /* margin-top: -300px; */ margin-right: 2vh; }
.login-box {
  background-color: #fff;  padding: 30px 30px 0px 30px; border-radius: 20px; box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1); width: 100%; 
}
.login-box .welcome-text { font-size: 20px; color: #666; margin: 18px 0px 18px 0px; display: flex; justify-content: center; }
.login-box .highlight { color: #102348; font-weight: 700; }
.login-box h2 { font-size: 25px; font-weight: 700; margin-bottom: 20px; color: #000; }
.login-box label { display: flex; width: 85px; align-items: center; margin-bottom: 1.5rem; font-size: 1rem; }
.login-box form label { display: block; margin-bottom: 6px; font-size: 14px; color: #333; }
.login-box input {
  width: 100%; padding: 12px; margin-bottom: 20px; border: 1px solid #ddd; border-radius: 8px; font-size: 14px; outline: none; transition: 0.3s ease;
}
.login-box input:focus { border-color: #102348; box-shadow: 0 0 0 3px rgba(16, 35, 72, 0.1); }
.forgot { text-align: right; margin-top: -16px; margin-bottom: 20px; font-style: italic; }
.forgot a { font-size: 13px; color: #102348; text-decoration: none; }
.password-eye { position: absolute; top: 35%; right: 10px; transform: translateY(-50%); cursor: pointer; color: gray; }
.login-box button {
  width: 100%; padding: 8px; margin-bottom: 2rem; background-color: #102348; color: #fff; border: none; border-radius: 10px; font-size: 16px; 
  font-weight: 600; cursor: pointer; transition: background 0.3s ease;
}
.login-box button:hover { background-color: #0a1835; }
.signup { text-align: right; margin-top: 20px; font-size: 14px; }
.signup a { color: #102348; text-decoration: none; font-weight: 600; }

/* 
#form-container { display: none; opacity: 0; transition: opacity 1.5s ease-in-out; Smooth fade-in effect }

.link-text {color:#3A84F3 !important}
.login_btn {width: 100%;background: #3A84F3 !important;color: white !important}
.input-group-texts{
	display: flex;align-items: center;padding: .375rem .75rem;font-size:0.9rem;background: #E9ECED !important;color: white !important;
	border: 0 !important;border-radius: 0.25rem 0 0 0.25rem !important;
}
.login-Lbl {font-family: "oxygen", "Roboto Condensed", sans-serif, Arial;color: #676a6c;}
.login-body-form {padding: 1rem 1.25rem;}
.login-carousel-image{height: 370px;}
.profile-image-login {height: auto !important;width: auto !important;}
img.responsive-img,video.responsive-video { max-width: 100%; height: auto;}
.carousel-captions { 
	position: absolute; right: 15%; bottom: 20px; left: 15%; z-index: 10; padding-top: 20px; padding-bottom: 86px; color: #fff;
	text-align: center;
}

.login-bgrnd { position: relative; height: 100vh; }
.login-bgrnd:BEFORE {
	background-image: url("/n-assets/images/vxo_bg.jpg");background-size: cover;  background-position: center top; content: "";
  	height: 100%; right: 0px; position: fixed;top: 0; width: 100%; z-index: -1;
}
.login-bgrnd::before { content: ""; position: fixed; top: 0; right: 0; bottom: 0; left: 0;
    background-image: url('/n-assets/images/vxo_bg.jpg'); background-size: cover; background-position: center top; z-index: 0;
}
.login-bgrnd::after {
	background-color: rgba(38, 50, 56, 0.08); background-size: 75em 47em; content: ""; height: 100%; left: 0; position: fixed; top: 0; 
	width: 100%;z-index: -1;
}

.login-logo {margin-top: 0rem;}
.loginbox{position: relative; background-color: #ffffff;color: #000; border-radius: 2px; height: 87vh; margin-top: 2vh;}
 */
 
/*------------------------------------------------------------------
[10. Dashboard]
*/

.card-table.card-table-top .card-body {height: 175px;overflow-y: auto; -webkit-overflow-scrolling: touch;}
.card-title > a.btn {color:#fff;}
.custom-table tr {background-color: #fff;}
.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 8px;vertical-align: middle;}
.dash-widget-icon {border-radius: 100%;color: #777;display: inline-block;float:left;font-size: 30px;height: 66px;line-height: 66px;margin-right: 10px;text-align: center;width: 66px;}
.dash-widget-info {text-align: right;}
.dash-widget-info > h3 {font-size: 28px;font-weight: 600;}
.dash-widget-info > span {font-size:0.9rem;}
.activity-panel .activity-box {height: 350px;overflow-x: auto;position: relative;-webkit-overflow-scrolling: touch;}
.activity-panel .activity-list > li {padding:0;border:0;}
.activity-panel .activity-list > li:last-child {margin-bottom:0;}
.activity-panel .activity-list::before {left: 8px;}
.chat-panel .card-body {overflow-y: auto;height: 340px; -webkit-overflow-scrolling: touch;}
.chat-panel .chats {padding: 30px 0;}
.chat-panel .chat-date {background-color: #fff;}
.chat-panel .message-area .input-group .form-control:focus {height: 44px;transition: inherit;}
.task-panel .card-body {height: 286px;overflow-x: auto;}
.task-panel .task-wrapper {padding:0;}
.member-panel .contact-list {border:1px solid #eaeaea;margin-bottom:15px;}
.member-panel .contact-list > li:last-child {border-bottom:0;}
.member-panel .card-body {overflow-y: auto;height: 260px; -webkit-overflow-scrolling: touch;}

/*------------------------------------------------------------------
[11. Activity]
*/

.activity-box {position: relative;}
.activity-list {list-style: none;margin: 0 0 0 10px;padding: 0;position: relative;}
.activity .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 {background-color: #fff;margin: 0 0 0 40px;padding: 0;position: relative;}
.activity-list::before {background: #ddd;bottom: 0;content: "";left: 23px;position: absolute;top: 8px;width: 2px;}
.activity .activity-list li::before {background: #ddd;bottom: 0;content: "";left: 22px;position: absolute;top: 12px;width: 2px;}
.activity-list li::before {background: #ddd;bottom: 0;content: "";left: 8px;position: absolute;top: 8px;width: 2px;}
.activity-list > li {background-color: #fff;margin-bottom: 10px;padding: 10px;position: relative;border: 1px solid #e7e7e7;}
.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 .activity-content .timeline-content {color: #9e9e9e;}
.activity-list > li .activity-content .timeline-content a.name {color: #000;}
.activity-list > li .time {color: #bdbdbd;display: block;font-size: 12px;line-height: 1.35;}

/*------------------------------------------------------------------
[12. Select2]
*/
/* 
.select2-container .select2-selection--single {border: 1px solid #ccc;height: 40px;border-radius: 0;}
.select2-container--default .select2-selection--single .select2-selection__arrow {height: 38px;right: 7px;}
.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;}
.select2-container--default.select2-container--open .select2-selection--single .select2-selection__arrow b {border-color: transparent transparent #ccc;border-width: 0 6px 6px;}
.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: #00bf6f;}
 */
/*------------------------------------------------------------------
[13.Nav bar and Nav tabs]
*/

ul.nav.nav-tabs.main-tabs{
	position: absolute; margin-left:0.25rem; width: 97.15%; z-index: 900; font-size:0.9rem; height: 2.5rem; background-color: #ffffff;
	border: 1px solid rgba(208 210 210);
}
.nav { background-color: #ffffff; margin-bottom: 0px; border-radius: 8px;}
.nav.has-common-help-popOver { border-radius: 8px 0 0 8px !important; }
.nav-right{ display: block ruby; }
.modal .nav { margin-bottom: 0px !important; cursor: pointer; }
.tab-widget .nav { 
	background-color: #ffffff; /* display: block; */ padding-top: 0.1rem; height: 2.5rem; border: 1px solid rgba(208 210 210); 
	width: 100% !important; cursor: pointer;
}
.navbar-nav > li { float: left;}
.nav-link{ padding:0.10rem 0.5rem 0.10rem 0.5rem !important; }

.nav-tabs {border-bottom: unset;}
.nav-tabs > li > a {margin-right: 0; /* color: #0f0f0f; */color: #000000; border-radius: 0;}
.nav-tabs > li > a:hover, .nav-tabs > li > a:focus {border-color: transparent;color: #fff;}
.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: #00bf6f;border-color: #00bf6f;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;}

/*-- For Main Menu --*/
.main-tabs > li.active > a.nav-link, .main-tabs > li.nav-item > a.active {
	background-color:#ffffff; border-bottom: 2px solid #0000ff !important; color: #0000ff !important;font-weight: 700;
}
.main-tabs > li:not(.active) .nav-link:hover { background-color: #5077a9 !important; color: #ffffff !important;}

.nav-tabs.nav-link:hover { background-color:#ffffff; border-bottom: 2px solid #0000ff !important; color: #0000ff !important; font-weight: 700; }

.tab-widget .nav-tabs > li.active, .tab-widget .nav-tabs > li.nav-item > a.active { background-color: #ffffff !important; height: 1.8px; }
.tab-widget .nav-tabs > li.active > a.nav-link, .tab-widget .nav-tabs > li.nav-item > a.active { 
	/* color: #5077a9 !important; */ color: #0000ff !important; font-weight: 700; 
}
.tab-widget .nav-tabs .nav-link:hover { background-color: #ffffff !important; }
.tab-widget .nav-tabs.nav-link:hover { color: #5077a9 !important;font-weight: 700; }

/* 	
.nav-tabs .nav-link:focus, .nav-tabs .nav-link:hover {background-color: #5077a9;border-color: transparent;}
.tab-widget .nav-tabs .nav-link:focus, .tab-widget .nav-tabs .nav-link:hover {
	border-bottom: 2px solid #3d2f4f !important;border-color: transparent; 
}
 */

.nav-tabs a.nav-link {/* border-radius:0; color:#2483b1; border: 0px solid transparent; */}
.tab-widget .nav-tabs a.nav-link {
	border-radius:0; /* color:#2483b1; */ /* color: #0f0f0f; */color: #000000; border: 0px solid transparent; display: ruby; }
.nav-text a.nav-link{ color: #3A84F3 !important; font-weight: 501; background-color: #fff;}
.nav-text a.nav-link:hover{ color: #ffffff !important; font-weight: 501;}
.nav-tabs .nav-brands {
	display: inline-block; padding-top: 0.25rem; padding-bottom: 0.25rem; margin-right: 1rem; /* font-size: 20px; */ font-size:0.9rem; 
	line-height: inherit; white-space: nowrap;
}
.nav-tabs .nav-select{margin-right: 0.25rem; height: 1.8rem;}
.nav-tabs .nav-item.lifeCycle{margin-top: 18px;}
.nav-tabs .nav-circle {margin: 0px -1px;}
.nav-tabs .status-circle {
	background-color: #ccc; border: 2px solid #DCDCDC; border-radius: 50%;display: inline-block;height: 1.85rem; width: 2rem;
}
.nav-tabs .status-bar {
	background-color: #ccc; border: 2px solid #DCDCDC; display: inline-block;height: 0.5rem; width: 1rem;margin:0rem 0rem 0rem -0.30rem;
}
.nav-tabs .icon {display:inline-block;}
/*.nav-tabs .icon:after {content: ''; display: block; width: 9px; height: 14px; border: solid white; border-width: 0 2px 2px 0; transform: rotate(45deg); margin-left: 7px; margin-top: 3px;}*/
.nav-tabs .nav-item{margin-bottom : 0px !important;/* font-size:22px; */font-size:1rem; padding-top: 0.25rem; }
.nav-tabs .nav-item.d-flex {margin-top: -0.125rem !important;}

.nav-item.right .nav-link{padding: 0.10rem !important;}
.nav-tabs li{float: left;}
.nav-tabs li.right{float: right;}
.nav-tabs li.right.active, .nav-tabs li.right > a.nav-link:hover {/* background-color: green !important; */}
.nav-tabs li.right.active > a.nav-link > i, .nav-tabs li.right > a.nav-link > i:hover{color: #ffffff !important;}
.nav-tabs > li.right.active > a.nav-link, .nav-tabs > li.right.active > .nav-link:hover, .nav-tabs > li.right.active > a {  
	border-bottom: 1px solid #9e9797!important; /* color: #fff !important; */font-weight: 700;
}
.nav-tabs li.right a{
	display:inline-flex; text-align: center!important; /* background-color: #EEECE1 !important; border: 1px solid #9e9797!important;  */
	box-shadow: none; color: #696666!important; margin-top: 2px!important; margin-right: 5px; /* border-radius: 50% !important; */
}

.nav-tabs .form-control{height: 1.8rem !important;}
.dropdown .greedy-menu li{width: 100%;}

/*------------------------------------------------------------------
[14. 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;}
 */
/*------------------------------------------------------------------
[15. 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;}
 */
/*------------------------------------------------------------------
[16. Chat]
*/
/* 
.chat-main-row {bottom: 0;left: 0;overflow: auto;padding-bottom: inherit;padding-top: inherit;position: absolute;right: 0;top: 0;}
.chat-main-wrapper {display: table;height: 100%;table-layout: fixed;width: 100%;}
.message-view {display: table-cell;height: 100%;float: none;padding: 0;position: static;vertical-align: top;width:75%;}
.chat-window {display: table;height: 100%;table-layout: fixed;width: 100%;background-color: #f5f5f5;}
.fixed-header {background-color: #fff;border-bottom: 1px solid #eaeaea;padding: 10px 15px;}
.fixed-header .navbar {border: 0 none;margin: 0;min-height: auto;padding:0;}
.fixed-header .user-info a {color: #76838f;text-transform: uppercase;}
.typing-text {color: #00bf6f;font-size: 12px;text-transform: lowercase;}
.last-seen {color: #a3afb7;display: block;font-size: 12px;}
.custom-menu.nav > li > a {color: #00bf6f;font-size: 26px;margin-left: 15px;padding: 0;}
.custom-menu.navbar-nav > li > a:hover, .custom-menu.navbar-nav > li > a:focus {background-color:transparent;} 
.custom-menu .dropdown-menu {left: auto;right: 0;}
.search-box .input-group {background-color: #e6e6e6;border: 1px solid #ddd;border-radius: 50px;}
.search-box .input-group .form-control {background: transparent;border: none;}
.search-box .btn {background-color: transparent;}
.chat-contents {display: table-row;height: 100%;}
.chat-content-wrap {height: 100%;position: relative;width: 100%;}
.chat-wrap-inner {bottom: 0;left: 0;overflow: auto;position: absolute;right: 0;top: 0;}
.chats{padding:30px 15px;}
.chat-body{display:block;margin:10px 0 0;overflow:hidden;}
.chat-body:first-child{margin-top:0}
.chat-right .chat-content{position:relative;display:block;float:right;padding:8px 15px;margin: 0;clear:both;background-color:#e6e6e6;border-radius:20px 2px 2px 20px;max-width: 60%;}
.chat-right .chat-body {padding-left: 48px;padding-right: 10px;}
.chat-bubble {display: block;width: 100%;float: left;margin-bottom:10px;}
.chat.chat-right .chat-bubble:last-child .chat-content {border-bottom-right-radius: 20px;}
.chat.chat-right .chat-bubble:first-child .chat-content {border-top-right-radius: 20px;}
.chat-content > p{margin-bottom:0;word-wrap: break-word;}
.chat-time{color:rgba(0, 0, 0, 0.5);display:block;font-size:12px;}
.chat-right .chat-time {text-align: right;}
.chat-line {border-bottom: 1px solid #eaeaea;height: 12px;margin: 7px 0 20px;position: relative;text-align: center;}
.chat-date {background-color: #f5f5f5;color: #000;font-size: 12px;padding: 0 11px;}
.chat-avatar{float:right;}
.chat-avatar .avatar {line-height:30px;height:30px;width:30px;}
.chat-left .chat-avatar{float:left}
.chat-left .chat-body{margin-right:0;margin-left:30px;padding-right: 20px;}
.chat-left .chat-content {background-color: #fff;border: 1px solid #eaeaea;color: #888;float: left;position:relative;padding:8px 15px;border-radius:2px 20px 20px 2px;max-width: 60%;}
.avatar {background-color: #aaa;border-radius: 50%;color: #fff;display: inline-block;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;}
.avatar:hover {color:#fff;}
.avatar > img {width: 100%;display:block;}
.chat.chat-left .chat-bubble:first-child .chat-content {border-top-left-radius: 20px;margin-top: 0;}
.chat.chat-left .chat-bubble:last-child .chat-content {border-bottom-left-radius: 20px;}
.chat-left .chat-time{color:#a3afb7}
.attach-list {color: #adb7be;padding: 5px 0 0;line-height: 24px;margin: 0;list-style: none;}
.attach-list i {margin-right: 3px;font-size:0.9rem;}
.attach-list a {word-wrap: break-word;}
.chat-footer {background-color: #fff;border-top: 1px solid #eaeaea;padding: 15px;}
.message-bar{display:table;height:44px;position:relative;width:100%;}
.message-bar .message-inner{display:table-row;height:100%;padding:0 8px;width:100%;}
.message-bar .link{color:#777;display:table-cell;font-size:20px;padding:0 10px;position:relative;vertical-align:middle;width:30px;}
.message-bar .message-area{display:table-cell;}
.message-area .input-group .form-control {background-color: #fff;border: 1px solid #eaeaea;box-shadow: none;color: #555;display: block;font-size: 14px;height: 44px;margin: 0;padding: 6px 12px;resize: none;}
.message-area .btn {height: 44px;width: 50px;}
.profile-right {display: table-cell;height: 100%;float: none;padding: 0;position: static;vertical-align: top;}
.display-table {display: table;table-layout: fixed;border-spacing: 0;width: 100%;height: 100%;}
.table-row {display: table-row;height: 100%;}
.table-body {position: relative;height: 100%;width: 100%; }
.table-content {bottom: 0;left: 0;overflow: auto;position: absolute;right: 0;top: 0;}
.profile-right-inner {border-left: 1px solid #eaeaea;background-color: #fff;}
.chat-profile-img {padding: 30px;position: relative;text-align: center;}
.edit-profile-img {height: 120px;margin: 0 auto;position: relative;width: 120px;cursor:pointer;}
.change-img {background-color: rgba(0, 0, 0, 0.3);border-radius: 50%;color: #fff;display: none;height: 100%;left: 0;line-height: 120px;position: absolute;top: 0;width: 100%;}
.edit-profile-img:hover .change-img {display: block;}
.edit-profile-img img {height: auto;margin: 0;width: 120px;border-radius: 50%;}
.user-name {color: #333;}
.edit-btn {border-radius: 40px;height: 36px;position: absolute;right: 15px;top: 15px;width: 36px;}
.chat-profile-info {padding:15px;}
.user-det-list {list-style: none;padding: 0;}
.user-det-list > li {padding: 6px 15px;}
.user-det-list .text-muted {color: #888;}
.transfer-files .tab-content {padding-top:0;}
.files-list {list-style: none;padding-left: 0;}
.files-list > li {border-bottom: 1px solid #eaeaea;border-radius: inherit;margin: 2px 0 0;padding: 10px;}
.files-cont {position: relative;}
.file-type {height: 48px;position: absolute;width: 48px;}
.files-icon {background-color: #f3f7f9;border: 1px solid #e4eaec;border-radius: 4px;display: inline-block;height: 38px;line-height: 38px;text-align: center;width: 38px;}
.files-icon i {color: #76838f;font-size: 20px;}
.files-info {padding: 0 30px 0 50px;}
.file-name a {color: #333;}
.files-action {display:none;height: 30px;list-style: none;padding-left: 0;position: absolute;right: 0;text-align: right;top: 10px;width: 30px;}
.files-list > li:hover .files-action {display:block;}
.file-date {color: #888;font-size: 12px;}
.file-author a {color: #00bf6f;font-size: 12px;text-decoration: underline;}
.files-action .dropdown-menu {left: auto;right: 0;}
.chat-img-attach {border-radius: 4px;margin-bottom: 12px;margin-left: 12px;position: relative;float: right;}
.chat-img-attach img {border-radius: 4px;display: inline-block;height: auto;max-width: 100%;}
.chat-placeholder {background: rgba(69, 81, 97, 0.6);border-radius: 4px;color: #fff;display: flex;flex-direction: column;height: 100%;justify-content: flex-end;left: 0;padding: 13px;position: absolute;top: 0;width: 100%;}
.chat-img-name {font-size: 12px;font-weight: 700;line-height: 16px;}
.chat-file-desc {font-size: 11px;}
.chat-right .chat-content.img-content {background-color:transparent;color: #76838f;padding: 0;text-align: right;}
.chat-right .img-content .chat-time {color: #a3afb7;}
.chat-left .chat-img-attach {float: left;}
.chat-left .chat-img-attach {float: left;margin-left: 0;margin-right: 12px;}
.chat-avatar-sm {width:24px;margin-right: 10px;display: inline-block;position: relative;float: left;}
.chat-avatar-sm img {width:24px;}
.chat-avatar-sm.user-img .status {bottom: 4px;right: -3px;}
.files-share-list {border: 1px solid #eaeaea;border-radius: 4px;margin-bottom: 20px;padding: 15px;}
.chat-user-list {list-style: none;margin: 0;padding: 0;}
.chat-user-list > li {border-bottom: 1px solid #eaeaea;border-radius: inherit;margin: 5px 0 0;padding: 10px;background-color: #fff;}
.designation {color: #9e9e9e;font-size: 12px;}
.online-date {color: #9e9e9e;font-size: 12px;}
.drop-zone{width:100%;height:205px;border:2px dashed #adb7be;text-align:center;padding:25px 0 0;margin-bottom: 20px;}
.drop-zone .drop-zone-caption{font-weight:600;}
.upload-list {padding: 0;list-style: none;margin: 0;}
.upload-list .file-list {background-color: #fff;border-top: 1px solid #d8e2e7;padding: 10px;}
.upload-list .file-list:first-child{border-top:none}
.upload-list .upload-wrap{position:relative;padding:0 20px 0 0;margin:0 0 5px}
.upload-list .file-name,.upload-list .file-size{display:inline-block;vertical-align:top;white-space:nowrap;}
.upload-list .file-name{padding-right:15px;overflow:hidden;max-width:100%;text-overflow:ellipsis}
.upload-list .file-size{color:#888;}
.upload-list .file-close{border:none;background:none;color:#dbe4ea;position:absolute;right:0;top:2px;}
.upload-list .file-close:hover{color:#f62d51}
.upload-list .upload-process{font-size:10px;color:#888;}
.upload-list .progress{margin-bottom:5px;background-color:#f6f8fa;height:5px;}
.upload-list .file-name i {color: #fda75c;margin: 0 5px 0 0;vertical-align: middle;}
.upload-drop-zone {height: 200px;border-width: 2px;margin-bottom: 20px;color: #ccc;border-style: dashed;border-color: #adb7be;line-height: 200px;text-align: center;background-color:#fff;}
.upload-drop-zone.drop {color: #222;border-color: #222;}
.upload-text {font-size: 24px;margin-left: 10px;}
 */
/*------------------------------------------------------------------
[17. Focus Label]
*/
.form-focus {display: flex;height: 50px;position: relative;}
.form-focus .focus-label {font-size:0.9rem;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;}

/*------------------------------------------------------------------
[18. 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;}
 */
/*------------------------------------------------------------------
[19. Employee]
*/
.action-icon {color: #777;font-size: 18px;padding: 0 10px;display:inline-block;}
.table .dropdown-menu {font-size:12px;}
.profile-widget {background-color: #fff;border: 1px solid #e7e7e7;border-radius: 4px;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;}

/*------------------------------------------------------------------
[20. Events]
*/
.calendar {float: left;margin-bottom: 0;}
.fc-view {margin-top: 30px;}
.none-border .modal-footer {border-top: none;}
.fc-toolbar h2 {font-size: 18px;font-weight: 600;font-family: 'Fira Sans', sans-serif;line-height: 30px;text-transform: uppercase;}
.fc-day-grid-event .fc-time {font-family: 'Fira Sans', 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:0.9rem;}
.fc-state-hover {background: #f3f3f3;}
.fc-state-highlight {background: #f0f0f0;}
.fc-state-down,
.fc-state-active,
.fc-state-disabled {background-color: #00bf6f;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 5px;text-align: center;}
.fc-basic-view td.fc-week-number span {padding-right: 8px;font-weight: 700;font-family: 'Fira Sans', sans-serif;}
.fc-basic-view td.fc-day-number {padding-right: 8px;font-weight: 700;font-family: 'Fira Sans', sans-serif;}

/*------------------------------------------------------------------
[21. Profile]
*/
.profile-details {text-align: center;}
.personal-info li .title {color: #515365;float: left;font-weight: 500;margin-right: 30px;width: 30%;}
.personal-info li .text {color: #888da8;display: block;overflow: hidden;}
.personal-info li {margin-bottom: 10px;}
.personal-info {list-style: none;margin-bottom: 0;padding: 0;}
.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;}
.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;}

/*------------------------------------------------------------------
[22. 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-weight: 700;position: absolute;right: 3px;top: 6px;}
.user-menu.nav > li > a > i {/* font-size: 20px; */ font-size:0.9rem; line-height: 60px;}
.noti-details {color: #989c9e;margin:0;}
.noti-time {margin:0;}
.noti-title {color: #333;}

/*------------------------------------------------------------------
[23. Roles & Permissions]
*/

.roles-menu {margin-top: 20px;}
.roles-menu > ul {background-color: #fff;padding:0;margin:0;list-style:none;}
.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: #00bf6f;color: #00bf6f;}
.roles-menu > ul > li a:hover {border-color: #00bf6f;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 {float: right;display:none;}
.roles-menu > ul > li a:hover .role-action {display:block;}

/*------------------------------------------------------------------
[24. 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: 60px;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; */font-size:0.9rem;}
.list-body {padding: 0 0 0 50px;}
.message-author {
	color: #333;float: left;font-weight: bold;width: 175px;display: block;max-width: 100%;overflow: hidden;text-overflow: ellipsis;
	white-space: nowrap;
}
.message-time {color: #888;float: right;font-size: 11px;}
.message-content {color: #333;font-size: 13px;display: block;max-width: 100%;overflow: hidden;text-overflow: ellipsis;white-space: nowrap;}

/*------------------------------------------------------------------
[25. Projects]
*/

.team-members {display: flex;list-style: none;margin-bottom: 0;padding: 0;}
.team-members li {float: left;}
.team-members li:first-child a {margin-left: 0;}
.team-members a {border: 2px solid #fff;border-radius: 100%;display: block;height: 38px;overflow: hidden;width: 38px;}
.team-members .all-users {line-height: 36px;opacity: 0.8;}
.all-users {background-color: #ff5e3a;color: #fff;font-size: 10px;font-weight: 800;line-height: 34px;text-align: center;}
.team-members img {width: 100%;}
.project-title {margin: 0 0 5px;}
.project-title > h5 {font-size:0.9rem;margin-bottom: 0;margin-top: 0;}
.project-title > a {color: #333;}
.project-box {position: relative;}
/*------------------------------------------------------------------
[26. Invoice]
*/

.invoice-details, .invoice-payment-details > li span {float: right;text-align: right;}
.table .team-members a {width: 32px;height: 32px;}
.table .team-members .all-users {line-height: 30px;}
.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;}

.amount-summary-wrapper { width:100%; display:flex; justify-content:flex-start; margin:8px 0; padding-left:12px; }
.amount-panes { display:flex; align-items:center; justify-content:flex-start; gap:10px; width:100%; flex-wrap:wrap; }
.amount-pane { background:#ffffff; border:1px solid #e1e1e1; border-radius:10px; padding:6px 12px; min-width:200px; max-width:220px; text-align:left; box-shadow:0 2px 6px rgba(0,0,0,0.08); transition:all 0.25s ease; }
.amount-pane:hover { transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,0,0,0.12); }
.amount-pane-label { font-size:12px; color:#666; display:block; margin-bottom:2px; white-space:nowrap; }
.amount-pane-value { font-size:17px; font-weight:600; color:#111; line-height:1.2; }

/*------------------------------------------------------------------
[27. Task]
*/

.task-chat-contents {background-color: #fff;}
.task-chat-contents .chat-left .chat-content {max-width: 100%;}
.task-chat-view {border-left: 1px solid #eaeaea;}
.task-left-sidebar {width:58.3333%;}
.task-right-sidebar {width:41.6667%;}
.task-chat-view .chat-left .chat-content {border:0;padding:0;}
.task-chat-view .chat-left .chat-body {margin-left: 50px;}
.task-chat-view .chat-date {background-color: #fff;}
.task-chat-view .chats {padding: 15px 15px 30px;}
.task-chat-view .avatar {width:30px;height:30px;line-height:30px;}
.followers-add {
	background-color: #fff;border: 1px solid #ccc;border-radius: 50%;color: #ccc;display: inline-block;/* font-size: 20px; */font-size:0.9rem;
	height: 30px;line-height: 30px;text-align: center;width: 30px;
}
.followers-add:hover {border: 1px solid #8c8c8c;color: #8c8c8c;}
.completed-task-msg {margin-bottom: 30px;margin-left: 50px;}
.task-chat-contents .chat.chat-left {margin-bottom: 20px;}
.file-attached {color: #333;font-size: 13px;}
.file-attached i {font-size:0.9rem;}
.task-attach-img > img {border: 1px solid #eaeaea;max-width: 100%;}
.attach-img-download {margin-bottom: 5px;}
.task-chat-view .chat-left .chat-time {color: #a3afb7;display: inline-block;font-size: 11px;}
.task-chat-user {color: #333;font-size: 13px;}
.task-chat-view .chat-content > p {font-size: 13px;margin-bottom: 0;}
.task-time {color: #a3afb7;display: inline-block;font-size: 11px;}
.task-success {color: #55ce63;font-size: 13px;}
.task-success a {color:#55ce63;}
.task-attach-img {margin-bottom: 20px;}
.task-assign {float: left;}
.assign-title {float: left;margin-right: 10px;margin-top: 5px;}
.task-assign > a {float: left;}
.followers-add > i {line-height: 28px;}
.task-followers {display: flex;margin-top: 15px;}
.followers-title {margin: 5px 10px 0 0;}
.task-line {border-color: #eaeaea;}
.task-information {color: #999;font-size: 11px;line-height: 17px;min-width: 1px;margin-left: 50px;}
.task-info-line {overflow-wrap: break-word;}
.task-user {color: #888;font-weight: 500;}
.task-information .task-time {display: inline-block;padding-left: 10px;}
.message-area .input-group .form-control:focus {height: 150px;transition: all 0.5s ease 0s;}
.task-btn-right {display: none !important;}
.task:hover .task-btn-right {display: table-cell !important;}
.task-action-btn.task-check {text-align: left !important;width: 40px;}
.add-task-btn {padding: 6px 10px;text-transform: uppercase;}
.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:0.9rem;vertical-align: -4px;}
.task-wrapper {padding: 20px;width: 100%;margin: 0 auto;box-sizing: border-box;}
.task-wrapper .mark-all-tasks {text-align: right;padding-bottom: 15px;}
.task-wrapper .mark-all-tasks .mark-all-tasks-container {overflow: hidden;position: relative;}
.task-wrapper .mark-all-tasks .mark-all-btn {cursor: pointer;display: inline-block;-webkit-transition: all 200ms ease;-moz-transition: all 200ms ease;-ms-transition: all 200ms ease;-o-transition: all 200ms ease;transition: all 200ms ease;}
.task-wrapper .mark-all-tasks .mark-all-btn#mark-all-finished {color: #35BA67;}
.task-wrapper .mark-all-tasks .mark-all-btn#mark-all-incomplete {color: #666;}
.task-wrapper .mark-all-tasks .mark-all-btn#mark-all-incomplete .action-circle {border: 1px solid #666;}
.task-wrapper .mark-all-tasks .mark-all-btn#mark-all-incomplete .action-circle .material-icons {color: #666;}
.task-wrapper .mark-all-tasks .mark-all-btn.move-up {-webkit-transform: translateY(-30px);-moz-transform: translateY(-30px);-ms-transform: translateY(-30px);-o-transform: translateY(-30px);transform: translateY(-30px);position: absolute;right: 0;}
.task-wrapper .mark-all-tasks .mark-all-btn.move-down {-webkit-transform: translateY(30px);-moz-transform: translateY(30px);-ms-transform: translateY(30px);-o-transform: translateY(30px);transform: translateY(30px);position: absolute;right: 0;}
.task-wrapper .task-list-header h3,
.task-wrapper .task-list-footer h3 {font-size: 24px;font-weight: 400;color: #666;}
.task-wrapper .task-list-body {max-height: 500px;overflow: auto;}
.task-wrapper #task-list {list-style: none;margin: 0;padding: 0;border-bottom: 1px solid #eaeaea;}
.task-wrapper #task-list li {margin: 0;padding: 0;}
.task-wrapper #task-list li .task-container {
	display: table;
	background: #fff;
	padding: 8px 15px;
	width: 100%;
	border: 1px solid #eaeaea;
	border-bottom: none;
	box-sizing: border-box;
	position: relative;
	-webkit-transition: background 200ms ease;
	-moz-transition: background 200ms ease;
	-ms-transition: background 200ms ease;
	-o-transition: background 200ms ease;
	transition: background 200ms ease;
}
.task-wrapper #task-list li .task-container .task-label {display: table-cell;font-weight: 400;vertical-align: middle;color: #333;word-break: break-all;}
.task-wrapper #task-list li .task-container .task-action-btn {display: table-cell;vertical-align: middle;text-align: right;}
.task-wrapper #task-list li .task-container .task-action-btn .action-circle:hover {border: 1px solid #8c8c8c;background: #fff;}
.task-wrapper #task-list li .task-container .task-action-btn .action-circle:hover .material-icons {color: #8c8c8c;}
.task-wrapper #task-list li .task-container:hover {background: #f3f3f3;}
.task-wrapper #task-list li.completed .task-container {background: #f3f3f3;}
.task-wrapper #task-list li.completed .task-container .complete-btn {background: #35BA67;border: 1px solid #2fa65c;}
.task-wrapper #task-list li.completed .task-container .complete-btn .material-icons {color: #fff;}
.task-wrapper #task-list li.completed .task-container .complete-btn:hover {background: #35BA67;border: 1px solid #2fa65c;}
.task-wrapper #task-list li.completed .task-container .complete-btn:hover .material-icons {color: #fff;}
.task-wrapper #task-list li.completed .task-container .task-label {color: #ccc;}
.task-wrapper #task-list li.new .task-container {-webkit-animation: taskHighlighter 2000ms linear 1; animation: taskHighlighter 2000ms linear 1;}
.task-wrapper .task-list-footer {position: relative;}
.task-wrapper .task-list-footer .add-task-btn-wrapper {text-align: center;}
.task-wrapper .task-list-footer .add-task-btn {
	cursor: pointer;
	border: 2px solid #9B1BCC;
	display: inline-block;
	height: 35px;
	width: 35px;
	border-radius: 10px;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.task-wrapper .task-list-footer .add-task-btn.hide {opacity: 1;visibility: visible;display: block;}
.task-wrapper .task-list-footer .add-task-btn:hover {background: #9B1BCC;}
.task-wrapper .task-list-footer .add-task-btn:hover .material-icons {color: #EBEEEF;}
.task-wrapper .task-list-footer .add-task-btn .material-icons {color: #9B1BCC;font-size: 34px;}
.task-wrapper .task-list-footer .new-task-wrapper {
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
	max-height: 0;
	overflow: hidden;
}
.task-wrapper .task-list-footer .new-task-wrapper::after {content: "";display: block;clear: both;}
.task-wrapper .task-list-footer .new-task-wrapper textarea {
	box-sizing: border-box;
	width: 100%;
	border: 1px solid #eaeaea;
	border-top: 0;
	height: 45px;
	resize: none;
	padding: 10px 15px;
	margin-bottom: 20px;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.task-wrapper .task-list-footer .new-task-wrapper textarea:focus {border: 1px solid #bfbfbf;outline: none;}
.task-wrapper .task-list-footer .new-task-wrapper textarea.error {border: 1px solid #D93737;outline: none;}
.task-wrapper .task-list-footer .new-task-wrapper .error-message {color: #D93737;font-style: italic;}
.task-wrapper .task-list-footer .new-task-wrapper .btn {padding: 10px 15px;float: right;cursor: pointer;}
.task-wrapper .task-list-footer .new-task-wrapper .add-new-task-btn {background: #fff;border: 1px solid #ccc;}
.task-wrapper .task-list-footer .new-task-wrapper.visible {max-height: 300px;overflow: auto;}
.notification-popup {
	z-index: 1051;
	position: fixed;
	top: 20px;
	right: 10px;
	width: 300px;
	display: inline-block;
	background: #1F8FEF;
	border: 1px solid #1082e4;
	color: #fff;
	padding: 20px;
	opacity: .8;
	border-radius: 2px;
	box-sizing: border-box;
	-webkit-transition: all 300ms ease;
	-moz-transition: all 300ms ease;
	-ms-transition: all 300ms ease;
	-o-transition: all 300ms ease;
	transition: all 300ms ease;
}
.notification-popup.success {background: #35BA67;border: 1px solid #2fa65c;}
.notification-popup p {margin-top: 0;margin-bottom: 0px;}
.notification-popup .task {overflow: hidden;white-space: nowrap;text-overflow: ellipsis;max-width: 100%;display: inline-block;}
.notification-popup .notification-text {font-size: 14px;display: inline-block;overflow: hidden;}
.notification-popup.hide {opacity: 0;visibility: hidden;}

html.menu-opened {overflow: hidden;}
html.menu-opened body {overflow: hidden;}
.task-chat-view.opened {margin-right:0;}
.chat-profile-view.opened {margin-right:0;}
.menu-opened .message-view.task-view {width:100%;}

/* Theme Options */

.themes {
	z-index: 999;
	position: fixed;
	top: 128px;
	width: 153px;
	border: 0;
	box-shadow: none;
	padding: 0;
	border-bottom-left-radius: 2px;
	right: -153px;
	background: #fff;
	-webkit-transition: transform 0.15s ease;
	-o-transition: transform 0.15s ease;
	transition: transform 0.15s ease;
}
.themes.active {transform: translateX(-153px);-ms-transform: translateX(-153px);-o-transform: translateX(-153px);-webkit-transform: translateX(-153px);}
.themes .themes-icon {
	display: inline-block;
	position: absolute;
	left: -47px;
	height: 48px;
	width: 48px;
	color: #616161;
	line-height: 48px;
	text-align: center;
	font-size: 14px;
	border-width: 1px 0 1px 1px;
	border-style: solid;
	border-color: #e0e0e0;
	background-color: #fff;
	border-top-left-radius: 2px;
	border-bottom-left-radius: 2px;
	top: 0;
	cursor: pointer;
}
.themes .themes-body {padding: 10px;background-color: #fff;border-top: 1px solid #e0e0e0;border-left: 1px solid #e0e0e0;border-bottom: 1px solid #e0e0e0;color: #616161;float: left;}
.themes .theme-colors {padding: 0;text-align: left;margin: 0;font-size: 0;padding-left: 0;list-style: none;margin-left: -5px;}
.themes .theme-colors > li {display: inline-block;padding-left: 5px;padding-right: 5px;}
.themes .theme-colors li {margin: 1px;padding: 0;float: left;}
.themes .theme-colors li span {display: block;height: 36px;width: 36px;border-radius: 2px;margin: 3px;}
.themes .theme-colors li span:hover {cursor: pointer;}
.themes .theme-colors .theme-light {background-color: #fff;border: 1px solid #ccc;}
.themes .theme-colors .theme-orange {background-color: #ffbc35;}
.themes .theme-colors .theme-purple {background-color: #5c66bf;}
.themes .theme-colors .theme-blue {background-color: #1d6ad2;}
.themes .theme-colors .theme-dark {background-color: #1a1a1a;}
.themes .theme-colors .theme-rtl {background-color: #00bf6f;color: #fff;display: block;font-size: 12px;font-weight: bold;line-height: 36px;text-align: center;}

/*------------------------------------------------------------------
[28. Project View]
*/

.project-user .list-box {margin: 0;}
.project-files i {color: #76838f;font-size: 50px;}
.project-user .list-item {border: 0 none;padding: 10px 0;}
.table-border {border: 1px solid #ddd;}
.file-size {color: #888;}
.project-task .task-wrapper {padding: 0;}
.project-task .tab-content {min-height: 200px;}
.uploaded-box {background-color: #fff;border: 1px solid #ddd;border-radius: 4px;display: block;margin-bottom: 20px;padding: 4px;}
.uploaded-box .uploaded-img-name {color: #333;padding: 9px;text-align:center;}

/*------------------------------------------------------------------
[29. Payslip]
*/

.payslip-title {margin-bottom: 20px;text-align: center;text-decoration: underline;text-transform: uppercase;}

/*------------------------------------------------------------------
[30. Attendance]
*/

.half-day {width: 15px;}

/*------------------------------------------------------------------
[31. Ticket]
*/

.ticket-header {padding: 6px 0;}
.ticket-priority {font-size: 14px;}
.ticket-chat-view {width:33.3333%;}
.dataTables_wrapper.container-fluid {padding-left: 0;padding-right: 0;}

/*------------------------------------------------------------------
[32. Client Profile]
*/

.tab-box {border-bottom: 0 none;padding: 0;}
.team-members a.followers-add {
	background-color: #fff;border: 1px solid #ccc;border-radius: 50%;color: #ccc;display: inline-block;/* font-size: 20px; */font-size:0.9rem;
	height: 30px;line-height: 30px;text-align: center;width: 30px;
}

/*------------------------------------------------------------------
[33. 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: #00bf6f;font-weight: bold;}
.unread .name, .unread .subject, .unread .mail-date {color: #000;font-weight: 600;}
.table-inbox .fa-star {color: #ffd200;}
.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;}
.table-inbox tr {cursor: pointer;}
table.table-inbox tbody tr.checked {background-color: #ffffcc;}
.mail-label {margin-right: 5px;}

/*------------------------------------------------------------------
[34. 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-img {float: left;margin-right: 10px;width: 40px;}
.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;}

/*------------------------------------------------------------------
[35. Pricing]
*/

.pricing-box {background-color: #fff;border: 1px solid #e7e7e7;padding: 30px;text-align: center;margin-bottom: 30px;}
.pricing-title {margin: 0 0 20px;text-transform: uppercase;background-color: #f6f6f6;padding: 20px;/* font-size: 20px; */font-size:0.9rem;}
.pricing-box ul {list-style: none;padding: 0;margin: 0 0 20px;text-align: left;}
.pricing-box ul li { line-height: 35px;}
.pricing-box ul li i {color: #00bf6f;margin-right: 5px;}
.table-cell {display: table-cell;position: relative;vertical-align: middle;}
.add-pricing {height: 420px;border: 2px dashed #e4e4e4;}
.btn.add-price-btn {
	width: 80px;height: 80px;/* font-size: 20px; */font-size:0.9rem;border-color: #e7e7e7;color:#333; background-color:#f0f0f0;line-height: 68px;
}

/*------------------------------------------------------------------
[36. Blog]
*/

.blog {position: relative;margin: 0 0 50px; background-color: #fff;border: 1px solid #e7e7e7;border-radius: 4px;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;
}
.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;}
.blog-content p {color: #282628;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: #00bf6f;
	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: #00bf6f;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;}
.blog-info a:last-child {margin-right: 0;}
.blog-info a:hover {color: #00bf6f;;}
.blog-info i {color: #00bf6f;font-size: 18px;margin-right: 5px;}
.post-left {float: left;}
.post-right {float: right;}
.post-left ul {margin-left: 0;padding-left: 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-color: #fff;padding: 20px;border: 1px solid #e7e7e7;}
.widget h5 {color: #656565;font-size: 21px;font-weight: normal;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: #00bf6f;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;}
.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;
}
.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: #333;}
.post-info p {color: #909090;font-size: 12px;margin: 0;}
.post-info p i {color: #00bf6f;font-size:0.9rem;margin-right: 4px;}
.categories {list-style: none;margin: 0;padding: 0;}
.categories li {padding: 12px 0;border-bottom: 1px solid #eaeaea;}
.categories li:last-child {padding-bottom: 0px;border-bottom: none;}
.categories li a {color: #656565;font-size: 14px;}
.categories li a:hover {
	color: #00bf6f;
	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: #00bf6f;font-size: 18px;margin-right: 10px;}
.tags {list-style: none;margin: 0;overflow: hidden; padding: 0;}
.tags li {float: left; }
.tag {
	background-color: #eee;
	border-radius: 3px 0 0 3px;
	color: #999;
	display: inline-block;
	height: 26px;
	line-height: 26px;
	padding: 0 20px 0 23px;
	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;
}
.tag::before {background-color: #fff;border-radius: 10px;box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);content: '';height: 6px;left: 10px;position: absolute;width: 6px;top: 10px;}
.tag::after {background-color: #fff;border-bottom: 13px solid transparent;border-left: 10px solid #eee;border-top: 13px solid transparent;content: '';position: absolute;right: 0;top: 0;}
.tag:hover {background-color: #00bf6f;color: white;}
.tag:hover::after {border-left-color: #00bf6f;}
.comment-by {display: block;font-size: 14px;line-height: 21px;margin: 0 0 10px;}
.comments-list .comment-block p {font-size: 13px;line-height: 20px;margin: 0;text-align: justify;}
blockquote p {font-style: italic;font-weight: 400;}
.grid-blog .blog-title {font-size:0.9rem;margin: 0 0 10px;}
.grid-blog .blog-title a {color:#333;}
.grid-blog .blog-content p {font-size: 13px;margin: 0 0 15px;color: #909090;}
.grid-blog .blog-info {border:0;border-top: 1px solid #eaeaea;margin-bottom: 0;padding: 12px 0;}
.grid-blog .blog-image {margin-bottom: 20px;}
.grid-blog .read-more {font-size: 13px;margin-bottom: 15px;}

/*------------------------------------------------------------------
[37. Blog View]
*/

.blog-view .blog-title {font-size: 32px;}
.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{
	border:1px solid #dfdfdf;color:#00bf6f;display:inline-block;/* font-size:22px; */font-size:0.9rem;height:40px;line-height:40px;width:40px;
}
.social-share > li > a:hover{background-color:#00bf6f;color:#fff;border-color:#00bf6f;}
.widget h3 {color: #656565;font-size: 21px;margin: 0 0 20px;}
.blog-reply > a {color: #00bf6f;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 88px;}
.comments-list li .comment {margin-bottom: 30px;}
.comments-list li .comment-author {margin-left: -88px;position: absolute;}
.comments-list li img.avatar {height: 58px;width: 58px;border-radius: 58px;}
.blog-author-name {color: #00bf6f;font-size: 18px;}
.text-red {color: #f00;}
.new-comment label {font-size: 14px;font-weight: 500;}
.new-comment input.form-control {border: 1px solid #e5e5e5;border-radius: 0;box-shadow: inherit;height: 40px;}
.new-comment textarea.form-control {border: 1px solid #e5e5e5;border-radius: 0;box-shadow: inherit;}
.new-comment .form-group {margin-bottom:20px;}
.comment-submit .btn {background-color: #00bf6f;border-color: #00bf6f;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;}

/*------------------------------------------------------------------
[38. UI Kit]
*/
.pagination-box .pagination {margin-top: 0;}

/*------------------------------------------------------------------
[39. Error]
*/

.error-box {
	background-color: #fff;border-radius: 5px;line-height: 1;margin: 0 auto;max-width: 475px;padding: 50px 30px 55px;
	text-align: center;width: 100%;
}
.error-heading {font-size: 3.5em;font-weight: bold;}
.error-title {color: #2c2c2c;/* font-size: 22px; */ font-size:20px; font-weight: normal;margin: 0 0 1.5rem;}
.error-wrapper {
	background-color: #fff;margin: 0;color: #4F5155;-moz-box-align: center;-moz-box-pack: center;align-items: center;
	display: flex;justify-content: center;height: 100%;
}
.error-box h1 {font-size:150px;}
.error-box p {margin-bottom:30px;}
.error-box .btn {text-transform:uppercase;}

/*------------------------------------------------------------------
[40. Lock Screen]
*/
/* 
.lock-user {margin-bottom: 20px;}
.lock-user img {margin-bottom: 15px;width: 100px;}
 */
/*------------------------------------------------------------------
[41. Countdown]
*/
/* 
.countdown {margin-bottom: 80px;}
.countdown ul {display: block;list-style: none;margin: 0 auto;padding: 0;width: 600px;}
.countdown ul li {display: inline-block;float: left;}
.countdown ul li.timer {background-color: #f5f5f5;border-radius:6px;color: #313131;padding: 20px 15px;text-align: center;width: 19.75%;}
.countdown ul li span { font-size: 50px;}
.countdown ul li p {color: #313131;font-size: 12px;margin: 0;text-transform: uppercase;}
.countdown ul li.seperator {font-size: 48px;line-height: 100px;padding: 0 8px;text-align: center;vertical-align: top;width: 41px;}
.newsletter {text-align: center;}
.newsletter h3 {font-size: 18px;font-weight: normal;margin-bottom: 11px;text-align: center;text-transform: uppercase;}
.newsletter form {margin: 0 auto;width: 500px;}
.newsletter input[type="text"] {border: 1px solid #d8d8d8;border-radius: 5px 0 0 5px;font-size: 12px;height: 46px;padding: 0 20px;width: 350px;float: left;}
.submit-btn {background-color: #cdcdcd;border: 1px solid #cdcdcd;border-radius: 0 5px 5px 0;color: #fff;padding: 0 20px;text-transform: uppercase;width: 150px;cursor: pointer;float: right;height:46px;}
.submit-btn:hover {background-color: #00bf6f;border: 1px solid #00bf6f;}
.title-section {margin-bottom: 80px;text-align: center;}
.coming-title {font-size: 40px;font-weight: normal;text-transform: uppercase;margin-bottom: 0;}
.sub-title {color: #bdbdbd;font-size: 14px;margin: 0;}
.coming-wrapper {display: table;height: 100vh;width: 100%;padding: 30px 0;background-color:#fff;}
 */
/*------------------------------------------------------------------
[42. 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;}
.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;}
 */
 
/*------------------------------------------------------------------
[43. 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;}
 */
/*------------------------------------------------------------------
[44. Incoming Call]
*/
/* 
.incoming-btns {margin-top: 20px;}
 */
/*------------------------------------------------------------------
[45. Widgets]
*/
/* 
.dash-widget {background-color: #fff;border: 1px solid #e7e7e7;border-radius: 4px;margin-bottom: 30px;padding:20px;position: relative;}
.dash-widget2 {display: block;min-height: 90px;background: #fff;width: 100%;border-radius: 4px;margin-bottom: 30px;border:1px solid #e7e7e7;}
.dash-widget2 .dash-widget-icon {border-radius: 4px 0 0 4px;display: block;float: left;height: 88px;width: 90px;text-align: center;font-size: 45px;line-height: 90px;color:#fff;}
.dash-widget2 .dash-widget-info {padding:11px 20px;}
.dash-progress {margin-top: 15px;}
.dash-progress h5 {margin-bottom: 0;}
.dash-widget3 .dash-widget-icon {color:#fff;    height: 60px;line-height: 60px;width: 60px;}
.dash-widget4 .dash-widget-icon {color:#fff;}
.dash-widget5 {display: block;min-height: 90px;background: #fff;width: 100%;border-radius: 4px;margin-bottom: 30px;border:1px solid #e7e7e7;}
.dash-widget5 .dash-widget-icon {border-radius: 0;display: block;float: left;height: 88px;width: 90px;text-align: center;font-size: 45px;line-height: 90px;color:#fff;}
.dash-widget5 .dash-widget-info {padding:11px 0;}
.analytics-desc {display: block;margin: 10px 0;text-align: center;}
.analytics-desc > .analytics-count {margin: 0;padding: 0;font-weight: 600;font-size:0.9rem;}
.analytics-desc > .analytics-title {text-transform: uppercase;font-size: 12px;}
.profile-widget.profile-widget4 {padding:0;}
.profile-bg {background: url("../img/user-02.jpg");background-size: cover;height: 141px;color:#fff;padding:20px;}
.profile-widget .profile-bg .user-name > a {color: #fff;}
.profile-bg h5 {color:#fff;}
.profile-avatar {position: relative;top: -50px;margin-bottom: -50px;}
.profile-avatar img {width: 80px;height: 80px;-webkit-border-radius: 50%;-moz-border-radius: 50%;border-radius: 50%;}
.profile-widget .user-info {padding: 10px 15px;}
.profile-widget .user-info .title {margin-bottom: 4px;font-size: 24px;line-height: 1;color: #262626;vertical-align: middle;}
.profile-widget .user-info .desc {overflow: hidden;font-size: 12px;line-height: 20px;color: #737373;text-overflow: ellipsis;}
.profile-widget.profile-widget3 {padding:0;overflow:hidden;}
.profile-widget3 {background-color: #fff;border: 1px solid #e1e8ed;border-radius: 6px;margin-bottom: 30px;}
.avatar-link {border-radius: 6px;display: inline-block;float: left;margin: -30px 5px 0 8px;max-width: 100%;vertical-align: bottom;position:relative;}
.avatar-link img {border: 2px solid #fff;border-radius: 7px;box-sizing: border-box;color: #fff;height: 72px;width: 72px;}
.avatar-link img.rounded-circle {border-radius:50%;}
.profile-widget3 .user-info {margin: 5px 0 0;text-align: left;padding:0;}
.profile-widget3 .user-info .username {font-size: 18px;font-weight: 700;line-height: 21px;}
.profile-widget3 .user-info .username a {color: #333;}
.user-analytics {padding: 10px 0;}
 */
/*------------------------------------------------------------------
[46. Contacts]
*/

.contacts-header {background-color: #fff;border-bottom: 1px solid #eaeaea;padding: 10px 15px;}
.contacts-header .navbar {border: 0 none;margin: 0;min-height: auto;}
.contacts-header .user-info a {color: #76838f;text-transform: uppercase;}
.contact-left {display: table-cell;height: 100%;float: none;padding: 0;position: static;vertical-align: top;-webkit-transition: all 0.4s ease;-moz-transition: all 0.4s ease;transition: all 0.4s ease;width:100%;}
.contacts-list {position: relative;padding: 0 70px 0 20px;}
.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-type {height: 48px;position: absolute;width: 48px;}
.contact-icon {background-color: #f3f7f9;border: 1px solid #e4eaec;border-radius: 4px;display: inline-block;height: 38px;line-height: 38px;text-align: center;width: 38px;}
.contact-icon i {color: #76838f;font-size: 20px;}
.contact-info {padding: 0 30px 0 50px;}
.contact-action {height: 30px;list-style: none;padding-left: 0;position: absolute;right: 0;text-align: right;top: 10px;width: 30px;}
.contact-date {color: #888;font-size: 12px;}
.contact-author a {color: #00bf6f;font-size: 12px;text-decoration: underline;}
.contact-action .dropdown-menu {left: auto;right: 0;}
.contact-alphapets {background-color: #fff;border-left: 1px solid #e7e7e7;bottom: 0;height: 100%;overflow: hidden;padding-bottom: 121px;position: fixed;right: 0;top: 121px;width: 50px;}
.contact-box {display: inline-table;height: 100%;padding: 30px 15px;position: relative;width: 100%;}
.alphapets-inner {height: 100%;overflow: auto;}
.alphapets-inner a {display: block;text-align: center;padding: 2px;color:#333;}

/*------------------------------------------------------------------
[47. Notification settings]
*/

.notification-list .list-group-item {padding: 15px;}

/*------------------------------------------------------------------
[48. Add Product]
*/

.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: 40px;box-shadow:inherit;border-radius:0;line-height: 30px;}
.bootstrap-tagsinput .badge {background-color: #00bf6f;border-radius: 3px 0 0 3px;color: #fff;display: inline-block;height: 26px;line-height: 26px;padding: 0 20px 0 23px;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;border:0;float:left;}
.bootstrap-tagsinput .badge [data-role="remove"]:hover {box-shadow:inherit;color:#f00;}
.bootstrap-tagsinput .badge::before {background-color: #fff;border-radius: 10px;box-shadow: inset 0 1px rgba(0, 0, 0, 0.25);content: '';height: 6px;left: 10px;position: absolute;width: 6px;top: 10px;}
.bootstrap-tagsinput .badge::after {background-color: #fff;border-bottom: 13px solid transparent;border-left: 10px solid #00bf6f;border-top: 13px solid transparent;content: '';position: absolute;right: 0;top: 0;}
.bootstrap-tagsinput .badge:hover {background-color: #00bf6f;color: white;}
.bootstrap-tagsinput .badge:hover::after {border-left-color: #00bf6f;}


/*------------------------------------------------------------------
[49. Product]
*/

.product {-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-o-transition: all 0.5s;border: 1px solid #e7e7e7;border-radius: 5px;padding:5px;background-color:#fff;margin-bottom:30px;}
.product-inner {overflow: hidden;position: relative;width: 100%;}
.product-inner img {width: 100%;height: auto;}
.product-inner .cart-btns {position: absolute;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0, 191, 111, 0.1);opacity: 0;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-o-transition: all 0.5s;}
.cart-btns .btn {width: 120px;display: block;margin: 30px auto 0;-moz-transition: all 0.5s;-webkit-transition: all 0.5s;-o-transition: all 0.5s;}
.product a.addcart-btn {margin: -100px auto 10px;}
.product a.proedit-btn {margin: 0 auto;}
.product .pro-desc {padding: 15px 10px;}
.pro-desc .price {font-size: 18px;line-height: 20px;color: #333;font-weight:bold;}
.product:hover .cart-btns {opacity: 1;}
.product:hover a.addcart-btn {margin: 55px auto 10px;}
.pro-desc h5 a {color:#333;}
.product-det {position: relative;display: block;float: left;width: 100%;min-height: 40px;}
.product-desc {padding: 0 0 0 70px;}
.product-det > img {top: 0;width: 60px;position: absolute;left: 0;}
.product-desc span, .product-desc a {width: 100%;margin: 0;padding: 0;display: block;}
.price-sup {font-weight: bold;margin-bottom:0;}

/*------------------------------------------------------------------
[50. Product Details]
*/

.product-content {position: relative;}
.product-content p {color: #282628;font-size: 14px;font-weight: 500;line-height: 25px;margin: 0 0 25px;}
.proimage-thumb {float: left;list-style:none;padding:0;}
.proimage-thumb li {float: left;height: 60px;width: 80px;text-align: center;margin: 13px 12px 0 0;}
.proimage-thumb li img {display: block;height: 62px;width: 81px;border-radius: 3px;-moz-border-radius: 3px;-webkit-border-radius: 3px;position: relative;}
.rated {color:#fc0;}
.product_price {font-size: 30px;font-weight: bold;}
.review-list {list-style: none;margin: 0;padding: 0;}
.review-list li {clear: both;padding: 10px 0 0 88px;}
.review-list li .review {margin-bottom: 30px;}
.review-list li .review-author {margin-left: -88px;position: absolute;}
.review-list li img.avatar {height: 58px;width: 58px;border-radius: 58px;}
.review-by {display: block;font-size: 14px;line-height: 21px;margin: 0 0 10px;}
.review-list .review-block p {font-size: 13px;line-height: 20px;margin: 0;text-align: justify;}
.new-review label {font-size: 14px;font-weight: 500;}
.new-review input.form-control {border: 1px solid #e5e5e5;border-radius: 0;box-shadow: inherit;height: 40px;}
.new-review textarea.form-control {border: 1px solid #e5e5e5;border-radius: 0;box-shadow: inherit;}
.new-review .form-group {margin-bottom:20px;}
.review-submit .btn {background-color: #00bf6f;border-color: #00bf6f;border-radius: 0;font-size: 18px;padding: 8px 26px;color:#fff;}
.review-date {color: #999;font-size: 12px;}
.review-author-name {font-size: 18px;}
.product-reviews {margin-bottom: 30px;}

/*------------------------------------------------------------------
[51. 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;}

/*------------------------------------------------------------------
[52. Gallery]
*/

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


/*------------------------------------------------------------------
[53. Responsive]
*/
@media (min-width: 767px) and (max-width: 1080px ) {
	.icon-pad1{
		margin-left:-11px;
		font-size: 24px !important;
	}
	.style1{
		font-size: 10px !important; 
	}
}
@media (min-width: 576px) and (max-width: 766px ) {
	.icon-pad1{
		margin-left:-6px;
		font-size: 12px !important;
	}
	.style1{
		font-size: 10px !important; 
	}
}
@media (min-width: 576px) and (max-width: 880px ) {
	.chart_style{
		width:200px!important;
	}
}
@media only screen and (min-width: 768px) {
	.modal-backdrop.custom-backdrop.in {background-color: #fff;left: 220px;opacity: 1;}
	.modal-open .modal.custom-modal {border-top: 1px solid #e7e7e7;left: 220px;top: 59px;}
	.custom-modal .modal-content {border: 0 none;box-shadow: inherit;margin: 0 auto;background-color: transparent;padding: 30px 0;width:600px;}
	.custom-modal .modal-title {margin-bottom: 20px;}
	.custom-modal .modal-body.card-box {padding:15px;}
	.custom-modal .modal-body {padding:0;}
	.custom-modal .modal-dialog {height: 100%;margin: 0;width: 100%;max-width: 100%;pointer-events: inherit;}
	.modal.custom-modal {background-color: #f5f5f5;}
	.custom-modal .modal-header {border:0; padding:0;}
	.custom-modal .modal-footer {border:0;}
	.modal-md {width:600px;}
	.custom-modal button.close {background: #00bf6f;border-radius: 50%;height: 50px;right: 15px;opacity: 1;position: absolute;top: 15px;width: 50px;text-shadow: inherit;color:#fff;z-index: 99;}
	.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: #00bf6f;}
	.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: #00bf6f;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: #00bf6f;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;}
	.custom-modal .modal-content > button.close {display:none;}
	.workmenu{
		font-size:200px;
	}
}
@media only screen and (max-width: 1199.98px) {
	.custom-modal .modal-content.modal-lg {width: 90%;}
	.workmenu{
		font-size:200px;
	}
}

@media only screen and (max-width: 991.98px) {
	.profile-rightbar {display:inline-block !important;}
	.task-right-sidebar .task-chat-view {display: block;position: fixed;right: 0;-webkit-transition: all 0.4s ease; -moz-transition: all 0.4s ease; transition: all 0.4s ease;margin-right: 0;}
	.task-chat-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: 60px;}
	.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: 60px;}
	.message-view.task-view {width:100%;}
	.pull-left.ticket-view-details {width: 90%;}
	/* .slide-nav .page-wrapper {left: 225px;margin-left: 0;} */
	.chat-main-row {left:0;}
	.header .header-left {position:absolute; width:100%;}
	.page-title-box {display:none;}
	.page-wrapper {margin-left:0;padding-left: 0;padding-right: 0;}
	.slide-nav .sidebar {margin-right: 0;}
	.modal-open .modal.custom-modal {left: 0;top:0;}
	.modal-backdrop.custom-backdrop.in {left: 0;}
	body {font-size:13px;}
	.sidebar-menu li a {font-size:13px;}
	.chat-panel .custom-menu.navbar-nav > li > a {font-size:18px;}
	.workmenu{
		font-size:200px;
	}
}
a.mobile_btn {color: #ffffff;font-size: 24px;height: 60px;left: -20px;line-height: 60px;position: absolute;top: 0;z-index: 10;}
.mobile_btn {display:block;}
.logo-header{margin: 0 0 0 1rem; display: flex;}
			
@media only screen and (max-width: 767.98px) {
	.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;}
	.custom-modal button.close {
		background-color: #00bf6f;border-radius: 50%;height: 30px;right: 15px;opacity: 1;position: absolute;top: 11px;width: 30px;text-shadow: inherit;
		color:#fff;z-index:99;
	}
	.modal-body.card-box {background-color: #fff;border: none;border-radius: inherit;box-shadow: unset;margin-bottom: 0;padding: 15px;}
	.header {z-index:1040;}
	.task-wrapper #task-list li .task-container .task-label {padding-right: 50px;word-break: unset;}
	.task-btn-right {position: absolute;right: 8px;}
	.task-wrapper #task-list li .task-container {padding:8px 10px;}
	.task-action-btn.task-check {width: 36px;}
	.roles-menu {margin-bottom:20px;}
	.contacts-list {padding: 0 70px 0 15px;}
	.left-action {text-align:center;margin-bottom:15px;}
	.right-action {text-align:center;}
	.top-action-left .pull-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%;}
	.custom-modal .modal-content.modal-lg {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 #00bf6f;border-left-width: 2px;}
	.nav-tabs {border-bottom: 0;position: relative;background-color: #2c2b2f;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 #00bf6f;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: #00bf6f;}
	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; }
	.card-title  { font-size: 1.12em; }
	.blog-view .blog-title {font-size: 24px;}
	.widget h3 {font-size: 18px;}
	.countdown ul {width: 100%;}
	.countdown ul li.timer {width:19.75%;min-height: inherit;}
	.countdown ul li.seperator {font-size: 40px;line-height: 97px;width: 7%;}
	.countdown ul li span {font-size: 40px;}
	.countdown ul li p {font-size: 10px;}
	.coming-title{font-size:30px;}
	.title-section {margin-bottom: 50px;}
	.countdown {margin-bottom: 50px;}
	.newsletter form {width: 90%;}
	.newsletter input[type="text"] {width:70%;height: 40px;}
	.submit-btn {width:30%;height: 40px;}
	.my-video ul li {width:80px;}
	.voice-call-avatar .call-avatar {width:120px;height:120px;}
	.product-info {margin: 20px 0 30px;}
	.profile-bg {height:280px;}
	.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;}
	.modal-backdrop.custom-backdrop {z-index:1041;}
	.custom-modal .modal-dialog-centered {min-height:inherit;}
	.custom-modal > button.close {display:none;}
	.workmenu{
		font-size:200px;
	}
}
@media only screen and (max-width: 575.98px) {
	.contact-cat {padding-right:70px;}
	.mobile-user-menu {display:block;}
	.search-box {display:none;}
	.filter-row {margin-bottom: 15px;}
	.page-wrapper > .content {padding: 3.8rem 0 0 0;}
	.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-panel .chats {padding: 15px 0;}
	.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;}
	body {font-size:0.9rem;}
	.sidebar-menu li a {font-size:12px;}
	.content {padding: 0 50px;}
	.countdown ul {width: 100%;}
	.countdown ul li.timer {min-height: inherit;padding: 15px 5px;width: 19.75%;}
	.countdown ul li.seperator {width: 7%;/* font-size: 22px; */ font-size:20px; padding: 0 5px;line-height: 55px;}
	.countdown ul li span {/* font-size: 22px; */ font-size:20px;}
	.countdown ul li p {font-size: 7px;}
	.coming-title{/* font-size:20px; */font-size:0.9rem;}
	.title-section {margin-bottom: 20px;}
	.countdown {margin-bottom: 20px;}
	.newsletter form {width: 90%;}
	.newsletter input[type="text"] {width:70%;height: 36px;padding: 0 10px;}
	.submit-btn {width:30%;height: 36px;padding: 0 10px;}
	.sub-title {font-size: 11px;}
	.newsletter h3 {font-size:0.9rem;}
	.pull-left.ticket-view-details {width: 80%;}
	.chat-panel .last-seen {font-size:10px;}
	.custom-menu.navbar-nav > li > a {margin-left: 10px;}
	.profile-bg {height:180px;}
	.error-box h1 {font-size: 50px;}
	.workmenu{font-size:200px;}
}
.carousel-control { width:  4%; }
.carousel-control.left,.carousel-control.right {margin-left:15px;background-image:none;}
@media (max-width: 767px) {
	.carousel-inner .active.left { left: -100%; }
	.carousel-inner .next        { left:  100%; }
	.carousel-inner .prev		 { left: -100%; }
	.active > div { display:none; }
	.active > div:first-child { display:block; }

}
@media (min-width: 767px) and (max-width: 992px ) {
	.carousel-inner .active.left { left: -50%; }
	.carousel-inner .next        { left:  50%; }
	.carousel-inner .prev		 { left: -50%; }
	.active > div { display:none; }
	.active > div:first-child { display:block; }
	.active > div:first-child + div { display:block; }
}
@media (min-width: 992px ) {
	.carousel-inner .active.left { left: -25%; }
	.carousel-inner .next        { left:  25%; }
	.carousel-inner .prev		 { left: -25%; }	
}






.text1{
	overflow: auto;
	height:80px;
}

div.bootstrap-datetimepicker-widget.dropdown-menu.top{
	display:none !important;
}


/*------------------------------------------------------------------
[54. fonts]
*/
.fonts_circle_chart_menu{font-size:0.9rem;border:1px solid #9e9797;height:30px;width:30px;border-radius:70px;padding:1px 0 0 6px;color:#000}
.fonts_circle_chart_menu_dropdown{font-size:0.9rem;border:1px solid #9e9797;height:30px;width:30px;border-radius:70px;padding:6px 0 0 6px;color:#000}


/*------------------------------------------------------------------
[55. modal]
*/
.modal{
	display:none;position:fixed;background-color:#fafafa;max-height:85%;width:55%;margin-top:auto;/* overflow-y:auto; */
	will-change:top, opacity
}
.modal .modal-title{ font-size: 1.25rem !important;}
.modal .modal-title .tools, .modal .tools{ margin-right: 0.5rem !important; }
.modal.bottom-sheet{ will-change:bottom,opacity }

/* for different modal size */
.modal.left-small{width:80%; left:10%; right:0; max-height:100%; height:80% !important; top: 10%; bottom: 10% !important;}
.modal.center-xs-small{width:50%;min-height:40%; max-height:80%;height:auto; left:25%; right:0; top:0; bottom:auto;}
.modal.center-small{width:85%;max-height:91%;height:auto;left:7%;right:0;top:0;bottom:auto}
.modal.full-large{left:6%;width:91.5%;max-height:91%;/* background-color: #f4f7ed; */background-color: #f5f5f5;}
.modal.extra-large{width:100%;max-height:100%;top:0% !important;}
.modal.center-calender{width:30%;max-height:100%;height:auto;left:30%;right:0;top:20%;bottom:auto}

.modal-content {border-radius:0; height: 92%; }

/* for modal header */
.modal .modal-close{ cursor:pointer; }
.modal .modal-header{ padding:0.5rem 0rem 0rem 0.5rem; background-color: #b5fef5; }
.modal .modal-header .navbar{ padding:0; margin-top:-15px; }
.modal .modal-header .breadcrumb{ padding:0 1rem; margin-top:15px; background-color:#b5fef5; }
.modal .modal-header li:last-child a{ color:#000; }
.modal .modal-header button.close{ margin-right: 0.25rem; }

/* for modal body */
.modal .modal-body, .modal .body, .modal .box .body { height:auto; overflow-y:auto; overflow-x: hidden; }
.modal .modal-body .notepad, .modal .body .notepad, .modal .box .body .notepad{ margin:0px;}
.modal .modal-body .notepad .note-text, .modal .body .notepad .note-text, .modal .box .body .notepad .note-text { 
	padding:0.75rem; 
}
.modal .modal-body { padding:0rem !important; /* background-color: #f5f5f5; */ /* background-color: #ffffff; */ }

.modal.left-small .modal-body { max-height:66vh; overflow-y:auto; overflow-x: hidden; } 
.modal.left-small .body { height:86vh; overflow-y:auto; overflow-x: hidden; }
.modal.center-small .modal-body { height:74vh; overflow-y:auto; overflow-x: hidden; }
.modal.center-small .body { height:74vh; overflow-y:auto; overflow-x: hidden; }

.modal.full-large .modal-body { height:74vh; overflow-y:auto; overflow-x: hidden; }
.modal.full-large .modal-body-no-footer { height:82vh; overflow-y:auto; overflow-x: hidden; }
.modal.full-large .body { /* height:83vh; overflow-y:auto; overflow-x: hidden;  */}

.modal.extra-large .modal-body{ height:84vh; overflow-y:auto; overflow-x: hidden; top:0 !important; } 
.modal.extra-large .body { height:84vh; overflow-y:auto; overflow-x: hidden; top:0 !important;}
 
 
 /* for lean modal*/
.lean-overlay{
	position:fixed;z-index:999;top:-100px;left:0;bottom:0;right:0;height:125%;width:100%;background:#000;display:none;will-change:opacity;
}

/* for responsiveness */
@media only screen and (max-width: 992px) {
.modal{width:80%}
.modal.full-large{left:0;width:100%}
.modal.left-small{width:100%;left:0;right:0}
.modal.center-small{width:100%;left:0;right:0}
}
/* for modal footer */
.modal-footer {border: none; display:contents; padding: 0.25rem 0rem 0.25rem 0rem; /* background-color: #f5f5f5; */ /* background-color: #ffffff; */}
.modal-footer button { margin-top: 0.3rem;  margin-left: 0.8rem;}
.modal-footer-field-button {margin-top:-32px;padding-left: 1rem;}
 .modal-footer input[type="submit"], .modal-footer input[type="button"] { margin-left: 0.8rem;  margin-top: 0.2rem; } 

/* for modal box inside modal body */
.modal-body .box{margin: 0.5rem 1rem 0.25rem 1rem;}
.modal-body .tree-box{margin: 1rem 0rem 0.25rem 0.75rem;}
.modal-body .body{/* background-color: #f4f7ed; */ background-color: #ffffff; padding: 0.25rem;}
.modal-body .box, .modal-body .box .body{background-color: #ffffff;}
.modal-body .box-body-form {padding: 0.5rem 1rem 0.5rem 1rem !important;}

/* for modal more button inside modal body */
.modal-body .more-field-button {/*margin-left: 8px;*/}

/* for breadcrumb/pageNavigation */
#modal-breadcrumb-id.modal-header{padding: 0rem;/* font-size:20px */font-size:0.9rem;}
#modal-breadcrumb-id.modal-header .navbar{padding: 0.25rem;}
#modal-breadcrumb-id .breadcrumb{margin-bottom: 0.1rem; padding: 0.5rem;}

/*------------------------------------------------------------------
[56. box]
*/
.box{ position:relative; background-color: #fff; margin-bottom:0.25rem; color:#000; border: 1px solid rgba(208 210 210); border-radius: 8px; }
.box-wo-margin{ position:relative; background-color: #fff;color:#000;border-radius:2px; border: 1px solid rgba(208 210 210);}
.box-wo-border{ position:relative; background-color: #fff;color:#000; }
.box:before,.box:after{content:" ";display:table}
.box:after{clear:both}
.box .collapse{display:block}
.box .expand{display:none}
/* 
.right-box{margin-right: -5px !important;}
.left-box{margin-left: -5px !important;}
 */
 
 /* for box header */
.box header{ 
	position:relative;line-height:25px; min-height:25px; vertical-align:middle;border-radius:2px 2px 0 0;cursor:pointer; display: flow-root;
	font-size: 1rem;
}
.box header.header-text {padding-left: 0.5rem !important; margin-top: 0.5rem !important;font-weight:700;}
.box header>h1, .box header>h2, .box header>h3, .box header>h4, .box header>h5, .box header>h6{ 
	white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
.box header:before,.box header:after{content:" ";display:table}
.box i.header-icon{padding-right:.5rem}
.box header>h5, .box header>h6 {
	vertical-align:middle; margin:0; display:inline-block; padding:8px 10px 8px 10px; vertical-align:middle; line-height:17px; font-size:0.9rem;
	/*  width: 80%; */
}
.box header>h6{vertical-align:middle;margin:0;display:inline-block;padding:0px 0px 5px 5px;vertical-align:middle;line-height:17px;font-size:18px;}
.box header .box-toolbar{float:right; padding:2px 5px 0px 0px; display: ruby;}
.box header .box-toolbar a i{font-weight:900;/* padding-top:5px; */color:#3A84F3;}
.box header .box-header-form{line-height: 27px; margin-bottom: -7px; padding: 5px 0px 0px 10px;}

/* for box body */
.box .body{/* padding:0.75rem 0.5rem 1rem 0.5rem; */ position:relative; }
.box .body:before,.box .body:after{ content:" ";display:table; }
.box .body:after{clear:both}
.box .body.collapse{display:block}
.box .body.expand{display:none}
.box .body:last-child{border-radius:0 0 2px 2px}
.box .body.table-responsive{margin:0}

/* specific to left box */
#leftBox .box .body{padding:0rem;}
/* specific to datatable under left box */
.left-box .box .body .ts-xy, .left-box .box .body .ts-c{padding:0;}

/* for Accordion menu for expand /collapse */ 
.box .body .box-body-toolbar{position: absolute;top: 1%;right: 15%;transform: scale(2,1.25);display: block;}
 
/*------------------------------------------------------------------
[57. form]
*/

.tab-widget{position: relative;}
.tab-widget .tab-content{position: relative;}
.box-body-form {padding: 0.5rem 1rem 0rem 1rem;}
.box-body-table {padding: 0rem 1rem 0rem 1rem;}
.box-body-table .table-wrap.table-resposive {width:auto; min-width: 97%; margin-top: -1rem !important; margin-left: 1rem !important;}
.box-body-tree {padding : 2rem 0rem 0rem 0rem;}
.box-body-button { padding: 0.5rem 0rem 0.5rem 0.75rem; }

/* For RHS BOX */
.box-right-box {padding-left: 5px;}
.box-right-box .box-body-button, #rightBox .box-body-button { padding: 0.5rem 0rem 0.5rem 0.25rem; text-align: right; }
.box-right-box .box-body-button .btn, #rightBox .box-body-button .btn { 
	color: black !important; background-color: #ffffff !important; border: solid 2px #3A84F3 !important; 
}
	

.grid-footer-button {margin : 0.5rem 0rem 0.5rem 0.1rem;}
.more-field-button {padding-bottom: 1rem; margin: -2px 0px 0px -5px;}
.more-field-button a{color:#3A84F3 !important;}
.footer-button {padding-bottom: 0.25rem;}
.manditory label:AFTER,.manditory_table {
	font-family: "Material-Design-Icons";content: "\e679";padding-right: 5px;color: red; font-size: .8rem;padding-left: 1px;
}
.manditory .select2-container ,.manditory .fs-label-wrap,.manditory .fs-wrap,.manditory input[type="text"], .manditory select,  .manditory textarea{
 background-color: rgb(232, 240, 254);
}
.manditory_label {color: red;}

textarea.form-control {height: calc(2rem + 2px); overflow: hidden;}
input.form-control {height: calc(2.2rem + 2px);}

.input-group textarea.form-control {padding : 0.55rem 1.2rem 0rem 0.55rem;}
.input-group input{overflow: hidden;vertical-align: middle;width: 100%;padding-right: 4.375rem; white-space: nowrap;text-overflow: ellipsis;} 
div.input-group.date input{padding-right: 0rem !important ;text-overflow: clip !important ; background-color: #f7f0e9 ;}
.form-group {margin-bottom : -0.15rem;/* font-size: 20px; */ font-size:0.9rem;}
.form-group label {margin-bottom : 0.1rem;/* font-size: 20px; */ font-size:0.9rem; /* display: flex; */ align-items: center; }

/*------------------------------------------------------------------
[58. button]
*/
.btn:disabled {background-color: #ededed !important; box-shadow: none; color: #171313 !important; cursor: default;}
.btn-circle {width: auto; height: 30px; padding: 6px 0px; border-radius: 15px; text-align: center; font-size: 13px; line-height: 1.42857;}
.btn-submit {background-color: #a95612!important;color: #fff;}
.btn-submit-add {background-color: #a95612!important;color: #fff;}
.btn-back {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-update {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-update-add {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-back {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-exit {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-more {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-reset {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-add {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-save {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-attach {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-save-add {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-go {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-previous {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-next{background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-search {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-clear {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-adv-search {background-color: #3A84F3 !important;border: 1px solid #3A84F3 !important;}
.btn-tabs {padding :.25rem .5rem;}
div[data-ajaxgrid="true"] .ts-xy-a .btn { color: black !important; background-color: #ffffff !important; border: solid 2px #3A84F3 !important; }


/*------------------------------------------------------------------
[59. icons]
*/
.fa-info-circle{color: #b4b4c5;}

.icon-content {position: absolute; top: 0.25rem; margin-right: 0.45rem; margin-top: 0px; right: 0px; z-index: 3;}
.icon-expcol {top: 0; margin-left: 7px; margin-top: 2px; left: 0px;	z-index: 3;}
.input-group {
	position: relative; display: -ms-flexbox; display: flex; -ms-flex-wrap: wrap; flex-wrap: wrap; -ms-flex-align: stretch; 
	align-items: stretch; width: 100%;
}
.input-group a {color: #000000;}
td div.input-group.date {position: unset; background: #f7f0e9;}

/* single selection dropdown*/
.input-group .select2-choice .select2-arrow{margin-right : 25px;}
.input-group .select2-search-choice-close {margin-right : 20px;}

/* multiple selection dropdown*/
.input-group .fs-arrow {margin-right : 20px;}

/*------------------------------------------------------------------
[60. life cycle circle]
*/
.outer-circle{
	position:relative; border: solid 1px lightblack; width: 1.15rem !important; height: 1.15rem !important; border-radius: 50%; list-style: none; 
	overflow: hidden; margin-left: auto; margin-right: auto;  margin-top:0.4rem; 
}
.circle-sector {overflow: hidden;position: absolute;top: -20%;right: -20%;width: 70%;height: 70%;transform-origin: 0% 100%;}
.circle-drawing {position: absolute;left: -100%;width: 200%;height: 200%;text-align:center;padding-top: 20px;}

/* [60 B. life cycle circle big] */
.outer-circle-2rem{
	position:relative;border: solid 1px lightblack;width: 2rem;height: 2rem;border-radius: 50%;list-style: none;overflow: hidden;
	margin-left: auto;margin-right: auto;margin-top:0px;
}
.circle-sector {overflow: hidden;position: absolute;top: -20%;right: -20%;width: 70%;height: 70%;transform-origin: 0% 100%;}
.circle-drawing {position: absolute;left: -100%;width: 200%;height: 200%;text-align:center;padding-top: 20px;}


/*------------------------------------------------------------------
[61. search section]
*/
#global_search.collapse{display: block;}
#global_search.expand{display: none;}

/*------------------------------------------------------------------
[62. datepicker]
*/
.date .form-control[readonly] {background-color: #f7f0e9 ;cursor: pointer;}

/*------------------------------------------------------------------
[63. select / multi select dropdown]
*/
/* boarview 2nd filter*/
.custom-dropdown{
	position:relative;background:#fff;padding:3px 7px;border-radius:10px;border:1px solid #d0d7de;box-shadow:0 4px 12px rgba(0,0,0,0.08);
	cursor:pointer;font-size:1rem;color:#1a1a1a;display:flex;align-items:center;justify-content:space-between;user-select:none;width:100%;
	max-width:100%;box-sizing:border-box;
}
.custom-dropdown .selected{font-weight:500;color:#000;flex:1;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.custom-dropdown .dropdown-list{
	position:absolute;top:100%;left:0;width:100%;max-width:100%;background:#fff;border-radius:10px;border:1px solid #e3e3e3;margin-top:6px;
	box-shadow:0 6px 16px rgba(0,0,0,0.15);overflow:hidden;max-height:0;opacity:0;transition:all 0.25s ease;z-index:1000;
}
.custom-dropdown.active .dropdown-list{max-height:300px;opacity:1;overflow-y:auto;}
.custom-dropdown .dropdown-list li{
	padding:8px 10px;font-size:1rem;color:#222;list-style:none;cursor:pointer;transition:background 0.2s ease;white-space:nowrap;
}
.custom-dropdown .dropdown-list li:hover{background:#e6e6e6;}
.custom-dropdown::after{
	content:"";display:inline-block;width:10px;height:10px;border-right:2px solid #333;border-bottom:2px solid #333;transform:rotate(45deg);
	margin-left:8px;transition:transform 0.2s ease;
}
.custom-dropdown.active::after{transform:rotate(-135deg);}
@media(max-width:480px){
	.custom-dropdown{padding:10px 12px;font-size:.9rem;}
	.custom-dropdown .dropdown-list li{font-size:.9rem;padding:8px;}
}


/* boarview 3nd filter*/
#yAxisDropdownId.select-color { 
	background:#fff; border:none; padding:2px 3px; border-radius:14px; font-size:0.9rem; box-shadow:0 4px 12px rgba(0,0,0,0.08); cursor:pointer; 
	width:6rem; height:1.9rem; outline:none; appearance:none; -webkit-appearance:none; -moz-appearance:none; color:#000; 
	background-image:url("data:image/svg+xml;utf8,<svg fill='gray' height='20' width='20' viewBox='0 0 20 20'><path d='M5 7l5 5 5-5H5z'/></svg>"); 
	background-repeat:no-repeat; background-position:right 8px center; background-size:14px; 
}
#yAxisDropdownId.select-color:hover { background:#f2f2f2; }
#yAxisDropdownId.select-color:focus { box-shadow:0 0 0 3px rgba(70,130,255,0.25); }

select{ /* border:none !important;  */ background-color: #fff !important; background-color: #fff; }
 
/* single select */
.select2-container.form-control{ padding-left:0.3rem; height:calc(2.2rem + 2px); background: #e6e6fa; } 
.select2-container .select2-choice{ height:calc(2rem + 2px)!important; line-height:30px; background: #e6e6fa; }
.select2-search input{ margin-top:3px; /* background: #e6e6fa; */}
.select2-drop{ background: #e6e6fa; }

/* multi select */
.fs-wrap{ outline:#fff; border:1px solid #ced4da; }
.fs-label-wrap{ height:2.2rem; background: #e6e6fa; }
.fs-label-wrap .fs-label{ height:80%; font-size:inherit; }
.fs-dropdown{position:absolute; height:-moz-available; max-height:10rem; width:inherit; overflow-x: hidden; margin-left: -1px; background: #e6e6fa; }
.fs-dropdown .fs-options{height:inherit; width:inherit; overflow: visible; }
.fs-wrap.multiple .fs-option.selected .fs-checkbox i{background-color:#3A84F3 !important; }
.fs-option,.fs-optgroup-label{ border-bottom:none; }


/* need to delete later on multi select is cleaned up*/
/*
.fs-label-wrap{
   display:block;height:calc(2rem + 1px);padding:0;overflow:hidden;position:relative;border:1px solid transparent;white-space:nowrap;line-height:18px;
   color:#0c0c0c;text-decoration:none;border-radius:2px;background-clip:padding-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none
 }
.fs-label-wrap .fs-label{height:100%;font-size:.94rem;}

.fs-dropdown{height:auto; max-height:8rem; width:auto; max-width: 18rem !important; width:-moz-available; width:-webkit-fill-available; z-index: 99; overflow-x: hidden;}
.fs-dropdown .fs-options{max-height: 8rem; width:auto; max-width: 18rem !important; width:-moz-available; width:-webkit-fill-available; overflow: visible;}
 */
/*
.fs-dropdown{height:auto; max-height:8rem; width:auto; max-width: 18rem !important; width:-moz-available; width:-webkit-fill-available; z-index: 99; overflow-x: hidden;}
.fs-dropdown .fs-options{max-height: 8rem; width:auto; max-width: 18rem !important; width:-moz-available; width:-webkit-fill-available; overflow: visible;}
*/

/* 
.fs-label-wrap{
	display:block;height:calc(2rem + 1px);padding:0;overflow:hidden;position:relative;border:1px solid transparent;white-space:nowrap;line-height:18px;
	color:#0c0c0c;text-decoration:none;border-radius:2px;background-clip:padding-box;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}
.fs-label-wrap .fs-label{padding:9px 22px 6px 0;height:100%;font-size:.94rem}
.fs-dropdown{height:auto;max-height:12rem;width:-moz-available;width:-webkit-fill-available;z-index: 99}
.fs-dropdown .fs-options{max-height: 5rem;overflow-y: auto !important;}
 */

/*------------------------------------------------------------------
[64. font colour for hyperlinks]
*/
.hyper-Link-font-color{/*color:#3A84F3;*/ color:#0000ff !important; cursor:pointer !important; font-size:0.9rem; }
.active-hyper-Link-font-color, .active-hyper-Link-font-color a, .active-hyper-Link-font-color:hover{
	color:#FF00FF !important; cursor:pointer !important; 
}

/*------------------------------------------------------------------
[65. page loader]
*/
.loader-wrapper{position:fixed;top:0;left:0;width:100%;height:100%;z-index:1000; display:flex; justify-content: center; align-items: center;}
.loader-wrapper .loader-section{
	position:fixed;top:0;width:51%;height:100%;background:#eceff1;z-index:1000;-webkit-transform:translateX(0);-ms-transform:translateX(0);
	transform:translateX(0)
}
.loader-wrapper .loader-section.section-left{left:0}
.loader-wrapper .loader-section.section-right{right:0}
.loader{
	display:block;/* position:relative; */ position:fixed; left:50%;top:50%;width:150px;height:150px;margin:-75px 0 0 -75px;border-radius:50%;
	border:3px solid transparent; border-top-color:#3498db;-webkit-animation:spin 2s linear infinite;animation:spin 2s linear infinite;z-index:1001;
}
.loader.small{width:100px;height:100px;margin:-50px 0 0 -50px}
.loader.x-small{width:50px;height:50px;margin:-25px 0 0 -25px}
.loader:before{
	content:"";position:absolute;top:5px;left:5px;right:5px;bottom:5px;border-radius:50%;border:3px solid transparent;border-top-color:#e74c3c;
	-webkit-animation:spin 3s linear infinite;animation:spin 3s linear infinite;
}
.loader:after{
	content:"";position:absolute;top:15px;left:15px;right:15px;bottom:15px;border-radius:50%;border:3px solid transparent;border-top-color:#f9c922;
	-webkit-animation:spin 1.5s linear infinite;animation:spin 1.5s linear infinite;
}
.loader-logo{display:block;position:absolute;left:48%;top:46%;background:url(../images/user-bg-2.jpg) no-repeat center center;z-index:1001}

@-webkit-keyframes spin {
0%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}
100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}
}
@keyframes spin {
0%{-webkit-transform:rotate(0deg);-ms-transform:rotate(0deg);transform:rotate(0deg)}
100%{-webkit-transform:rotate(360deg);-ms-transform:rotate(360deg);transform:rotate(360deg)}
}
.loader-wrapper.loaded{
	visibility:hidden;-webkit-transform:translateY(-100%);-ms-transform:translateY(-100%);transform:translateY(-100%);
	-webkit-transition:all .3s 1s ease-out;transition:all .3s 1s ease-out;
}
.loader-wrapper.loaded .loader-section.section-left{
	-webkit-transform:translateX(-100%);-ms-transform:translateX(-100%);transform:translateX(-100%);
	-webkit-transition:all .7s .3s cubic-bezier(0.645,0.045,0.355,1);transition:all .7s .3s cubic-bezier(0.645,0.045,0.355,1)
}
.loader-wrapper.loaded .loader-section.section-right{
	-webkit-transform:translateX(100%);-ms-transform:translateX(100%);transform:translateX(100%);
	-webkit-transition:all .7s .3s cubic-bezier(0.645,0.045,0.355,1);transition:all .7s .3s cubic-bezier(0.645,0.045,0.355,1)
}
.loader-wrapper.loaded .loader{opacity:0;-webkit-transition:all .3s ease-out;transition:all .3s ease-out}

.preloader-overlay{background-color:#fff;height:100%;position:absolute;opacity:.8;text-align:center;top:0;width:100%;z-index:9999;display:none}
.preloader-overlay.active{display:block; left: 0;}
.preloader-holder{display:none;height:100%;margin:auto;margin-top:5%;position:absolute;text-align:center;width:100%;z-index:99999;top:0}
.preloader-holder.active{display:block}


/*------------------------------------------------------------------
[66. tree]
*/
/* 
.tree {height: 350px; width: 100%;}
.fancytree-container {
	font-size: 13pt ! important;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" ! important;
}
span.fancytree-node.fancytree-selected {
	font-size: 13pt ! important;font-style:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif,"Apple Color Emoji","Segoe UI Emoji","Segoe UI Symbol","Noto Color Emoji" ! important;
}
.fancytree-title{margin: -6px 0 0 0;}
*/

.shrink-box a {color: #007bff!important;}
.treeIcon{width: 0.6rem; font-size: 0.75rem;}
 
.analytics-tree{height: 75vh !important;}
.analytics-tree-menu-1{height: 59vh !important;}
.analytics-tree-menu-2{height: 50vh !important;}

.modal-body .analytics-tree{height:72vh !important;}
.modal-body .analytics-tree-menu-1{height: 61vh !important;}
.modal-body .org-tree.analytics-tree{height: inherit !important;}

.graphView{height: 79vh !important;}
.graphView-menu-1{height: 73vh !important;}
.graphView-menu-2{height: 62vh !important;}

/* for Accordion menu for expand /collapse */ 
#leftBox .box .body .box-body-toolbar{position: absolute;top: 1%;right: 10%;transform: scale(2,1.25);display: block;}
#leftBox.col-1 .box .body .box-body-toolbar{top: 1%;right: 30%;}
#leftBox.col-4 .box .body .box-body-toolbar{top: 1%;right: 7%;}
#leftBox.col-12 .box .body .box-body-toolbar{top: 1%;right: 8%;}
#leftBox.col-12 .box .body .box-body-toolbar.graphLOV{top: 1%;right: 11%;}

.treeGraphView, .treeGraphViewLOV { font-size: 0.55rem;}
.treeGraphView > select, .treeGraphViewLOV > select{ width: 4rem; height: 1.15rem;}
.treeGraphView > select > option, .treeGraphViewLOV > select > option{ font-size: 0.75rem;}

.treeNode { cursor: pointer; }
.treeNode circle { fill: #fff; stroke: steelblue; stroke-width: 1.5px; }
.treeNode text { font-weight: normal; }
.treeLink { fill: none; stroke: #ccc; stroke-width: 1.5px; }

/*------------------------------------------------------------------
[67. decreaseFont]
*/
.decreaseFont {font-size: 0.85rem ! important;}

/*------------------------------------------------------------------
[68. Calendar]
*/
.leave-event{background-color: #efca5c;}
.holiday-event{background-color: orange;}
.weekOff-event{background-color: #78eae3;}
.multiple-event{background-image: -webkit-linear-gradient(30deg, orange 50%, #78eae3 50%);}
.event3{background-color:#FF0;}
.event4{background-color:#90EE90;}

/*------------------------------------------------------------------
[69. Common Help]
*/
.has-common-help-popOver { border-right: none !important; }
.common-help-link {
	display: grid; justify-content: right; padding: .35rem .75rem 0rem 0rem !important; background: #ffffff; color:#3A84F3;
	height: 2.5rem !important; border: 1px solid rgba(208 210 210); border-left: none !important; border-radius: 0 8px 8px 0px;
}
.wizard-help-link { font-size: 25px; border: none; }

.scopeFlowHelp .input-group{background-color: lavender;}
.scopeFlowHelp .description{overflow: auto; height: 59.75vh !important; font-size: 18px;}
.scopeFlowHelp .preCondition, .scopeFlowHelp .postCondition{overflow: auto; height: 25.75vh !important;}

.scopeFlowHelp table {border: black solid 1px !important;}
.scopeFlowHelp table tbody tr{border-bottom: black solid 1px !important;}

/*------------------------------------------------------------------
[70. Grid Search Icon]
*/
.searchiconstyle {/* font-size: 20px; */ font-size:0.9rem; padding-left: 6px;padding-top: 9px; color: #3A84F3 !important;}

/*------------------------------------------------------------------
[71. Wizard UI]
*/

 .f1{padding:25px;background:#fff;border-radius:4px}
.f1 h3{margin:0 0 5px;text-transform:uppercase}

.f1-steps{display:flex;justify-content:space-between;align-items:center;position:relative;margin:10px 0 10px 5px}
.f1-progress{position:absolute;top:20px;left:80px;width:100%;height:1px;background:#ddd}
.f1-progress-line{position:absolute;top:0;left:0;height:1px;background:#f35b3f}

.f1-step{flex:1 1 auto;display:flex;justify-content:center;align-items:center;position:relative;margin:0 5px}
.f1-step a{padding-left:0!important}
.f1-step-icon{
	padding:8px 12px;border-radius:20px;font-weight:400;font-size:0.9rem;color:#1e293b;white-space:nowrap;display:flex;background:#DCDCDC;
	align-items:center;justify-content:center;
}

.f1-step.activated .f1-step-icon{background:#a9ddc0;color:#1e293b}
.f1-step.active .f1-step-icon{width:48px;height:48px;margin-top:0;background:#f35b3f;font-size:22px;line-height:48px}

.f1-step p{color:#000;text-align:center;margin-bottom:10px!important;font-size:14px}
.f1-step.current .f1-step-icon{background:#dcbb51;color:#1e293b}
.f1-step+.f1-step::before{content:">";font-weight:700;color:#333;display:flex;align-items:center}
 






/*------------------------------------------------------------------
[72. Document Upload UI]
*/
.upload-container { position: relative; margin: -1rem 1rem 0rem 1rem; }
.upload-container input {
	border: 1px solid #92b0b3; background: #f1f1f1; outline: 2px dashed #92b0b3; outline-offset: -10px; 
	padding: 100px 0px 100px 325px;  text-align: center !important; width: 100%;
}
.upload-container input:hover { background: #ddd; }
.upload-container:before { position: relative; top: 175px; left: 40%; content: " (or) Drag and Drop files here."; color: #3f8188; font-weight: lighter; }

/*------------------------------------------------------------------
[73.Old Panes UI]
*/

/* Pane card with Multiple Data layout
 */
 .pane-card{
	display:flex; flex-direction: column; border-left:4px solid #dbeafe; background:#ffffff; border-radius:.75rem; padding: 0 0 0.75rem; 
	height: 12.5rem; box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);  transition: all 0.25s ease; 
}
.pane-card:hover{  background: #f0f9ff; transform: scale(1.03); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);  border-left: 4px solid #3b82f6;  }
.pane-header{ display:flex; align-items:center; justify-content:left; gap:.5rem; margin:0.5rem 0rem 0.5rem 0.6rem; }
.pane-header img{ width:28px; height:28px; }
.pane-header span{ font-weight:600; font-size:1.2rem; color:#1e293b; }
.pane-status{ display:grid; gap:.25rem; margin: auto 0 auto 0; }
.status-item{ display:flex; align-items:center; justify-content:space-between; padding:6px 10px; font-size:0.9rem; border-radius:8px; font-weight:500; }
.status-item a { font-size: 1.1rem; line-height: 1.1; }

/* For Attaching Arrow with the Panes
 */.pane-card-wrapper { display: flex; align-items: center; justify-content: center; }
.pane-card-wrapper img{ height: 25px; width: 25px; margin-left: 0.25rem; }
.pane-card-wrapper img.upDownArrow { position: relative; right: 10%; height: 25px; width: 25px; }
.pane-card-wrapper span.no-image{ margin-left: 1.5rem; }

/* Pane card with Single Data layout
 */.pane-card-single {
	border-left:4px solid #dbeafe; background:#ffffff; border-radius:.75rem; padding: 0 0 0.75rem; height: 12.5rem;
  	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);  transition: all 0.25s ease;
}
.pane-card-single:hover{ background: #f0f9ff; transform: scale(1.03); box-shadow: 0 6px 18px rgba(0, 0, 0, 0.1);  border-left: 4px solid #3b82f6; }
.pane-header-single{ display:flex; align-items:center; justify-content:left; gap:0.25rem; margin: 0.5rem 0rem 0rem 0.5rem; }
.pane-box-center-text{ font-weight:600; font-size:1rem;white-space: nowrap; overflow: hidden;text-overflow: ellipsis; color:#333; }
.pane-main-center{ display:flex;flex-direction:column;align-items:center;justify-content:center;flex-grow:1; margin:10%; }
.pane-circle{ 
    padding: 1rem; min-width: 55px; width: auto; height:55px; font-size:1.5rem; font-weight:600; border-radius:25%; background-color:#e0f0ff; 
    color:#0000ff; display:flex; align-items:center; justify-content:center; text-decoration:none;
}
.pane-circle-label{ font-size:.95rem; margin-top:.5rem; color:#6c757d; }


.pane-tile-arrow-wrapper { position: relative; }

.pane-tile-arrow-wrapper .pane-tile { margin: 1.25rem; }

.pane-count-multiple {
   /*  display: flex; align-items: center; justify-content: space-between; padding: 0px 0px; font-size:0.9rem; border-radius: 8px;
    font-weight: 500;  */
/*       display: flex;
 */    align-items: center;
    justify-content: flex-start;   
    gap: 20px;                    

    padding: 0;
    font-size: 0.9rem;
    font-weight: 500;
    border-radius: 8px; 
    
}
.pane-count-multiple span{ margin-right: 0.5rem; }

.arrow-right-icon { position: absolute; top: 50%; right: -10px; transform: translateY(-50%);z-index: 1; }
.arrow-down-icon { position: absolute; bottom: -10px; left: 50%; transform: translateX(-50%); z-index: 1; }
.arrow-right-icon img, .arrow-down-icon img{ width: 20px; height: 20px; }

/* Pane card with NO Data layout
 */
.pane-noBox {
	display: flex;
	align-items: center;
	justify-content: center;
	/* Dynamic sizing */
	flex: 1 1 11rem;
	/* Clean UI */
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	height: 6.5rem;
	margin: 8px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.06);
	cursor: pointer;
	transition: transform 0.25s ease, box-shadow 0.25s ease, background
		0.25s ease;
}

.pane-noBox:hover{ background: #ffffff;
  transform: translateY(-4px);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12); }
.pane-noBox-text, .pane-noBox-wrapper{ text-align:center; width: 100%; }
.pane-noBox-image{ padding-bottom:.25rem; }
.pane-noBox-image img{ width:34px; height:34px; transition:transform .2s; }
.pane-noBox:hover .pane-noBox-image img{ transform:scale(1.1); }
.pane-noBox-text{ font-family:'Inter', sans-serif;white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#000!important; font-size:1.1rem; font-weight:500; }

/* For Banner Boxes
 */.banner-box { 
	border-left:4px solid #dbeafe; border-radius:.75rem; height:14.5rem; margin:.25rem; background:#fff; box-shadow:0 2px 8px rgba(0,0,0,.03);
	transition:.25s; cursor:pointer; display:flex; align-items:center; justify-content:center;
}
.banner-box:hover{ background:#f0f9ff; transform:scale(1.03); box-shadow:0 6px 18px rgba(0,0,0,.1); border-left-color:#3b82f6; }
.banner-box-text, .banner-box-wrapper { /* text-align:center; */ }
.banner-box-image { padding-bottom:.25rem; }
.banner-box-image img { width:50px; height:50px; transition:transform .2s; }
.banner-box:hover .banner-box-image img{ transform:scale(1.1); }
.banner-box-text { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; color:#000!important; font-size:1rem; font-weight:500; }
.banner-box-subtext { font-size: 1rem; }

.banner-box-center-text { 
    color:#000000 !important; cursor:pointer !important; font-size: 1.2rem; display: flex; align-items: center; justify-content: center; height: 2rem; 
}
.banner-box-number {display:block; font-size:0.9rem; text-align: left; padding-left: 1rem;}
.banner-box-number-multiple {display:block; font-size: 1.3rem; text-align: left; padding-left: 0rem; }
.pane-tile {
	/* display: flex; */
	flex-direction: column;
	flex: 1 1 11rem; 
	background: #ffffff;
	border: 1px solid #e5e7eb;
	border-radius: 16px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08);
	padding: 17px;
	margin: 6px;
	position: relative;
	cursor: pointer;
	font-family: 'Inter', sans-serif;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color
		0.25s ease;
}

/* Hover effect */
.pane-tile:hover {
	background: #ffffff;
	transform: translateY(-4px);
	box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
	z-index: 1;
}

/* Glow layer */
.pane-tile::before {
	content: "";
	position: absolute;
	inset: 0;
	border-radius: 16px;
	border: 1px solid transparent;
	transition: all 0.25s ease;
	pointer-events: none;
}

.pane-tile:hover::before {
	border-color: #ffffff;
	box-shadow: 0 0 0 2px rgba(37, 99, 235, 0.08);
}

/* ================================
    ICON AREA
   ================================ */
.pane-icon {
	 display: flex;
	align-items: center;
	justify-content: space-between;
	 margin-bottom: 5px; 
}

.pane-icon img {
	width: 33px;
	height: 33px;
	transition: transform .2s;
}

/* ================================
    TITLE AREA
   ================================ */
.pane-title {
	color: #000;
	font-size: 1.1rem;
	font-weight: 500;
	word-wrap: break-word;
}

/* ================================
    COUNT  PLUS BUTTON
   ================================ */
.pane-count {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.pane-count  a {
	  font-size: 1.6rem;
    font-weight: 500;
    color: #000;
    text-decoration: none;
}

/* ================================
    PLUS (+) BUTTON
   ================================ */
.plus-icon  {
	position: absolute;
	top: 19px;
	right: 18px;
	border: 1px solid #d1d5db;
	color: #2563eb;
	width: 34px;
	height: 34px;
	border-radius: 8px;
	background: #f9fafb;
	align-items: center;
	text-align: center;
	line-height: 34px;
	font-size: 20px;
	font-weight: bold;
	} 

.plus-icon:hover {
	background: linear-gradient(to right, #1565C0, #7E57C2);
	color: #fff;
	box-shadow: 0 2px 10px rgba(21, 101, 192, 0.3);
	transform: scale(1.1);
}
/* row layout */
.pane-row {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: 0.2rem;
}

/* +12.5% */
.growth {
    font-size: 14px;
    font-weight: 500;
    color: #16a34a;
}


/* Total Items */
.label {
    font-size: 15px;
    color: #626262;
}
	/* vs last month */
.gray-text {
    font-size: 14px;
    color: #9b9b9b;
}	
#res_org-subtabs .pane-tile {padding:18px 18px 45px 18px;}
/* #financeInvoicepanes_tabs .pane-tile {padding:18px 18px 45px 18px;} */
#includePages .pane-tile {padding:18px 18px 45px 18px;}
#milestonePane .pane-tile {padding:18px 18px 45px 18px;}
#oppSubTabs .pane-tile {padding:18px 18px 45px 18px;}
/*------------------------------------------------------------------
[74. Sweet alert UI]
*/
/* 
.swal-icon { width: 60px !important; height: 60px !important;}
.swal-icon--warning__body { height: 30px !important; }
.swal-icon--error__line { height: 30px !important; top: 27px !important;}
 */
.swal-title { font-size: 1.5rem !important; }
.swal-text { font-size:0.9rem !important; text-align: center !important; }
.swal-button { border-radius : 15px !important; }

/*------------------------------------------------------------------
[75. Chat Bot UI]
*/
.chatbot-wrapper { position: fixed; bottom: 20px; right: 20px; z-index: 1000; }
.chat-toggle {
  width: 60px; height: 60px; background-color: #007bff; color: white; font-size: 30px; border-radius: 50%; display: flex; align-items: center;
  justify-content: center; cursor: pointer; box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
}
.chat-container {
  width: 463px; height: 401px; background: #fff; border-radius: 10px; box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15); display: flex; flex-direction: column;
  overflow: hidden; position: absolute; bottom: 80px; right: 0; opacity: 0; pointer-events: none; transform: scale(0.8); transition: all 0.3s ease-in-out;
}
.chat-container.active { opacity: 1; pointer-events: auto; transform: scale(1); }

.chat-box { flex: 1;  padding: 15px; overflow-y: auto; display: flex; flex-direction: column; gap: 10px; }
.message { max-width: 80%; padding: 10px 15px; border-radius: 20px; font-size: 15px; line-height: 1.4; word-wrap: break-word; }
.user { align-self: flex-end; background-color: #e6f0ff; color: #007bff; border-bottom-right-radius: 0; }
.bot { align-self: flex-start; background-color: #f1f1f1; color: #333; border-bottom-left-radius: 0; margin-bottom: 0px; }
.chatbot-wrapper .input-container { display: flex; border-top: 1px solid #ddd; }
.chatbot-wrapper input[type="text"] { flex: 1; padding: 12px; border: none; font-size: 16px; outline: none; }
.chatbot-wrapper button { padding: 12px 20px; background: #007bff; color: white; border: none; cursor: pointer; font-weight: bold; }
.chatbot-wrapper button:hover { background: #0056b3; }

.chat-header { 
	background-color: #4b6cb7; color: white; padding: 10px; font-weight: bold; font-size: 1.6rem; text-align: center; border-top-left-radius: 10px; 
	border-top-right-radius: 10px;
}
.typing-indicator-bubble {
	display: flex; align-items: center; padding: 10px 16px; margin: 10px; background: #e0e0e0; border-radius: 20px; width: fit-content;
 	max-width: 60%; animation: fadeIn 0.3s ease-in-out;
}
.typing-indicator-bubble span {
	width: 8px; height: 8px; margin: 0 2px; background-color: #888; border-radius: 50%; display: inline-block; animation: blink 1.2s infinite;
}
.typing-indicator-bubble span:nth-child(2) { animation-delay: 0.2s; }
.typing-indicator-bubble span:nth-child(3) { animation-delay: 0.4s; }

@keyframes blink {
  0%, 80%, 100% {
    transform: scale(0.6);
    opacity: 0.3;
  }
  40% {
    transform: scale(1);
    opacity: 1;
  }
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(5px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}


/* Mic button styling */
#mic-btn {
  position: relative;
  width: 48px;
  height: 48px;
  border: none;
  border-radius: 50%;
  background-color: #007BFF; /* Blue when idle */
  color: white;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: background-color 0.3s ease;
  cursor: pointer;
  margin-left: 8px;
}

#mic-btn.recording {
  background-color: #dc3545; /* Red when recording */
}

/* Microphone icon */
.mic-icon i {
  font-size: 20px;
  z-index: 2;
}

/* Pulsing ring animation */
.pulse-ring {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 70px;
  height: 70px;
  transform: translate(-50%, -50%);
  border-radius: 50%;
  background: rgba(220, 53, 69, 0.4); /* Light red */
  z-index: 1;
  opacity: 0;
  pointer-events: none;
}

#mic-btn.recording .pulse-ring {
  animation: pulse 1.5s infinite;
  opacity: 1;
}

@keyframes pulse {
  0% {
    transform: translate(-50%, -50%) scale(0.9);
    opacity: 0.6;
  }
  70% {
    transform: translate(-50%, -50%) scale(1.5);
    opacity: 0;
  }
  100% {
    transform: translate(-50%, -50%) scale(0.9);
    opacity: 0;
  }
}

.read-aloud-btn {
  color: black !important;  /* This sets the icon color to black */
  background-color: #f1f1f1 !important;
  border: none;
  font-size: 16px;
  padding: 6px 8px;
  border-radius: 6px;
  cursor: pointer;
  align-self: flex-start;
  transition: background-color 0.2s ease;
  box-shadow: none;
  font-size: 12px; /* smaller icon size */
  margin-top: 0 !important;
}

.read-aloud-btn:hover,
.read-aloud-btn:focus {
  background-color: #dcdcdc !important;  /* slightly darker gray on hover */
  outline: none;
}


/*------------------------------------------------------------------
[76. checkbox [input type ='checkbox']]
*/
.readonly-checkbox {
    pointer-events: none; /* disables clicking */
    accent-color: #007bff; /* optional: keeps checkbox bright (Bootstrap blue) */
    opacity: 1; /* prevent dimming */
    cursor: default;
}
/*------------------------------------------------------------------
[77. Data Amount change into the panes Khushboo Bharti]
*/
.amount-summary-wrapper { width:100%; display:flex; justify-content:flex-start; margin:8px 0; padding-left:12px; }
.amount-panes { display:flex; align-items:center; justify-content:flex-start; gap:10px; width:100%; flex-wrap:wrap; }
.amount-pane { background:#f0f9ff; border:1.5px solid #93c5fd; border-left:4px solid #3b82f6; border-radius:10px; padding:6px 12px; min-width:200px; max-width:220px; text-align:left; box-shadow:0 2px 6px rgba(0,0,0,0.08); transition:background .25s ease, transform .25s ease, box-shadow .25s ease, border .25s ease; }
.amount-pane:hover { transform:scale(1.03); box-shadow:0 6px 18px rgba(0,0,0,0.12); background:#e0f2fe; border-color:#3b82f6; }
.amount-pane-label { font-size:12px; color:#1e40af; display:block; margin-bottom:2px; white-space:nowrap; }
.amount-pane-value { font-size:17px; font-weight:600; color:#0b3c6f; line-height:1.2; }

/* .amount-summary-wrapper { width:100%; display:flex; justify-content:flex-start; margin:8px 0; padding-left:12px; }
.amount-panes { display:flex; align-items:center; justify-content:flex-start; gap:10px; width:100%; flex-wrap:wrap; }
.amount-pane { background:#ffffff; border:1px solid #e1e1e1; border-radius:10px; padding:6px 12px; min-width:200px; max-width:220px; text-align:left; box-shadow:0 2px 6px rgba(0,0,0,0.08); transition:all 0.25s ease; }
.amount-pane:hover { transform:translateY(-1px); box-shadow:0 4px 10px rgba(0,0,0,0.12); }
.amount-pane-label { font-size:12px; color:#666; display:block; margin-bottom:2px; white-space:nowrap; }
.amount-pane-value { font-size:17px; font-weight:600; color:#111; line-height:1.2; } */