body.page-template-template-app{
	overflow:hidden;
	margin:0;
	width:100vw;
	height:100vh;
}



body > #fullscreen-wrap{
	position:fixed;
	display:flex;
	top:0;
	left:0;
	right:0;
	bottom:0;
}

body #main-wrap{
	position: relative;
	display: flex;
	flex-direction: column;
	flex:1 0 auto;
	width:100%;
	height:100%;
	margin:0;
	padding:0;
	z-index:1;
}

#main-wrap header{
	flex:0 0 auto;	
}

header .header-menu{
	box-shadow: 0px 1px 4px 1px rgba(0,0,0,0.12);
}

#main-wrap .header-menu__container{
	max-width:100%;
}

.nav-and-main{
	display:flex;
	flex-grow:1;
	overflow:auto;
	position: relative;
	
}

#main{
	flex-direction:column;
}

#sidebar-drawer{
	display: flex;
	flex-direction: column;
	flex:none;
	background-color:#fff;
	width:250px;
	top:0;
	bottom:0;
	left:0;
	right:0;	
  transition: all 0.35s ease-in-out;
	position:absolute; /* Overlay on mobile instead of push */
	z-index:2000;
}

.main-overlay{
	z-index:1500;
	position: absolute;
	top:0;
	right:0;
	bottom:0;
	left:0;
	background-color:rgba(0,0,0,0.6);
	transition: opacity 0.2s ease-in-out;
}

main.sidebar--expanded{
	overflow:hidden;
}

.first-load main.sidebar--expanded,
main.sidebar--compressed{
	overflow:auto;
}

main.sidebar--expanded .main-overlay{
	display:block;
	z-index:1500;
	opacity:1;
	height:10000px;
}

.first-load main.sidebar--expanded .main-overlay,
main.sidebar--compressed .main-overlay{
	opacity:0;
	z-index:-1;
	background-color:rgba(0,0,0,0);	
	height:0px;
}

#sidebar-drawer.sidebar--expanded{
	margin-left:0;
}


#sidebar-drawer.sidebar--compressed{
	margin-left:-250px;
}

#sidebar-drawer.sidebar--expanded .menu-icon-expand,
#sidebar-drawer.sidebar--compressed .menu-icon-compress{
	display:none;
}


	
.first-load #sidebar-drawer.sidebar--expanded{
	margin-left:-250px;		
}
	



@media(min-width:992px){
		
	.first-load #sidebar-drawer.sidebar--expanded{
		margin-left:0px;		
	}

	
	main.sidebar--expanded,
	main.sidebar--compressed{
		overflow:auto;
	}
	
	main.sidebar--expanded .main-overlay{
		display:none;
	}
	
	#sidebar-drawer{
		position:relative;
	}
	
	#sidebar-drawer.sidebar--compressed{
		margin-left:-190px;
	}
	
}






nav.nav-sidebar{
	display:flex;
	flex-direction: column;
	flex-grow:1;
	border-right:1px solid #e6e6e6;
	overflow: hidden;
	
}

.nav-sidebar__top{
	display:flex;
	flex:0 0 auto;
	position: relative;
	height:auto;
	overflow: hidden;
}


.nav-sidebar__header{
	display:flex;
	align-items:center;
	justify-content:space-between;
	width:100%;
	min-height:100px;
	padding:16px 8px 16px 16px;
	border-bottom:1px solid #e6e6e6;
}

.nav-sidebar__logo{
	max-width:150px!important;
}

.button__close-sidebar{
	cursor: pointer;
  color: rgba(0,0,0,0.55);  
  margin-right: 0px;
  padding: 0 8px;
	background:transparent;
	border:0;
	display:flex;
	align-items:center;
	outline:none;
}

.button__close-sidebar:focus,
.button__close-sidebar:hover,
.button__close-sidebar:active{
	outline:none;
}

.menu-icon-compress{
	margin-right:4px;
	font-size:0.6rem;
}

.menu-icon-bars{
	font-size:1.45rem;
}

.menu-icon-expand{
  margin-left:6px;
	font-size:0.8rem;
}










.nav-sidebar__scrollable{
	overflow-x:hidden;
	overflow-y:auto;
	flex:1 1 auto;
	
}

.nav-sidebar__bottom{
	overflow:hidden;
	flex:0 0 auto;
	padding-bottom:8px;	
}

.nav-sidebar__divider{
	
}


.style--ui{
	font-family:'Roboto', 'Arial', sans-serif;
	font-weight:500;
	font-size:15px;
	line-height:24px;
	color: rgba(0,0,0,0.55);	
	letter-spacing: 0.25px;	
}


.nav-sidebar__menu,
.nav-sidebar__main-menu{
	padding:0;
	margin:0;
}



.menu-item__link{
	display: flex;
	flex-direction: row;
	align-items:center;
	overflow:visible;
	padding:0 24px 0 16px;
	cursor:pointer;
	min-height:48px;
	position: relative;
}

.menu-item:hover *,
.menu-item:focus *,
.menu-item:active *{
	background-color:#f4f4f4;
	color:#285843;
	text-decoration: none;
}

.menu-item__icon{
	display:flex;
	flex-direction: row;
	align-items:center;
	width:30px;
	margin-left:8px;
	margin-right:18px;
	font-size:20px;
	transition: all 0.2s ease-in-out;
}
.menu-item__text{
	white-space:nowrap;
	overflow:hidden;
	text-overflow: ellipsis;
	color:inherit;
	opacity:1;
}

.menu-item__link::after{
	position: absolute;
	content: ' ';
	left:0;
	height:100%;
	width:4px;
	background-color:#285843;
	opacity:0;
	transition:opacity 150ms linear;	
}

.menu-item.is-selected .menu-item__link::after{
	opacity:1;
}

.menu-item.is-selected *{
	color:#285843;
	background-color:#f4f4f4;	
}



/* HIDDEN SIDEBAR */

.page__header .button__close-sidebar{
	
	
}

/* COMPRESSED SIDEBAR */
@media(min-width:992px){ 

	.sidebar--compressed .button__close-sidebar{
		margin-right:2px;
		padding:0px;
	}

	.sidebar--compressed .menu-item__link{
		flex-flow:row-reverse;
		padding: 0;
	}

	.sidebar--compressed .menu-item__text{
		opacity:0;
	}

	.sidebar--compressed .menu-item__icon{
		justify-content: center;
		font-size:24px;
		margin-left:0;
		margin-right:14px;
		width:32px;
	}
	
	.main-overlay{
    display:none;
  }
	

}


/*
#main-wrap main {
    transform: translateX(0px);
    transition: translateX 0.35s ease-in-out;
    background-color: hsl(210,9%,96%);
    margin: auto;
    position: relative;
    width: 100%;
    overflow-x: hidden;
    min-height: 100vh;
}
*/


#main-wrap #main{
	background-color: hsl(210,9%,96%);
	display: flex;
	flex:1;
	position: relative;
}


.page__header{
	margin:0;	
	background-color:#fff;
	border-bottom:1px solid #e6e6e6;
	position: sticky;
	top:0;
	z-index:1400;
}

.page__header .button__close-sidebar .menu-icon-bars{
	font-size:2rem;
	padding:15px;
}

.page__header-inner{
	display:flex;
	align-items:center;
	justify-content: flex-start;
	min-height:70px;
}

.page__subtitle{
	font-size:0.8rem;
	font-weight:600;
	font-family:'Roboto', sans-serif;
	font-style:normal;
	letter-spacing: 0px;
	color: rgba(0,0,0,0.55);	
	text-align: left;
	margin-bottom:0;
	text-transform: capitalize;
}
.page__parent-title{
	font-size:0.8rem;
	font-weight:600;
	font-family:'Roboto', sans-serif;
	font-style:normal;
	letter-spacing: 0.5px;
	color: rgba(0,0,0,0.55);	
	text-align: left;
	margin-bottom:0;
	text-transform: uppercase;
}

.page__parent-title:hover,
.page__parent-title:hover,
.page__parent-title:hover{
	color:#065fd4;
}
.page__breadcrumbs{
	display:flex;
	flex-direction: column;
	justify-content: center;
	align-items:flex-start;
	width:100%;
	margin:auto;
}

.page__title{
	font-size:1.25rem;
	font-weight:800;
	font-family:'Roboto', sans-serif;
	font-style:normal;
	letter-spacing: 0px;
	color:#000;
	text-align: left;
	margin-bottom:0;
	text-transform: capitalize;
}

.page__container{
	width:100%;
	padding-left:0px;
  padding-right:0px;
	margin:0 auto;	
	flex:1;
}

@media(min-width:768px){
	
	.page__container{
		padding-left:15px;
		padding-right:15px;
		padding-bottom:30px;
	}
	.page__title{
		text-align:center;
		font-size:1.75rem;
		width:100%;	
	}
	
	.page__title{
		text-align:center;
		font-size:1.5rem;
		width:100%;	
	}
	
}



@media(min-width:992px){
   
	.page__header{
		margin:0;		
		position:relative;
		background-color:transparent;
		border-bottom:none;
	}
	
	.page__header-inner{
		min-height:100px;
	}

	.page__parent-title{
		font-size:1rem;
		font-weight:900;		
		font-style:normal;
		letter-spacing: 1px;	
		text-align: left;
		padding-left:30px;
	}
	.page__subtitle{
		font-size:1rem;
		font-weight:900;		
		font-style:normal;
		letter-spacing: 1px;	
		text-align: left;
		padding-left:30px;
	}
	
	.page__title{
		font-size:2rem;
		font-weight:900;
		font-family:'Roboto', sans-serif;
		font-style:normal;
		letter-spacing: 0.5px;
		color:#000;
		text-align: left;
		padding-left:30px;
	}
	
	.page__header .button__close-sidebar{
		display:none;
	}

	.page__container{
		width:100%;
		padding-left:30px;
		padding-right:30px;
		padding-bottom:2rem;	
		margin:0 auto;
		max-width:1300px;
	}
	.page__container--fill-width{
		max-width:100%;
	}


	.page__submenu{
	  width:100%;
		border-top:1px solid #e6e6e6;
		padding:30px 10px;
	}

}


@media(min-width:1440px){
	
	.page__title{
		max-width:1300px;
		text-align: left;
		padding-left:30px;
		margin:auto;
	}
	.fill-width .page__title{
		max-width:inherit;
		padding-left:40px;
	}	
	.page__breadcrumbs{
		max-width:1300px;	
	}
	.fill-width .page__breadcrumbs{
		max-width:inherit;	
		padding-left:40px;
	}

}



.controls__bar{
	display:flex;
	flex-direction:row;
	width:100%;	
	justify-content: space-between;
	padding-bottom:0.5rem;
}

.controls__right{
	margin-left:auto;;
}

.tab-content{
	padding-top:0rem;
}






#sidebar > nav,
#sidebar > div{
	direction:ltr; /* Flip content back to normal  */	
}



#sidebar [data-toggle="collapse"].list-group-item{ 
  justify-content:space-between;
}

#sidebar [data-toggle="collapse"].list-group-item:not(.collapsed){ 
  justify-content:space-between;
  background-color: #dc3545!important;
}



#sidebar [data-toggle="collapse"] div > i:before {
	content: "\f106";
}

#sidebar [data-toggle="collapse"].collapsed div > i:before {
	content: "\f107";
}