mistserver/embed/mist.css

.mistvideo {
  background: black center none no-repeat;
  /*LTS
  background-size: auto 30%;
  background-image: url('data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiBpZD0ic3ZnNTI4MCIgaGVpZ2h0PSIxNTAiIHdpZHRoPSIyMDIuNTIwMTciIHZlcnNpb249IjEuMSI+PGRlZnMgaWQ9ImRlZnM1MjgyIiAvPjxtZXRhZGF0YSBpZD0ibWV0YWRhdGE1Mjg1Ij48cmRmOlJERj48Y2M6V29yayByZGY6YWJvdXQ9IiI+PGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+PGRjOnR5cGUgcmRmOnJlc291cmNlPSJodHRwOi8vcHVybC5vcmcvZGMvZGNtaXR5cGUvU3RpbGxJbWFnZSIgLz48ZGM6dGl0bGU+PC9kYzp0aXRsZT48L2NjOldvcms+PC9yZGY6UkRGPjwvbWV0YWRhdGE+PGcgaWQ9ImxheWVyMSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoLTQ4LjcyNjIzNCwtNDQ5Ljc1MjA0KSI+PHBhdGggc3R5bGU9ImZpbGw6IzhjYjNjZjtmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6bm9uemVybztzdHJva2U6bm9uZSIgaWQ9InBhdGg0NiIgZD0ibSA2OS4wODIxNTMsNTM0LjI1MzE0IDgxLjAyODYzNyw0My4yNjQ4OCA4MS4wMjYwNSwtNDMuMjY0ODggLTMwLjUwNzA3LC02OS4wMDg5NCAtMTAxLjAzOTA2OCwwIC0zMC41MDg1NDksNjkuMDA4OTQgMCwwIHogbSA4MS4wMjg2MzcsNTAuMTE3MzIgLTg4LjgyNjQ4NiwtNDcuNDMwODggMzQuMzY5NDE4LC03Ny43NDA3OSAxMDguOTEzNTY4LDAgMzQuMzY5MDUsNzcuNzQwNzkgLTg4LjgyNTU1LDQ3LjQzMDg4IDAsMCIgLz48cGF0aCBzdHlsZT0iZmlsbDojYjVkM2UyO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDQ4IiBkPSJtIDIzNC44NzM1Miw1MzguMDM5NTkgLTE2Ni43NTE1MTksMCAwLC02LjA0NTQxIDE2Ni43NTE1MTksMCAwLDYuMDQ1NDEiIC8+PHBhdGggc3R5bGU9ImZpbGw6IzhjYjNjZjtmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6bm9uemVybztzdHJva2U6bm9uZSIgaWQ9InBhdGg1MCIgZD0ibSA4My40ODcwMDksNTM1LjUyMDgyIGMgMCw5LjU5OTY4IC03Ljc4MTA4LDE3LjM4MDc1IC0xNy4zNzk2NTEsMTcuMzgwNzUgLTkuNTk5MTIyLDAgLTE3LjM4MTEyNCwtNy43ODEwNiAtMTcuMzgxMTI0LC0xNy4zODA3NSAwLC05LjU5Nzg0IDcuNzgyMDAyLC0xNy4zODA3NiAxNy4zODExMjQsLTE3LjM4MDc2IDkuNTk4NTcxLDAgMTcuMzc5NjUxLDcuNzgyOTIgMTcuMzc5NjUxLDE3LjM4MDc2IiAvPjxwYXRoIHN0eWxlPSJmaWxsOiM4Y2IzY2Y7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoNTIiIGQ9Im0gMjUxLjI0NjQsNTM1LjUyMDgyIGMgMCw5LjU5OTY4IC03Ljc4MTA3LDE3LjM4MDc1IC0xNy4zODA3NCwxNy4zODA3NSAtOS41OTk2OCwwIC0xNy4zNzg5MiwtNy43ODEwNiAtMTcuMzc4OTIsLTE3LjM4MDc1IDAsLTkuNTk3ODQgNy43NzkyNCwtMTcuMzgwNzYgMTcuMzc4OTIsLTE3LjM4MDc2IDkuNTk5NjcsMCAxNy4zODA3NCw3Ljc4MjkyIDE3LjM4MDc0LDE3LjM4MDc2IiAvPjxwYXRoIHN0eWxlPSJmaWxsOiNiNWQzZTI7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoNTQiIGQ9Im0gMTU1Ljc4NzY4LDUzNy4xODI4IC01LjA1MjI4LC0zLjMyMjEyIDQ5LjM3MTA4LC03NS4wNjM1NiA1LjA1MDQzLDMuMzIyMTEgLTQ5LjM2OTIzLDc1LjA2MzU3IDAsMCIgLz48cGF0aCBzdHlsZT0iZmlsbDojYjVkM2UyO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDU2IiBkPSJtIDE0OC43ODYsNTM3Ljc4MTYyIC01Mi44OTY5NzcsLTc0LjA1NTY5IDQuOTE5NDE3LC0zLjUxNTU4IDUyLjg5NTMzLDc0LjA1NzU0IC00LjkxNzc3LDMuNTEzNzMgMCwwIiAvPjxwYXRoIHN0eWxlPSJmaWxsOiM4Y2IzY2Y7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoNTgiIGQ9Im0gMjE0LjU5NjI4LDQ2Mi41OTgyOSBjIDAsNy4wOTc1IC01Ljc1MjQyLDEyLjg0ODEgLTEyLjg0NjI0LDEyLjg0ODEgLTcuMDk1NjUsMCAtMTIuODQ2MjUsLTUuNzUwNiAtMTIuODQ2MjUsLTEyLjg0ODEgMCwtNy4wOTM4MSA1Ljc1MDYsLTEyLjg0NjI1IDEyLjg0NjI1LC0xMi44NDYyNSA3LjA5MzgyLDAgMTIuODQ2MjQsNS43NTI0NCAxMi44NDYyNCwxMi44NDYyNSIgLz48cGF0aCBzdHlsZT0iZmlsbDojOGNiM2NmO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDYwIiBkPSJtIDExMS44MjQ4NCw0NjIuNTk4MjkgYyAwLDcuMDk3NSAtNS43NTEzMywxMi44NDgxIC0xMi44NDU4NzMsMTIuODQ4MSAtNy4wOTUyODUsMCAtMTIuODQ3NTMyLC01Ljc1MDYgLTEyLjg0NzUzMiwtMTIuODQ4MSAwLC03LjA5MzgxIDUuNzUyMjQ3LC0xMi44NDYyNSAxMi44NDc1MzIsLTEyLjg0NjI1IDcuMDk0NTQzLDAgMTIuODQ1ODczLDUuNzUyNDQgMTIuODQ1ODczLDEyLjg0NjI1IiAvPjxwYXRoIHN0eWxlPSJmaWxsOiM4Y2IzY2Y7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoNjIiIGQ9Im0gMTY4Ljg3NzE0LDQ4Ny41MzUzNSBjIDAsOS4zOTE0NSAtNy42MTE1NywxNy4wMDQ4NyAtMTcuMDAxMTksMTcuMDA0ODcgLTkuMzg5NjMsMCAtMTcuMDAzMDQsLTcuNjEzNDIgLTE3LjAwMzA0LC0xNy4wMDQ4NyAwLC05LjM4OTYyIDcuNjEzNDEsLTE3LjAwMTIgMTcuMDAzMDQsLTE3LjAwMTIgOS4zODk2MiwwIDE3LjAwMTE5LDcuNjExNTggMTcuMDAxMTksMTcuMDAxMiIgLz48cGF0aCBzdHlsZT0iZmlsbDojYjVkM2UyO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDY0IiBkPSJtIDE2NS44NTUzNiw1MzYuNDAxNTYgYyAwLDcuNzIzOTYgLTYuMjU5MTMsMTMuOTgxMjYgLTEzLjk3OTQxLDEzLjk4MTI2IC03LjcyMDI5LDAgLTEzLjk4MTI2LC02LjI1NzMgLTEzLjk4MTI2LC0xMy45ODEyNiAwLC03LjcyMDI5IDYuMjYwOTcsLTEzLjk3OTQxIDEzLjk4MTI2LC0xMy45Nzk0MSA3LjcyMDI4LDAgMTMuOTc5NDEsNi4yNTkxMiAxMy45Nzk0MSwxMy45Nzk0MSIgLz48cGF0aCBzdHlsZT0iZmlsbDojOGNiM2NmO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDY2IiBkPSJtIDY4LjMzNTczNiw1MzcuNDA1NzQgLTIuOTQ1ODY2LC01LjI4MDc0IDgzLjg3ODg4LC00Ny45ODU0NyA0LjQ1NzEyLDYuNzkxNjIgLTg1LjM5MDEzNCw0Ni40NzQ1OSAwLDAiIC8+PHBhdGggc3R5bGU9ImZpbGw6IzhjYjNjZjtmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6bm9uemVybztzdHJva2U6bm9uZSIgaWQ9InBhdGg2OCIgZD0ibSAxNDkuNDY5NTgsNDkwLjY1NDc3IC01Mi4xNDE3MjQsLTI1LjMxNDc2IDIuNTQ1NjY5LC01LjQ4MTU5IDUzLjY1MzM1NSwyMy44MDIwNCAtMy4zMDE4NSw2LjIzODg3IC0wLjc1NTQ1LDAuNzU1NDQiIC8+PHBhdGggc3R5bGU9ImZpbGw6IzhjYjNjZjtmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6bm9uemVybztzdHJva2U6bm9uZSIgaWQ9InBhdGg3MCIgZD0ibSAxNDkuNDE0Myw0ODQuMDYzOTcgNTEuMDA3MjYsLTIzLjgwMjAzIDIuNjU1MSw1LjQyOTk5IC00OS40OTYzNSwyNS4zMTQ3NyIgLz48cGF0aCBzdHlsZT0iZmlsbDojOGNiM2NmO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDcyIiBkPSJtIDIzMy4wOTM2Miw1MzguNTA3NTggLTgzLjg4MDE2LC00Ny45ODU0NyA0LjU2NzY4LC02LjcyNzE0IDgyLjM2NzQzLDQ5LjQ5NjM3IC0zLjA1NDk1LDUuMjE2MjQgMCwwIiAvPjxwYXRoIHN0eWxlPSJmaWxsOiM4Y2IzY2Y7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOm5vbnplcm87c3Ryb2tlOm5vbmUiIGlkPSJwYXRoNzQiIGQ9Im0gMTU0LjUyMDAxLDU4MC40ODQ1MiAtNi44MDA4NCwwIC0yLjI2NjM0LC05My43MDI3OCAxMS4zMzUzNiwwIC0yLjI2ODE4LDkzLjcwMjc4IDAsMCIgLz48cGF0aCBzdHlsZT0iZmlsbDojOGNiM2NmO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lIiBpZD0icGF0aDc2IiBkPSJtIDE2OC4xMjE2OSw1ODIuMzczMTMgYyAwLDkuNTk5NjggLTcuNzgxMDcsMTcuMzc4OTEgLTE3LjM4MDc1LDE3LjM3ODkxIC05LjU5Nzg0LDAgLTE3LjM3ODkxLC03Ljc3OTIzIC0xNy4zNzg5MSwtMTcuMzc4OTEgMCwtOS41OTk2OCA3Ljc4MTA3LC0xNy4zODA3NiAxNy4zNzg5MSwtMTcuMzgwNzYgOS41OTk2OCwwIDE3LjM4MDc1LDcuNzgxMDggMTcuMzgwNzUsMTcuMzgwNzYiIC8+PC9nPjwvc3ZnPg==');
  LTS*/
  display: inline-block;
  color: white;
  font-family: sans-serif;
  text-align: center;
}
.mistvideo[data-loading] {
  background-image: none;
  position: relative;
  min-width: 70px;
  min-height: 70px;
}
.mistvideo[data-loading]:before {
  content: '';
  display: block;
  width: 25px;
  height: 25px;
  border: 5px solid transparent;
  border-radius: 25px;
  border-top-color: white;
  border-left: 0px;
  opacity: 0.8;
  animation: spin 1.5s infinite linear;
  margin: -15px 0 0 -12.5px;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 5;
}
.mistvideo .error {
  margin: 225px 20px 20px;
}
.mistvideo .error button {
  margin: 5px auto;
  display: block;
}
.mistplayer {
  position: relative;
  overflow: hidden;
}
.mistplayer[data-hide] {
  cursor: none;
}
.mistplayer .html5_player {
  display: block;
  margin: 0 auto;
}
.mistplayer .controls {
  height: 75px;
  background-color: black;
  opacity: 0.6;
  position: absolute;
  left: 1px;
  right: 1px;
  bottom: -75px;
  display: flex;
  align-items: center;
}
.mistplayer:hover:not([data-hide]) .controls {
  bottom: 0;
}
.mistplayer.audio {
  width: 500px;
}
.mistplayer.audio .controls {
  position: static;
}
.mistplayer:not(:hover) .controls,
.mistplayer[data-hide] .controls {
  transition: bottom 0.5s ease-in 1s;
}
.mistplayer video {
  display: block;
}
.mistplayer .controls .row {
  display: flex;
  flex-flow: row nowrap;
}
.mistplayer .controls .column {
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
}
.mistplayer .controls .row .button {

}
.mistplayer .controls .row .button:not(:first-child) {
  margin-left: 0;
}
.mistplayer .controls .button {
  cursor: pointer;
  width: 45px;
  line-height: 45px;
  font-size: 16px;
  position: relative;
  background: transparent center none no-repeat;
}
.mistplayer .controls .button.play {
  height: 45px;
  margin-left: 15px;
}
.mistplayer .controls .button.play[data-state=playing] {
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2ZXJzaW9uPSIxLjEiIGlkPSJzdmcyIiBoZWlnaHQ9IjQ1IiB3aWR0aD0iNDUiPjxkZWZzIGlkPSJkZWZzNCIgLz48bWV0YWRhdGEgaWQ9Im1ldGFkYXRhNyI+PHJkZjpSREY+PGNjOldvcmsgcmRmOmFib3V0PSIiPjxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PjxkYzp0eXBlIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+PGRjOnRpdGxlPjwvZGM6dGl0bGU+PC9jYzpXb3JrPjwvcmRmOlJERj48L21ldGFkYXRhPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTEwMDcuMzYyMikiIGlkPSJsYXllcjEiPjxnIHN0eWxlPSJmaWxsOiNmZmYiIHRyYW5zZm9ybT0idHJhbnNsYXRlKDMuMDMwNDU3NSw0Ny43Mjk3MDUpIiBpZD0iZzM3NzkiPjxwYXRoIGlkPSJwYXRoMzgyMy03IiBkPSJtIDQuNDY5NTQyOSw5OTguMTYzNzcgYSA0LjAwMTE5MTYsNC4wMDExOTE2IDAgMCAwIDMuNzQ5OTk5LDMuOTY4NzMgbCAyLjI4MTI1MDEsMCBhIDQuMDAxMTkxNiw0LjAwMTE5MTYgMCAwIDAgMy45Njg3NSwtMy43NTAwMyBsIDAsLTMyLjI4MTIzIGEgNC4wMDExOTE2LDQuMDAxMTkxNiAwIDAgMCAtMy43NSwtMy45Njg3NSBsIC0yLjI4MTI1MDEsMCBhIDQuMDAxMTkxNiw0LjAwMTE5MTYgMCAwIDAgLTMuOTY4NzQ5LDMuNzUgbCAwLDMyLjI4MTI4IHoiIHN0eWxlPSJmaWxsOiNmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+PHBhdGggaWQ9InBhdGgzODIzLTctNCIgZD0ibSAyNC40Njk1NDIsOTk4LjE2MzggYSA0LjAwMTE5MTYsNC4wMDExOTE2IDAgMCAwIDMuNzUsMy45Njg3IGwgMi4yODEyNSwwIGEgNC4wMDExOTE2LDQuMDAxMTkxNiAwIDAgMCAzLjk2ODc1LC0zLjc1IGwgMCwtMzIuMjgxMjYgYSA0LjAwMTE5MTYsNC4wMDExOTE2IDAgMCAwIC0zLjc1LC0zLjk2ODc1IGwgLTIuMjgxMjUsMCBhIDQuMDAxMTkxNiw0LjAwMTE5MTYgMCAwIDAgLTMuOTY4NzUsMy43NSBsIDAsMzIuMjgxMzEgeiIgc3R5bGU9ImZpbGw6I2ZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz48L2c+PC9nPjwvc3ZnPg==");
}
.mistplayer .controls .button.play[data-state=paused] {
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2ZXJzaW9uPSIxLjEiIGlkPSJzdmcyIiBoZWlnaHQ9IjQ1IiB3aWR0aD0iNDUiPjxkZWZzIGlkPSJkZWZzNCIgLz48bWV0YWRhdGEgaWQ9Im1ldGFkYXRhNyI+PHJkZjpSREY+PGNjOldvcmsgcmRmOmFib3V0PSIiPjxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PjxkYzp0eXBlIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+PGRjOnRpdGxlPjwvZGM6dGl0bGU+PC9jYzpXb3JrPjwvcmRmOlJERj48L21ldGFkYXRhPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTEwMDcuMzYyMikiIGlkPSJsYXllcjEiPjxwYXRoIHRyYW5zZm9ybT0ibWF0cml4KDEuMDE0MTgyNywtMC41ODU1Mzg2NywwLjU4NTUzODY3LDEuMDE0MTgyNywtMC40ODQxOTgzMSwxMDIyLjg4OTMpIiBkPSJNIDEwLjMxMjUsLTYuMzQzNzUgQSAyLjk0MTYxODYsMi45NDE2MTg2IDAgMCAwIDcuOTA2MjUsLTQuODc1IGwgLTE0LjEyNSwyNC41IGEgMi45NDE2MTg2LDIuOTQxNjE4NiAwIDAgMCAyLjU2MjUsNC40MDYyNSBsIDI4LjI4MTI1LDAgQSAyLjk0MTYxODYsMi45NDE2MTg2IDAgMCAwIDI3LjE1NjI1LDE5LjYyNSBMIDEzLC00Ljg3NSBhIDIuOTQxNjE4NiwyLjk0MTYxODYgMCAwIDAgLTIuNjg3NSwtMS40Njg3NSB6IiBpZD0icGF0aDM4MDkiIHN0eWxlPSJmaWxsOiNmZmY7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOmV2ZW5vZGQ7c3Ryb2tlOm5vbmUiIC8+PC9nPjwvc3ZnPg==");
}
.mistplayer .controls .progress_container {
  flex-grow: 1;
  position: relative;
  margin: 15px;
}
.mistplayer .controls .button.progress {
  height: 15px;
  border: 1px solid white;
  overflow: hidden;
  width: auto;
  margin: 0;
}
.mistplayer .controls .button.progress .bar {
  background-color: white;
  position: absolute;
  width: 0;
  top: 0;
  bottom: 0;
  left: 0;
}
.mistplayer .controls .button.progress .buffer {
  background-color: white;
  opacity: 0.5;
  position: absolute;
  top: 0;
  bottom: 0;
}
.mistplayer .controls .progress_container .hint {
  position: absolute;
  background: white;
  border-radius: 5px;
  bottom: 22px;
  padding: 3px 5px;
  color: black;
  opacity: 0.6;
  display: none;
  font-size: 12px;
}
.mistplayer .controls .progress_container .hint:after {
  content: '';
  display: block;
  position: absolute;
  left: 0;
  border: 5px solid transparent;
  border-left-color: white;
  bottom: -5px;
}
.mistplayer .controls .button.timestamp {
  width: auto;
  cursor: default;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mistplayer .controls .button.sound {
  height: 65px;
  width: 30px;
  margin-left: 20px;
  position: relative;
  background: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2ZXJzaW9uPSIxLjEiIGlkPSJzdmczOTM3IiBoZWlnaHQ9IjY1IiB3aWR0aD0iMzAiPjxkZWZzIGlkPSJkZWZzMzkzOSIgLz48bWV0YWRhdGEgaWQ9Im1ldGFkYXRhMzk0MiI+PHJkZjpSREY+PGNjOldvcmsgcmRmOmFib3V0PSIiPjxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PjxkYzp0eXBlIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+PGRjOnRpdGxlPjwvZGM6dGl0bGU+PC9jYzpXb3JrPjwvcmRmOlJERj48L21ldGFkYXRhPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTk4Ny4zNjIyKSIgaWQ9ImxheWVyMSI+PHBhdGggaWQ9InJlY3Q0Njc0IiBkPSJtIDAsMTA1Mi4zNjIyIDAsLTY1IDUsMCBjIC0wLjE3MjU4OCwwIC0wLjMzNzI1NiwwLjAyOTUgLTAuNSwwLjA2MjUgLTAuNDg5MTExLDAuMSAtMC45NDIzNDUsMC4zMTcyNSAtMS4yODEyNSwwLjY1NjI1IC0wLjIyNjIwNiwwLjIyNjIgLTAuNDA0NzQzLDAuNTEzNSAtMC41MzEyNSwwLjgxMjUgLTAuMTI2NTA3LDAuMjk5MSAtMC4xODc1LDAuNjIzNjUgLTAuMTg3NSwwLjk2ODc1IDAsMCAwLjA3NTk3OCwwLjQ0NzA1IDAuMTg3NSwwLjc4MTI1IGwgMTkuODQzNzUsNTkuNDk5OTUgYyAwLjE0Mjc3NywxLjI0NTEgMS4xODU0MTQsMi4yMTg4IDIuNDY4NzUsMi4yMTg4IGwgLTI1LDAgeiBtIDI1LDAgYyAwLjg3NzU0OSwwIDEuNjQ3NjYzLC0wLjQ0MSAyLjA5Mzc1LC0xLjEyNSAwLjA2MzgxLC0wLjA5OCAwLjEwNjIsLTAuMjA0NiAwLjE1NjI1LC0wLjMxMjUgMC4wMjk2MiwtMC4wNjIgMC4wNjkyNiwtMC4xMjI1IDAuMDkzNzUsLTAuMTg3NSAwLjA0NTAxLC0wLjEyMTIgMC4wNjc0MSwtMC4yNDU5IDAuMDkzNzUsLTAuMzc1IDAuMDA5LC0wLjA0NCAwLjAyNDU3LC0wLjA4IDAuMDMxMjUsLTAuMTI1IDAuMDE4NzgsLTAuMTIzNSAwLjAzMTI1LC0wLjI0NjIgMC4wMzEyNSwtMC4zNzUgbCAwLC02MCBjIDAsLTEuMzg1IC0xLjExNDk5OSwtMi41IC0yLjUsLTIuNSBsIDUsMCAwLDY1IC01LDAgeiIgc3R5bGU9ImNvbG9yOiMwMDAwMDA7ZGlzcGxheTppbmxpbmU7b3ZlcmZsb3c6dmlzaWJsZTt2aXNpYmlsaXR5OnZpc2libGU7ZmlsbDojMDAwMDAwO2ZpbGwtb3BhY2l0eToxO2ZpbGwtcnVsZTpub256ZXJvO3N0cm9rZTpub25lO21hcmtlcjpub25lO2VuYWJsZS1iYWNrZ3JvdW5kOmFjY3VtdWxhdGUiIC8+PHBhdGggaWQ9InBhdGg0Njk3LTYiIGQ9Im0gMjUsMTA1Mi4zNjE3IGMgLTEuMjgzMzM2LDAgLTIuMzI1OTczLC0wLjk3MzcgLTIuNDY4NzUsLTIuMjE4NyBMIDIuNjg3NSw5OTAuNjQyOSBDIDIuNTc1OTc4LDk5MC4zMDg3IDIuNSw5ODkuODYxNyAyLjUsOTg5Ljg2MTcgYyAwLC0wLjM0NTEgMC4wNjA5OTMsLTAuNjY5NyAwLjE4NzUsLTAuOTY4OCAwLjEyNjUwNywtMC4yOTkgMC4zMDUwNDQsLTAuNTg2MyAwLjUzMTI1LC0wLjgxMjUgMC4zMzg5MDUsLTAuMzM5IDAuNzkyMTM5LC0wLjU1NjIgMS4yODEyNSwtMC42NTYyIDAuMTYyNzQ0LC0wLjAzMyAwLjMyNzQxMiwtMC4wNjIgMC41LC0wLjA2MiBsIDIwLDAgYyAxLjM4NTAwMSwwIDIuNSwxLjExNSAyLjUsMi41IGwgMCw2MCBjIDAsMC4xMjg4IC0wLjAxMjQ3LDAuMjUxNSAtMC4wMzEyNSwwLjM3NSAtMC4wMDY3LDAuMDQ1IC0wLjAyMjI1LDAuMDgxIC0wLjAzMTI1LDAuMTI1IC0wLjAyNjM0LDAuMTI5MiAtMC4wNDg3NCwwLjI1MzggLTAuMDkzNzUsMC4zNzUgLTAuMDI0NDksMC4wNjUgLTAuMDY0MTMsMC4xMjUyIC0wLjA5Mzc1LDAuMTg3NSAtMC4wNTAwNSwwLjEwNzkgLTAuMDkyNDQsMC4yMTQ1IC0wLjE1NjI1LDAuMzEyNSAtMC40NDYwODcsMC42ODQgLTEuMjE2MjAxLDEuMTI1IC0yLjA5Mzc1LDEuMTI1IHogbSAwLC0xLjIxODcgYyAwLjQ3NDEwNiwwIDAuODY0NzM0LC0wLjIxMTQgMS4wOTM3NSwtMC41NjI1IC0wLjAyMTEyLDAuMDMyIC0wLjAwNTksLTAuMDEgMC4wNjI1LC0wLjE1NjMgYSAxLjIwNDQ1MiwxLjIwNDQ1MiAwIDAgMSAwLC0wLjAzMSBjIDAuMDIzNSwtMC4wNDkgMC4wNTE5OCwtMC4wNTIgMC4wNjI1LC0wLjA2MiAwLjAwNTUsLTAuMDE2IDAuMDA5NCwtMC4wMzUgMCwtMC4wMzEgMC4wMDE3LC0wLjAxIDAuMDA1NSwtMC4wNjEgMC4wMzEyNSwtMC4xODc1IDAuMDA4LC0wLjAzOSAwLjAyNTU1LC0wLjAzOSAwLjAzMTI1LC0wLjA2MiAwLjAwOTgsLTAuMDY2IDAuMDA1NSwtMC4xMDI3IDAsLTAuMDk0IC0wLjAwMTYsLTAuMDMgMCwtMC4wNjggMCwtMC4wOTQgbCAwLC02MCBjIDAsLTAuNzM4NiAtMC41NDI2MTcsLTEuMjgxMyAtMS4yODEyNSwtMS4yODEzIGwgLTIwLDAgYyAtMC4wMzUzNTMsMCAtMC4xMDUzMjIsMCAtMC4yNSwwLjAzMSAtMC4yOTY4NjMsMC4wNjEgLTAuNTQ2MzQzLDAuMTcxMyAtMC42ODc1LDAuMzEyNSAtMC4wODkzOTQsMC4wODkgLTAuMjA1MjYzLDAuMjU4IC0wLjI4MTI1LDAuNDM3NSAtMC4wNTUzMTUsMC4xMzA4IC0wLjA1ODY2MSwwLjI4MzIgLTAuMDYyNSwwLjQ2ODcgLTIuNTJlLTQsMC4wMTIgMCwwLjAxOSAwLDAuMDMxIDAuMDI3OTgyLDAuMTM1MyAwLjA4MjQ5OSwwLjI3ODkgMC4xMjUsMC40MDYyIGwgMTkuODQzNzUsNTkuNTAwNSBhIDEuMjA0NDUyLDEuMjA0NDUyIDAgMCAxIDAuMDMxMjUsMC4yNSBjIDAuMDc1MjcsMC42NTY0IDAuNjA3MDU0LDEuMTI1IDEuMjgxMjUsMS4xMjUgeiIgc3R5bGU9ImZpbGw6I2ZmZmZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz48L2c+PC9zdmc+") no-repeat;
}
.mistplayer .controls .button.sound .speaker {
  width: 25px;
  height: 25px;
  margin: 0;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2ZXJzaW9uPSIxLjEiIGlkPSJzdmc0NjU5IiBoZWlnaHQ9IjI1IiB3aWR0aD0iMjUiPjxkZWZzIGlkPSJkZWZzNDY2MSIgLz48bWV0YWRhdGEgaWQ9Im1ldGFkYXRhNDY2NCI+PHJkZjpSREY+PGNjOldvcmsgcmRmOmFib3V0PSIiPjxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PjxkYzp0eXBlIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+PGRjOnRpdGxlPjwvZGM6dGl0bGU+PC9jYzpXb3JrPjwvcmRmOlJERj48L21ldGFkYXRhPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTEwMjcuMzYyMikiIGlkPSJsYXllcjEiPjxwYXRoIGlkPSJyZWN0NDE1OSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwxMDI3LjM2MjIpIiBkPSJNIDAgMCBMIDAgMjUgTCAyNSAyNSBMIDI1IDAgTCAwIDAgeiBNIDE3Ljc4OTA2MiAwLjc0NjA5Mzc1IEMgMTguMjk1MTM5IDAuNzY3NzkwNDMgMTguNzk2OTM2IDAuOTE1NDM0MzggMTkuMjUgMS4xODU1NDY5IEwgMTkuMjUgMjMuODEyNSBDIDE4LjA0MTUxMiAyNC41MzQ2IDE2LjQ4MTgzMiAyNC4zNzc0OTQgMTUuNDQ1MzEyIDIzLjMwODU5NCBMIDEwLjM0MTc5NyAxOC4wNDY4NzUgTCA4LjA4Nzg5MDYgMTguMDQ2ODc1IEMgNi43OTk3OTc2IDE4LjA0Njg3NSA1Ljc1IDE2Ljk2MzI2NiA1Ljc1IDE1LjYzNDc2NiBMIDUuNzUgOS4zNjMyODEyIEMgNS43NSA4LjAzNDg4MTIgNi43OTk3OTc2IDYuOTUxMTcxOSA4LjA4Nzg5MDYgNi45NTExNzE5IEwgMTAuMzQxNzk3IDYuOTUxMTcxOSBMIDE1LjQ0NTMxMiAxLjY4OTQ1MzEgQyAxNi4wOTI3NTkgMS4wMjE3MDMxIDE2Ljk0NTYwMiAwLjcwOTkzMjYyIDE3Ljc4OTA2MiAwLjc0NjA5Mzc1IHogIiBzdHlsZT0ib3BhY2l0eToxO2ZpbGw6IzAwMDAwMDtmaWxsLW9wYWNpdHk6MTtmaWxsLXJ1bGU6ZXZlbm9kZDtzdHJva2U6bm9uZTtzdHJva2Utd2lkdGg6MS41O3N0cm9rZS1taXRlcmxpbWl0OjQ7c3Ryb2tlLWRhc2hhcnJheTpub25lO3N0cm9rZS1kYXNob2Zmc2V0OjA7c3Ryb2tlLW9wYWNpdHk6MSIgLz48cGF0aCBpZD0icmVjdDQ1NzQiIGQ9Im0gMTkuMjUsMTAyOC41NDczIGMgLTEuMjA4MTcsLTAuNzIwMyAtMi43Njk1OTksLTAuNTY0IC0zLjgwNTUxMywwLjUwNDQgbCAtNS4xMDIzNjIsNS4yNjIyIC0yLjI1MzU0MTgsMCBjIC0xLjI4ODA5MywwIC0yLjMzODU4MzIsMS4wODM0IC0yLjMzODU4MzIsMi40MTE4IGwgMCw2LjI3MDkgYyAwLDEuMzI4NSAxLjA1MDQ5MDIsMi40MTE5IDIuMzM4NTgzMiwyLjQxMTkgbCAyLjI1MzU0MTgsMCA1LjEwMjM2Miw1LjI2MjMgYyAxLjAzNjUyLDEuMDY4OSAyLjU5NzAyNSwxLjIyNjMgMy44MDU1MTMsMC41MDQyIGwgMCwtMjIuNjI3NyB6IiBzdHlsZT0iZmlsbDpub25lO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTojZmZmZmZmO3N0cm9rZS13aWR0aDoxLjU7c3Ryb2tlLW1pdGVybGltaXQ6NDtzdHJva2UtZGFzaGFycmF5Om5vbmU7c3Ryb2tlLW9wYWNpdHk6MSIgLz48L2c+PC9zdmc+");
  position: absolute;
  left: -15px;
  top: 30px;
  background-color: white;
}
.mistplayer .controls .button.sound .speaker[data-muted] {
  background-color: transparent;
}
.mistplayer .controls .button.sound .volume {
  position: absolute;
  bottom: 0;
  left: 1px;
  right: 1px;
  background-color: white;
  opacity: 0.6;
  height: 100%;
  z-index: -1;
}
.mistplayer .controls .button.loop {
  min-height: 45px;
  background-color: transparent;
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB3aWR0aD0iNDUiIGhlaWdodD0iNDUiIGlkPSJzdmczOTM3IiB2ZXJzaW9uPSIxLjEiPiA8ZGVmcyBpZD0iZGVmczM5MzkiIC8+IDxtZXRhZGF0YSBpZD0ibWV0YWRhdGEzOTQyIj4gPHJkZjpSREY+IDxjYzpXb3JrIHJkZjphYm91dD0iIj4gPGRjOmZvcm1hdD5pbWFnZS9zdmcreG1sPC9kYzpmb3JtYXQ+IDxkYzp0eXBlIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+IDxkYzp0aXRsZT48L2RjOnRpdGxlPiA8L2NjOldvcms+IDwvcmRmOlJERj4gPC9tZXRhZGF0YT4gPHBhdGggaWQ9InJlY3Q0NTExIiBkPSJNIDAgMCBMIDAgNDUgTCA0NSA0NSBMIDQ1IDAgTCAwIDAgeiBNIDIyLjUgMTEuMjUgQSAxMS4yNSAxMS4yNSAwIDAgMSAzMy43NSAyMi41IEEgMTEuMjUgMTEuMjUgMCAwIDEgMjIuNSAzMy43NSBBIDExLjI1IDExLjI1IDAgMCAxIDE0LjU1MDc4MSAzMC40NDkyMTkgTCAxMi43MTQ4NDQgMzIuMjg1MTU2IEwgMTIuNzE0ODQ0IDI1Ljc4NTE1NiBMIDE5LjIxNDg0NCAyNS43ODUxNTYgTCAxNy4zNzY5NTMgMjcuNjIzMDQ3IEEgNy4yNSA3LjI1IDAgMCAwIDIyLjUgMjkuNzUgQSA3LjI1IDcuMjUgMCAwIDAgMjkuNzUgMjIuNSBBIDcuMjUgNy4yNSAwIDAgMCAyMi41IDE1LjI1IEEgNy4yNSA3LjI1IDAgMCAwIDE3LjM3Njk1MyAxNy4zNzY5NTMgTCAxNC41NTA3ODEgMTQuNTUwNzgxIEEgMTEuMjUgMTEuMjUgMCAwIDEgMjIuNSAxMS4yNSB6ICIgc3R5bGU9Im9wYWNpdHk6MTtmaWxsOiMwMDAwMDA7ZmlsbC1vcGFjaXR5OjE7ZmlsbC1ydWxlOmV2ZW5vZGQ7c3Ryb2tlOm5vbmU7c3Ryb2tlLXdpZHRoOjEuNTtzdHJva2UtbWl0ZXJsaW1pdDo0O3N0cm9rZS1kYXNoYXJyYXk6bm9uZTtzdHJva2UtZGFzaG9mZnNldDowO3N0cm9rZS1vcGFjaXR5OjEiIC8+IDxwYXRoIGlkPSJwYXRoNDQ5NSIgZD0iTSAyMi41IDExLjI1IEEgMTEuMjUgMTEuMjUgMCAwIDAgMTQuNTUwNzgxIDE0LjU1MDc4MSBMIDE3LjM3Njk1MyAxNy4zNzY5NTMgQSA3LjI1IDcuMjUgMCAwIDEgMjIuNSAxNS4yNSBBIDcuMjUgNy4yNSAwIDAgMSAyOS43NSAyMi41IEEgNy4yNSA3LjI1IDAgMCAxIDIyLjUgMjkuNzUgQSA3LjI1IDcuMjUgMCAwIDEgMTcuMzc2OTUzIDI3LjYyMzA0NyBMIDE5LjIxNDg0NCAyNS43ODUxNTYgTCAxMi43MTQ4NDQgMjUuNzg1MTU2IEwgMTIuNzE0ODQ0IDMyLjI4NTE1NiBMIDE0LjU1MDc4MSAzMC40NDkyMTkgQSAxMS4yNSAxMS4yNSAwIDAgMCAyMi41IDMzLjc1IEEgMTEuMjUgMTEuMjUgMCAwIDAgMzMuNzUgMjIuNSBBIDExLjI1IDExLjI1IDAgMCAwIDIyLjUgMTEuMjUgeiAiIHN0eWxlPSJvcGFjaXR5OjE7ZmlsbDpub25lO2ZpbGwtb3BhY2l0eTowLjg1ODQ0NzU7ZmlsbC1ydWxlOmV2ZW5vZGQ7c3Ryb2tlOiNmZmZmZmY7c3Ryb2tlLXdpZHRoOjEuNTtzdHJva2UtbWl0ZXJsaW1pdDo0O3N0cm9rZS1kYXNoYXJyYXk6bm9uZTtzdHJva2UtZGFzaG9mZnNldDowO3N0cm9rZS1vcGFjaXR5OjEiIC8+PC9zdmc+");
}
.mistplayer .controls .button.loop[data-on] {
  background-color: rgba(255,255,255,0.6);
}
.mistplayer .controls .button.fullscreen {
  background-image: url("data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBlbmNvZGluZz0iVVRGLTgiIHN0YW5kYWxvbmU9Im5vIj8+PHN2ZyB4bWxuczpkYz0iaHR0cDovL3B1cmwub3JnL2RjL2VsZW1lbnRzLzEuMS8iIHhtbG5zOmNjPSJodHRwOi8vY3JlYXRpdmVjb21tb25zLm9yZy9ucyMiIHhtbG5zOnJkZj0iaHR0cDovL3d3dy53My5vcmcvMTk5OS8wMi8yMi1yZGYtc3ludGF4LW5zIyIgeG1sbnM6c3ZnPSJodHRwOi8vd3d3LnczLm9yZy8yMDAwL3N2ZyIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIiB2ZXJzaW9uPSIxLjEiIGlkPSJzdmczOTM3IiBoZWlnaHQ9IjQ1IiB3aWR0aD0iNDUiPjxkZWZzIGlkPSJkZWZzMzkzOSIgLz48bWV0YWRhdGEgaWQ9Im1ldGFkYXRhMzk0MiI+PHJkZjpSREY+PGNjOldvcmsgcmRmOmFib3V0PSIiPjxkYzpmb3JtYXQ+aW1hZ2Uvc3ZnK3htbDwvZGM6Zm9ybWF0PjxkYzp0eXBlIHJkZjpyZXNvdXJjZT0iaHR0cDovL3B1cmwub3JnL2RjL2RjbWl0eXBlL1N0aWxsSW1hZ2UiIC8+PGRjOnRpdGxlPjwvZGM6dGl0bGU+PC9jYzpXb3JrPjwvcmRmOlJERj48L21ldGFkYXRhPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTEwMDcuMzYyMikiIGlkPSJsYXllcjEiPjxnIHRyYW5zZm9ybT0idHJhbnNsYXRlKDAsLTEuMTA5Mzc1KSIgaWQ9Imc0NTYzIj48ZyBpZD0iZzQ1NTgiPjxwYXRoIGlkPSJyZWN0Mzk0NSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwxMDA3LjM2MjIpIiBkPSJNIDUuMTU2MjUsMTAgQyAzLjY5MTM0NjEsMTAgMi41LDExLjE5MTM0NiAyLjUsMTIuNjU2MjUgbCAwLDE5LjY4NzUgQyAyLjUsMzMuODA4NjU0IDMuNjkxMzQ2MSwzNSA1LjE1NjI1LDM1IGwgMzQuNjg3NSwwIEMgNDEuMzA4NjU0LDM1IDQyLjUsMzMuODA4NjU0IDQyLjUsMzIuMzQzNzUgbCAwLC0xOS42ODc1IEMgNDIuNSwxMS4xOTEzNDYgNDEuMzA4NjU0LDEwIDM5Ljg0Mzc1LDEwIEwgNS4xNTYyNSwxMCB6IE0gNSwxMi41MzEyNSBsIDM1LDAgMCwyMCAtMzUsMCAwLC0yMCB6IiBzdHlsZT0iZmlsbDojZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPjxyZWN0IHJ5PSIwIiB5PSIxMDE5Ljg2MjIiIHg9IjUiIGhlaWdodD0iMjAiIHdpZHRoPSIzNSIgaWQ9InJlY3QzOTQ3IiBzdHlsZT0iZmlsbDojZmZmO2ZpbGwtb3BhY2l0eTowLjM5MjE1Njg2O3N0cm9rZTpub25lIiAvPjxwYXRoIGlkPSJwYXRoMzk0OSIgdHJhbnNmb3JtPSJ0cmFuc2xhdGUoMCwxMDA3LjM2MjIpIiBkPSJtIDE4Ljc4MTI1LDM1LjQwNjI1IGMgLTEuNTM2NjEsMC4zNzk4MDkgLTIuOTcxNDY1LDAuOTkxNTU3IC00LjI4MTI1LDEuODEyNSBsIDE1LjY1NjI1LDAgYyAtMS4zMTMwMDUsLTAuODIyOTYxIC0yLjc2MjgyNSwtMS40MzI5NTMgLTQuMzEyNSwtMS44MTI1IGwgLTcuMDYyNSwwIHoiIHN0eWxlPSJmaWxsOiNmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+PC9nPjxnIGlkPSJnNDAwNyIgdHJhbnNmb3JtPSJtYXRyaXgoMi4wMzUzOTg1LDAsMCwxLjE2MzA4MjgsLTk5LjMyMTczNCwtMTQxLjU0NTgxKSIgc3R5bGU9ImZpbGw6IzAwMCI+PHBhdGggaWQ9InJlY3QzOTU4IiBkPSJtIDY1LjUzMzY0NiwxMDAxLjQ3NTggLTIuMDMyOTMyLDAgMC42NjI5MTMsMC42NjI5IC0yLjI1MzkwMywyLjI1MzkgMC43MDcxMDcsMC43MDcxIDIuMjUzOTAzLC0yLjI1MzkgMC42NjI5MTIsMC42NjI5IDAsLTIuMDMyOSB6IiBzdHlsZT0iZmlsbDojZmZmO2ZpbGwtb3BhY2l0eToxO3N0cm9rZTpub25lIiAvPjxwYXRoIGlkPSJyZWN0Mzk1OC01IiBkPSJtIDY1LjUzMzY0NiwxMDEyLjg0IDAsLTIuMDMzIC0wLjY2MjgzNiwwLjY2MjkgLTIuMjUzOTAxLC0yLjI1MzkgLTAuNzA3MTA0LDAuNzA3MSAyLjI1MzkwMiwyLjI1MzkgLTAuNjYyOTA2LDAuNjYyOSAyLjAzMjg0NSwxZS00IHoiIHN0eWxlPSJmaWxsOiNmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+PHBhdGggaWQ9InJlY3QzOTU4LTUxIiBkPSJtIDU0LjE2OTQzLDEwMDEuNDc1OCAyLjAzMjkzMiwwIC0wLjY2MjkxMywwLjY2MjkgMi4yNTM5MDMsMi4yNTM5IC0wLjcwNzEwNywwLjcwNzEgLTIuMjUzOTAzLC0yLjI1MzkgLTAuNjYyOTEyLDAuNjYyOSAwLC0yLjAzMjkgeiIgc3R5bGU9ImZpbGw6I2ZmZjtmaWxsLW9wYWNpdHk6MTtzdHJva2U6bm9uZSIgLz48cGF0aCBpZD0icmVjdDM5NTgtNS03IiBkPSJtIDU0LjE2OTQzLDEwMTIuODQgMCwtMi4wMzMgMC42NjI4MzYsMC42NjI5IDIuMjUzOTAxLC0yLjI1MzkgMC43MDcxMDQsMC43MDcxIC0yLjI1MzkwMiwyLjI1MzkgMC42NjI5MDYsMC42NjI5IC0yLjAzMjg0NSwxZS00IHoiIHN0eWxlPSJmaWxsOiNmZmY7ZmlsbC1vcGFjaXR5OjE7c3Ryb2tlOm5vbmUiIC8+PC9nPjwvZz48L2c+PC9zdmc+");
  height: 45px;
}
.mistplayer .controls .button.tracks {
  line-height: 25px;
  width: 100%;
  margin: 0;
  height: 25px;
  padding: 0 15px;
  box-sizing: border-box;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mistplayer .controls .tracks .settings {
  position: absolute;
  background-color: black;
  padding: 5px 10px;
  right: -1000px;
  bottom: 27px;
}
.mistplayer .controls .tracks:hover .settings {
  right: 0;
}
.mistplayer .controls .tracks:not(:hover) .settings {
  transition: right 0.5s ease-in 1s;
}
.mistplayer .controls .tracks .settings label {
  text-align: left;
  display: flex;
  flex-flow: row nowrap;
}
.mistplayer .controls .tracks .settings label > *:not(:first-child) {
  margin-left: 1em;
  flex-grow: 1;
}
.mistplayer .controls .tracks .settings label span {
  text-transform: capitalize;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.mistplayer .controls .tracks .settings label select {
  background: none;
  color: white;
  border: none;
  outline: none;
}
.mistplayer .controls .tracks .settings label option {
  color: black;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}