/* Navigation
--------------*/

	#nav {
		position: absolute;
		top: 0;
		bottom: 0;
		left: 0;
		width: 250px;
		border-right: 1px solid #DDDDDD;
		background-color: #fafafa;
	}

	#nav ul {
		margin: 0 0 0 10px;
	}

	#nav li a {
		display: grid;
		grid-template-columns: 20px auto 20px;
		grid-gap: 3px;
		padding: 5px 10px;
		border-radius: 7px;
	}

	#nav li {
		display: block;
		margin: 0;
	}

	#nav li + li {
		margin-top: 3px;
	}

	#nav li a:hover {
		background-color: rgba(0,0,0,0.05);
	}

	#nav li a.active {
		background-color: #147ee3;
		color: #FFFFFF;
	}

	#nav li a.active .mdi,
	#nav li a.active .nav--counter {
		color: #FFFFFF;
	}

	#nav li a.active .nav--counter {
		opacity: 0.7;
	}

	.nav--icon {
		display: inline-block;
		width: 20px;
		text-align: center;
	}

	.nav--name {
		line-height: 20px;
	}

	#nav li .mdi {
		display: inline;
		float: left;
		font-size: 17px;
		position: relative;
		color: #357df9;
		color: #147ee3;

	}

	/*
	nav ul li .mdi {
		display: inline-block;
		width: 25px;
		padding-right: 5px;
		text-align: center;
		font-size: 18px;
		color: #FFFFFF;
		float: left;
		position: relative;
		top: -4px;
	}
	*/

	#nav ul li a:hover > .mdi {
		scale: 1.15;
	}

	.nav--counter {
		opacity: 0.3;
		text-align: right;
		font-size: 12px;
		line-height: 20px;
	}

	.nav-header {
		display: grid;
		grid-template-columns: 40px auto;
		height: 60px;
		padding: 15px 0 0 15px;
		/*border-bottom: 1px solid #DDDDDD;*/
	}

	.nav-header--icon {
		display: block;
	}

	.nav-header--icon img {
		display: block;
		width: 30px;
		border-radius: 7px;
	}

	.nav-header--name {
		display: block;
	}

	.nav-header--name strong {
		display: block;
	}

	.nav-header--name small {
		display: block;
		font-size: 11px;
		position: relative;
		top: -1px;
		opacity: 0.6;
	}

	.nav-body {
		position: absolute;
		top: 60px;
		right: 0;
		bottom: 50px;
		left: 0;
		padding: 5px 7px 20px 0;
		overflow-y: auto;
	}

/* Trenner
-----------*/

	.nav-body h2 {
		display: block;
		font-size: 12px;
		padding-left: 15px;
		font-weight: 400;
		color: #777777;
		margin-bottom: 7px;
	}

	.nav-body h2 + h2 {
		margin-top: 50px;
	}