video#videoLiveRef::-webkit-media-controls-timeline,
video#videoLiveRef::-webkit-media-controls-current-time-display,
video#videoLiveRef::-webkit-media-controls-time-remaining-display {
  display: none;
}
.home-nav__wrapper {
  overflow: hidden;
}
.match-detail__content-container {
  /* min-height: 50vh; */
}
/* .match-detail__header-wrapper {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-direction: column;
  margin-bottom: 2rem;
} */
.match-detail__header-top__section {
  position: relative;
}
.match-detail__header-info {
  text-align: center;
  margin-bottom: 1rem;
}
.match-detail__header-info__match {
  font-size: 0.875rem;
}
.match-detail__header-info__country {
  font-size: 0.563rem;
}
.match-detail__header-info__date {
  color: var(--color-grey-light);
  font-size: 0.688rem;
}
.match-detail__header-info__opponent {
  margin-bottom: 0.5rem;
}
.match-detail__header-info__home-name {
  width: 20rem; /*12rem*/
  text-align: right;
  overflow: hidden;
}
.match-detail__header-info__away-name {
  width: 20rem; /*12rem*/
  overflow: hidden;
}
.match-detail__header-info__penatly {
  border-top: 0.1rem solid #35454d;
  margin-top: 0.6rem;
  padding-top: 0.5rem;
}
/* .match-detail__header-info__penatly-title {
  font-size: 11.2px;
  color: var(--color-grey-light);
  margin-bottom: 1rem;
} */
.match-detail__header-info__penatly-label {
  top: 0.6rem;

  position: absolute;
  width: 2.3rem;
}
.match-detail__header-info__penatly-label.left {
  right: 3.4rem;
}
.match-detail__header-info__penatly-label.right {
  left: 3.4rem;
}
.match-detail__header-info__score {
  width: 2rem;
  text-align: center;
}
.desktop-match-detail__thumbnail-wrapper {
  display: flex;
  flex-direction: row;
  height: 28rem;
  margin-bottom: 2rem;
}
.desktop-match-detail__thumbnail-overview {
  width: 90%;
  position: relative;
  margin-right: 2rem;
}
.desktop-match-detail__thumbnail-iframe {
  width: 100%;
  height: 100%;
  border: none;
}
.match-detail__status {
  font-size: 0.625rem;
  line-height: 1rem;
  color: #93a9b4;
}
.desktop-match-detail__thumbnail-overview img {
  width: 100%;
  height: 100%;
}
.desktop-match-detail__thumbnail-section__wrapper {
  /* width: 30%; */
  overflow-y: auto;
  cursor: pointer;
}
.desktop-match-detail__thumbnail-section {
  position: relative;
  margin-right: 0.5rem;
  height: 8rem;
  width: 14.7rem;
}
.desktop-match-detail__thumbnail-section img {
  width: 100%;
  height: 100%;
}
.desktop-match-detail__thumbnail-section__container {
  display: flex;
  padding: 0.5rem 0;
  border-bottom: 0.1rem solid #35454d;
  margin-right: 1.5rem;
}
.desktop-match-detail__thumbnail-section__container:first-child {
  padding-top: 0;
}
.desktop-match-detail__thumbnail-section__desc-wrapper {
  width: calc(100% - 6.7rem);
}
.desktop-match-detail__thumbnail-section__desc-duration {
  font-size: 11.2px;
  margin-bottom: 0.5rem;
}
.desktop-match-detail__thumbnail-section__desc-title {
  font-size: 0.88rem;
  color: #2e8fef;
  margin-bottom: 0.4rem;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.2;
  margin-bottom: 0.2rem;
  min-height: 2.2rem;
  text-align: left;
}
.desktop-match-detail__thumbnail-section__desc-tool {
  font-size: 11.2px;
}
.match-detail__thumbnail-wrapper {
}
.match-detail__thumbnail-overview {
  position: relative;
  height: 13rem;
  overflow: hidden;
}
.match-detail__thumbnail-overview img {
  width: 100%;
  height: 100%;
}
.match-detail__thumbnail-section__overlay {
  position: absolute;
  background-color: rgb(0 0 0 / 22%);
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  pointer-events: none;
}
.match-detail__thumbnail-section__overlay.selected {
  border: 2px solid #2e8fef;
}
.match-detail__thumbnail-section__play-icon {
  width: 1rem;
  height: 1rem;
  background: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAUCAYAAACAl21KAAAACXBIWXMAAAsTAAALEwEAmpwYAAAAAXNSR0IArs4c6QAAAARnQU1BAACxjwv8YQUAAAEGSURBVHgBnZSNDYIwEIUP4gCMgJvgBjqBdQLjBOIGMgFsghvoBrABblDfhTOclZ/Sl7wUmvajd7yUrLXG9rrCKYUKm3M7qIGPFKBYPb/gFK4EmNIKaVABb+FWgAwrfYEaRFEUtTDDTgI0cM39WySpHhlnPoXv3v2bAjnASgHHy10CqXVGTmVH4+ILctZ3f+WuBdF4uXVMYXozT7+vAuHLiUShoT4aDDSIzGGzApJhKKkPK+sG3wFhGC2C5M8wIJOpB3zi8Op1MfmVwRDeuANg50ImTwTAGUMOJ9T3ocDmnGa0cQAZhisNZVTw5duHWakcPXUuBOov+3uxdTbwYmPQXiAMTChQH9jnPsqBHiEaAAAAAElFTkSuQmCC) center/cover
    no-repeat;
}
.match-detail__thumbnail-section__play-desc {
  font-size: 11.2px;
  margin-top: 0.2rem;
}
.match-detail__thumbnail-section__wrapper {
  display: flex;
  overflow-y: auto;
  padding-left: 0.5rem;
  margin-bottom: 1rem;
}
.match-detail__thumbnail-section__container {
  min-width: 36%;
  padding: 0.5rem 0.5rem 0 0;
}
.match-detail__thumbnail-section {
  position: relative;
  padding-top: 70%;
  overflow: hidden;
}
.match-detail__thumbnail-section img {
  -o-object-fit: cover;
     object-fit: cover;
  height: 100%;
  width: 100%;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.match-detail__wrapper {
  margin: 0 0 1.5rem 1rem;
  position: relative;
  display: flex;
  align-items: center;
}
.match-detail__icon-highlight {
  margin: 0 0.8rem 0.8rem 0.8rem;
}
.match-detail__container {
  display: flex;
  justify-content: space-between;
  margin-bottom: 0.8rem;
  font-size: 13.6px;
}
.match-detail__divider {
  width: 0.12rem;
  background-color: var(--color-grey-40);
  height: 4.2rem;
  position: absolute;
  right: 1.7rem;
  top: 1.2rem;
}
.match-detail__opponent {
  display: flex;
  align-items: center;
  justify-content: center;
  color: #cfd9de;
}
.match-detail__opponent:hover {
  color: var(--color-hover);
}
.match-detail__icon {
  margin: 0.2rem;
  fill: white;
}
.match-detail__score {
  color: white;
}
.match-filter {
  display: flex;
  margin: 1rem 0;
}
.match-filter__child {
  color: white;
  border: 1px solid white;
  border-radius: 1rem;
  padding: 0.4rem 1.1rem;
  margin-right: 1rem;
  cursor: pointer;
  font-size: 14.4px;
}
.match-detail__penatly-score {
  width: 1.8rem !important;
  text-align: center;
}
.match-detail__video-live-icon {
  width: 1.5rem;
  height: 1.5rem;
  right: 1rem;
  position: absolute;
  z-index: 1;
  top: 1rem;
}
.match-detail__video-live__container {
  margin: 0 auto 1rem;
}
.match-detail__video-live-overlay {
  background-color: #34343494;
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 3rem;
  box-sizing: border-box;
}
.match-detail__video-live-overlay__title {
  margin-bottom: 2rem;
  text-align: center;
}
.match-detail__video-live-overlay__button-wrapper {
  width: 20rem;
}
/* .video-js .vjs-big-play-button{
        display: none;
    } */
.match-detail__video-live {
  height: 480px; /*680px*/
}
.match-detail__video-live__channel {
  display: flex;
  margin-top: 1rem;
  overflow-x: auto;
}
.match-detail__video-live__channel-btn {
  border: 1px solid white;
  padding: 0.5rem 1rem;
  border-radius: 0.5rem;
  margin-right: 1rem;
  cursor: pointer;
}
.nav-selected {
  display: block !important;
}
#OverlayAdInfo {
  z-index: 1;
  position: absolute;
  bottom: 6rem;
  left: 1rem;
  font-size: 0.688rem;
}
.match-detail__tracker-commentary__wrapper {
  flex-direction: column;
  height: 55vw;
}
.match-detail__tracker-video {
  width: 70%; /*100%*/
  height: 480px; /*50vw   55vw*/
}
.match-detail__tracker-header {
  padding: 0 1rem 1rem 1rem;
  /* margin: 0 1rem; */
  text-align: left;
  color: var(--color-grey-light);
  font-size: 12.8px;
}
.match-detail__tracker-video .iframe {
  height: 100%;
}
@media (min-width: 1000px) {
.match-detail__tracker-commentary__wrapper {
    flex-direction: row;
    width: 100%; /*47.25rem*/
    height: 480px; /*37rem  28rem*/
    justify-content: center;
    margin: 0 auto 1rem;
    position: absolute;
    top: 0;
    /* padding-bottom: 3rem; */
    background: #000105;
    z-index: 1;
}
.match-detail__info-timeline__middle {
    flex: 5.6 !important;
}
}
@media(max-width: 768px) { /* for test */
.home-nav__wrapper {
    overflow-x: scroll;
}
.match-detail__header-top__section {
    position: absolute;
    width: 100%;
    z-index: 3;
    background-color: var(--bg-theme);
    top: 3rem;
}
.match-detail__header-bottom__section {
    padding-top: calc(56vw + 175px); /*calc(56vw + 203px);*/
}
.match-detail__video-live {
    height: 55vw;
}
.match-detail__header-top__section-tab {
    margin-bottom: 0;
}
.match-detail__video-live__channel {
    margin-left: 1rem;
    overflow-x: auto;
}
.match-detail__tracker-commentary__wrapper {
    position: absolute;
    top: 0;
    padding-bottom: 1rem;
    background: #000105;
    z-index: 1;
    /* margin-bottom: 1.5rem; */
}
.match-detail__tracker-video {
    width: 100%;
    height: 55vw;
}

  /* Temporary - during revert Tracker back into Tracker tab */
  /* if no live stream then adjust */
.match-detail__content-container {
    /* margin-top: 0; */
    /*9.8rem*/
}
  /* if got live stream then contra */
  /* .match-detail__header-bottom__section .match-detail__content-container {
    margin-top: 0;
  } */
}