 
/** Side Menu **/
 
/* ScrolBar  */
.scrollbar
{

height: 90%;
width: 100%;
overflow-y: hidden;
overflow-x: hidden;
}

.scrollbar:hover
{

height: 90%;
width: 100%;
overflow-y: scroll;
overflow-x: hidden;
}

/* Scrollbar Style */ 


#style-1::-webkit-scrollbar-track
{
border-radius: 2px;
}

#style-1::-webkit-scrollbar
{
width: 5px;
background-color: #F7F7F7;
}

#style-1::-webkit-scrollbar-thumb
{
border-radius: 10px;
-webkit-box-shadow: inset 0 0 6px rgba(0,0,0,.3);
background-color: #BFBFBF;
}
/* Scrollbar End */  
 
.main-menu:hover, nav.main-menu.expanded {
width:250px;
overflow:hidden;
opacity:1;
}

.main-menu {
	background:#EF5983;
	position:absolute;
	top:0;
	bottom:0;
	height:100%;
	left:0;
	width:55px;
	overflow:hidden;
	-webkit-transition:width .2s linear;
	transition:width .2s linear;
	-webkit-transform:translateZ(0) scale(1,1);
	box-shadow: 1px 0 15px rgba(0, 0, 0, 0.07);
    opacity:1;
    z-index: 2;
}

.main-menu>ul {
margin:7px 0;

}

.main-menu li {
position:relative;
display:block;
width:250px;

}

.main-menu li>a {
position:relative;
width:255px;
display:table;
border-collapse:collapse;
border-spacing:0;
color:#8a8a8a;
font-size: 13px;
text-decoration:none;
-webkit-transform:translateZ(0) scale(1,1);
-webkit-transition:all .14s linear;
transition:all .14s linear;
font-family: 'Strait', sans-serif;
border-top:1px solid #f2f2f2;
text-shadow: 1px 1px 1px  #fff;  
}

.main-menu .nav-icon {  
position:relative;
display:table-cell;
width:55px;
height:36px;
text-align:center;
vertical-align:middle;
font-size:18px;

}
.main-menu .nav-text  {   
position:relative;
display:table-cell;
vertical-align:middle;
width:190px;
font-family: 'Titillium Web', sans-serif;
} 

.main-menu .fb-like {
left: 180px;
position:absolute;
top: 15px;
}

.main-menu>ul.logout {
position:absolute;
left:0;
bottom:0;  
}

.no-touch .scrollable.hover {
overflow-y:hidden;

}

.no-touch .scrollable.hover:hover {
overflow-y:auto;
overflow:visible;
  
}

/* Logo Hover Property */
 
 
nav {
-webkit-user-select:none;
-moz-user-select:none;
-ms-user-select:none;
-o-user-select:none;
user-select:none;
  
}

nav ul,nav li {
outline:0;
margin:0;
padding:0; 
}

/* Darker element side menu Start*/

.darkerli
{
background-color:#ededed;
text-transform:capitalize;  
}

.darkerlishadow
{
background-color:#ededed;
text-transform:capitalize;  
-webkit-box-shadow: inset 0px 5px 5px -4px rgba(50, 50, 50, 0.55);
-moz-box-shadow:    inset 0px 5px 5px -4px rgba(50, 50, 50, 0.55);
box-shadow:         inset 0px 5px 5px -4px rgba(50, 50, 50, 0.55);
}

.darkerlishadowdown
{
background-color:#ededed;
text-transform:capitalize;  
-webkit-box-shadow: inset 0px -4px 5px -4px rgba(50, 50, 50, 0.55);
-moz-box-shadow:    inset 0px -4px 5px -4px rgba(50, 50, 50, 0.55);
box-shadow:         inset 0px -4px 5px -4px rgba(50, 50, 50, 0.55);
}

/* Darker element side menu End*/
 
.main-menu li:hover>a,nav.main-menu li.active>a,.dropdown-menu>li>a:hover,.dropdown-menu>li>a:focus,.dropdown-menu>.active>a,.dropdown-menu>.active>a:hover,.dropdown-menu>.active>a:focus,.no-touch .dashboard-page nav.dashboard-menu ul li:hover a,.dashboard-page nav.dashboard-menu ul li.active a {
color:#fff;
background-color:#00bbbb;
text-shadow: 0px 0px 0px; 
}
.area {
float: left;
background: #e2e2e2;
width: 100%;
height: 100%;
} 
	
/** End Side Menu **/	

/* Remove Bootstrap button outline */
 button .focus, a .focus {
	 outline: 0;
	 -webkit-box-shadow: none !important;
	 box-shadow: none !important;
}
 button:focus, a:focus {
	 outline: 0;
	 -webkit-box-shadow: none !important;
	 box-shadow: none !important;
}
 [data-component='navbar'] {
	/* Right Menu Dropdowns */
	/* Notification */
	/* Notification Dropdown */
}
 [data-component='navbar'] .navbar { 
	  background-color: #fff;
}
 [data-component='navbar'] .navbar-toggler {
	 line-height: 2.4;
	 margin-left: 75px;
}
 [data-component='navbar'] .navbar-toggler span {
	 text-transform: uppercase;
	 font-size: 1em;
	 font-weight: 400;
	 font-family: 'Lato', sans-serif;
	 display: none;
}
 [data-component='navbar'] .navbar-toggler[aria-expanded="true"] {
	 color: #009fff;
}
 [data-component='navbar'] .navbar-toggler[aria-expanded="true"] span {
	 display: initial;
	 color: #009fff;
}
 [data-component='navbar'] .navbar-toggler[aria-expanded="true"] i {
	 color: #009fff;
}
 [data-component='navbar'] .navbar-collapse {
	 background-color: #292a2c;
	 margin-left: 75px;
}
 [data-component='navbar'] .navbar-nav {
	 height: 100vw;
}
 [data-component='navbar'] .collapsing {
	 -webkit-transition: height 0.3s ease;
	 -o-transition: height 0.3s ease;
	 transition: height 0.3s ease;
}
 [data-component='navbar'] .navbar-brand { 
	 background-color: #009fff;
	 height: 60px;
	 width: 75px;
	 text-align: center;
}
 [data-component='navbar'] ::-webkit-scrollbar {
	 width: 0px;
	 background: transparent;
}
  
 [data-component='navbar'] .home {
	 border-right: 1px solid #ababab;
}
 [data-component='navbar'] .dropdown-toggle::after {
	 display: none;
}
 [data-component='navbar'] .dropdown-item {
	 color: #292b2c;
	 font-size: 0.75em;
}
[data-component='navbar'] .dropdown-item.active {
    font-weight:600;
}
 [data-component='navbar'] .dropdown {
	 position: relative;
}
 [data-component='navbar'] .dropdown span {
	 color: #fff;
	 position: absolute;
	 width: 15px;
	 height: 15px;
	 top: -8px;
	 right: -3px;
	 background-color: red;
	 border-radius: 50%;
	 text-align: center;
	 font-size: 0.625em;
	 font-weight: 600;
}
 [data-component='navbar'] .dropdown img {
	 border-radius: 20%;
	 height: 40px;
}
 [data-component='navbar'] .list-group .lg {
	 height: 500px;
	 width: 270px;
	 overflow: auto;
}
 [data-component='navbar'] .list-group .list-group-item {
	 border-radius: 0;
	 letter-spacing: 0.5px;
}
 [data-component='navbar'] .list-group h5 {
	 font-size: 0.6875em;
	 font-weight: 700;
	 line-height: 2;
}
 [data-component='navbar'] .list-group p {
	 font-size: 0.5625em;
	 font-weight: 400;
	 line-height: 2;
}
  
 [data-component='sidebar'] .sidebar {
	 position: fixed;
	 z-index: 9;
}
 [data-component='sidebar'] .first-menu {
	 position: fixed;
	 background: transparent linear-gradient(180deg, #FFEBEB 0%, #EBFAFF 50%) 0% 0% no-repeat padding-box;
	 height: 100vh;
	 width: 80px;
	 top: 0px;
	 overflow: hidden;
	 transition: width 0.5s;
}
 [data-component='sidebar'] .first-menu a {
	 color: #414445;
	 white-space: nowrap;
	 padding: 0.9rem 1.4rem;
     height: 55px;
     vertical-align: middle;
}
[data-component='sidebar'] .first-menu a.navbar-brand img {
	 width:auto;
}
 
 [data-component='sidebar'] .first-menu span {
	 font-size: 14px;
	 white-space: nowrap;	   
	 opacity: 0;
	 visibility: hidden;
}
[data-component='sidebar'] .first-menu:hover span {
	 opacity: 1;
	 visibility: visible;
}
[data-component='sidebar'] .first-menu .navbar-brand{
    padding: 1rem 1.5rem;
	height: 90px;
}
[data-component='sidebar'] .first-menu .navbar-brand img:first-child{
	margin-top:-5px;
}
[data-component='sidebar'] .first-menu .logo-expand {	  
	 white-space: nowrap;	   
	 opacity: 0;
	 visibility: hidden;
}
[data-component='sidebar'] .first-menu:hover .logo-expand {
	 opacity: 1;
	 visibility: visible;	     	 
}
 [data-component='sidebar'] .first-menu .list-group-item {
	 border-radius: 0;
	 border-left: 4px solid transparent;
}
 [data-component='sidebar'] .first-menu .list-group-item:hover {
	 background-color: #f9efef;
}
 [data-component='sidebar'] .first-menu:hover {
	 width: 280px;
}
 [data-component='sidebar'] .list-group-item {
	 font-size: 14px;
}
 [data-component='sidebar'] .submenu {
	 position: fixed;
	 left: 241px;	 
	 width: 200px;
     top: 58px;
     background-color: #feebeb;	  
	 height: 100vw;
	 opacity: 0;
	 visibility: hidden;
	 transition: 600ms opacity 600ms, 600ms visibility 600ms;
}
 [data-component='sidebar'] .submenu .list-group-item {
	 margin-top: 8px;
}
 [data-component='sidebar'] .first-menu li:hover .submenu {
	 visibility: visible;
	 opacity: 1;
}
 [data-component='sidebar'] .sub-submenu {
	 position: fixed;
	 background-color: #fff;
	 left: 355px;
	 top: 60px;
	 height: 100vw;
	 width: 195px;
	 opacity: 0;
	 visibility: hidden;
	 transition: 600ms opacity 600ms, 600ms visibility 600ms;
}
 [data-component='sidebar'] .sub-submenu a {
	 color: #009fff;
}
 [data-component='sidebar'] .sub-submenu .list-group-item:hover {
	 background-color: transparent;
}
 [data-component='sidebar'] .submenu li:hover .sub-submenu {
	 visibility: visible;
	 opacity: 1;
}
 [data-component='sidebar'] .list-group-item {
	 background-color: transparent;
	 border: none;
	 border-radius: 0;
}
[data-component='sidebar'] .arrow {
	 position: fixed;
	 left: 329px;
	 width: 0;
	 height: 0;
	 border-top: 27px solid transparent;
	 border-bottom: 27px solid transparent;
	 border-right: 27px solid white;
}
[data-component='sidebar'] .arrow:nth-child(3) {
	 top: 20px;
}
[data-component='sidebar'] .first-menu .list-group-item.active {   
    border-left: 4px solid #EF5983;
}
[data-component='sidebar'] .first-menu .list-group-item.active span{   
    font-weight:600;
} 
.wp-content {
	 margin-top: 80px;
	 margin-left: 75px;
}
 
.header-top {
    height: 70px;
	padding: 0 3rem;
	z-index:1;
}
.right-help a{
    color: #414445;
    font-size: 14px;
    letter-spacing: 0.5px;
    font-weight: 400;
}
 
 [data-component='vertical-nav'] .navbar-vertical{
	 background-color: #F8F8F8; 
     position: fixed;
     top: 0;
     left: 80px;
     width: 200px;
     height: 100vh;
     z-index:2;
     padding: 4rem 0; 	 
 }

 .wp-content.wp-content-right {
    margin-top: 70px;
    margin-left: 280px;
} 
.navbar-vertical .navbar-nav .nav-link {    
    color: #414445;
    font-size: 14px;
} 
 .navbar-vertical .navbar-nav li.active .nav-link {    
    font-weight:600;
 }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
	
	
	