.sidenav {
  font-size: 0.875rem;
}

.sidenav__link {
  text-decoration: none;
  padding-top: 0.5rem;
  padding-bottom: 0.5rem;
  cursor: pointer;
}

.sidenav__list {
  margin-bottom: 0;
  margin-left: 0;
  list-style: none;
}

.sidenav__categories-list {
  padding-left: 0;
}

.sidenav__articles-list,
.sidenav__sections-list  {
  padding-right: 1.5rem;
  padding-left: 1.5rem;
  border-left: 1px solid #ccc;
  margin-left: 4px;
}

.sidenav__article-name {
  display: block;
  margin-left: -9px;
}

.sidenav__article.is-active > .sidenav__link {
  font-weight: bold;
}

.sidenav__category-name,
.sidenav__section-name {
  display: flex;
  align-items: center;
}

.sidenav__has-sections > .sidenav__link > svg {
  transition: transform 0.2s ease;
  margin-right: 4px;
  margin-left: -4px;
}
.sidenav__has-sections.is-open > .sidenav__link > svg {
  transform: rotate(90deg);
}

/* ==========================================================================
  Mobile Version
  ========================================================================== */

@media (max-width: 991px) {
  .sidenav-open {
    overflow: hidden;
  }

  .sidenav {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 99999;
    width: 85%;
    max-width: 300px;
    height: 100%;
    overflow-y: auto;
    background: #fff;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0);
    transform: translateX(-100%);
  }

  .sidenav.is-active {
    padding-top: 2rem;
    padding-left: 2rem;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
    transition: all 0.3s;
    transform: translateX(0);
  }

}


/* ==========================================================================
Overlay
========================================================================== */

.sidenav-overlay {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 99998;
  width: 100%;
  height: 100%;
  visibility: hidden;
  background: #000;
  opacity: 0;
}

.sidenav-overlay.is-active {
  visibility: visible;
  opacity: 0.1;
  transition: all 0.3s;
}

@media (min-width: 992px) {
  .sidenav-btn.hidden-md {
    display: none !important;
  }

  .sidenav-overlay {
    display: none;
  }
}