::-webkit-scrollbar{width:7px;height:7px;background:#f1f5f9;border-radius:0px;}
::-webkit-scrollbar-track{border-radius:0px}
::-webkit-scrollbar-thumb{
	border-radius:0px;
	background-color: #1a202e;
	transition: 350ms;
}
::-webkit-scrollbar-thumb:hover{background-color: #8da2fb;}
/* html,body,.sidebar{scrollbar-color: #bababa transparent; scrollbar-width: thin;} */
body{
	background-color: #f1f5f9;
}
.display-b{display: block!important;}
.display-ib{display: inline-block!important;}
.l{box-shadow: 0 0 0 1px red}


/*Start | Header Style*/
.top-header{
	background: #fff;
	box-shadow: 0 1px 3px 0 rgba(0,0,0,.1),0 1px 2px 0 rgba(0,0,0,.06);
	position: relative;
	display: flex;
	flex: 1 1 auto;
	align-items: center;
	justify-content: space-between;
	width: 100%;
	height: 64px;
	max-height: 64px;
	min-height: 64px;
	padding: 0 24px 0 94px;
	z-index: 49;
	transition: 350ms;
}
.header-search{
	position: absolute;
	width: 100%;
	height: 100%;
	left: 0;
	top: -80px;
	opacity: 0;
	padding: 0 24px 0 94px;
	background: #fff;
	z-index: 10;
	transition: 350ms;
}
.header-search.active{
	opacity: 1;
	top: 0;
}
.header-search input{
	width: 100%;
	height: 64px;
	border: 0;
	outline: none;
	font-size: 18px;
	padding-right: 40px;
	letter-spacing: 0.75px;
}
.header-search button{
	width: 40px;
	height: 40px;
	font-size: 20px;
	color: rgba(240,82,82,0.5);
	background: #fff;
	z-index: 2;
	top: 50%;
	position: absolute;
	margin-top: -20px;
	right: 24px;
	border: none;
	outline: none;
}
.header-search button:hover{
	color: rgba(240,82,82,0.9);
}


.header-icon{
	display: inline-block;
	text-align: center;
	width: 44px;
	height: 44px;
	min-width: 44px;
	min-height: 44px;
	font-size: 19px;
	line-height: 44px;
	color: #64748b;
	border-radius: 50%;
	cursor: pointer;
	position: relative;
	text-decoration: none!important;
	vertical-align: middle;
}
.header-icon:before{
	content: '';
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	position: absolute;
	transform: scale(0);
	border-radius: 50%;
	transition: 350ms;
	z-index: -1;
	background-color:  rgba(100,116,139,0.20); 
}
.header-icon:hover:before{
	transform: scale(1);
}
.header-userimg{
	width: 32px;
	height: 32px;
	display: block;
	margin: 6px 0 0 6px;
	border-radius: 50%;
	position: relative;
	line-height: 0;
}
.header-userimg:before{
	content: '';
	position: absolute;
	display: block;
	width: 11px;
	height: 11px;
	right: -2px;
	bottom: -2px;
	background: #0e9f6e;
	border-radius: 20px;
	border: 2px solid #fff;
	z-index: 2;
}
.header-userimg img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	object-position: center;
	position: absolute;
	left: 0;
	left: 0;
	z-index: 1;
	border-radius: 50%;
}

.box-indicator{
	position: absolute;
	min-width: 20px;
	height: 20px;
	background: rgba(240,82,82,0.9);
	top: 0px;
	right: 2px;
	font-size: 12px;
	line-height: 20px;
	text-align: center;	
	color: #fff;
	border-radius: 50%;
}
.clickto-fullmenu{transition: 350ms;}
.full-menu .top-header,
.full-menu .header-search{
	padding: 0 24px 0 294px;
}
.full-menu .clickto-fullmenu{
	transform: rotate(-180deg);
	transform:none;
}
.full-hidemenu .top-header,
.full-hidemenu .header-search{
	padding: 0 24px 0 24px;
}
.clickto-fullfixedmenu{
	background-color:  rgba(100,116,139,0.10); 
}
.full-hidemenu .clickto-fullmenu{
	visibility: hidden;
	opacity: 0;
}
/*End | Header Style*/




/*Start | Sidebar Style*/
.sidebar{
	color: #fff;
	background-color: #1a202e;
	width: 270px;
	height: 100%;
	position: fixed;
	top: 0;
	left: 0;
	/* overflow: hidden;
	overflow-y: auto; */
	z-index: 100;
	transition: 350ms;
}
.sidebar .tooltip {
	position: fixed;
}
.sidebar-listing::-webkit-scrollbar{width:0px;height:0px;background:transparent;border-radius:0px;}
.sidebar-listing:hover::-webkit-scrollbar{width:7px;height:7px;}
.sidebar-listing::-webkit-scrollbar-track{border-radius:0px;background-color: transparent;}
.sidebar-listing::-webkit-scrollbar-thumb{
	visibility: hidden; 
	border-radius:0px;
	background-color:#000;
	box-shadow: inset 0 0 0 1px #555;
	transition: 500ms;
}
.sidebar-listing:hover::-webkit-scrollbar-thumb{
	visibility: visible;
}
.sidebar-listing::-webkit-scrollbar-thumb:hover{
	background-color:#8da2fb;
	box-shadow: inset 0 0 0 1px #8da2fb;
	transform: scale(1.2);
}

.sidebar-listing{
	list-style: none;
	padding: 0;
	margin: 0;
	overflow: hidden;
	height: calc(100vh - 120px);
}
.sidebar-listing:hover{
	overflow-y: auto;

}
.logo{
	display: flex;
	align-items: center;
	justify-content: center;
	width: 260px;
	height: 100px;
	min-height: 100px;
	max-height: 100px;
}
.logo img{
	height: 40%;
}

.sidebar-link{
  position: relative;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  padding: 12px 24px;
  font-size: 13px;
  font-weight: 500;
  line-height: 20px;
  text-decoration: none;
  color: #cfd8e3;
  transition: background-color 375ms cubic-bezier(.25,.8,.25,1);
  text-decoration: none;
  transition: 350ms;
}
.sidebar-morelink:before{
	content: '\f054';
	position: absolute;
	font: normal normal normal 14px/1 FontAwesome;
	color: rgba(255,255,255,.70);
	right: 10px;
	top: 50%;
	margin-top: -6px;
	font-size: 12px;
	transition: 350ms;
	opacity: 1;
}
.sidebar-morelink[aria-expanded="true"]:before{
	transform: rotate(90deg);
}

.sidebar-link.active, .sidebar-link:hover, .sidebar-morelink[aria-expanded="true"]{
	color: #fff;
  background-color: rgba(0,0,0,.25);
  text-decoration: none;
}
.sidebar-link:focus{
	color: #fff;
	text-decoration: none;
}


.sidebar-link i.fa{
	width: 24px;
	min-width: 24px;
	height: 24px;
	font-size: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	text-align: center;
	margin-right: 15px;
	/*box-shadow: 0 0 0 1px red;*/
}
.navigation-itemtitle{
	padding: 15px 24px 12px 24px;
	position: relative;
}
.navigation-itemtitle:before{
	content: '';
	position: absolute;
	width: 24px;
	height: 2px;
	background: #64748b;
	opacity: 0;
	top: 40px;
	left: 24px;
	transition: 350ms;
}
.main-itemtitle{
	font-size: 13px;
	/*color: #8da2fb;*/
	color:#c81e1e!important;
	font-weight: 600;
	text-transform: uppercase;
	white-space: nowrap;
	transition: 350ms;
}
.menu-text .main-itemtitle {
	font-size: 10px;
    color: #FFFF00 !important;
    top: -0.7rem;
 }
.sub-itemtitle{
	color: #64748b;
	font-size: 12px;
	white-space: nowrap;
	transition: 350ms;
}
.sidebar .menu-text{
	white-space: nowrap;
	transition: 350ms;
}

/* .sidebar .collapse{
	display: none;
}
.sidebar-mini.active .collapse.in{
	display: block;
} */
.cross-mobilemenu{
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: 60;
	display: none;
	padding: 15px;
	text-align: right;
	background: rgba(255,255,255,0.75);	
}
.cross-mobilemenu .fa{
	font-size: 32px;
	color: rgba(240,82,82,1);
}




.sidebar-mini{
	width: 70px;
}
.sidebar-mini .sidebar-listing:hover::-webkit-scrollbar{width:0px;height:0px;}
.sidebar-mini .logo{
	width: 100%;
}
.sidebar-mini .navigation-itemtitle:before{opacity: 0.7}
.sidebar-mini .main-itemtitle,
.sidebar-mini .sub-itemtitle,
.sidebar-mini .menu-text{
	opacity: 0;
}
/*After adding .active class*/
.sidebar.active .sidebar-listing::-webkit-scrollbar{width:7px;height:7px;}

.full-menu .sidebar .sidebar-listing::-webkit-scrollbar{width:7px;height:7px;}

.full-menu .sidebar-mini,
.sidebar-mini.active{
	width: 270px;
}
.full-menu .sidebar-mini .navigation-itemtitle:before,
.sidebar-mini.active .navigation-itemtitle:before{
	opacity: 0
}
.full-menu .sidebar-mini .main-itemtitle,
.full-menu .sidebar-mini .sub-itemtitle,
.full-menu .sidebar-mini .menu-text,
.sidebar-mini.active .main-itemtitle,
.sidebar-mini.active .sub-itemtitle,
.sidebar-mini.active .menu-text,
.sidebar-mini.active .sidebar-morelink:before{
	opacity: 1;
}	


.full-hidemenu .sidebar-mini{
	left: -270px;
}
.sidebar .sidebar_new_tag{
    border-radius: 50px;
    border: 1px solid #fff;
    background: #3B82F6;
    color:  #FFF;
    font-size: 10px !important;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 2px 8px;
    align-self: center;
}
.sidebar .sidebar_trial_tag{
	border-radius: 500px;
	border: 1px solid #fff;
	background:  #F77172;
	font-size: 10px !important;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 2px 8px;
	color: #fff;
}
.sidebar .sidebar_pro_tag{
	border-radius: 500px;
	border: 1px solid #fff;
	background:  #5ED5A8;
	font-size: 10px !important;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    padding: 2px 8px;
	color: #fff;
}
/*End | Sidebar Style*/





/*Start | Main Wrapper Style*/
#wrapper, .wrapper-box{
	/*padding-top: 20px;*/
	padding-left: 80px;
	padding-right: 10px;
	padding-bottom: 20px;
	box-sizing: border-box;
	transition: 350ms;
}
.full-menu #wrapper, .full-menu .wrapper-box{
	padding-left: 300px;
}
.full-hidemenu #wrapper, .full-hidemenu .wrapper-box{
	padding-left: 10px;
}
/*End | Main Wrapper Style*/

@media(max-width: 720px){
	.clickto-fullmenu, .clickto-share, .clickto-todo{ /* removed .clickto-timesheet */
		display: none;
	}

	.top-header,
	.full-menu .top-header,
	.full-menu .header-search{
		padding: 0 24px 0 24px;
	}
	.full-hidemenu .top-header,
	.full-hidemenu .header-search{
		padding: 0 24px 0 24px;
	}

	.full-menu .sidebar-mini,
	.sidebar-mini.active,
	.sidebar-mini{
		width: 270px;
	}	

	.sidebar-mini .main-itemtitle,
	.sidebar-mini .sub-itemtitle,
	.sidebar-mini .menu-text,
	.sidebar-morelink:before,
	.sidebar-mini.active .sidebar-morelink:before{
		opacity: 1;
	}

	#wrapper, .wrapper-box,
	.full-menu #wrapper,
	.full-menu .wrapper-box,
	.full-hidemenu #wrapper,
	.full-hidemenu .wrapper-box{
		padding-left: 10px;
	}

	.sidebar{
		left: -270px;
	}

	.full-hidemenu .sidebar{
		left: 0px;
	}
	.full-hidemenu .cross-mobilemenu{
		display: block;
	}
}

.logo img:nth-child(2),
.sidebar-mini.active .logo img:nth-child(1),
.full-menu .sidebar-mini .logo img:nth-child(1)
{display: none;}

.sidebar-mini.active .logo img:nth-child(2),
.full-menu .sidebar-mini .logo img:nth-child(2)
{display: inline-block;}