/*
 * Navigation
 */

nav {
    margin: 0;
    padding: 0;
    display: block;
}

ul#menu {
    list-style: none;
    display: block;
    margin: auto 1em;
    padding: 0;
    width: max-content;
    font-family: "Liberation Mono","Courier New",monospace;
}

ul#menu > li {
    display: block;
    float: left;
    position: relative;
    width: 13em;
    margin: 0 1em;
    padding: 0.88em 0;
    background: rgb(154, 216, 82);
    border-bottom: 2px solid rgb(140, 150, 130);
}

ul#menu > li.current {
    display: block;
    float: left;
    position: relative;
    width: 13em;
    margin: 0 1em;
    padding: 0.88em 0;
    background: rgb(123, 173, 66);
    border-bottom: 2px solid rgb(109, 116, 103);
}

ul#menu li span {
    color: rgb(20, 60, 20);
    padding: 1em 2em;
    margin: 0;
}

ul#menu li a {
    color: rgb(20, 60, 20);
    padding: 1em 2em;
    margin: 0;
}

ul#menu ul {
    list-style: none;
    margin: 1em auto;
    padding: 0;
    position: absolute;
    // hide until hovered
    display: none;
    visibility: hidden;
    opacity: 0;
}

ul#menu li:hover > ul {
    # show submenu
    display: block;
    visibility: visible;
    opacity: 1;
}

ul#menu ul > li {
    display: block;
    position: relative;
    width: 13em;
    padding: 0.9em 0;
    background: rgb(150, 220, 80);
    border-bottom: 2px solid rgb(140, 150, 130);
}

ul#menu ul > li.current {
    display: block;
    position: relative;
    width: 13em;
    padding: 0.9em 0;
    background: rgb(123, 173, 66);
    border-bottom: 2px solid rgb(140, 150, 130);
}

/*
 * Content
 */

p.gap {
    clear: both;
}

main {
    margin-left: 2em;
}

main h1 {
	font-family: "Liberation Mono","Courier New",monospace;
    margin-top: 1em;
    color: rgb(20, 60, 20);
}

p.content {
	margin-top:1mm;
}

ul.content {
	list-style-type: square;
}

pre.code {
	background-color: #f0f0f0;
	margin-top: 1mm;
	padding: 2mm 1mm; 
	border-style: solid;
	border-width: 1px;
	border-color: #727272;
}

span.code {
	color:#2040a0;
	font-family:monospace;
	white-space:nowrap;
}

a:link {
    color: rgb(20, 60, 20);
	text-decoration: none;
}

a:visited {
    color: rgb(20, 60, 20);
	font-style:italic;
	text-decoration:none;
}

a:hover {
    color: rgb(20, 60, 20);
	text-decoration:underline;
}

/*
 * Footer
 */

footer {
    padding: 0;
    margin-left: 2em;
    margin-top: 1em;
}

footer p {
	font-family:"Liberation Mono","Courier New",monospace;
	font-size:small;
}