/* *****************************************************************************
multi-use classes 
***************************************************************************** */
.inputmask {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 1003;
  text-align: center;
  color: #fff;
  font-weight: bold;
  font-size: 20px;
  padding: 50px 0;
  text-shadow: 0 0 5px rgba(0, 0, 0, 0.7);
  -webkit-font-smoothing: antialiased;
  background: url('transparent.gif') repeat;
}
/* *****************************************************************************
Tester 
***************************************************************************** */
#vid-tester {
  background: #000;
  position: fixed;
  z-index: 1000;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
:fullscreen #vid-tester,
:-webkit-full-screen #vid-tester,
:-moz-full-screen #vid-tester {
  display: block;
}
.input-tab {
  position: fixed;
  line-height: 1em;
  padding: 10px 0px 10px;
  margin-top: -20px;
  top: 50%;
  text-align: center;
  z-index: 1002;
}
.input-tab-L {
  left: 0;
  padding-right: 10px;
}
.input-tab-R {
  right: 0;
  padding-left: 10px;
}
.input-tab-M {
  width: 100%;
}
.input-tab-init {
  background: rgba(204, 204, 204, 0.6);
  border: 2px solid #bbb;
}
#vid-tester .inputmask {
  cursor: none;
}
.replayvideo-text {
  display: none;
}
/* *****************************************************************************
Analysis 
***************************************************************************** */
.chart-analysis-view {
  position: relative;
  margin: 0px 0px 15px -36px;
}
.video-analysis-view {
  position: relative;
  background: #000;
  margin-bottom: 45px;
}
.video-controls {
  position: absolute;
  left: 0;
  right: 0;
  bottom: -30px;
  height: 30px;
  background: #f3f3f3;
}
.video-controls a {
  display: inline-block;
  height: 30px;
  width: 30px;
  line-height: 30px;
  text-align: center;
  border-right: 1px solid #fff;
}
.chart-wrapper {
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  width: 0%;
  overflow: hidden;
  z-index: 2;
}
.plot-info .sep {
  margin: 0 0 8px;
}
.margin-hide {
  position: absolute;
  top: -999999px;
  left: -999999px;
}
.security-overlay {
  position: absolute;
  bottom: 15%;
  left: 20%;
  opacity: 0.35;
}
.add-custom-plotline {
  position: relative;
  top: -20px;
}
.highcharts-container hr {
  margin: 6px 0;
}
.tune-in-btn,
.tune-out-btn {
  position: absolute;
  margin: 0;
  padding: 0;
  border: none;
  text-align: center;
  color: #fff;
  background: rgba(0, 0, 0, 0.5);
  cursor: pointer;
}
@media (min-width: 768px) {
  .tune-in-btn,
  .tune-out-btn {
    left: 0px;
    right: 0px;
    min-height: 15%;
    line-height: 100px;
  }
}
@media (max-width: 768px) {
  .tune-in-btn,
  .tune-out-btn {
    left: 110px;
    right: 110px;
    min-height: 10%;
    padding: 5px;
  }
}
.tune-in-btn {
  top: 0;
}
.tune-out-btn {
  bottom: 0;
}
.vcenter span.line-colorselector {
  position: relative;
  top: 4px;
  left: 3px;
}
.vcenter .btn span.line-colorselector {
  top: -1px;
  left: 0px;
}
.scaling .radio {
  margin-right: 15px;
}
.sampling-rate {
  margin-top: 15px;
}
.back-link {
  left: -60px;
  margin: -50px 0 20px;
  position: relative;
  top: 6px;
  width: 65px;
}
.current-plotlines .csv-options {
  margin-top: 29px;
}
.free-text {
  font-size: 16px;
  cursor: pointer;
}
/* *****************************************************************************
Top navigation
***************************************************************************** */
.top-nav {
  text-align: right;
  font-size: 11px;
  margin: 2px 0;
  width: 940px;
}
/* *****************************************************************************
Dial Test (minimal amount of bootstrap classes to make the page responsive + bs button
***************************************************************************** */
@media (min-width: 992px) {
  .col-md-offset-2 {
    margin-left: 16.66666667%;
  }
  .col-md-8 {
    width: 66.66666667%;
  }
  .col-md-1,
  .col-md-2,
  .col-md-3,
  .col-md-4,
  .col-md-5,
  .col-md-6,
  .col-md-7,
  .col-md-8,
  .col-md-9,
  .col-md-10,
  .col-md-11,
  .col-md-12 {
    float: left;
  }
}
.col-xs-1,
.col-xs-2,
.col-xs-3,
.col-xs-4,
.col-xs-5,
.col-xs-6,
.col-xs-7,
.col-xs-8,
.col-xs-9,
.col-xs-10,
.col-xs-11,
.col-xs-12 {
  float: left;
}
.col-xs-1,
.col-sm-1,
.col-md-1,
.col-lg-1,
.col-xs-2,
.col-sm-2,
.col-md-2,
.col-lg-2,
.col-xs-3,
.col-sm-3,
.col-md-3,
.col-lg-3,
.col-xs-4,
.col-sm-4,
.col-md-4,
.col-lg-4,
.col-xs-5,
.col-sm-5,
.col-md-5,
.col-lg-5,
.col-xs-6,
.col-sm-6,
.col-md-6,
.col-lg-6,
.col-xs-7,
.col-sm-7,
.col-md-7,
.col-lg-7,
.col-xs-8,
.col-sm-8,
.col-md-8,
.col-lg-8,
.col-xs-9,
.col-sm-9,
.col-md-9,
.col-lg-9,
.col-xs-10,
.col-sm-10,
.col-md-10,
.col-lg-10,
.col-xs-11,
.col-sm-11,
.col-md-11,
.col-lg-11,
.col-xs-12,
.col-sm-12,
.col-md-12,
.col-lg-12 {
  position: relative;
  min-height: 1px;
  padding-right: 15px;
  padding-left: 15px;
}
.text-center {
  text-align: center;
}
.row {
  margin-right: -15px;
  margin-left: -15px;
}
@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
.container {
  padding-right: 15px;
  padding-left: 15px;
  margin-right: auto;
  margin-left: auto;
}
.btn-primary {
  color: #fff;
  background-color: #337ab7;
  border-color: #2e6da4;
}
.btn {
  display: inline-block;
  padding: 6px 12px;
  margin-bottom: 0;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.42857143;
  text-align: center;
  white-space: nowrap;
  vertical-align: middle;
  -ms-touch-action: manipulation;
  touch-action: manipulation;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  background-image: none;
  border: 1px solid transparent;
  border-radius: 4px;
}
h2.text-info {
  color: white;
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
}
.input-level-numerical {
  float: left;
  margin-left: 10px;
}
.input-qualitative {
  float: right;
  text-transform: uppercase;
  margin-right: 10px;
}
.input-level-numerical,
.input-qualitative {
  color: white;
}
.fullscreen-bg {
  position: fixed;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  overflow: hidden;
  z-index: -100;
  text-align: center;
}
.fullscreen-bg__video {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  z-index: -101;
}
#iphone-play-btn {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 101;
}
#video-play-btn,
#video-loading-msg {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 101;
  color: white;
}
.lds-dual-ring {
  display: inline-block;
  width: 64px;
  height: 64px;
}
.lds-dual-ring:after {
  content: " ";
  display: block;
  width: 46px;
  height: 46px;
  margin: 1px;
  border-radius: 50%;
  border: 5px solid #fff;
  border-color: #fff transparent #fff transparent;
  animation: lds-dual-ring 1.2s linear infinite;
}
@keyframes lds-dual-ring {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
