:root {
    --red:   #CC241D;
    --green: #98971A;
    --blue:  #458588;
}

:link {
    color: #458588;
}

:visited {
    color: #B16286;
}

body {
    background-color: #282828;
    color: #EBDBB2;
}

#main nav {
    background-color:  #282828;
    border-color: #FABD2F;
}



/* sidebar layout */

#main body {
	height: 100%;
	max-width: 100%;
	position: absolute;
	bottom: 0;
	left: 0;
	right: 0;
	top: 0;
	display: table;
	padding: 0;
	margin: 0;
}

#main nav,
#main div,
#main article {
	display: table-cell;
	padding: 4px;
}

#main div,
#main nav {
	border-right: 11px solid;
	background-color: #282828;
	border-color: #FABD2F;
}

#main nav header {
	margin: 0;
	font-size: 15pt;
	font-weight: bolder;
	white-space: nowrap;
}

#main nav ul {
	margin-top: 0;
	margin-bottom: 1em;
	padding-left: 0;
}

#main nav li {
	list-style-type: none;
	list-style-position: inside;
	margin-left: 0.5em;
}

#main article h2 {
	margin: 0;
	text-align: center;
}


#main main {
	display: table-row;
}

#main footer {
	display: table-row;
	text-align: center;
}

#main nav {
	vertical-align: top;
}