.videoSliderContainer {
    width: 540px;
    margin-left: 50px;
    margin-top: 1px;
}

input[type=range]#videoslider {
    border: none;
    outline: none;
    width: 340px;
    -webkit-appearance: none;
    background: transparent;
}

input[type=range]::-ms-track {
    width: 100%;
    cursor: pointer;

  /* Hides the slider so custom styles can be added */
    background: transparent;
    border-color: transparent;
    color: transparent;
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border-color: transparent;
    height: 22px;
    width: 22px;
    /* border-radius: 3px; */
    background: url(../common/logo.gif); 
	background-repeat: no-repeat;
	background-size: 21px;
    cursor: pointer;
    margin-top: -10px; /* You need to specify a margin in Chrome, but in Firefox and IE it is automatic */
}

input[type=range]::-moz-range-thumb {
    /* box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; */
    border-color: transparent;
	height: 22px;
    width: 22px;
    /* border-radius: 3px; */
	background: url(../common/logo.gif);
	background-repeat: no-repeat;
	background-size: 21px;
    cursor: pointer;
}

/* All the same stuff for IE */
input[type=range]::-ms-thumb {
    /* box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d; */
    border-color: transparent;
	height: 22px;
    width: 22px;
    /* border-radius: 3px; */
	background: url(../common/logo.gif);
	background-repeat: no-repeat;
	background-size: 21px;
    cursor: pointer;
}

input[type=range]::-webkit-slider-runnable-track {
  width:240px;
  height: 3.2px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #3071a9;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}

input[type=range]:focus::-webkit-slider-runnable-track {
  background: #367ebd;
}

input[type=range]::-moz-range-track {
  width:240px;
  height: 3.4px;
  cursor: pointer;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
  background: #3071a9;
  border-radius: 1.3px;
  border: 0.2px solid #010101;
}

input[type=range]::-ms-track {
  width:240px;
  height: 3.4px;
  cursor: pointer;
  background: transparent;
  border-color: transparent;
  border-width: 16px 0;
  color: transparent;
}
input[type=range]::-ms-fill-lower {
  background: #2a6495;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]:focus::-ms-fill-lower {
  background: #3071a9;
}
input[type=range]::-ms-fill-upper {
  background: #3071a9;
  border: 0.2px solid #010101;
  border-radius: 2.6px;
  box-shadow: 1px 1px 1px #000000, 0px 0px 1px #0d0d0d;
}
input[type=range]:focus::-ms-fill-upper {
  background: #367ebd;
}

.videoFillClass {
  object-fit: fill;
}

.videoContainClass {
  object-fit: contain;
}