/*adapted from Miletić (2022, April 18). The Distillery: A poor man's TOC in {distill}. Retrieved from https://radovan-miletic.github.io/distill-blog/ */

d-article {
    contain: none;
  }

/* Sidebar Navigation */
#TOC {
  opacity: 0.8;
  position: fixed;
  left: calc(5%);
  top: calc(5.5%);
  width: 20%;
  max-width: 150px;
  max-height: 85%;
  overflow-y: auto;
  background: white;            /* Optional, remove to enable the blur filter (just for fun). */
  backdrop-filter: blur(10px);  /* Optional, wouldn't not work with Firefox browser. */
  padding: 10px;                /* Optional */
  /* border-right: 1px solid rgba(0, 0, 0, 0.1); */
  border: 1px solid rgba(0, 0, 0, 0.1);
  /* border-radius: 1px; */
  transition: all 0.5s;
  z-index: 999;                 /* Optional */
  }

/* Hide the TOC when resized to mobile or tablet:  480px, 768px, 900px */
@media screen and (max-width: 1200px) {
#TOC {
    left: 0;
    top: 0;
    padding: 0;
    width: 90%;
    position: relative;
    max-width: none;
    max-height: none;
    overflow-y: auto;
    border: none;
    background: none; }
  }
  
/* ScrollSpy active styles (uses javascript) */
.d-contents nav ul li.active > a { 
    font-weight: bold;  
    /* border-left: 1px solid #2780e3; */
    color: #0f2e3d !important;
  }

/* 💡 This small transition makes setting of the active state smooth */
.d-contents nav a {
      transition: all 0.1s ease-in-out;
  }