:root {
  --youtube-red: #fe0900;
}

html {
  box-sizing: border-box;
  font-family: "YouTube Noto", Roboto, Arial, Helvetica, sans-serif;
  height: 100%;
}

*,
*::before,
*::after {
  box-sizing: inherit;
  margin: 0;
  padding: 0;
}

body {
  height: 100%;
  background-color: #000;
}

.container {
  width: 100%;
  height: 100%;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
}

/*.video-container {*/
/*    !*width: 800px;*!*/
/*    width: 100%;*/
/*    background-color: #000;*/
/*    border-radius: 4px;*/
/*    margin: 0 auto;*/
/*    position: relative;*/
/*    display: flex;*/
/*    flex-direction: column;*/
/*    justify-content: center;*/
/*    height: 100%;*/
/*}*/

.hidden {
  display: none;
}

.invert {
  filter: invert(100%);
}

.invert_advance {
  /*filter: invert(100%);*/
  mix-blend-mode: multiply;
}

/* svg {
  width: 28px;
  height: 28px;
  fill: #fff;
  stroke: #fff;
  cursor: pointer;
} */

.noselect {
  -webkit-touch-callout: none;
  /* iOS Safari */
  -webkit-user-select: none;
  /* Safari */
  -khtml-user-select: none;
  /* Konqueror HTML */
  -moz-user-select: none;
  /* Old versions of Firefox */
  -ms-user-select: none;
  /* Internet Explorer/Edge */
  user-select: none;
  /* Non-prefixed version, currently
                           supported by Chrome, Edge, Opera and Firefox */
}

@media only screen and (max-width: 600px) {}

@media only screen and (max-width: 400px) {}

#lw-container {
  /*width: 800px;*/
  width: 100%;
  background-color: #000;
  border-radius: 4px;
  margin: 0 auto;
  position: relative;
  display: flex;
  flex-direction: column;
  justify-content: center;
  height: 100%;
}

#playGround {
  position: absolute;

  /*left: 0px;*/
  /*top: 0px;*/
  /*overflow: scroll;*/
  transform-origin: 0px 0px;
  z-index: 1;
  /*width: 948px;*/
  /*height: 570px;*/
  /*transform: translate(10px, 178px);*/
  overflow: hidden;
  /*background-color: #7E2EA0;*/
}

#bottomControls {
  position: absolute;
  bottom: 0px;
  height: 30px;
  width: 100%;
}

#bottomControlsRight {
  right: 0px;
  position: absolute;
  width: 180px;
}

#btnPrevious {
  background-color: rgba(255, 255, 255, 0);
  border: none;
  cursor: pointer;
  color: rgba(125, 125, 125, 1);
  font-size: 18px;
  width: 80px;
}

#btnNext {
  background-color: rgba(255, 255, 255, 0);
  border: none;
  cursor: pointer;
  color: rgba(125, 125, 125, 1);
  font-size: 18px;
  width: 80px;
}

/* 
text {
  border: 12px solid transparent;
} */

text>ul {
  padding-left: 50px;
}