Configure CSS to add table of contents in side bar? - css

Question

Disclaimer - I know very little about CSS.
I'm interesting in using jemdoc's CSS (https://jemdoc.jaboc.net/jemdoc.css) with HTML5 exported from emacs org-mode. However I believe emacs org-mode exports a "table-of-contents" rather than a "menu" (which is generated from a separate file with jemdoc), but I would like it if the table of contents could be displayed in the sidebar like the menu. Can this be modified to accept a table of contents? I believe this is the relevant part of the jemdoc CSS.
table#tlayout {
border: none;
border-collapse: separate;
background: white;
}
body {
background: white;
font-family: Georgia, serif;
padding-bottom: 8px;
margin: 0;
}
#layout-menu {
background: #f6f6f6;
border: 1px solid #dddddd;
padding-top: 0.5em;
padding-left: 8px;
padding-right: 8px;
font-size: 1.0em;
width: auto;
white-space: nowrap;
text-align: left;
vertical-align: top;
}
#layout-menu td {
background: #f4f4f4;
vertical-align: top;
}
#layout-content {
padding-top: 0.0em;
padding-left: 1.0em;
padding-right: 1.0em;
border: none;
background: white;
text-align: left;
vertical-align: top;
}
#layout-menu a {
line-height: 1.5em;
margin-left: 0.5em;
}
tt {
background: #ffffdd;
}
pre, tt {
font-size: 90%;
font-family: monaco, monospace;
}
a, a > tt {
color: #224b8d;
text-decoration: none;
}
a:hover {
border-bottom: 1px gray dotted;
}
#layout-menu a.current:link, #layout-menu a.current:visited {
color: #022b6d;
border-bottom: 1px gray solid;
}
#layout-menu a:link, #layout-menu a:visited, #layout-menu a:hover {
color: #527bbd;
text-decoration: none;
}
#layout-menu a:hover {
text-decoration: none;
}
div.menu-category {
border-bottom: 1px solid gray;
margin-top: 0.8em;
padding-top: 0.2em;
padding-bottom: 0.1em;
font-weight: bold;
}
div.menu-item {
padding-left: 16px;
text-indent: -16px;
}
Currently I use something like this to display my org-mode at the top of the HTML5 page (which I also copied from another CSS file).
#table-of-contents {
display: table;
width: 350px;
border: 1px solid #aaa;
margin-top: 3ex;
padding: 10px 10px 10px 0px;
}
#table-of-contents h2 {
border: 0;
text-align: center;
list-style-type: none;
}