
* {box-sizing:border-box;}



body {margin:0; display:flex; flex-direction:row; min-height:100vh; font-family: Arial, "Helvetica Neue", Helvetica, sans-serif;}
nav#nav {flex:0 1 auto;}
div#container {flex:1 1 auto;}



nav#nav {background-color:#13101D; display:flex; flex-direction:column; justify-content:space-between;}
nav#nav main.main {flex-grow:1; padding:1rem;}
nav#nav footer.bottom {flex-grow:0;}



nav#nav ul.navlist {list-style:none; margin:0; padding:0;}

/* nav#nav ul.navlist li.navitem {min-width:10rem;} */
nav#nav ul.navlist li.navitem div.navlink,
nav#nav ul.navlist li.navitem a.navlink {background-color:#13101D; color:#F8F8F8; border-radius:.5rem; padding:1rem; text-decoration:none;}
nav#nav ul.navlist li.navitem div.navlink {background-color:#1F1B32;}
nav#nav ul.navlist li.navitem div.navlink,
nav#nav ul.navlist li.navitem a.navlink {display:flex; flex-direction:row; justify-content:flex-start; align-items:center;}
nav#nav ul.navlist li.navitem a.navlink:hover {background-color:#F8F8F8; color:#13101D;}

nav#nav ul.navlist li.navitem div.navlink svg.icon,
nav#nav ul.navlist li.navitem a.navlink svg.icon {flex:0 1 auto;}
nav#nav ul.navlist li.navitem div.navlink input.search {flex: 1 1 auto; background-color:inherit; border:0 none; outline:none; color:inherit; font-size:1em;}
nav#nav ul.navlist li.navitem a.navlink span.caption {flex: 1 1 auto;}
nav#nav ul.navlist li.navitem div.navlink input.search {display:none;}
nav#nav ul.navlist li.navitem a.navlink span.caption {display:none;}
nav#nav.open ul.navlist li.navitem div.navlink svg.icon,
nav#nav.open ul.navlist li.navitem a.navlink svg.icon {margin-right:1rem;}
nav#nav.open ul.navlist li.navitem div.navlink input.search {display:block;}
nav#nav.open ul.navlist li.navitem a.navlink span.caption {display:block;}



div#container {background-color:#E6EAF8; padding:0 1rem;}
div#container h1 {}
