@square-icon: "\e009";
body {
  background-image: none;
  background-color: rgb(0, 0, 0);
  touch-action: manipulation;
  padding: 0px 0px;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.vjs-default-skin {
  color: rgb(200, 200, 200);
  font-size: 3vw;
  padding: 0;
}
.vjs-default-skin .vjs-slider-handle {
  left: 0;
  font-size: 4vw;
}
.vjs-default-skin .vjs-slider-handle:before {
  font-size: 4vw;
  line-height: 0;
  text-align: center;
}
.vjs-default-skin .vjs-play-control {
  width: 0em;
  left: -200px;
  cursor: pointer;
}
.vjs-default-skin .vjs-remaining-time {
  display: none;
  float: left;
}
/*start of style after video-js stuff */
.video-js .vjs-overlay {
  color: #fff;
  position: absolute;
  text-align: center;
}
.video-js .vjs-overlay-no-background {
  max-width: 33%;
}
.video-js .vjs-overlay-background {
  background-color: #646464;
  background-color: rgba(255, 255, 255, 0);
  border-radius: 3px;
  padding: 1vw;
  width: 10vw;
}
.video-js .vjs-overlay-top-left {
  top: 5px;
  left: 5px;
}
.video-js .vjs-overlay-top {
  left: 50%;
  margin-left: -16.5%;
  top: 5px;
}
.video-js .vjs-overlay-top-right {
  right: 5px;
  top: 5px;
}
.video-js .vjs-overlay-right {
  right: 5px;
  top: 50%;
  transform: translateY(-50%);
}
.video-js .vjs-overlay-bottom-right {
  bottom: 3.5em;
  right: 5px;
}
.video-js .vjs-overlay-bottom {
  bottom: 3.5em;
  left: 50%;
  margin-left: -16.5%;
}
.video-js .vjs-overlay-bottom-left {
  bottom: 3.5em;
  left: 5px;
}
.video-js .vjs-overlay-left {
  left: 5px;
  top: 50%;
  transform: translateY(-50%);
}
.video-js .vjs-overlay-center {
  left: 50%;
  margin-left: -16.5%;
  top: 50%;
  transform: translateY(-50%);
}
.video-js .vjs-no-flex .vjs-overlay-left,
.video-js .vjs-no-flex .vjs-overlay-center,
.video-js .vjs-no-flex .vjs-overlay-right {
  margin-top: -15px;
}

#login {
  box-sizing: border-box;
  font-family: -apple-system, BlinkMacSystemFont, "segoe ui", roboto, oxygen,
    ubuntu, cantarell, "fira sans", "droid sans", "helvetica neue", Arial,
    sans-serif;
  font-size: 26px;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#mctxt1 {
  background-color: black;
  margin: 0;
  padding: 0;
  display: block;
}
#ctxt1 {
  /* width: 94vw; */
  background-color: white;
  margin-top: 0;
  margin-left: 1vw;
  margin-right: 0;
  margin-bottom: 0;
  padding: 0;
  padding-bottom: 1vw;
  display: none;
}
#plyrmsg {
  display: none;
  color: rgba(0, 255, 0, 0.5);
  /* height: 20px; */
  font-size: 2.5vw;
  margin-left: 0;
  margin-top: 0.1vw;
  margin-bottom: -0.5vw;
  padding: 0;
  font-family: Arial, Helvetica, sans-serif;
  letter-spacing: 3px;
}
#btn1 {
  background-color: black;
  padding-left: 0px;
  padding-bottom: 0px;
  padding-top: 0px;
  margin: -2px;
  width: 99.9%;
}
#btn2 {
  background-color: black;
  padding-left: 10px;
  padding-top: 0px;
  padding-bottom: 0px;
  margin: 0;
  display: none;
}
#slidr {
  display: none;
  width: 100%;
  vertical-align: top;
}
#slidr2 {
  display: none;
  width: 100%;
  vertical-align: top;
}
#pOnbtns {
  display: none;
  width: 100%;
  vertical-align: top;
}
.sldtxt {
  font-family: -apple-system, BlinkMacSystemFont, "segoe ui", roboto, oxygen,
    ubuntu, cantarell, "fira sans", "droid sans", "helvetica neue", Arial,
    sans-serif;
  font-size: 3.5vw;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  float: left;
  color: white;
  letter-spacing: 0.4vw;
  margin-top: 0vw;
  opacity: 0.3;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
.playOn {
  cursor: pointer;
  margin-top: 0.5vw;
  margin-bottom: 0;
  margin-left: 11vw;
  margin-right: 3vw;
  padding-top: 0vw;
  height: 13vw;
  width: auto;
}
.playLog {
  cursor: pointer;
  margin-top: 0.5vw;
  margin-bottom: 0;
  margin-left: 2vw;
  margin-right: 0;
  padding-top: 0vw;
  height: 13vw;
  width: auto;
}
.btn {
  display: none;
  width: 10vw;
  height: 12vw;
  font-size: 0px;
  margin: 0;
  margin-left: 0vw;
  padding: 0;
  border: 0px;
  cursor: pointer;
}
.login {
  width: 100%;
  background-color: #ffffff;
  box-shadow: 0 0 9px 0 rgba(0, 0, 0, 0.3);
  margin: 1px auto;
}
.login h1 {
  text-align: center;
  color: #5b6574;
  font-size: 10vw;
  padding: 1vw 0 1vw 0;
  border-bottom: 1px solid #dee0e4;
}
.login form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  padding-top: 1vw;
}
.login form label {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 10vw;
  height: 10vw;
  background-color: rgb(50, 50, 50);
  color: #ffffff;
}
.login form input[type="password"],
.login form input[type="text"] {
  width: 69vw;
  height: 10vw;
  border: 1px solid #dee0e4;
  margin-bottom: 5vw;
  margin-left: 0.5vw;
  margin-right: 9vw;
  font-size: 7vw;
}
.login form input[type="submit"] {
  width: 80vw;
  padding: 15px;
  margin-top: 5vw;
  margin-bottom: 3vw;
  background-color: rgb(50, 50, 50);
  border: 0;
  border-radius: 5px;

  cursor: pointer;
  font-weight: bold;
  font-size: 7vw;
  color: #ffffff;
  transition: background-color 0.2s;
}
.login form input[type="submit"]:hover {
  background-color: #2868c7;
  transition: background-color 0.2s;
}
.btnpanel {
  display: none;
  width: 10vw;
  height: 12vw;
  font-size: 0px;
  margin: 0;
  margin-left: 0vw;
  margin-right: -3vw;
  padding: 0;
  border: 0px;
  cursor: pointer;
}
.btnscan {
  display: none;
  width: 10vw;
  height: 12vw;
  font-size: 0px;
  margin: 0;
  margin-left: 0vw;
  margin-right: 0.4vw;
  padding: 0;
  border: 0px;
  cursor: pointer;
}
.btnspeed {
  display: none;
  width: 10vw;
  height: 12vw;
  font-size: 0px;
  margin: 0;
  margin-left: -0.6vw;
  padding: 0;
  border: 0px;
  cursor: pointer;
}
.btnrplay {
  display: none;
  width: 10vw;
  height: 12vw;
  font-size: 0px;
  margin: 0;
  margin-left: 0vw;
  margin-right: 0vw;
  padding: 0;
  border: 0px;
  cursor: pointer;
}
.btnstep {
  display: none;
  width: 10vw;
  height: 12vw;
  font-size: 0px;
  margin: 0;
  margin-left: 0vw;
  margin-right: 0vw;
  padding: 0;
  border: 0px;
  cursor: pointer;
}
.btnmute {
  display: none;
  width: 9.5vw;
  height: 12vw;
  font-size: 0px;
  margin: 0;
  margin-left: 0.1vw;
  margin-right: -0.2vw;
  padding: 0;
  border: 0px;
  cursor: pointer;
}
.btnhelp {
  display: none;
  width: 9vw;
  height: 12vw;
  font-size: 0px;
  margin: 0;
  margin-left: -0.2vw;
  margin-right: -0.5vw;
  padding: 0;
  border: 0px;
  cursor: pointer;
}
.lbtn {
  display: inline;
  max-width: 11vw;
  max-height: 11vw;
  min-height: 10vw;
  min-width: 10vw;
  font-size: 0px;
  margin-left: 5px;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 0;
  cursor: pointer;
}
.addbtn {
  display: inline-flex;
  max-width: 11vw;
  max-height: 11vw;
  min-height: 10vw;
  min-width: 10vw;
  font-size: 0px;
  cursor: pointer;
  margin-top: 0.8vw;
  margin-bottom: -0.8vw;
  margin-left: 2vw;
  padding: 0;
}
.mlbtn {
  display: inline;
  float: left;
  max-width: 11%;
  max-height: 11vw;
  min-height: 10vw;
  min-width: 10vw;
  font-size: 0px;
  margin-left: 5px;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 1vw;
  cursor: pointer;
}
.btn2 {
  width: 19%;
  height: 100px;
  color: white;
  display: inline-block;
  margin: 4px 1px 4px 2px;
  border-radius: 5px;
  border: 1px solid black;
  box-shadow: 1px 2px 4px 0 rgba(0, 0, 0, 0.8), 0 2px 4px 0 rgba(0, 0, 0, 0.8);
  cursor: pointer;
}
.movhead {
  display: flexbox;
  font-family: Arial, Helvetica, sans-serif;
  font-size: 7vw;
  font-weight: 600;
  text-shadow: 1px 1px 5px gray;
  margin-top: -2vw;
  letter-spacing: 2px;
  padding: 0;
  color: black;
}
.txtLabel {
  font-family: Arial, Helvetica, sans-serif;
  font-size: 3vw;
  margin: 0;
  padding: 0;
  color: black;
  text-align: left;
}
.tbox {
  /* List words */
  display: inline;
  position: relative;
  top: 1vw;
  float: none;
  line-height: 85%;
  /* box-sizing: border-box;
			border: 1px solid lightgray; */
  font-size: 5.1vw;
  /* margin: auto; */
  vertical-align: top;
  /* margin-left: -1vw; */
  /* padding-bottom: 30vw; */
  color: black;
  /* box-shadow: 0 8px 0px 0px rgba(100, 100, 100, .5), 0 0px 0px 3px rgba(0, 0, 0, .5); */
}
.mtbox {
  /* List words */
  display: inline;
  position: relative;
  top: 1vw;
  float: none;
  font-size: 5.1vw;
  line-height: 85%;
  vertical-align: top;
  color: black;
}
.substy {
  display: inline-block;
  background-color: black;
  color: grey;
  width: 12vw;
  height: 7vw;
  text-align: center;
  font-size: 3vw;
  font-weight: 100;
  letter-spacing: 0px;
  margin-top: 1vw;
  margin-left: 2vw;
  border-radius: 4px;
}
.hash1 {
  display: none;
  position: relative;
  top: 0vw;
  float: none;
  width: 39%;
  height: 9vw;
  box-sizing: border-box;
  border: 1px solid rgba(255, 0, 0, 0.5);
  font-size: 5.1vw;
  font-family: serif;
  font-weight: bold;
  margin-left: 10vw;
  margin-right: 0;
  margin-bottom: 2vw;
  padding-left: 1vw;
  color: black;
  /* box-shadow: 0 1px 0px 0px rgba(100, 100, 100, .5), 0 0px 0px 0px rgba(0, 0, 0, .5); */
}
.hash2 {
  display: none;
  position: relative;
  top: 0vw;
  float: none;
  width: 49%;
  height: 7vw;
  box-sizing: border-box;
  border: 1px solid rgba(255, 0, 0, 0.5);
  font-size: 4vw;
  font-family: serif;
  font-weight: 100;
  font-style: italic;
  margin-left: 0;
  margin-right: 0;
  padding-left: 1vw;
  color: black;
  /* box-shadow: 0 1px 0px 0px rgba(100, 100, 100, .2), 0 0px 0px 0px rgba(0, 0, 0, .2); */
}
.hash3 {
}
.hash4 {
}
/* fast speed box: */
/* .tbox3 {
			position: relative;
			top: 1.4vw;
			float: right;
			/* box-sizing: border-box;
			font-size: 3.5vw;
			font-family: sans-serif;
			font-weight: bold;
			letter-spacing: -1px;
			margin-right: .6vw;
			padding-bottom: 1vw;
			padding-left: 0vw;
			color: black;
			border-radius: 4px;
			display: inline;
			box-shadow: 0 3px 0px 0px rgba(100, 100, 100, .3), 0 0px 0px 1px rgba(0, 0, 0, .3);
		} */
.tboxf {
  /*  search and stop frame boxes   */
  position: relative;
  top: -4vw;
  width: 19vw;
  float: none;
  font-size: 4vw;
  font-family: sans-serif;
  font-weight: bold;
  margin-left: -0.1vw;
  margin-right: 0;
  padding-left: 0;
  padding-right: 0;
  padding-bottom: 1vw;
  color: black;
  display: inline;
}
.clearbtn {
  cursor: help;
  opacity: 0.5;
  width: 10.5vw;
  margin-left: -10.5vw;
  margin-right: 0.1vw;
}
.slider2 {
  -webkit-appearance: none;
  width: 94vw;
  margin-left: 0;
  margin-right: 0;
  height: 2vw;
  margin-top: 0vw;
  margin-bottom: 3.6vw;
  background: rgb(80, 80, 80);
  border-radius: 30px;
  outline: none;
  opacity: 0.8;
  -webkit-transition: 0.2s;
  transition: opacity 0.2s;
}
.slider2::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 9vw;
  height: 7.5vw;
  padding: 0;
  margin-left: 1vw;
  border-radius: 6px;
  border: 1px solid rgba(100, 100, 100, 0.5);
  background: url("../dist/thumb2.png");
  background-size: 8.5vw, 8.5vw;
  cursor: pointer;
}
.slider2::-moz-range-thumb {
  width: 10vw;
  height: 10vw;
  background: #4caf50;
  cursor: pointer;
}
.slider {
  -webkit-appearance: none;
  width: 65vw;
  margin-left: 23.5vw;
  height: 2vw;
  margin-top: -4vw;
  margin-bottom: 2.5vw;
  background: #d3d3d3;
  border-radius: 30px;
  outline: none;
  opacity: 0.9;
  -webkit-transition: 0.2s;
  transition: opacity 0.2s;
}
.slider::-webkit-slider-thumb {
  -webkit-appearance: none;
  appearance: none;
  width: 9vw;
  height: 7vw;
  padding: 0;
  border-radius: 6px;
  border: 1px solid rgba(100, 100, 100, 0.5);
  background: url("../dist/gauge1.png");
  background-size: 8.5vw, 8.5vw;
  cursor: pointer;
}
.slider::-moz-range-thumb {
  width: 10vw;
  height: 10vw;
  background: #4caf50;
  cursor: pointer;
}