/* =====================
  Tokens in Design System
  (following https://medium.com/eightshapes-llc/tokens-in-design-systems-25dd82d58421)
===================== */
/* ==========[ TOKENS ]========== */
/* 1. Texts */
/* 2. Button */
/* 3. Brand */
/* 4. Background */
/* 5. Font */
/* 6. Border */
/* ==========[ DECISION ]========== */
/** VAR OLDS **/
/*-- Colors --*/
/*-- Text & Font --*/
/*-- Border, Shadow --*/
/*-- Main colors --*/
/* width */
::-webkit-scrollbar {
  width: 8px; }

/* Track */
::-webkit-scrollbar-track {
  background: #f1f1f1; }

/* Handle */
::-webkit-scrollbar-thumb {
  background: #dedede;
  border-radius: 8px; }

/* Handle on hover */
::-webkit-scrollbar-thumb:hover {
  background: #cecece; }

.sidebar {
  align-items: stretch; }
  @media (min-width: 767px) {
    .sidebar {
      max-width: 290px; } }
  .sidebar .sidebar-inner {
    position: sticky;
    top: 75px;
    overflow: hidden; }
  .sidebar .sidebar-menu {
    overflow-y: scroll; }
    .sidebar .sidebar-menu h3 {
      text-transform: uppercase;
      font-weight: 600;
      font-size: 16px;
      margin-bottom: 12px; }
    .sidebar .sidebar-menu h5 {
      margin-bottom: 5px;
      font-weight: 600;
      font-size: 15px;
      color: #333;
      text-transform: uppercase; }
    .sidebar .sidebar-menu ul {
      padding-left: 0;
      font-weight: 600;
      padding-bottom: 1px;
      list-style: none; }
      .sidebar .sidebar-menu ul li {
        margin-bottom: 8px; }
        .sidebar .sidebar-menu ul li:last-child {
          margin-bottom: 6px; }
        .sidebar .sidebar-menu ul li a {
          color: #6a737d;
          font-weight: 400;
          display: block;
          font-size: 15px;
          margin-bottom: 10px;
          padding-right: 12px;
          line-height: 1.7; }
          .sidebar .sidebar-menu ul li a:hover {
            text-decoration: underline; }
          .sidebar .sidebar-menu ul li a.active {
            border-right: 4px solid #009f6f;
            color: #009f6f;
            font-weight: bold; }
            .sidebar .sidebar-menu ul li a.active:hover {
              text-decoration: none; }
        .sidebar .sidebar-menu ul li.active a {
          border-right: 4px solid #009f6f;
          color: #009f6f;
          font-weight: bold; }
          .sidebar .sidebar-menu ul li.active a:hover {
            text-decoration: none; }
        .sidebar .sidebar-menu ul li.feature-header:not(:first-child) {
          margin-top: 40px; }
        .sidebar .sidebar-menu ul li.feature-header {
          margin-bottom: 12px; }
  .sidebar .other-features {
    position: relative;
    top: -40px;
    padding-top: 50px; }