#toc{
  display: none;
  width: 200px;
  padding: 10px;
  border-left: 1px solid #ccc;
  background-color: #f7f7f7;
  overflow-y: auto;
}
#tocItems{
  line-height:1.4 !important;
}
.tocItem{
  display: block;
  cursor:pointer;
}
a.tocItem{
  text-decoration-color: transparent;
  text-underline-offset: 0.2em;
  white-space: unset;
}
a:hover.tocItem{
  text-decoration-color: inherit;
}
.tocDepth1{
  margin-left:0px;
  font-size: 1.5rem;
}
.tocDepth1:not(:first-child) {
  margin-top:0.5rem
}
.tocDepth2{
  margin-left:10px;
  margin-top:0.5rem;
  font-size: 1.2rem;
}
.tocDepth3{
  margin-left:20px;
  margin-top:0.25rem;
  font-size: 1rem;
}
.tocDepth4{
  margin-left:30px;
  margin-top:0.25rem;
  font-size:1rem;
}
.tocDepth5{
  margin-left:30px;
  margin-top:0.25rem;
  font-size:1rem;
}
.tocDepth6{
  margin-left:30px;
  margin-top:0.25rem;
  font-size:1rem;
}

.activeTOC{
  font-weight: 800;
}

@media (min-width: 1350px) {
  #toc { width: 25% }
  body.comments-active #toc { width: 20% } /* a bit smaller when the comment sidebar is visible */
}

#ep_table_of_contents-a button {
  transform: rotateY(180deg);
}