.sidebar {
	@include container-background();
	@include shadow();
	width: $side-menu-width;
	z-index: 5;
	position: fixed;
	height: 100%;

	.sidebar-items {
		padding: 10px;
		height: calc(100% - #{$sidebar-branding-height + $userbox-height});
		overflow-y: auto;
	}

	.sidebar-branding {
		padding: 5px 10px;
		height: $sidebar-branding-height;

		svg {
			height: 100%;
			max-width: 100%;
		}
	}

	.sidebar-item,
	.sidebar-group-label {
		font-weight: 700;
	}

	.sidebar-group {
		margin-bottom: 10px;
		padding-left: 7px;
	}

	i {
		font-size: 14px;
		margin-right: 7px;
		position: relative;
		top: -1px;
	}

}

.inner-folder {
	padding-left: 10px;
	border-left: solid 1px rgba($black, .3);
	display: none;

	&.open {
		display: block;
	}
}

.menufolder,
.menupage {
	padding: 1px 0;
	border-bottom: 1px solid rgba($black, .05);
}

.menufolder {
	cursor: pointer;
}

.menupage {
	&.active i {
		color: darken($primary-color, 25%);
	}

}

.addpage-button {
	cursor: pointer;
}