section.app {
	position: absolute; left: 0; top: 0; 
    width: 100%; height: 100%; overflow: auto;
}

nav.app {
	position: sticky; left: 0; top: 0; width: 100%; height: 48px;
	display: flex; align-items: center; flex-wrap: nowrap; z-index: 9000;
	background-color: #373433;
	color: #f0f0ef;
}

div.app--icon, img.app--icon {
	cursor: pointer; width: 48px; height: 48px; line-height: 48px; 
	vertical-align: middle; text-align: center; font-size: 32px; min-width: 48px;
}

div.app--container {
	white-space: nowrap; flex-shrink: 0; box-sizing: border-box;
	overflow: hidden; display: flex;
}

div.app--container-middle {
	padding: 0 8px; flex-shrink:1; flex-grow:1; flex-direction: column;
}

section.app.--mobile div.app--container-left {
	margin-left: -24px; transition: margin-left .3s ease-in-out;
}

section.app.--menu-hidden div.app--container-left {
	margin-left: 0;
}

section.app.--mobile.--menu-open div.app--container-left {
	margin-left: 0;
}

div.app--title {
	font-size: 17px; text-overflow: ellipsis; overflow: hidden;
}

div.app--subtitle {
	font-size: 12px;
	color: #84a6d1;
	text-overflow: ellipsis; overflow: hidden;
}

section.app--menu {
	position: fixed; left: 0; top: 48px; 
	width: 256px; height: calc(100% - 48px); z-index: 9500;
    padding: 16px 0; overflow: auto;
	background-color: #eee;
	color: #666;
	box-sizing: border-box;
}

section.app.--menu-hidden section.app--menu{
	display: none;
}

section.app.--menu-hidden div.app--menu-icon{
	display: none;
}

section.app.--mobile section.app--menu {
	margin-left: -256px; transition: margin-left .3s ease-in-out;
}

section.app.--mobile.--menu-open section.app--menu {
	margin-left: 0;
}

section.app--main{
    position: absolute; left: 256px; width:calc(100% - 256px); min-height: calc(100% - 48px);
	overflow: visible; box-sizing: border-box;
}

section.app.--mobile section.app--main{
	left: 0; width: 100%;
}

section.app.--menu-hidden section.app--main{
	left: 0; width: 100%;
}

div.app--user-image{
	border-radius: 50%; transform: scale(0.7); background-size: cover; box-sizing: border-box;
	border: 3px solid hsl(0,0%,100%);
}

div.app--menu-icon{
    background-color: #2382ba;
}