.embed-container {
  position: relative;
  overflow: hidden;
}
#video {
  display: none;
}
#rotate_icon_container {
  text-align: center;
  position: relative;
  display: none;
}
#rotate_icon {
  position: absolute;
}
.close-btn {
  position: absolute;
  display: none;
}
.close-btn img {
  width: 100%;
}
.close-btn:focus,
.close-btn:hover {
  outline-offset: 5px;
}
.close-btn:focus img,
.close-btn:hover img,
.next-btn:focus img,
.next-btn:hover img  {
  width: 100%;
  box-shadow: 0px 0px 0px 4px #fff;
  border-radius: 5px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
}
.nextbtn-container {
  position: absolute;
  display: none;
}

.next-btn img {
  width: 100%;
}

.vjs-texttrack-settings {
  display: none;
}

.vjs-menu-button-popup .vjs-menu {
  left: -6em !important;
}

.vjs-custom-waiting .vjs-loading-spinner {
  display: block;
}
.video-js.vjs-custom-waiting .vjs-loading-spinner:before,
.video-js.vjs-custom-waiting .vjs-loading-spinner:after {
  /* I just copied the same animation as in the default css file */
  -webkit-animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8)
      infinite,
    vjs-spinner-fade 1.1s linear infinite;
  animation: vjs-spinner-spin 1.1s cubic-bezier(0.6, 0.2, 0, 0.8) infinite,
    vjs-spinner-fade 1.1s linear infinite;
}
.video-js.vjs-custom-waiting .vjs-loading-spinner {
  -webkit-animation: 0s linear 0.3s forwards vjs-spinner-show;
  animation: 0s linear 0.3s forwards vjs-spinner-show;
}

.sing_along_controls {
  width: 100%;
  height: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  bottom: 0;
}
.sing_along_controls div {
  width: auto;
  height: auto;
  text-align: center;
  cursor: pointer;
}
.sing_along_controls .prev_btn {
  width: 182px;
  height: 90px;
  background: url(images/prev_video_default.png) no-repeat center center;
  background-size: contain;
}
.sing_along_controls .prev_btn:active {
  background: url(images/prev_video_hover.png) no-repeat center center;
  background-size: contain;
}
.sing_along_controls .play_btn {
  width: 182px;
  height: 90px;
  background: url(images/play_video_default.png) no-repeat center center;
  background-size: contain;
}
.sing_along_controls .play_btn:active {
  background: url(images/play_video_hover.png) no-repeat center center;
  background-size: contain;
}
.sing_along_controls .pause_btn {
  width: 182px;
  height: 90px;
  background: url(images/pause_video_default.png) no-repeat center center;
  background-size: contain;
  display: none;
}
.sing_along_controls .pause_btn:active {
  background: url(images/pause_video_hover.png) no-repeat center center;
  background-size: contain;
}
.sing_along_controls .next_btn {
  width: 182px;
  height: 90px;
  background: url(images/next_video_default.png) no-repeat center center;
  background-size: contain;
}
.sing_along_controls .next_btn:active {
  background: url(images/next_video_hover.png) no-repeat center center;
  background-size: contain;
}

.video-js .vjs-big-play-button:focus,
.video-js:hover .vjs-big-play-button {
  box-shadow: 0px 0px 0px 4px #fff inset;
  outline: none;
}

/*.video-js:hover .vjs-big-play-button .vjs-icon-placeholder:before,
.video-js:hover .vjs-big-play-button:focus .vjs-icon-placeholder:before {
  top: -3px;
}
a:focus, button:focus {
  outline-width: 3px;
  outline-style: solid;
  outline-color: #000;
  display: inline-block;
}*/

a:hover, a:focus{
  border:none;
  outline: none;
}
/* .close-btn:focus img, .close-btn:hover img {
  box-shadow: 0px 0px 0px 4px #fff;
} */