/* Variables that are overwritten in the theme specific vars and settings files */
/* --- */
.mychannels {
  /**
  * Simple reset of element margin and padding
  */
  /* HTML5 display-role reset for older browsers */
}
.mychannels html,
.mychannels body,
.mychannels applet,
.mychannels object,
.mychannels iframe,
.mychannels h1,
.mychannels h2,
.mychannels h3,
.mychannels h4,
.mychannels h5,
.mychannels h6,
.mychannels p,
.mychannels blockquote,
.mychannels pre,
.mychannels a,
.mychannels abbr,
.mychannels acronym,
.mychannels address,
.mychannels big,
.mychannels cite,
.mychannels code,
.mychannels del,
.mychannels dfn,
.mychannels em,
.mychannels img,
.mychannels ins,
.mychannels kbd,
.mychannels q,
.mychannels s,
.mychannels samp,
.mychannels small,
.mychannels strike,
.mychannels strong,
.mychannels sub,
.mychannels sup,
.mychannels tt,
.mychannels var,
.mychannels b,
.mychannels u,
.mychannels center,
.mychannels dl,
.mychannels dt,
.mychannels dd,
.mychannels ol,
.mychannels ul,
.mychannels li,
.mychannels fieldset,
.mychannels form,
.mychannels label,
.mychannels legend,
.mychannels table,
.mychannels caption,
.mychannels tbody,
.mychannels tfoot,
.mychannels thead,
.mychannels tr,
.mychannels th,
.mychannels td,
.mychannels article,
.mychannels aside,
.mychannels canvas,
.mychannels details,
.mychannels embed,
.mychannels figure,
.mychannels figcaption,
.mychannels footer,
.mychannels header,
.mychannels hgroup,
.mychannels menu,
.mychannels nav,
.mychannels output,
.mychannels ruby,
.mychannels section,
.mychannels summary,
.mychannels time,
.mychannels mark,
.mychannels audio,
.mychannels video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  text-transform: none;
  letter-spacing: normal;
  vertical-align: baseline;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
.mychannels hr {
  margin: 0;
  padding: 0;
}
.mychannels article,
.mychannels aside,
.mychannels details,
.mychannels figcaption,
.mychannels figure,
.mychannels footer,
.mychannels header,
.mychannels hgroup,
.mychannels main,
.mychannels menu,
.mychannels nav,
.mychannels section {
  display: block;
}
.mychannels body {
  line-height: 1;
}
.mychannels ol,
.mychannels ul {
  list-style: none;
}
.mychannels blockquote,
.mychannels q {
  quotes: none;
}
.mychannels blockquote:before,
.mychannels blockquote:after,
.mychannels q:before,
.mychannels q:after {
  content: "";
  content: none;
}
.mychannels table {
  border-collapse: collapse;
  border-spacing: 0;
}
.mychannels svg {
  vertical-align: baseline;
}
.mychannels .button,
.mychannels input[type=button],
.mychannels input[type=submit] {
  height: auto;
  line-height: normal;
}
.mychannels {
  position: relative;
  /* disable subtitles of the popcorn and use builtin VTT */
}
.mychannels .mychannels-video__time-indicator {
  font-family: inherit;
  position: absolute;
  bottom: 10px;
  left: 10px;
  background-color: rgba(0, 0, 0, 0.7);
  border-radius: 4px;
  padding: 8px 10px;
  font-size: 16px;
  display: flex;
  align-items: center;
}
.mychannels .mychannels-video__live-indicator {
  height: 8px;
  width: 8px;
  background: #ff0000;
  border-radius: 50%;
  margin-right: 5px;
}
.mychannels .mychannels-placeholder {
  padding-top: 56.25%;
  font-family: Arial, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  color: #fff;
  font-size: 12px;
}
@media screen and ( min-width: 600px ) {
  .mychannels .mychannels-placeholder {
    font-size: 20px;
  }
}
.mychannels .mychannels-placeholder__title {
  transition: all 0.15s ease;
  position: absolute;
  top: 1em;
  left: 1em;
  display: block;
  display: -webkit-box;
  max-width: calc(100% - 9em);
  font-size: 22px;
  max-height: 60.5px;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mychannels .mychannels-placeholder__thumbnail {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.mychannels .mychannels-placeholder__content {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 1.5em;
}
.mychannels .mychannels-placeholder__play {
  height: 2.8em;
  width: 2.8em;
}
.mychannels .mychannels-placeholder__play .mychannels__playbutton {
  transform: scale(1.1);
}
.mychannels .mychannels-placeholder__play .mychannels__playbutton .mychannels__playbutton_arrow {
  fill: #fff;
}
.mychannels .mychannels-placeholder__play .mychannels__playbutton .mychannels__playbutton_circle {
  fill: #d10a10;
}
.mychannels .mychannels-placeholder__brand {
  position: absolute;
  top: 10px;
  right: 10px;
  max-width: 130px;
  max-height: 48px;
  border-radius: 4px;
}
.mychannels .mychannels-placeholder__authenticated,
.mychannels .pui__overlay__authenticated {
  cursor: pointer;
  position: absolute;
  top: 10px;
  right: 10px;
  width: 40px;
  height: 40px;
}
.mychannels .mychannels-auth-wall {
  padding-top: 56.25%;
  font-family: Arial, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  color: #fff;
  font-size: 12px;
}
.mychannels .mychannels-auth-wall--large {
  font-size: 20px;
}
.mychannels .mychannels-auth-wall > * {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.mychannels .mychannels-auth-wall__thumbnail {
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
}
.mychannels .mychannels-auth-wall__backdrop {
  display: flex;
  flex-direction: column;
  justify-content: center;
  background-color: rgba(0, 0, 0, 0.65);
}
.mychannels .mychannels-auth-wall__content {
  display: flex;
  flex-direction: column;
  align-items: center;
  padding: 1.5em;
}
.mychannels .mychannels-auth-wall__authenticated {
  position: absolute;
  top: 10px;
  left: auto;
  right: 10px;
  height: 40px;
  width: 40px;
}
.mychannels .mychannels-auth-wall__play {
  height: 2.8em;
  width: 2.8em;
  background: #fff;
  border-radius: 50%;
  margin-bottom: 1em;
}
.mychannels .mychannels-auth-wall__play svg {
  transform: scale(1.1);
  fill: #d10a10;
}
.mychannels .mychannels-auth-wall__title {
  font-size: 1.4em;
  line-height: 1.1428571429;
  text-align: center;
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-weight: 700;
  margin-bottom: 0.5em;
}
.mychannels .mychannels-auth-wall__description {
  font-size: 0.85em;
}
.mychannels .mychannels-auth-wall__cta {
  background-color: #d10a10;
  border-radius: 5px;
  color: white;
  font-size: 1.2em;
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-weight: 700;
  text-transform: none;
  padding: 0.65em 4.5em;
  text-align: center;
  line-height: 1;
  margin-top: 1em;
  margin-bottom: 0.75em;
  text-decoration: none;
}
.mychannels .mychannels-auth-wall__ctc {
  font-size: 0.85em;
}
.mychannels .mychannels-auth-wall__ctc a {
  color: #fff;
  text-decoration: underline;
}
.mychannels .mychannels-temptation-not-available {
  padding-top: 56.25%;
  font-family: inherit;
}
.mychannels .mychannels-temptation-not-available .mychannels-temptation-not-available-content {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.mychannels .mychannels-not-available {
  padding-top: 56.25%;
  font-family: inherit;
}
.mychannels .mychannels-not-available > * {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  background-color: #1e232a;
  color: #ffffff;
  padding: 4.2%;
}
.mychannels .mychannels-not-available .video-fox-goal,
.mychannels .mychannels-not-available .video-fox-highlights {
  background-color: #002e56;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom;
  background-image: url("");
}
.mychannels .mychannels-not-available h1 {
  font-size: 20px;
  line-height: 1.3;
  text-align: center;
  font-family: inherit;
}
@keyframes mychannelsFadeIn {
  from {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes mychannelsFadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 80px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
.mychannels .mychannels-video-sticky {
  color: #000;
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-weight: 700;
}
.mychannels .mychannels-video-sticky__inner {
  transition: all 100ms ease;
  z-index: 880;
}
.mychannels .mychannels-video-sticky__video {
  position: relative;
  transition: all 100ms ease;
  overflow: hidden;
}
.mychannels .mychannels-video-sticky__mask {
  display: none;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background-size: cover;
  background-position: center;
  justify-content: center;
  align-items: center;
  z-index: 50;
}
.mychannels .mychannels-video-sticky__play {
  height: 50px;
  width: 50px;
  background: transparent;
  border-radius: 50%;
}
.mychannels .mychannels-video-sticky__play svg {
  fill: #d10a10;
  transform: scale(1.02);
}
.mychannels .mychannels-video-sticky__meta {
  padding: 10px 0 10px 10px;
  display: none;
  flex-grow: 1;
  animation: mychannelsFadeIn 100ms ease;
}
.mychannels .mychannels-video-sticky__meta h1 {
  font-size: 16px;
  line-height: 1.2352941176;
  -webkit-line-clamp: 2;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .mychannels .mychannels-video-sticky__meta h1 {
    font-size: 25px;
    line-height: 1.16;
    -webkit-line-clamp: 3;
  }
}
.mychannels .mychannels-video-sticky__close {
  align-self: flex-start;
}
.mychannels .mychannels-video-sticky__close,
.mychannels .mychannels-video-sticky .mychannels-video__close-button {
  display: none;
}
.mychannels .mychannels-video-sticky__close button,
.mychannels .mychannels-video-sticky .mychannels-video__close-button button {
  background-color: transparent;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 0.75em;
}
.mychannels .mychannels-video-sticky__close button:focus,
.mychannels .mychannels-video-sticky .mychannels-video__close-button button:focus {
  outline: none;
}
.mychannels .mychannels-video-sticky__close .close-button-icon,
.mychannels .mychannels-video-sticky .mychannels-video__close-button .close-button-icon {
  display: flex;
}
.mychannels .mychannels-video-sticky__close .close-button-icon svg,
.mychannels .mychannels-video-sticky .mychannels-video__close-button .close-button-icon svg {
  height: 1.2em;
  width: 1.2em;
}
.mychannels .mychannels-video-sticky .mychannels-video__close-button {
  position: absolute;
  top: 1em;
  right: 1em;
}
.mychannels .mychannels-video-sticky .mychannels-video__close-button button {
  background-color: #222;
  border-radius: 4px;
}
.mychannels .mychannels-video-sticky .mychannels-video__close-button .close-button-icon svg {
  fill: #fff;
  height: 1.65em;
  width: 1.65em;
}
.mychannels .mychannels-video-sticky--is-sticky {
  background: #f5f5f5;
  padding-top: 56.25%;
}
.mychannels .mychannels-video-sticky--is-sticky .mychannels-video-sticky__inner {
  position: fixed;
  display: flex;
  align-items: center;
  background: #fff;
  width: 100%;
  box-shadow: 0 7px 7px -7px rgba(0, 0, 0, 0.5);
  top: 50px;
  transition: top 550ms ease-out;
}
.mychannels .mychannels-video-sticky--is-sticky .mychannels-video-sticky__inner--sub-nav-open {
  margin-top: 36px;
}
.mychannels .mychannels-video-sticky--is-sticky .mychannels-video-sticky__inner.animate-up {
  top: -300px;
}
.mychannels .mychannels-video-sticky--is-sticky .pui_root .pui__overlay__title {
  display: none;
}
.mychannels .mychannels-video-sticky--is-sticky .pui__root--active .mychannels-video__close-button,
.mychannels .mychannels-video-sticky--is-sticky .pui__root--active .mychannels-video__close-overlay {
  display: block;
}
.mychannels .mychannels-video-sticky--is-sticky .pui__root--active:not(.pui__root--is-fullscreen) .pui__overlay__brand {
  display: none;
}
.mychannels .mychannels-video-sticky .pui__root--active.pui__root--is-fullscreen .mychannels-video__close-button,
.mychannels .mychannels-video-sticky .pui__root--active.pui__root--is-fullscreen .mychannels-video__close-overlay {
  display: none;
}
.mychannels .mychannels-video-sticky--is-mini .mychannels-video-sticky__mask {
  display: flex;
}
.mychannels .mychannels-video-sticky--is-mini .mychannels-video-sticky__meta {
  display: block;
  opacity: 1;
}
.mychannels .mychannels-video-sticky--is-mini .mychannels-video-sticky__close {
  display: block;
}
.mychannels .mychannels-inline-playlist {
  max-width: 1024px;
  border-radius: 5px;
  background: #f6f6f6;
  overflow: hidden;
  color: #222;
  border: 1px solid #e5e5e5;
  margin: 0 auto;
}
.mychannels .mychannels-inline-playlist__video {
  position: relative;
  padding-top: 56.25%;
}
.mychannels .mychannels-inline-playlist__player {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
}
.mychannels .mychannels-inline-playlist__content {
  padding-top: 15px;
  padding-right: 15px;
  padding-left: 15px;
}
.mychannels .mychannels-inline-playlist__title {
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-weight: 700;
  font-size: 22px;
  line-height: 1.1428571429;
  margin: 0 0 10px 0;
  padding: 0;
}
.mychannels .mychannels-inline-playlist__description {
  display: block;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  font-family: Arial, "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-weight: 400;
  font-size: 17px;
  line-height: 1.2352941176;
  overflow: hidden;
}
.mychannels .mychannels-inline-playlist__divider {
  margin-top: 15px;
  border-bottom: 1px solid #e5e5e5;
}
.mychannels .mychannels-inline-playlist__list {
  position: relative;
  z-index: 0;
}
.mychannels .mychannels-inline-playlist__list-control {
  display: none;
  position: absolute;
  opacity: 0;
  z-index: 1;
  top: 50%;
  transform: translate3d(0, -50%, 0);
  width: 50px;
  height: 80px;
  background: #d10a10;
  border: none;
  outline: 0;
  cursor: pointer;
  transition: opacity 0.35s ease;
}
.mychannels .mychannels-inline-playlist__list-control--is-visible {
  opacity: 1;
}
.mychannels .mychannels-inline-playlist__list-control svg {
  height: 60px;
  fill: #fff;
}
.mychannels .mychannels-inline-playlist__list-control--previous {
  left: 0;
}
.mychannels .mychannels-inline-playlist__list-control--previous svg {
  transform: rotate(-90deg);
}
.mychannels .mychannels-inline-playlist__list-control--next {
  right: 0;
}
.mychannels .mychannels-inline-playlist__list-control--next svg {
  transform: rotate(90deg);
}
.mychannels .mychannels-inline-playlist__items {
  display: flex;
  z-index: 0;
  overflow-x: auto;
  padding-top: 15px;
  padding-bottom: 15px;
}
.mychannels .mychannels-inline-playlist__item {
  position: relative;
  min-width: 40%;
  margin-left: 15px;
  cursor: pointer;
}
.mychannels .mychannels-inline-playlist__item:last-child {
  margin-right: 15px;
}
.mychannels .mychannels-inline-playlist__item--is-selected::before {
  content: "";
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate3d(-50%, -100%, 0);
  width: 0;
  height: 0;
  border-left: 4px solid transparent;
  border-right: 4px solid transparent;
  border-bottom: 8px solid rgba(0, 0, 0, 0.75);
}
.mychannels .mychannels-inline-playlist__item--is-selected .mychannels-inline-playlist__visual::after {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: rgba(0, 0, 0, 0.75);
}
.mychannels .mychannels-inline-playlist__item--is-selected .mychannels-inline-playlist__label {
  display: block;
}
.mychannels .mychannels-inline-playlist__item--is-selected .mychannels-inline-playlist__item-time,
.mychannels .mychannels-inline-playlist__item--is-selected .mychannels-inline-playlist__item-title {
  opacity: 0.5;
}
.mychannels .mychannels-inline-playlist__visual {
  position: relative;
  padding-top: 75%;
  overflow: hidden;
}
.mychannels .mychannels-inline-playlist__label {
  display: none;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  background: #d10a10;
  color: #fff;
  padding: 6px 18px;
  border-radius: 5px;
  z-index: 1;
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-weight: 700;
  font-size: 17px;
}
.mychannels .mychannels-inline-playlist__item-title {
  display: block;
  display: -webkit-box;
  -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  line-height: 1.2352941176;
  height: 63px;
  margin-top: 10px;
  margin-bottom: 10px;
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-weight: 700;
  font-size: 17px;
}
.mychannels .mychannels-inline-playlist__item-time {
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-weight: 700;
  font-size: 17px;
  line-height: 1.2352941176;
}
.mychannels .mychannels-inline-playlist__thumbnail {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate3d(-50%, -50%, 0);
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
}
.mychannels .mychannels-inline-playlist__banner {
  position: absolute;
  top: 5px;
  right: 5px;
  width: 30px;
  height: 30px;
}
.mychannels .mychannels-inline-playlist__banner--hln.mychannels-inline-playlist__banner--authenticated {
  top: 5px;
  left: 5px;
  height: 21px;
  width: 43px;
}
.mychannels .mychannels-inline-playlist__banner--hln.mychannels-inline-playlist__banner--subscribed {
  top: 5px;
  left: 5px;
  height: 19px;
  width: 43px;
}
.mychannels .mychannels-inline-playlist__banner--ADR.mychannels-inline-playlist__banner--authenticated {
  width: 30px;
  height: 30px;
}
.mychannels .mychannels-inline-playlist__banner--ADR.mychannels-inline-playlist__banner--subscribed {
  top: 0;
  right: 0;
  width: 92px;
  height: 25px;
}
.mychannels .mychannels-inline-playlist__banner svg {
  vertical-align: top;
}
.mychannels .mychannels-inline-playlist__play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate3d(-50%, -50%, 0);
  height: 50px;
  width: 50px;
}
.mychannels .mychannels-inline-playlist__play .mychannels__playbutton {
  transform: scale(1.1);
}
.mychannels .mychannels-inline-playlist__play .mychannels__playbutton .mychannels__playbutton_arrow {
  fill: #fff;
}
.mychannels .mychannels-inline-playlist__play .mychannels__playbutton .mychannels__playbutton_circle {
  fill: #d10a10;
}
.mychannels .mychannels-inline-playlist--sm .mychannels-inline-playlist__list-control {
  display: block;
}
.mychannels .mychannels-inline-playlist--md .mychannels-inline-playlist__title {
  font-size: 28px;
}
.mychannels .mychannels-inline-playlist--md .mychannels-inline-playlist__item {
  min-width: 26.6666666667%;
}
.mychannels .audio-stream-root {
  position: relative;
}
.mychannels .audio-stream-root svg {
  cursor: pointer;
}
.mychannels .audio-stream-root [data-type=pause],
.mychannels .audio-stream-root [data-type=play] {
  transition: opacity 0.5s ease;
}
@keyframes mychannelsFadeIn {
  from {
    opacity: 0;
    transform: translate3d(0, 0, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
@keyframes mychannelsFadeInUp {
  from {
    opacity: 0;
    transform: translate3d(0, 80px, 0);
  }
  to {
    opacity: 1;
    transform: translate3d(0, 0, 0);
  }
}
.mychannels .mychannels--recos-visible .pui__controls {
  z-index: 10;
}
.mychannels .pe__container__player ::cue {
  color: #fff;
  background-color: rgba(0, 0, 0, 0.5);
  line-height: 1.5;
}
@media screen and (max-width: 576px) {
  .mychannels .pe__container__player ::cue {
    /* fluid font size for subtitles when on small screen
     https://css-tricks.com/snippets/css/fluid-typography/ */
    font-size: calc(17px + 6 * (100vw - 576px) / 680);
  }
}
.mychannels .pe__container__subtitles {
  display: none;
}
.mychannels .pui__root--active {
  /* transition for play button */
}
.mychannels .pui__root--active .mychannels__playbutton {
  transform: scale(1.15) !important;
}
.mychannels .pui__root .pui__icon {
  font-family: "player-ui-icons-rounded";
}
.mychannels .pui__root .pui__nod {
  background-color: #d10a10;
}
.mychannels .pui__root .pui__startplay {
  background: #d10a10;
}
.mychannels .pui__root .pui__seekbar__bars__progress {
  background-color: #d10a10;
}
.mychannels .pui__root .pui__overlay__brand {
  transition: all 0.15s ease;
  position: absolute;
  top: 1em;
  right: 1em;
  max-width: 9.2857142857em;
  max-height: 3.4285714286em;
  border-radius: 0.2857142857em;
  z-index: 1;
}
.mychannels .pui__root .pui__overlay__title__wrapper {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  pointer-events: none;
  height: 100px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0.65) 0%, rgba(0, 0, 0, 0) 100%);
}
.mychannels .pui__root .pui__overlay__title {
  transition: all 0.15s ease;
  position: absolute;
  top: 10px;
  left: 10px;
  display: block;
  display: -webkit-box;
  max-width: calc(100% - 9em);
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-size: 22px;
  max-height: 52px;
  line-height: 1.1818181818;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.mychannels .pui__root .pui__startplay {
  /*
   * By default we disable startplay, cause own overlay is used
   * 'Skins' can enable by using 'flex' and disable overlay if needed
   */
  display: none;
  align-items: center;
  justify-content: center;
  height: 48px;
  width: 48px;
  border-radius: 50%;
  transform: scale(1.25);
}
.mychannels .pui__root .pui__overlay__clickout {
  cursor: pointer;
  position: absolute;
  left: 0;
  bottom: 1em;
  transform: translateY(0);
  text-decoration: none;
  transition: transform 0.3s ease;
  color: #fff;
  font: inherit;
  line-height: normal;
}
.mychannels .pui__root .pui__overlay__clickout__body {
  display: flex;
  align-items: center;
  background-color: rgba(0, 0, 0, 0.8);
  margin: 1em 1em 0 1em;
  padding: 0.3em 0.4em;
  border-radius: 2px;
  overflow: hidden;
  transition: margin 0.3s ease;
}
.mychannels .pui__root .pui__overlay__clickout__icon {
  margin-right: 0.8em;
  height: 1em;
  width: 1em;
}
.mychannels .pui__root .pui__overlay__clickout__icon svg {
  height: 100%;
  width: 100%;
  fill: #fff;
}
.mychannels .pui__root .pui__overlay__recommendations {
  animation: mychannelsFadeIn 0.35s ease;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  padding-bottom: 3.36em;
  background-color: rgba(0, 0, 0, 0.8);
  display: flex;
}
.mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper {
  padding: 10px;
  flex-grow: 1;
  width: 100%;
  overflow: hidden;
  display: flex;
  flex-wrap: wrap;
  justify-content: space-evenly;
  align-items: center;
}
.mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper {
  flex: 0 0 50%;
  height: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper .pui__overlay__recommendation {
  position: relative;
  height: calc(100% - 20px);
  border-radius: 4px;
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: calc(100% - 20px);
  overflow: hidden;
  transition: all 0.2s ease-out;
}
.mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper .pui__overlay__recommendation:hover {
  transform: scale(1.02);
}
.mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper .pui__overlay__recommendation img {
  position: absolute;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: center;
     object-position: center;
  width: 100%;
  height: 100%;
}
.mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper .pui__overlay__recommendation .pui__overlay__recommendation_title {
  position: absolute;
  height: 100%;
  width: 100%;
  background: linear-gradient(0deg, rgba(0, 0, 0, 0.8) 0%, rgba(0, 0, 0, 0.7) 30%, rgba(0, 0, 0, 0.1) 60%, rgba(0, 0, 0, 0) 100%);
  display: flex;
  align-items: flex-end;
  text-overflow: ellipsis;
  overflow: hidden;
}
.mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper .pui__overlay__recommendation .pui__overlay__recommendation_title span {
  padding: 10px;
  font-size: 17px;
  font-weight: 600;
  color: white;
}
.mychannels .pui__root.pui__root--is-fullscreen .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper {
  flex: 0 0 33%;
  height: 33%;
}
.mychannels .pui__root .pui__overlay .pui__overlay--hidden {
  display: none;
}
.mychannels .pui__root .pui__overlay__playbutton_wrapper {
  width: 100%;
  height: 100%;
  position: absolute;
  left: 0;
  top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  pointer-events: none;
}
.mychannels .pui__root .pui__overlay__playbutton_wrapper .mychannels__playbutton {
  height: 60px;
  width: 60px;
  transform: scale(1);
  transition: transform 0.35s;
}
.mychannels .pui__root .pui__overlay__playbutton_wrapper .mychannels__playbutton .mychannels__playbutton_arrow {
  fill: #fff;
}
.mychannels .pui__root .pui__overlay__playbutton_wrapper .mychannels__playbutton .mychannels__playbutton_circle {
  fill: #d10a10;
}
@media (max-width: 767px) {
  .mychannels .pui__root .pui__overlay__title {
    max-width: calc(100% - 6em);
    font-size: 15px;
    max-height: 41.25px;
  }
  .mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper {
    padding: 5px 10px;
  }
  .mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper .pui__overlay__recommendation {
    flex-grow: 0;
    flex-shrink: 1;
    flex-basis: calc(100% - 10px);
    height: calc(100% - 10px);
  }
  .mychannels .pui__root .pui__overlay__recommendations .pui__overlay__recommendations_wrapper .pui__overlay__recommendation_wrapper .pui__overlay__recommendation .pui__overlay__recommendation_title span {
    padding: 5px;
    font-size: 14px;
  }
}
.mychannels .pui__root--active .pui__overlay__clickout {
  transform: translateY(-3.5em);
}
.mychannels .pe__container.pe__pip .pui__root .pui__overlay__recommendations {
  display: none;
}
.mychannels .pe__container.pe__pip .pui__root .pui__overlay__clickout {
  display: none;
}
.mychannels .pui__root--theme-branded-content {
  /** disable mc play button */
}
.mychannels .pui__root--theme-branded-content .pui__icon {
  font-family: "player-ui-icons-rounded";
}
.mychannels .pui__root--theme-branded-content .pui__nod {
  color: #000;
  background-color: #fff;
}
.mychannels .pui__root--theme-branded-content .pui__overlay__playbutton_wrapper {
  display: none;
}
.mychannels .pui__root--theme-branded-content .pui__startplay {
  display: flex;
  color: #000;
  background: #fff;
}
.mychannels .pui__root--theme-branded-content .pui__seekbar__bars__progress {
  background-color: #fff;
}
.mychannels .pui__root--theme-ziggo {
  font-size: 12px;
}
.mychannels .pui__root--theme-ziggo.pui__root--active::before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  background: linear-gradient(to bottom, transparent, rgba(0, 0, 0, 0.4) 77%, rgba(0, 0, 0, 0.4) 100%) 100% 100%/100% 240px no-repeat transparent;
}
.mychannels .pui__root--theme-ziggo .pui__controls .pui__button {
  opacity: 1;
  height: 3.6666666667em;
  width: 3.6666666667em;
}
.mychannels .pui__root--theme-ziggo .pui__button__tooltip {
  padding: 7px 10px;
  background-color: #fff;
  color: #000;
}
.mychannels .pui__root--theme-ziggo .pui__controls::before {
  content: none;
}
.mychannels .pui__root--theme-ziggo .pui__icon {
  font-family: "player-ui-icons-jwplayer";
}
.mychannels .pui__root--theme-ziggo .pui__overlay__title {
  display: none;
}
.mychannels .pui__root--theme-ziggo .pui__nod {
  display: none;
}
.mychannels .pui__root--theme-ziggo .pui__seekbar__bars__buffered {
  background-color: #fff;
}
.mychannels .pui__root--theme-ziggo .pui__seekbar__bars__progress {
  background-color: #f48c00;
}
.mychannels .pui__root--theme-ziggo .pui__seekbar__progress {
  background-color: #fff;
}
.mychannels .pui__root--theme-ziggo .pui__seekbar__scrubber {
  background-color: #f48c00;
}
.mychannels .pui__root--theme-ziggo .pui__seekbar__tooltip__text {
  padding: 7px 10px;
  background-color: #fff;
  color: #000;
}
.mychannels .pui__root--theme-ziggo .pui__overlay__playbutton_wrapper {
  display: none;
}
.mychannels .pui__root--theme-ziggo .pui__startplay {
  display: flex;
  background: transparent;
  border: 5px solid #fff;
  height: 60px;
  width: 60px;
  transition: all 0.2s;
}
.mychannels .pui__root--theme-ziggo .pui__startplay .pui__icon {
  font-size: 32px;
}
.mychannels .pui__root--theme-ziggo .pui__startplay:hover {
  background-color: rgba(0, 0, 0, 0.6);
  border-color: #f48c00;
  color: #f48c00;
  -webkit-backdrop-filter: blur(3px);
          backdrop-filter: blur(3px);
}
.mychannels .pui__root--theme-vtmgo {
  /* enable popcorn play button */
  /* disable mc play button */
}
.mychannels .pui__root--theme-vtmgo .pui__icon {
  font-family: "player-ui-icons-vtmgo";
}
.mychannels .pui__root--theme-vtmgo .pui__nod {
  background-color: #f0f;
}
.mychannels .pui__root--theme-vtmgo .pui__startplay,
.mychannels .pui__root--theme-vtmgo .pui__seekbar__bars__progress {
  background: #f0f;
}
.mychannels .pui__root--theme-vtmgo .pui__startplay {
  display: flex;
}
.mychannels .pui__root--theme-vtmgo .pui__overlay__playbutton_wrapper {
  display: none;
}
.mychannels .pui__root--theme-vtmgo .pui__startplay .pui__icon {
  font-size: 2em;
}
.mychannels .pui__root--theme-vtmgo .pui__seekbar__scrubber {
  background: #fff;
  border: 0.3em solid #f0f;
}
.mychannels .pui__root {
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
}
.mychannels .mychannels-placeholder__subscribed,
.mychannels .pui__overlay__subscribed {
  cursor: pointer;
  position: absolute;
  top: 0;
  right: 0;
  width: 129px;
  height: 35px;
}
.mychannels .mychannels-placeholder__subscribed svg,
.mychannels .pui__overlay__subscribed svg {
  height: 100%;
  width: 100%;
}
.mychannels .pui__overlay__title,
.mychannels .mychannels-video__time-indicator {
  font-family: "FlamaProSemicond-Bold", "Flama Semicondensed";
  font-weight: 700;
}