.loader {
  background: 
    linear-gradient(90deg,#0001 33%,#0005 50%,#0001 66%)
    #f2f2f2;
  background-size:300% 100%;
  animation: l1 0.45s infinite linear;
}

@keyframes l1 {
  0% {background-position: right}
}


.lib_wrapper {
  height: 100%;
  overflow: scroll;
  width: max-content;
  position: absolute;
  left: 0;
  top: 0;
  padding: 0.5em 1em;
  padding-bottom: 2.4em;
  overflow-y: hidden;
}

.lib_wrapper .item {
  background: #171717;
  height: 100%;
  width: 12vh;
  display: inline-block;
  border-radius: 4pt;
  cursor: pointer;
}


.lib_wrapper .item.close svg {
  display: block;
  overflow: visible;
  stroke: #636363;
  position: absolute;
  top: 50%;
  width: 1.5em
}


.lib_wrapper .close {
  background: none;
  width: 2.5vh;
  padding: 4pt;

}

.director_wrapper .library .close {
  display: none;
}





::-webkit-scrollbar {
  width: 4pt;
  height: 4pt;
  // background: red;
}


::-webkit-scrollbar-thumb {
  background: #555;
  border-radius: 10pt;
}


html, body {
  touch-action: none;  /* blocks pinch on most elements */
}


.chat_wrapper > .filler {
  max-height: 10%;
}


.active svg{
stroke: #d4f26d !important;
}



.cam_preview {
  min-height: initial !important;
  flex: 1 0 auto !important;
}



@media (max-width: 500px) {
  .lib_wrapper {
    padding: 0.8em 1em;
  }

.lib_wrapper .item:not(.close) {
  width: 18vh;
}

}