.menuIconButton{
    color: var(--theme-text-color); 
    background-color: var(--card-background);
    border-radius: 8px;
    padding-top: 3px;
    padding-bottom: 3px;
    padding-right: 8px;
    padding-left: 8px;
}

.menuSection{
    min-width: inherit;
    font-size: 1.7em;
    background: var(--card-background);
    border: 3px inset var(--docked-drawer-background);
    display: inline-flex;
    vertical-align: top;
}

.menuSection:hover{
    opacity: 0.5;
}

.menuButton{
    padding: 8px 8px;
    padding-right: 1em;
    width: 100%;
    text-align: left;
    display: flex;
    align-items: center;
    position: relative;
    background-color: inherit;
    color: var(--theme-text-color);
    border: 0;
}
.menuButton:hover {
    background-color: var(--theme-button-hover-color);
    cursor: pointer;    
}
.menuItem:{
    position: relative;
}

.menuList{
    margin: 0;
    display: block;
    padding: 0;
    list-style-type: none;
}
.menuList + .menuList{
        border-top: 1px solid #ddd;
}
.menuPanel{
    display: flex;
    flex-direction: column;
}
.menuCanvas{
    position: absolute;
    padding-top: 13px;
    padding-bottom: 13px;
    top: 0px;
    left:0px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    background-color: var(--drawer-background);
    opacity: 1.0;
    border: var(--line-size) solid var(--line-background) 
}

.listItemHide{
    display: none;
}
.listItemShow{
    display: flex;
}



.listItem{
  background:0 0;
  border:0;
  outline:0!important;
  color:inherit;
  vertical-align:middle;
  font-family:inherit;
  font-size:inherit;
  margin:0;
  display:-webkit-box;
  display:-webkit-flex;
  display:flex;
  -webkit-box-align:center;
  -webkit-align-items:center;
  align-items:center;
  text-align:left;
  padding:.25em 0;
  overflow:hidden;
  -webkit-flex-shrink:0;
  flex-shrink:0;
  text-decoration:none;
  line-height:inherit
}
.listItem.dragging-over{
  position:relative
}
.dragging-over-top:before{
  content:' ';
  height:.1em;
  width:100%;
  position:absolute;
  top:0;
  z-index:99999;
  -webkit-border-radius:100em;
  border-radius:100em
}
.dragging-over-bottom:after{
  content:' ';
  height:.1em;
  width:100%;
  position:absolute;
  bottom:0;
  z-index:99999;
  -webkit-border-radius:100em;
  border-radius:100em
}
.listItem-noverticalpadding{
  padding-top:0;
  padding-bottom:0
}
.listItemCursor{
  cursor:pointer
}
@media (pointer:coarse){
  .listItem-touchzoom-transition{
    -webkit-transition:-webkit-transform .1s ease-in-out;
    -o-transition:transform .1s ease-in-out;
    transition:transform .1s ease-in-out;
    -webkit-transition-delay:80ms;
    -o-transition-delay:80ms;
    transition-delay:80ms
  }
  .listItem-touchzoom:active{
    -webkit-transform:scale(.94);
    transform:scale(.94)
  }
}
.listItem-largeImage{
  padding:1em 0
}
.listItem-withContentWrapper{
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
  -webkit-flex-direction:column;
  flex-direction:column;
  -webkit-box-align:start;
  -webkit-align-items:flex-start;
  align-items:flex-start
}
.listItem-content{
  display:-webkit-box;
  display:-webkit-flex;
  display:flex;
  -webkit-box-align:center;
  -webkit-align-items:center;
  align-items:center;
  width:100%
}
.listItem-indexnumberleft{
  margin-right:1em;
  margin-left:.5em
}
.listItem-border{
  border-bottom-width:.08em;
  border-bottom-style:solid
}
.paperListItem:last-child{
  border-bottom-style:none
}
.listItemAside,.listItemIcon,.listItemImageContainer{
  -webkit-flex-shrink:0;
  flex-shrink:0
}
.listItemButton{
  margin:0;
  -webkit-flex-shrink:0;
  flex-shrink:0;
  contain:layout style
}
@media (pointer:coarse){
  .listItemContextMenuButton{
    display:none
  }
}
.listItemBody{
  -webkit-box-flex:1;
  -webkit-flex-grow:1;
  flex-grow:1;
  padding:.35em .75em;
  overflow:hidden;
  -o-text-overflow:ellipsis;
  text-overflow:ellipsis;
  -webkit-box-orient:vertical;
  -webkit-box-direction:normal;
  -webkit-flex-direction:column;
  flex-direction:column;
  vertical-align:middle;
  -webkit-box-pack:center;
  -webkit-justify-content:center;
  justify-content:center;
  text-align:left;
  -webkit-box-align:initial;
  -webkit-align-items:initial;
  align-items:initial;
  margin:0
}
.listItemBody-noleftpadding{
  padding-left:0!important
}
.listItemBody-code{
  font-family:monospace
}
.listItemBody-noverticalpadding{
  padding-top:0;
  padding-bottom:0
}
.listItemBodyText{
  margin:0;
  overflow:hidden;
  -o-text-overflow:ellipsis;
  text-overflow:ellipsis
}
.listItemBodyText-nowrap{
  white-space:nowrap
}
.listItemImageContainer{
  width:3.26em;
  height:3.26em;
  position:relative;
  display:-webkit-box;
  display:-webkit-flex;
  display:flex;
  -webkit-box-align:center;
  -webkit-align-items:center;
  align-items:center;
  -webkit-box-pack:center;
  -webkit-justify-content:center;
  justify-content:center;
  -webkit-border-radius:.3em;
  border-radius:.3em
}
.listItemImage{
  -webkit-border-radius:.3em;
  border-radius:.3em;
  width:100%;
  height:100%;
  -o-object-fit:contain;
  object-fit:contain
}
.listItemImage-round,.listItemImageContainer-round{
  -webkit-border-radius:100em;
  border-radius:100em
}
.listItemImageContainer-large{
  width:20vw;
  height:11.25vw;
  margin-right:.35em
}
.listItemImageButton{
  margin:0;
  color:rgba(255,255,255,.6);
  font-size:1.5em;
  background:0 0;
  -webkit-transition:-webkit-transform .2s ease-in-out;
  -o-transition:transform .2s ease-in-out;
  transition:transform .2s ease-in-out;
  display:-webkit-box;
  display:-webkit-flex;
  display:flex;
  position:absolute;
  top:50%;
  left:50%;
  margin-left:-2em;
  margin-top:-2em
}
@media(hover:hover) and (pointer:fine){
  .listItemImageButton:hover{
    -webkit-transform:scale(1.2,1.2);
    transform:scale(1.2,1.2)
  }
}
.listItemImageButton-icon{
  background:rgba(0,0,0,.4);
  border:.08em solid currentColor;
  -webkit-border-radius:100em;
  border-radius:100em;
  display:-webkit-box;
  display:-webkit-flex;
  display:flex;
  -webkit-box-pack:center;
  -webkit-justify-content:center;
  justify-content:center;
  -webkit-box-align:center;
  -webkit-align-items:center;
  align-items:center;
  padding:.21em
}
@media all and (max-width:64em){
  .listItemImageContainer-large{
    width:33.75vw;
    height:18.984375vw
  }
  .listItemImageButton{
    font-size:1.02em!important
  }
}
.listItemImageContainer-large-tv{
  width:30vw!important;
  height:16.875vw!important
}
.listItemIcon{
  width:1em!important;
  height:1em!important;
  font-size:163%;
  padding:0 .25em
}
.listItemImageContainer>.listItemIcon{
  margin:0
}
.listViewDragHandle{
  touch-action:none;
  padding:1em
}
.listItemProgressBar{
  position:absolute!important;
  bottom:0;
  left:0;
  right:0
}
.listItem:focus{
  -webkit-border-radius:.42em;
  border-radius:.42em
}
.listItem:focus .secondary{
  color:inherit!important
}
.listItem-focusscale{
  -webkit-transition:-webkit-transform .2s ease-out;
  -o-transition:transform .2s ease-out;
  transition:transform .2s ease-out
}
.listItem-focusscale:focus{
  -webkit-transform:scale(1.025,1.025);
  transform:scale(1.025,1.025)
}
.paperList{
  margin:.5em auto;
  -webkit-border-radius:.3em;
  border-radius:.3em
}
.paperList-clear{
  background-color:transparent!important
}
.paperList .listItemImageContainer{
  margin:0 .25em 0 1em
}
.listItemMediaInfo{
  display:none;
  -webkit-box-align:center;
  -webkit-align-items:center;
  align-items:center;
  margin-right:1em;
  -webkit-flex-shrink:0;
  flex-shrink:0
}
.listGroupHeader-first{
  margin-top:0
}
.listItemIndicators{
  right:.324em;
  top:.324em;
  position:absolute;
  display:-webkit-box;
  display:-webkit-flex;
  display:flex;
  -webkit-box-align:center;
  -webkit-align-items:center;
  align-items:center
}
.listItem,.listItemBody,.listItemMediaInfo{
  display:-webkit-box;
  display:-webkit-flex;
  display:flex;
  contain:layout style
}
.listItem-bottomoverview{
  font-size:88%;
  margin-top:.2em
}
@media not all and (min-width:50em){
  .listItem-overview{
    display:none!important
  }
}
@media all and (min-width:50em){
  .listItem-bottomoverview{
    display:none!important
  }
}
.listItemCheckboxContainer{
  width:auto!important
}
@media all and (max-width:75em){
  .listViewUserDataButtons{
    display:none!important
  }
}
.listItemPlayedIndicator{
  font-size:1.6em
}
.listItem .mediaStreamAttribute{
  padding-left:2.3em
}
@media(pointer:coarse){
  .listItem-textActionButton{
    pointer-events:none!important
  }
}
