:root {
  --backgroundcolour: #1C1C1F;
}
html, .content {
	width: 100%;
    height: 100%;
}
body, .sidebar {
    height: 100%;
	background-color: var(--backgroundcolour);
}
 
body {  
	font-family: Helvetica, Arial, Tahoma, Verdana, sans-serif;
	margin: 0px;
	font-size: 11pt;
}

li {
	padding-bottom: 4px;
}
.page {
	padding-top: 100px;
	max-width: 720px;
	margin: auto;
	display: flex;
}
.content {
	background-color: #edf1f7;
	padding-left: 10px;
	padding-right: 10px;
	border-left-style: solid;
	border-color: var(--accentcolour);
	border-width: 5px;
}
/* The side navigation menu */
.sidebar {
	margin: 0;
	padding: 0;
	width: 200px;
	position: sticky;
	overflow: hidden;
}
#home {
	font-size: 14pt;
	font-weight: bold;
	padding-top: 4px;
	padding-bottom: 4px;
	margin-bottom: 10px;
}
#daniel {
	margin-bottom: 10px;
}

/* Sidebar links */
.sidebar a {
	display: block;
	color: #edf1f7;
	padding: 2px;
	text-decoration: none;
}
#home:hover:not(.active) {
	background-color: #FDCA40;
}
#daniel:hover:not(.active) {
	background-color: #DF2935;
}
#posts:hover:not(.active) {
	background-color: #0CCE6B;
}
#commissions:hover:not(.active) {
	background-color: #3772FF;
}
/* Active/current link */
.sidebar a.active {
	background-color: var(--accentcolour);
	color: var(--backgroundcolour);
}
/* Links on mouse-over */
.sidebar a:hover:not(.active) {
	color: var(--backgroundcolour);
}

.content a:link, .content a:visited {
	color: black;
}
.content a:hover {
	color: var(--accentcolour);
}