.stem-sideMenu { display: inline-block; position: relative; margin: 20px auto; }
    .stem-sideMenu .treeMenu { max-height: 55vh; overflow: auto; margin: 0 auto; padding: 0; width: 100%; }

        .stem-sideMenu .treeMenu ul,
        .stem-sideMenu .treeMenu ol { width: 100%; list-style: none; margin: 0; padding: 0; }

        .stem-sideMenu .treeMenu ol { display: none; }

        .stem-sideMenu .treeMenu > li { display: flex; flex-wrap: wrap; justify-content: space-between; flex-direction: row-reverse; width: 100%; list-style: none; padding: 0; margin: 0 auto; position: relative; z-index: 1; }

            .stem-sideMenu .treeMenu > li > a { display: inline-block; width: 100%; text-decoration: none; padding: 10px; border-bottom: 1px solid #ccc; }
            .stem-sideMenu .treeMenu > li > label { width: 40px; background: transparent url('cat-arrow.png') center center no-repeat; border-left: 1px solid #eee; border-bottom: 1px solid #ccc; cursor: pointer; }
                .stem-sideMenu .treeMenu > li > label + a { width: calc(100% - 40px); }

            .stem-sideMenu .treeMenu > li > input[type=checkbox] { opacity: 0; display: none; }
                .stem-sideMenu .treeMenu > li > input[type=checkbox]:checked ~ ol { display: inline-block; }
                .stem-sideMenu .treeMenu > li > input[type=checkbox]:checked + label { transform: rotate(180deg); border: 0; border-right: 1px solid #eee; border-top: 1px solid #ccc; }

        .stem-sideMenu .treeMenu ol li a { display: inline-block; width: 100%; text-decoration: none; padding: 10px 10px 10px 20px; border-bottom: 1px solid #eee; }