@media screen and (min-width: 1261px) {
  .table-of-content {
    position: relative;
  }
  .table-of-content:after {
    position: absolute;
    content: "";
    height: 46px;
    background: transparent linear-gradient(180deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.5490196078) 22%, #FFFFFF 100%) 0% 0% no-repeat padding-box;
    bottom: 0;
    display: block;
    width: 98%;
    margin-left: auto;
  }
  .table-of-content .table-of-content__content > ul {
    border-left: 1px solid #000000;
  }
  .table-of-content .table-of-content__content > ul > li.has-child:after {
    content: "";
    width: 16px;
    height: 16px;
    top: 5px;
    right: 3px;
    position: absolute;
    background: url(../../../../../../../uploads/tenweb-theme/images/icons/arrows/glossary_arrow.svg) no-repeat center;
  }
  .table-of-content .table-of-content__content > ul > li.has-child.active:after {
    transform: rotateZ(-90deg);
  }
  .table-of-content .table-of-content__content > ul > li.active > a {
    position: relative;
  }
  .table-of-content .table-of-content__content > ul > li.active > a:before {
    content: "";
    width: 6px;
    height: 100%;
    top: 0;
    left: 0;
    position: absolute;
    background: #3339F1;
  }
  .table-of-content .table-of-content__content > ul > li.active ul {
    display: flex;
  }
  .table-of-content .table-of-content__content ul {
    gap: 22px;
  }
  .table-of-content .table-of-content__content ul li {
    position: relative;
  }
  .table-of-content .table-of-content__content ul li a {
    padding: 0 24px 0 20px;
  }
  .table-of-content .table-of-content__content ul li:not(.active) a:hover {
    text-decoration: underline;
  }
}