@mixin sidePanelCommon
  position: absolute
  max-height: 600px
  //overflow-y: scroll
  top: 170px
  //z-index: 1

#graph-explorer
  #toolbar
    display: flex
    flex-direction: column

    ul
      display: flex
      flex-direction: row
      margin: 0
      li
        display: flex
        max-width: 200px

  #toggle-container
    position: absolute
    z-index: 999 // needs to appear above solid menu bar
    right: 15px
    top: 10px
    width: 70%

  #controls-container
    position: absolute
    z-index: 999 // needs to appear above graph elements
    backdrop-filter: blur(4px)
    background: rgba(255,255,255,75%)
    overflow: auto
    left: 0
    right: 0

  .graph-tree
    @include sidePanelCommon
    background-color: #fff
    z-index: 1

  #graph-view
    height: 95%

  #sp-container
    @include sidePanelCommon
    border: 1px white solid
    background-color: white
    left: 70%
    width: 28%

    #myTab
      marginBottom: 18px
      marginTop: 18px

    #myTabContent
      borderBottom: 1px solid black
      paddingBottom : 19px

    #horizontal-checkbox
      ul
        display: inline
        float : left

  #tree
    position: absolute
    z-index: 1

.input-with-autocomplete
  .completions
    position: absolute
    max-height: 300px
    overflow-y: scroll
    width: 300px
    top: 50px
    z-index: 5
