/*this part is for the image on the side*/
.l-side {
    float: right;
    position: relative;
    left: 11em;
    margin-left: -11em;
    width: 450px;
    padding-left: 1em;
    margin-bottom: 0em !important;
    padding-bottom: 1em;
  }


@media (max-width: 1180px) {
    .l-side {
      float: none;
      left: 0;
      margin-left: none;
      padding-left: none;
      width: 100%;
    }
  }


  d-article p{
  clear: left;
}


/*this part is for the counters */
d-title{counter-reset: section equation figure;}



d-equation span .katex-display span.katex span.katex-html::after{
  counter-increment: equation;
  content: "(" counter(equation) ")";
  float: right;
  line-height: 200%;
}

.section::before {
  counter-increment: section;                 
  content: counter(section) " ";  
}

d-section{counter-reset: subsection;}

.subsection::before {
  counter-increment: subsection;                 
  content: counter(section) "." counter(subsection) " ";  
} 

figcaption::before{
  counter-increment: figure;
  content: "Figure " counter(figure) ": ";
}


/* table of contents */
@media (max-width: 1000px) {
  d-contents {
    justify-self: start;
    align-self: start;
    grid-column-start: 2;
    grid-column-end: 6;
    padding-bottom: 0.5em;
    margin-bottom: 1em;
    padding-left: 0.25em;
    border-bottom: 1px solid rgba(0, 0, 0, 0.1);
    border-bottom-width: 1px;
    border-bottom-style: solid;
    border-bottom-color: rgba(0, 0, 0, 0.1);
  }
}

@media (min-width: 1000px) {
  d-contents {
    align-self: start;
    grid-column-start: 1;
    grid-column-end: 4;
    justify-self: end;
    padding-right: 3em;
    padding-left: 2em;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: rgba(0, 0, 0, 0.1);
  }
}

@media (min-width: 1180px) {
  d-contents {
    grid-column-start: 1;
    grid-column-end: 4;
    justify-self: end;
    padding-right: 3em;
    padding-left: 2em;
    border-right: 1px solid rgba(0, 0, 0, 0.1);
    border-right-width: 1px;
    border-right-style: solid;
    border-right-color: rgba(0, 0, 0, 0.1);
  }
}

d-contents nav h3 {
  margin-top: 0;
  margin-bottom: 1em;
}

d-contents nav a {
  color: rgba(0, 0, 0, 0.8);
  border-bottom: none;
  text-decoration: none;
}

d-contents li {
  list-style-type: none;
}

d-contents ul {
  padding-left: 1em;
}

d-contents nav ul li {
  margin-bottom: 0.25em;
}

d-contents nav a:hover {
  text-decoration: underline solid rgba(0, 0, 0, 0.6);
}

d-contents nav ul {
  margin-top: 0;
  margin-bottom: 6px;
}

d-contents nav > div {
  display: block;
  outline: none;
  margin-bottom: 0.5em;
}

d-contents nav > div > a {
  font-size: 13px;
  font-weight: 600;
}

d-contents nav > div > a:hover, d-contents nav > ul > li > a:hover {
  text-decoration: none;
}