/* CSS Document */
.sidebar{
	order: 2;
	display: flex;
	align-items: left;
	padding:1rem 0.5rem 0 0.5rem;
	flex-direction:column;
	background-color:#FFF;
	margin:0 auto 0.5rem auto;
	width:100%;
	max-width:50rem;
	border-top-style:solid;
	border-top-width:3px;
	box-sizing:border-box;
}
.sidebarUnit{
	padding-top:0.5rem;
	padding-bottom:0.5rem;
	display:flex;
	align-items: center;
	padding-left:0.5rem;
	color:#CCC;
	font-weight:600;
	border-style:solid solid solid solid;
	margin-top:-1px;
	border-color:#eee;
	border-width:1px;	
	text-decoration:none;
}
.sidebarTop{
	border-top-style:solid;
	border-top-color:#EEE;
	border-top-width:1px;	
}
.sidebarSubUnit{
	padding: 0.5rem 1rem 0.5rem 1rem;
	margin:-1px 0.5rem 0px 0.5rem;
	/*display:flex;*/
	align-items: center;
	color:#AAA;
	font-weight:500;
	border-style:solid solid solid solid;
	border-color:#EEE;
	border-width:1px;
	text-decoration:none;
}
.sidebarIcon {
	padding-left: 1rem;
	padding-right: 1rem;
	filter: grayscale(100%);
	opacity:50%;
}

.sidebarHeading h1 {
	color: #000;
	font-size: 1.8rem;
	border-bottom-style:solid;
	border-bottom-color:#EEE;
	border-bottom-width:1px;
	margin: 0px;
	padding-bottom: 1rem;
	padding-left: 1rem;
}
.sidebarHeading h2{
	color: #000;
	font-size: 1.5rem;
	border-bottom-style:solid;
	border-bottom-color:#EEE;
	border-bottom-width:1px;
	margin: 0px;
	padding: 1rem 0 1rem 1rem;
}
.sidebarUnit:hover {
	background-color: #F5F5F5;
	border-bottom-style: solid;
	border-bottom-color: #EEE;
	border-bottom-width: 1px;
}
#selected .sidebarUnit  {
	border-style: solid solid solid solid;
	border-width: 1px 0.5rem 1px 0.5rem;
	padding-left: 0.05rem;
	border-color: #ff0066;
	color: #ff0066;
}
#selected .sidebarUnit img{
	filter:none;
}
#selected .sidebarSubUnit img{
	filter:none;
}
#selected .sidebarSubUnit{
	display:flex;
	color: #ff0066;
}
#subSelected.sidebarSubUnit {
	padding-left:0.9rem;
	border-style: solid solid solid solid;
	border-width: 1px 0.2rem 1px 0.2rem;
	border-color: #EEE #ff0066 #EEE #ff0066;
	color: #ff0066;	
	background-color: #fff2f2;
}

.sidebarSubUnit:hover {
	background-color: #F5F5F5;
	border-bottom-style: solid;
	border-bottom-color: #EEE;
	border-bottom-width: 1px;
}
.sidebarUnit span {
	color: #BBB;
}
.sidebarUnit#selected:hover {
	background-color: #FFF;
}
@media (min-width: 85rem){
	.sidebar{
		order: 1;
		flex:1;
		min-width:15rem;
		max-width:25rem;
		margin-top:4rem;
		border-top-style:none;
		padding-right:1rem;
		padding-left:2rem;
	}
	.sidebarUnit{
	border-right:0.05rem;
	border-right-style:solid;
	border-right-color:#EEE;
	border-left:0.05rem;
	border-left-style:solid;
	border-left-color:#EEE;
	}
}