.video-js {
  margin: 30px auto;
  border-radius: 10px;
}

.video-js .vjs-remaining-time {
  display: none;
}

.video-js .vjs-current-time {
  display: block!important;
}

.vjs-control-bar {
  border-radius: 10px;
}

.divName {
  max-width: 175px!important;
  padding: 0 0 0 35px!important;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.divNameP {
  max-width: 60px!important;
  padding: 0px!important;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.divNameP100 {
  max-width: 100px!important;
  padding: 0px!important;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}


.divName2 {
  max-width: 100px!important;
  padding: 2px!important;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  vertical-align: middle;
} 

.divName3 {
  max-width: 80px!important;
  padding: 2px!important;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
  vertical-align: middle;
} 

.div200 {
  max-width: 120px!important;
  margin: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
@media (min-width: 500px) {
  .div200 {
    max-width: 200px!important;
    margin: 10px;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
  }
}  

.div450 {
  max-width: 450px!important;
  margin: 10px;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.divCut {
  max-width: 120px!important;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}

.innerComment {
  width: 100%;
  height: 100%;
  text-align: center;
  font-size: 12pt;
  padding: 5px;
  text-shadow: -1px 0 black, 0 1px black, 1px 0 black, 0 -1px black;
  word-wrap: break-word;
}

#test-control-panel {
  margin: 50px auto;
  width: 50%;
  height: auto;
  background-color: #fff;
  border: 2px solid #0097b1;
  display: flex;
  flex-wrap: wrap;
}

.control-section {
  width: 26%;
  border: 1px #0097b1 solid;
  padding: 2%;
  display: flex;
  flex-direction: column;
  margin: 5px;
}

.event-type {
  font-size: 1.1em;
}

#mocha {
  text-align: left;
  width: 50%;
  float: left;
}
#mocha-video-container {
  float: left;
  width: 40%;
  margin-top: 50px;
  position: fixed;
  right: 6%;
}

.expanded {
  bottom: -57px!important;
}

.v-expansion-panel-content__wrap {
  padding: 0!important;
}

.v-expansion-panel-header__icon {
  margin-top: 15px!important;
  padding-right: 20px;
  padding-left: 10px;
}

.v-expansion-panel::before {
  box-shadow: none!important;
}

.v-expansion-panel {
  background-color: transparent!important;
}