@import '~mediaelement/build/mediaelementplayer.min.css';

.mejs__container {
  min-width: auto !important;
}

.mejs__overlay-button {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

:not([style*='display: none']).mejs__controls {
  background: none !important;
}

.mejs__controls div {
  display: inline-block;
}

.mejs__time-rail {
  width: 50%;
}

.mejs__fullscreen > button {
  background-position: -80px 0 !important;
}

mediaelementwrapper, mediaelementwrapper > div {
  height: 100%;
  display: block;
}

mediaelementwrapper object {
  width: 100% !important;
  height: 100% !important;
}

.mejs__background, .mejs__mediaelement {
  position: static;
}

.mejs__video {
  &, .mejs__inner {
    min-height: 300px;
  }
  &:not(.mejs__container-fullscreen) {
    height: auto !important;
    &, .mejs__overlay-play {
      max-width: 100%;
      width: 100% !important;
      height: 100% !important;
    }
    video {
      height: auto !important;
    }
  }
  //&.mejs__container-fullscreen {
  //    display: flex;
  //    align-items: center;
  //}
}

.mejs__inner {
  position: relative;
  .mejs__layers {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    .mejs__overlay-play {
      height: 100%;
      position: relative;
    }
    .mejs__poster {
      width: 100%;
      height: 100%;
    }
  }
}