.page-content {
       padding: 40px;
        gap: 60px;
        display: grid;
        grid-template-columns: 20% 80%;
      }
      h1 {
        text-align: center;
      }
      .menu {    
        gap: 10px;
        display: flex;
        flex-direction: column;
        overflow-wrap: anywhere;
      }
      .sub-menu-items > div > a {
        text-decoration: none;
        color: black;
      }
      .sub-menu-items {    
        gap: 10px;
        margin-left: 20px;
        display: grid;
        grid-template-rows: auto;  
        transition: all .3s ease;
      }
      .sub-menu-items > div {
         padding: 5px;
      }
      code {
        white-space: pre-line;
      }
      .sub-menu-items >div:hover {
            background: lightgray;
            cursor: pointer;
      }
      .menu-item  {
        cursor: pointer;
        display: grid;
        grid-auto-flow: column;
        padding: 5px;
        transition: all .3s ease;
      }
      .menu-item:hover {
          background: lightgray;
      }
        .menu-item > div:last-child  {
            text-align: right;
        }
      .menu-item-activated  {
        background: lightcoral;
      }
      .menu-item > a {
        text-decoration: none;
        color: black;
      }
      .code-container {
        background: black;
        color: white;
        padding:20px;
      }
     .overview-text-container {
       overflow-wrap: anywhere;
        padding: 0 40px;
     }
     ul {
        display: grid;
        grid-auto-flow: row;
        gap: 10px;
        list-style-type: decimal;
     }