@font-face {
    font-family: appFontBold;
    src: url(../fonts/TT-Scandia-Bold.otf);
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: appFontBoldItalic;
    src: url(../fonts/TT-Scandia-BoldItalic.otf);
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: appFontItalic;
    src: url(../fonts/TT-Scandia-MediumItalic.otf);
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: appFontLight;
    src: url(../fonts/TT-Scandia-Regular.otf);
    font-weight: 400;
    font-style: normal;
}

@font-face {
    font-family: appFontRegular;
    src: url(../fonts/TT-Scandia-Medium.otf);
    font-weight: 400;
    font-style: normal;
}

* {
    box-sizing: border-box;
}

/* :focus {
    outline: #7397a9 auto 5px;
  } */

body,
html {
    margin: 0;
    padding: 0;
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 14px;
    background-color: #061016;
    color: #fff;
    min-height: 100%;
    -webkit-font-smoothing: antialiased;
    -ms-overflow-x: hidden;
}

body.non-scroll {
    overflow: hidden;
}

#root {
    height: 100%;
}

.App {
    /* min-height: 100vh; */
    position: relative;
}

h1 {
    font-size: 40px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 1em 0;
}

a {
    color: #7397a9;
}

input {
    font-family: appFontLight, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

input[type="radio"] {
    border: 0;
    clip: rect(0 0 0 0);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
}

input[type="radio"]+span:before {
    content: "";
    display: inline-block;
    width: 22px;
    height: 22px;
    vertical-align: middle;
    border-radius: 100%;
    border: 4px solid #fff;
    margin-right: 0.75em;
    transition: all 0.3s ease;
    background: #fff;
    box-sizing: border-box;
}

input[type="radio"]:checked+span:before {
    background: #0094d9;
}

input[type="checkbox"] {
    -webkit-appearance: none;
    -moz-appearance: none;
    width: 22px;
    height: 22px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05), inset 0 -15px 10px 0 rgba(0, 0, 0, 0.05);
    position: relative;
    border-radius: 2px;
    margin: 0;
    margin-right: 0.75em;
    transition: all 0.3s ease;
    cursor: pointer;
    vertical-align: middle;
}

input[type="checkbox"]:after {
    content: url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABYAAAAWCAYAAADEtGw7AAAAAXNSR0IArs4c6QAAAWVJREFUOBHN1L2OAVEUwPH/biRCoSBRUYgGpcRLeBGdUkIQgqhpFTQ6jUqjUmtpScwbICQSds5eHzMGMWuKPckd95h7fnPdnMHpdErrY6UPp0Ks9Jd+WQEhfTgZmsAnJ8WL9X2ZOP35j+HxGNptOB5NP9plyuwmwyH0ereqbPY6/zvc78NgoCCXzqRSV1Qm9mFpok4HRiMFud2Qy0Ey+QEs59hqwWSiEI8HikVIJEyoJNau0DTY7y0LORyg2byhPh/Uag9RK7xcQqGgCoz4bgfVKkyn6oF+P9TrEI1aN3D+xrzjbhfWa5jPb7jkpRLMZqokGIRGA8Lhp6jcML/Smw2Uy7BYqKJ4XD1IjkcipP+lVCoQCPymry5mWFbe45fqSEShcrZvhBWWons8FlPH4fW+Qaolj2EjLjvM50H61UY8hwXZbhUob5bNeA3bxIzLze1mvPPhXOBzL30omcs1gTMO47LRzA+ujtGXd5fWAgAAAABJRU5ErkJggg==);
    opacity: 0.01;
    position: absolute;
}

input[type="checkbox"]:checked:after {
    opacity: 1;
}

input[type="checkbox"]:focus,
input[type="checkbox"]:hover,
input[type="radio"]+span:focus:before,
input[type="radio"]+span:hover:before {
    box-shadow: 0 0 5px #fff;
}

.onoffswitch {
    position: relative;
    width: 72px;
    user-select: none;
    vertical-align: middle;
}

.onoffswitch-checkbox {
    display: none;
}

.onoffswitch-label {
    display: block;
    overflow: hidden;
    cursor: pointer;
    border-radius: 15.5px;
    margin: 0;
}

.onoffswitch-label:focus,
.onoffswitch-label:hover {
    box-shadow: 0 0 5px 3px rgba(255, 255, 255, 0.3);
}

.onoffswitch-inner {
    display: block;
    width: 200%;
    margin-left: -100%;
    transition: margin 0.3s ease-in;
}

.onoffswitch-inner:after,
.onoffswitch-inner:before {
    display: block;
    float: left;
    width: 50%;
    height: 31px;
    padding: 0;
    line-height: 31px;
    font-size: 14.4px;
    color: #fff;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    box-sizing: border-box;
}

.onoffswitch-inner:before {
    content: "ON";
    padding-left: 10.8px;
    background-color: #42cc14;
    color: #fff;
}

.onoffswitch-inner:after {
    content: "OFF";
    padding-right: 10.8px;
    background-color: #324751;
    color: #fff;
    text-align: right;
}

.onoffswitch-switch {
    display: block;
    width: 24.8px;
    height: 24.8px;
    margin: 0;
    background: #fff;
    position: absolute;
    top: 3.1px;
    right: 43.2px;
    border: 2px solid #afafaf;
    border-radius: 12.4px;
    transition: all 0.3s ease-in;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-inner {
    margin-left: 0;
}

.onoffswitch-checkbox:checked+.onoffswitch-label .onoffswitch-switch {
    right: 3.1px;
}

.button-theme,
.live-tv .not-entitled-player-slate .not-entitled-slate-content a,
.live-tv .not-entitled-player-slate .not-entitled-slate-content button,
.settings-page .controls.privacy-settings .misc-type a,
.synopsis .content-left .buttons a,
.synopsis .content-left .buttons button,
.top-nav-button,
a.settings-button,
button.settings-button {
    font-size: 14px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    background-image: none;
    background: #0094d9;
    color: #fff;
    border-radius: 4px;
    min-height: 35px;
    position: relative;
    cursor: pointer;
    border-width: 0;
}

.button-theme::after,
.live-tv .not-entitled-player-slate .not-entitled-slate-content a::after,
.live-tv .not-entitled-player-slate .not-entitled-slate-content button::after,
.settings-page .controls.privacy-settings .misc-type a::after,
.synopsis .content-left .buttons a::after,
.synopsis .content-left .buttons button::after,
.top-nav-button::after,
a.settings-button::after,
button.settings-button::after {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.1);
    transition: 0.3s ease;
    opacity: 0.01;
}

.button-theme:focus,
.button-theme:hover,
.live-tv .not-entitled-player-slate .not-entitled-slate-content a:focus,
.live-tv .not-entitled-player-slate .not-entitled-slate-content a:hover,
.live-tv .not-entitled-player-slate .not-entitled-slate-content button:focus,
.live-tv .not-entitled-player-slate .not-entitled-slate-content button:hover,
.settings-page .controls.privacy-settings .misc-type a:focus,
.settings-page .controls.privacy-settings .misc-type a:hover,
.synopsis .content-left .buttons a:focus,
.synopsis .content-left .buttons a:hover,
.synopsis .content-left .buttons button:focus,
.synopsis .content-left .buttons button:hover,
.top-nav-button:focus,
.top-nav-button:hover,
a.settings-button:focus,
a.settings-button:hover,
button.settings-button:focus,
button.settings-button:hover {
    background-image: none;
    background: #00acfc;
}

.button-theme:focus::after,
.button-theme:hover::after,
.live-tv .not-entitled-player-slate .not-entitled-slate-content a:focus::after,
.live-tv .not-entitled-player-slate .not-entitled-slate-content a:hover::after,
.live-tv .not-entitled-player-slate .not-entitled-slate-content button:focus::after,
.live-tv .not-entitled-player-slate .not-entitled-slate-content button:hover::after,
.settings-page .controls.privacy-settings .misc-type a:focus::after,
.settings-page .controls.privacy-settings .misc-type a:hover::after,
.synopsis .content-left .buttons a:focus::after,
.synopsis .content-left .buttons a:hover::after,
.synopsis .content-left .buttons button:focus::after,
.synopsis .content-left .buttons button:hover::after,
.top-nav-button:focus::after,
.top-nav-button:hover::after,
a.settings-button:focus::after,
a.settings-button:hover::after,
button.settings-button:focus::after,
button.settings-button:hover::after {
    opacity: 1;
}

.progress-bar-container .progress-bar {
    background: #0094d9;
}

.cc-icon,
.hd-icon {
    width: 28px;
    height: auto;
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    margin-top: -1px;
}

.not-found-content {
    font-size: 40px;
    display: flex;
    height: calc(100vh - 70px);
    justify-content: center;
    align-items: center;
}

.toggleable-image {
    display: flex;
    justify-items: center;
}

.toggleable-image img {
    max-width: 100%;
}

.toggleable-image .selected-image {
    display: none;
}

:focus>.toggleable-image .default-image,
:hover>.toggleable-image .default-image {
    display: none;
}

:focus>.toggleable-image .selected-image,
:hover>.toggleable-image .selected-image {
    display: inline;
}

.primary-color-icon .color1-fill {
    fill: #fff;
}

.primary-color-icon .color1-stroke {
    stroke: #fff;
}

.primary-color-icon .color2-fill {
    fill: #00366399;
}

.secondary-color-icon .color1-fill {
    fill: #003663;
}

.primary-color-logo .color2-fill {
    fill: #fff;
}

.secondary-color-logo .color2-fill {
    fill: #0094d9;
}

.player .pause-icon,
.player .play-icon {
    width: 40px;
    height: 40px;
}

.player .pause-icon-large,
.player .play-icon-large {
    width: 120px;
    height: 120px;
}

.player .mute-icon,
.player .volume-icon {
    width: 40px;
    height: 40px;
}

.player .forward-icon,
.player .rewind-icon {
    width: 32px;
    height: 32px;
}

.player .fullscreen-icon,
.player .minimize-fullscreen-icon {
    width: 24px;
    height: 24px;
}

.player .back-icon {
    width: 40px;
    height: 40px;
}

.player .small-size-player-button {
    width: 25px;
    height: 25px;
}

.arrow-svg {
    overflow: visible;
}

.arrow-svg g {
    transition: all 0.3s ease;
}

.arrow-svg:hover .width1-stroke {
    stroke-width: 5;
}

.tile-image-holder .play-icon-svg .color3-fill {
    fill: #fff;
}

.tile-image-holder .play-icon:focus .play-icon-svg .color3-fill,
.tile-image-holder .play-icon:hover .play-icon-svg .color3-fill {
    fill: #0094d9;
}

.tile.playable .tile-description .info-svg .info-svg .color1-fill {
    fill: #7397a9;
}

.tile.playable .tile-description .info-svg .info-svg .color1-stroke {
    stroke: #7397a9;
}

.tile.playable .tile-description:focus .info-svg .color1-fill,
.tile.playable .tile-description:hover .info-svg .color1-fill {
    fill: #fff;
}

.tile.playable .tile-description:focus .info-svg .color1-stroke,
.tile.playable .tile-description:hover .info-svg .color1-stroke {
    stroke: #fff;
}

.live-tv .channels-container .tabs .tv-guide-anchor svg .color1-fill {
    fill: #7397a9;
    transition: all 0.3s ease;
}

.live-tv .channels-container .tabs .tv-guide-anchor:focus svg .color1-fill,
.live-tv .channels-container .tabs .tv-guide-anchor:hover svg .color1-fill {
    fill: #fff;
}

.search-menu-item .clear-icon .color1-stroke,
.search-menu-item .search-icon .color1-stroke {
    stroke: #7397a9;
    transition: all 0.3s ease;
}

.search-menu-item .clear-icon .color1-fill,
.search-menu-item .search-icon .color1-fill {
    fill: #7397a9;
    transition: all 0.3s ease;
}

.search-menu-item:focus .clear-icon .color1-stroke,
.search-menu-item:focus .search-icon .color1-stroke,
.search-menu-item:hover .clear-icon .color1-stroke,
.search-menu-item:hover .search-icon .color1-stroke {
    stroke: #fff;
}

.search-menu-item:focus .clear-icon .color1-fill,
.search-menu-item:focus .search-icon .color1-fill,
.search-menu-item:hover .clear-icon .color1-fill,
.search-menu-item:hover .search-icon .color1-fill {
    fill: #fff;
}

.search-menu-item.open .search-icon .color1-stroke {
    stroke: #fff;
}

.search-menu-item.open .search-icon .color1-fill {
    fill: #fff;
}

.KIDS .kids-svg .color1-fill,
.KIDSmobile .kids-svg .color1-fill {
    fill: #7397a9;
    transition: all 0.3s ease;
}

.KIDS.active .kids-svg .color1-fill,
.KIDS:focus .kids-svg .color1-fill,
.KIDS:hover .kids-svg .color1-fill,
.KIDSmobile.active .kids-svg .color1-fill,
.KIDSmobile:focus .kids-svg .color1-fill,
.KIDSmobile:hover .kids-svg .color1-fill {
    fill: #fff;
}

.settings-icon .color1-fill {
    fill: #7397a9;
    transition: all 0.3s ease;
}

.settings-icon:focus .color1-fill,
.settings-icon:hover .color1-fill {
    fill: #fff;
}

.settings-cross .color1-stroke {
    stroke: #e8350c;
}

.settings-tick .color1-fill {
    fill: #42cc14;
}

.menu-bar-container {
    position: relative;
    width: 100%;
    z-index: 105;
    background: rgb(2 33 59);
    height: 70px;
    transition: all 0.3s linear;
}

.menu-bar-container.menu-bar-hidden:not(.hamburgerOpen) {
    transform: translateY(-74px);
}

.menu-bar-container.ua-barrier-menu {
    position: initial;
}

.menu-bar-container.searchBarOpen .image-link {
    display: none;
}

.login .menu-bar-simple {
    box-shadow: 0 0 30px rgba(0, 0, 0, 0.15);
    background: #fff;
}

.menu-bar {
    min-width: 300px;
    padding: 0 5%;
    width: 100%;
    box-sizing: border-box;
    border-bottom: 1px solid #061016;
    display: flex;
    justify-content: space-between;
    height: 70px;
    position: static;
    opacity: 0;
    transition: opacity 0.3s;
}

.menu-bar .hidden-hamburger {
    display: none !important;
}

.menu-bar .logo {
    cursor: pointer;
}

.menu-bar .menu-item {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 18px;
}

.menu-bar.show {
    opacity: 1;
}

@media (min-width: 1920px) {
    .menu-bar {
        padding: 0 80px;
    }
}

.menu-bar .logo {
    height: 40px;
    display: inline-block;
    vertical-align: middle;
    margin-right: 25px;
}

.menu-bar .logo img,
.menu-bar .logo svg {
    height: 100%;
    width: auto;
    object-fit: contain;
}

.menu-bar .logo-when-no-menu {
    margin-top: 13px;
    cursor: pointer;
    height: 40px;
}

.menu-bar .logo-when-no-menu img,
.menu-bar .logo-when-no-menu svg {
    height: 100%;
    object-fit: contain;
}

.menu-bar.hamburger .logo-when-no-menu {
    margin-top: 0;
    margin-left: 15px;
}

.menu-bar.standard .menu-item {
    display: inline-block;
    color: #7397a9;
    cursor: pointer;
    padding: 0;
    margin: 0 25px;
    position: relative;
    height: 100%;
    line-height: 69px;
    vertical-align: middle;
    transition: color 0.3s ease;
}

/* .menu-bar.standard .menu-item:first-child {
    margin-left: 0;
  } */

.menu-bar .left-section {
    display: inline-block;
}

.menu-bar.standard .left-section {
    overflow: auto;
    white-space: nowrap;
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.menu-bar.standard .left-section::-webkit-scrollbar {
    display: none;
}

.menu-bar .menu-item.focused,
.menu-bar .menu-item:focus,
.menu-bar .menu-item:hover {
    color: #fff;
}

.menu-bar.standard .menu-item.active a {
    color: #fff;
}

.menu-bar .menu-item.active:hover {
    color: #fff;
}

.menu-bar .right-section {
    align-self: flex-end;
    display: flex;
    height: 100%;
    box-sizing: border-box;
}

.menu-bar .right-section .settings-icon {
    vertical-align: middle;
    cursor: pointer;
    color: #7397a9;
    transition: color 0.3s ease;
    height: 100%;
    display: flex;
    align-items: center;
}

.menu-bar .right-section .settings-icon img,
.menu-bar .right-section .settings-icon svg {
    min-width: 26px;
    height: 26px;
    object-fit: cover;
}

.menu-bar.hamburger {
    width: 100%;
    padding-left: 0;
}

.menu-bar.hamburger .logo {
    margin-left: 20px;
}

.menu-bar.hamburger .side-menu {
    width: 33%;
}

.menu-bar.hamburger .side-menu .menu-item {
    padding-left: 30px;
    transition: color 0.3s ease;
}

.menu-bar.hamburger .side-menu .menu-item.active {
    margin-left: 0;
}

.menu-bar.hamburger .side-menu.open:after {
    content: "";
    position: fixed;
    pointer-events: none;
    background: rgba(0, 54, 99, 0.4);
    width: 100%;
    height: calc(100% - 70px);
    left: 0;
    right: 0;
    top: 70px;
    z-index: -1;
}

.menu-bar.hamburger .left-section {
    margin-top: 13px;
}

.menu-bar.hamburger .logo {
    margin-left: 20px;
}

.hamburger-icon-holder {
    display: inline-block;
    vertical-align: middle;
    cursor: pointer;
    height: 26px;
}

.hamburger-icon-holder:hover .hamburger-icon span {
    background: #fff;
}

.hamburger .hamburger-icon:focus span {
    background: #fff;
}

.hamburger .hamburger-icon {
    display: inline-block;
    margin-left: 15px;
    width: 36px;
    height: 26px;
    position: relative;
    transform: rotate(0);
    transition: 0.3s ease-in-out;
    cursor: pointer;
    z-index: 1;
}

.hamburger .hamburger-icon span {
    display: block;
    position: absolute;
    height: 1px;
    width: calc(100% - 10px);
    background: #7397a9;
    border-radius: 1px;
    opacity: 1;
    left: 5px;
    transform: rotate(0);
    transition: 0.3s ease-in-out;
}

.hamburger .hamburger-icon span:nth-child(1) {
    top: 5px;
}

.hamburger .hamburger-icon span:nth-child(2) {
    top: 12px;
}

.hamburger .hamburger-icon span:nth-child(3) {
    top: 12px;
}

.hamburger .hamburger-icon span:nth-child(4) {
    top: 19px;
}

.hamburger .hamburger-icon.open span:nth-child(1) {
    top: 0;
    width: 0%;
    left: 50%;
    top: 50%;
}

.hamburger .hamburger-icon.open span:nth-child(2) {
    top: 50%;
    transform: rotate(45deg);
}

.hamburger .hamburger-icon.open span:nth-child(3) {
    top: 50%;
    transform: rotate(-45deg);
}

.hamburger .hamburger-icon.open span:nth-child(4) {
    top: 100%;
    width: 0%;
    left: 50%;
    top: 50%;
}

.side-menu {
    display: block;
    position: absolute;
    margin-top: 70px;
    top: 0;
    width: 40%;
    height: calc(100vh - 70px);
    box-sizing: border-box;
    min-width: 200px;
    opacity: 0.01;
    pointer-events: none;
    transition: opacity 0.3s ease-in-out;
    border-right: 1px solid #061016;
    background: #061016;
}

.menu-bar.hamburger {
    position: relative;
    width: 100%;
}

.side-menu.open {
    opacity: 1;
    pointer-events: auto;
}

.side-menu .border-div {
    display: block;
    width: 100%;
    border-top: 1px solid #061016;
}

.side-menu .menu-item {
    text-align: left;
    display: inline-block;
    color: #7397a9;
    cursor: pointer;
    padding: 12px 0;
    padding-left: 34px;
    margin: 0;
    width: 100%;
}

.menu-bar.hamburger .menu-item.active,
.side-menu .menu-item.active {
    color: #fff;
    position: relative;
}

.menu-bar .menu-item .light-bar {
    position: absolute;
    left: 0;
    pointer-events: none;
    background-color: #7397a9;
    border-radius: 0;
    background: #7397a9;
}

.menu-bar.standard .menu-item .light-bar {
    bottom: 0;
    width: 100%;
    height: 4px;
}

.menu-bar .side-menu .menu-item .light-bar,
.menu-bar.hamburger .menu-item .light-bar {
    top: 0;
    width: 4px;
    height: calc(1.35em + 24px);
    border-radius: 0;
}

.menu-bar.standard {
    display: none;
}

.menu-bar.hamburger {
    display: flex;
}

@media (min-width: 992px) {
    .menu-bar.standard {
        display: flex;
    }
    .menu-bar.hamburger {
        display: none;
    }
}

.menu-bar .toolbar-item {
    display: inline-block;
    height: 100%;
    color: #7397a9;
    cursor: pointer;
    line-height: 69px;
}

.menu-bar .toolbar-item:not(:first-child) {
    margin-left: 20px;
}

.menu-bar .toolbar-item:focus,
.menu-bar .toolbar-item:hover {
    color: #fff;
}

.menu-bar .toolbar-item .toggleable-image {
    height: 100%;
    align-items: center;
}

.menu-bar .toolbar-item .toggleable-image img {
    min-width: 26px;
    height: 26px;
    object-fit: cover;
}

@media (max-width: 480px) {
    .searchBarOpen .logo {
        display: none !important;
    }
    .searchBarOpen .hamburger-icon-holder {
        line-height: 56px;
    }
}

@media (max-width: 768px) {
    .menu-bar .logo,
    .menu-bar .logo-when-no-menu {
        margin-right: 0;
    }
    .menu-bar .logo img,
    .menu-bar .logo svg,
    .menu-bar .logo-when-no-menu img,
    .menu-bar .logo-when-no-menu svg {
        max-width: 100px;
    }
}

.menu-bar a {
    text-decoration: none;
}

.menu-bar a:hover {
    color: #fff;
    transition: color .3s ease;
}

@media (min-width: 992px) and (max-width: 1200px) {
    .menu-bar.standard .menu-item {
        margin: 0 22px;
    }
}

.kids-svg {
    width: 55px;
    height: 25px;
}

.KIDS {
    display: none;
}

.menu-bar.standard .menu-item.KIDS {
    line-height: 75px;
}

.menu-type-side-menu {
    padding-left: 250px;
}

.menu-type-side-menu .page {
    padding-top: 40px;
}

.menu-type-side-menu .footer {
    padding-left: calc(250px + 5%);
}

.menu-type-side-menu .menu-bar-container {
    left: 0;
    height: 0;
    transition: none;
}

.menu-type-side-menu .logo-container {
    text-align: center;
    width: calc(100% - 32px);
}

.menu-type-side-menu .logo-container>svg {
    height: 32px;
    width: 32px;
}

.menu-type-side-menu .logo-container .logo {
    margin-right: 0;
}

.menu-type-side-menu .logo-container .logo>svg {
    width: calc(100% - 20px);
}

.menu-type-side-menu .menu-bar {
    height: 0;
}

.menu-type-side-menu .menu-bar .side-menu {
    display: flex;
    flex-direction: column;
    justify-content: space-between;
    background: #061016;
    left: 0;
    height: 100vh;
    width: 250px;
    min-width: 100px;
    margin-top: 0;
}

.menu-type-side-menu .menu-bar .menu-header {
    padding-bottom: 6px;
    padding-left: 34px;
    font-size: 20px;
    color: #7397a9;
}

.menu-type-side-menu .menu-bar .menu-item {
    display: flex;
    line-height: 32px;
    color: #fff;
    cursor: pointer;
}

.menu-type-side-menu .menu-bar .menu-item.active {
    color: #7397a9;
}

.menu-type-side-menu .menu-bar .menu-item.active .color1,
.menu-type-side-menu .menu-bar .menu-item.active .color1-fill {
    fill: #7397a9;
}

.menu-type-side-menu .menu-bar .menu-item.active .color1-stroke {
    stroke: #7397a9;
}

.menu-type-side-menu .menu-bar .menu-item:hover {
    font-weight: 400;
    color: #7397a9;
}

.menu-type-side-menu .menu-bar .menu-item:hover .color1,
.menu-type-side-menu .menu-bar .menu-item:hover .color1-fill {
    fill: #7397a9;
}

.menu-type-side-menu .menu-bar .menu-item:hover .color1-stroke {
    stroke: #7397a9;
}

.menu-type-side-menu .menu-bar .menu-item.logo-control {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 25px;
    padding-left: 34px;
    min-height: 90px;
}

.menu-type-side-menu .menu-bar .menu-item .menu-icon {
    height: 32px;
    width: 32px;
    margin-right: 15px;
}

.menu-type-side-menu .menu-bar .menu-item .menu-icon.menu-icon-normal {
    position: relative;
}

.menu-type-side-menu .menu-bar .menu-item .menu-icon.menu-icon-selected {
    position: relative;
}

.menu-type-side-menu .menu-bar .menu-item .light-bar {
    height: 2.4em;
    margin-top: 6px;
    border-radius: 0m;
}

.menu-type-side-menu .menu-bar .side-menu-dimmer-container {
    height: 0;
}

.menu-type-side-menu .menu-bar .side-menu-dimmer-container .side-menu-dimmer {
    position: relative;
    top: -59px;
    background: linear-gradient(to bottom, transparent, #061016);
    height: 60px;
}

.menu-type-side-menu .menu-bar .menu-group.top-group {
    height: calc(100% - 250px);
    overflow-y: scroll;
}

.menu-type-side-menu .menu-bar .menu-group.top-group .top-group-content {
    padding-bottom: 60px;
}

.menu-type-side-menu .menu-bar .menu-group.bottom-group {
    margin-bottom: 40px;
}

.menu-type-side-menu-folded {
    padding-left: 100px;
}

.menu-type-side-menu-folded .footer {
    padding-left: calc(100px + 5%);
}

.menu-type-side-menu-folded .menu-bar .side-menu {
    width: 100px;
}

.menu-type-side-menu-folded .menu-bar .side-menu .menu-item.logo-control {
    display: flex;
}

.menu-type-side-menu-folded .menu-bar .side-menu .menu-item .menu-icon {
    margin-right: 0;
}

.menu-bar.hamburger .suggestions .recent-header {
    padding: 0 15px;
    font-size: 12px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.menu-bar.hamburger .suggestions .suggestion {
    padding: 0 15px;
}

.menu-bar.hamburger .suggestions .recent-header span.clear {
    font-size: 12px;
}

.menu-bar.hamburger .suggestions .recent-header span.clear:focus,
.menu-bar.hamburger .suggestions .recent-header span.clear:hover {
    color: #fff;
}

.menu-bar.hamburger .suggestions .suggestion:hover {
    color: #7397a9;
}

.search-menu-item.open {
    padding-top: 13px;
}

.search-menu-item input {
    display: none;
    border: none;
    background: 0 0;
    color: #fff;
    height: 40px;
    line-height: 40px;
    vertical-align: middle;
    font-size: 16px;
    min-width: 200px;
    margin-left: 0;
    padding-left: 15px;
}

.search-menu-item input:focus {
    outline: 0;
}

@media (max-width: 543px) {
    .search-menu-item .suggestions {
        max-height: 30vh;
        overflow-y: auto;
    }
    .search-menu-item.open input {
        max-width: 180px;
        min-width: 120px;
    }
    .search-open .logo {
        display: none !important;
    }
    .search-open .hamburger-icon-holder {
        margin-top: 7px;
    }
}

@media (max-width: 480px) {
    .search-menu-item.open input {
        max-width: 150px;
    }
}

.search-menu-item.open input {
    display: inline-block;
}

.search-menu-item .search-inner {
    margin: 0;
    display: flex;
    align-items: center;
    height: 100%;
    line-height: 40px;
    position: relative;
}

.search-menu-item .search-inner .show {
    visibility: visible;
}

.search-menu-item .search-inner .hide {
    visibility: hidden;
}

.search-menu-item.open .search-inner {
    border-bottom: 1px solid #fff;
    height: initial;
}

.search-inner .search-icon {
    display: inline-block;
    cursor: pointer;
    line-height: 0;
}

.search-inner .search-icon img,
.search-inner .search-icon svg {
    min-width: 26px;
    height: 26px;
    object-fit: cover;
}

.search-inner .clear-icon {
    display: none;
    width: 28px;
    cursor: pointer;
    line-height: 0;
}

.search-menu-item.open .clear-icon {
    display: inline-block;
}

.search-menu-item .suggestions {
    position: absolute;
    width: 100%;
    top: 40px;
    left: 0;
    background: #061016;
    border: 1px solid #061016;
    display: none;
    box-shadow: 1px 1px 3px #061016;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.search-menu-item .suggestions .suggestion {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 16px;
    padding: 0 15px;
    color: #7397a9;
    cursor: pointer;
    user-select: none;
    transition: 0.3s ease;
}

.search-menu-item .suggestions .suggestion:focus,
.search-menu-item .suggestions .suggestion:hover {
    background: #061016;
    color: #fff;
}

.search-menu-item .suggestions .recent-header {
    user-select: none;
    cursor: default;
    padding: 0 5px;
    border-bottom: 1px solid #061016;
}

.search-menu-item .suggestions .recent-header .header {
    font-size: 16px;
}

.search-menu-item .suggestions .recent-header .clear {
    font-size: 16px;
}

.search-menu-item .suggestions .recent-header span.clear {
    float: right;
    font-size: 16px;
    color: #7397a9;
    cursor: pointer;
}

.search-menu-item .suggestions .recent-header span.clear:focus,
.search-menu-item .suggestions .recent-header span.clear:hover {
    color: #fff;
}

.search-menu-item.large {
    position: relative;
    z-index: 105;
    margin: 0 5%;
}

.search-menu-item.large input {
    width: 100%;
    height: 56px;
    line-height: 56px;
    font-size: 22.4px;
}

.search-menu-item.large .clear-icon,
.search-menu-item.large .search-icon {
    width: 27px;
}

.search-menu-item.large .clear-icon>svg,
.search-menu-item.large .search-icon>svg {
    width: 27px;
    height: 27px;
}

.search-menu-item.large .suggestions {
    top: 56px;
}

.search-menu-item.open .suggestions {
    display: block;
}

.suggestion span.term {
    color: #fff;
}

.dialog {
    display: inline;
    flex: 100%;
    text-align: center;
}

.modal .buttons {
    align-self: flex-end;
}

.modal .loading-indicator-container {
    margin-left: auto;
    margin-right: auto;
}

.modal-container.open {
    align-items: center;
    background: rgba(0, 54, 99, 0.45);
    justify-content: center;
    display: flex;
    position: fixed;
    top: 0;
    right: 0;
    left: 0;
    bottom: 0;
    width: 100vw;
    height: 100vh;
    z-index: 110;
}

.modal-container.open .modal {
    padding: 10px 0 0 0;
    border-radius: 4px;
    border-width: 1px;
    border-color: #061016;
    border-style: solid;
    width: 30%;
    min-width: 410px;
    max-height: 90%;
    background: #061016;
    display: flex;
    flex-direction: column;
}

.modal-container.open .modal .top-line {
    position: relative;
    padding: 0 10px 10px 10px;
    flex: 10%;
    flex-grow: 0;
    width: 100%;
    user-select: none;
    border-bottom-width: 1px;
    border-bottom-color: #555;
    border-bottom-style: solid;
}

.modal-container.open .modal .title {
    display: inline-block;
    width: 100%;
    text-align: center;
    padding: 0 2em;
    font-size: 18px;
    outline: 0;
}

.modal-container.open .modal .control {
    position: absolute;
    right: 0;
    top: 0;
    margin-right: 0.8em;
    margin-top: -0.25em;
    cursor: pointer;
    float: right;
}

.modal-container.open .modal .control svg {
    height: 32px;
}

.modal-container.open .modal .content {
    padding: 0 20px 20px 20px;
    text-align: center;
    min-height: auto;
    overflow-y: auto;
}

.modal-container.open .modal .content .pin-entry {
    margin: 35px 0 15px 0;
}

.modal-container.open .modal .content .pin-entry .inputs {
    width: 100%;
}

.modal-container.open .modal .content p,
.modal-container.open .modal .content span {
    margin: 0;
}

.modal-container.open .modal .content .dialog>p,
.modal-container.open .modal .content .dialog>span {
    display: inline-block;
    margin: 30px 0;
}

.modal-container.open .modal .content .forgot {
    margin: 0 0 30px 0;
    cursor: pointer;
    user-select: none;
    display: inline-block;
    text-align: center;
    padding-top: 1em;
}

.modal-container.open .modal .buttons {
    font-size: 14px;
}

.modal-container.open .modal .spinner {
    margin: 20px auto;
}

.content p {
    font-size: 14px;
}

.content a {
    color: #7397a9;
}

.modal-container.closed {
    display: none;
}

@media (max-width: 768px) {
    .modal-container.open .modal {
        width: 70%;
    }
}

.next-episode {
    height: 160px;
    width: 100%;
    margin: 0 auto 10px auto;
    background: #061016;
}

.next-episode .left-section {
    padding: 20px;
    float: left;
}

.next-episode .left-section>img {
    float: left;
    max-height: 120px;
    margin-right: 15px;
}

.next-episode .left-section .description {
    float: right;
}

.next-episode .left-section .description .heading,
.next-episode .left-section .description .rating-line,
.next-episode .left-section .description .title {
    display: block;
    color: #fff;
    vertical-align: middle;
    overflow: hidden;
    margin: 3px 0;
    padding: 0 20px;
    user-select: none;
    cursor: pointer;
}

.next-episode .left-section .description .heading {
    font-size: 32px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.next-episode .left-section .description .title {
    font-size: 16px;
    color: #fff;
    margin-top: 5px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.next-episode .left-section .description .rating-line {
    font-size: 16px;
    margin-top: 5px;
    line-height: 48px;
}

.next-episode .left-section .description .rating-line img {
    width: 30px;
    vertical-align: middle;
    margin-right: 10px;
}

.next-episode .left-section .description .remaining-time {
    color: #fff;
    font-weight: bolder;
    padding: 0;
}

.next-episode .right-section {
    float: right;
    text-align: right;
    padding: 20px;
}

.next-episode .right-section .close-icon {
    display: inline-block;
    opacity: 0.7;
}

.next-episode .right-section .close-icon:hover {
    opacity: 1;
}

.next-episode .right-section .buttons {
    float: left;
}

.next-episode .right-section button {
    width: 240px;
    height: 40px;
}

.next-episode .right-section .close-icon {
    cursor: pointer;
}

.next-episode .right-section .close-icon>svg {
    width: 36px;
    height: 36px;
    fill: #fff;
}

@media (max-width: 991px) {
    .next-episode .left-section {
        padding: 20px 0 20px 20px;
    }
    .next-episode .left-section>img {
        max-width: 94px;
        margin-top: 8px;
    }
    .next-episode .right-section {
        padding: 20px 20px 20px 0;
    }
    .next-episode .right-section button {
        width: 195px;
    }
}

@media (max-width: 751px) {
    .next-episode {
        height: 240px;
        margin-bottom: 25px;
    }
    .next-episode .left-section {
        padding: 20px 20px 0 20px;
        float: none;
    }
    .next-episode .left-section>img {
        display: none;
    }
    .next-episode .left-section .description {
        float: none;
    }
    .next-episode .right-section {
        padding: 20px;
        float: none;
        text-align: left;
    }
    .next-episode .right-section .close-icon {
        position: absolute;
        top: 20px;
        right: 40px;
    }
    .next-episode .right-section .buttons {
        float: none;
    }
    .next-episode .right-section button {
        width: 100%;
        max-width: 376px;
    }
}

.bottom-bar .progress-bar {
    width: 100%;
    padding: 15px 0 1em 0;
}

.bottom-bar .progress-bar.volume {
    width: 100px;
    padding: 13px 0;
    margin-bottom: 0;
    margin-top: -5px;
    display: inline-block;
    vertical-align: middle;
}

.bottom-bar .progress-bar .progress-bar-bg {
    width: 100%;
    height: 3px;
    background: #004f91;
    position: relative;
}

.bottom-bar .progress-bar .buffering,
.bottom-bar .progress-bar .handle,
.bottom-bar .progress-bar .level,
.bottom-bar .progress-bar .playback {
    position: absolute;
    top: 0;
    left: 0;
}

.bottom-bar .progress-bar .buffering {
    background: #003663;
    width: 70%;
    height: 100%;
}

.bottom-bar .progress-bar .playback {
    height: 100%;
    background: #0094d9;
    width: 50%;
}

.bottom-bar .progress-bar .handle {
    border-radius: 100%;
    left: 50%;
}

.bottom-bar .progress-bar .handle.scrub {
    transform: translate3d(-10px, -8px, 0);
    border-width: 10px;
    border-color: #0094d9;
    border-style: solid;
}

.bottom-bar .progress-bar .handle.volume {
    padding: 0;
    transform: translate3d(-7px, -5.5px, 0);
    border-width: 7px;
    border-color: #fff;
    border-style: solid;
}

.bottom-bar .progress-bar .level {
    background: #fff;
    height: 100%;
}

.progress-bar.closed {
    opacity: 0.001;
    width: 0 !important;
}

.progress-bar {
    opacity: 1;
    transition: all 0.3s ease;
}

.player-internal-container {
    display: block;
    height: 100vh;
}

.live-tv .player-internal-container {
    height: 100%;
}

.player-container.whole-viewport {
    margin-top: -70px;
    display: flex;
    align-items: center;
    height: 100vh;
}

.player-container.whole-viewport .player {
    width: 100%;
}

.player {
    position: relative;
    min-height: 300px;
    height: 100%;
}

.player .overlay {
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    z-index: 11;
}

.player .initialising {
    visibility: hidden;
}

.ads-video-container,
video {
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
    min-width: 100%;
    width: 100%;
    max-height: 100%;
    overflow: hidden;
}

.ads-video-container.ads-paused,
video.ads-paused {
    pointer-events: none;
}

video {
    background: #000;
}

.ads-video-container>div {
    width: 100% !important;
    height: 100% !important;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0;
    margin: auto;
}

.ad-paused-overlay {
    position: absolute;
    display: flex;
    align-items: center;
    justify-content: center;
    top: 0;
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.ad-paused-overlay svg {
    max-width: 10%;
}

.ads-active .ads-video-container>div>iframe {
    width: 100%;
    height: 100%;
    z-index: 12;
}

.ads-active .ad-paused-overlay {
    z-index: 12;
}

.video-wrapper {
    width: 100vw;
    height: 100%;
    position: relative;
    background: #000;
}

.live-tv .video-wrapper {
    width: auto;
    height: 100%;
    padding-top: 56.25%;
}

.live-tv .not-entitled-player-slate {
    padding-top: 56.25%;
    position: relative;
    background: #000;
}

.live-tv .not-entitled-player-slate .not-entitled-slate-content {
    position: absolute;
    width: 90%;
    height: 100px;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
    text-align: center;
}

.live-tv .not-entitled-player-slate .not-entitled-slate-content a,
.live-tv .not-entitled-player-slate .not-entitled-slate-content button {
    padding: 0 15px;
}

.live-tv .not-entitled-player-slate .not-entitled-slate-content a {
    display: inline-block;
    line-height: 35px;
    text-decoration: none;
}

.live-tv .player.fullscreen .video-wrapper {
    padding-top: 0;
}

.whole-viewport .video-wrapper {
    position: relative;
    padding-top: 0;
    overflow: normal;
    width: 100%;
    height: 100vh;
}

.play-toggle {
    cursor: pointer;
}

.overlay>span {
    background: 0 0;
    transition: all 0.3s ease;
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
    user-select: none;
}

.overlay>span .bottom-bar,
.overlay>span .middle,
.overlay>span .top-bar {
    position: absolute;
    width: 100%;
}

.overlay>span .top-bar {
    display: flex;
    top: 0;
    padding: 3em;
    background: linear-gradient(to bottom, #000, rgba(0, 0, 0, 0));
}

.overlay>span .top-bar .back-button {
    float: left;
    height: 45px;
}

.overlay>span .top-bar .back-button-transition>svg {
    transition: all ease-in-out 0.3s;
    height: 40px;
    width: 40px;
    display: block;
}

.overlay>span .top-bar .back-button:focus .back-button-transition>svg,
.overlay>span .top-bar .back-button:hover .back-button-transition>svg {
    margin: -5px;
    height: 50px;
    width: 50px;
}

.overlay>span .top-bar .synopsis {
    padding-top: 0;
    padding-left: 20px;
}

.overlay>span .bottom-bar {
    bottom: 0;
    height: auto;
    padding-bottom: 1em;
    padding-left: 3em;
    padding-right: 3em;
}

.overlay>span .bottom-bar .bottom-bar-inner {
    width: 100%;
    height: 100%;
    display: flex;
    justify-content: space-between;
}

.overlay>span .bottom-bar .bottom-bar-inner .left span {
    display: inline-block;
    vertical-align: middle;
}

.overlay>span .bottom-bar .bottom-bar-inner .right {
    line-height: 40px;
    margin-top: -10px;
    margin-bottom: 5px;
}

.overlay>span .bottom-bar .bottom-bar-inner .right span {
    display: inline-block;
    vertical-align: middle;
    height: 26px;
}

.overlay>span .bottom-bar .seek-button {
    margin-left: 20px;
    cursor: pointer;
}

.overlay>span .bottom-bar .remaining-time {
    line-height: 28px;
    padding-right: 30px;
}

.overlay>span .bottom-bar .volume-controls {
    margin-left: 20px;
}

.overlay>span .bottom-bar .volume-controls .progress-bar {
    margin-left: 20px;
}

.overlay>span .bottom-bar .volume:hover svg {
    cursor: pointer;
}

.overlay>span .bottom-bar .volume-controls:first-child {
    margin-left: 0;
}

.overlay>span .bottom-bar .closed-captions-toggle {
    height: auto !important;
    display: block !important;
    cursor: pointer;
    padding-right: 30px;
    margin-top: 5px;
    float: right;
}

.overlay>span .bottom-bar .closed-captions-toggle .cc-icon-on {
    display: none;
}

.overlay>span .bottom-bar .closed-captions-toggle .cc-icon-off {
    display: block;
}

.overlay>span .bottom-bar .captions-controls {
    position: relative;
    display: inline-block;
    vertical-align: middle;
}

.overlay>span .bottom-bar .captions-language-dropdown {
    position: absolute;
    background: #061016;
    border-radius: 4px;
    padding: 10px;
    bottom: 60px;
    right: 0;
}

.overlay>span .bottom-bar .captions-language-dropdown .captions-language-header {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
}

.overlay>span .bottom-bar .captions-language-dropdown .captions-language-options {
    max-height: 240px;
}

.overlay>span .bottom-bar .captions-language-dropdown .captions-language-options.grid {
    display: grid;
    grid-template-rows: repeat(auto-fit, 30px);
    grid-auto-flow: column;
}

.overlay>span .bottom-bar .captions-language-dropdown .captions-language-options.scroller {
    overflow-y: auto;
}

.overlay>span .bottom-bar .captions-language-dropdown .captions-language-options .language-option {
    display: block !important;
    height: auto !important;
    line-height: 30px;
    cursor: pointer;
    transition: all 0.3s;
    padding: 0 20px;
    white-space: nowrap;
    position: relative;
}

.overlay>span .bottom-bar .captions-language-dropdown .captions-language-options .language-option.active {
    color: #0094d9;
}

.overlay>span .bottom-bar .captions-language-dropdown .captions-language-options .language-option.active .active-tick {
    position: absolute;
    top: 4px;
    left: 4px;
    border: solid #0094d9;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 6px 3px;
    width: auto;
    transform: rotate(45deg);
}

.overlay>span .bottom-bar .captions-language-dropdown .captions-language-options .language-option:focus,
.overlay>span .bottom-bar .captions-language-dropdown .captions-language-options .language-option:hover {
    color: #0094d9;
}

.overlay>span .bottom-bar .closed-captions-toggle.captions-on .cc-icon-on {
    display: block;
}

.overlay>span .bottom-bar .closed-captions-toggle.captions-on .cc-icon-off {
    display: none;
}

.overlay>span .middle {
    top: 40%;
    height: 20%;
}

.overlay>span .fullscreen-toggle {
    cursor: pointer;
    float: right;
}

.overlay>span .middle svg {
    width: 100%;
    height: 100%;
}

.overlay .clickthrough-container {
    position: absolute;
    width: 100%;
    top: 150px;
    text-align: right;
    padding-right: 50px;
    z-index: 0;
}

.overlay .clickthrough-container .clickthrough-item {
    color: #fff;
    display: inline-block;
    cursor: pointer;
    height: 35px;
    line-height: 30px;
    border-color: #fff;
    border-width: 1px;
    border-style: solid;
    text-decoration: none;
    padding: 0 10px;
}

.overlay .clickthrough-container .clickthrough-item img {
    max-height: 80%;
    margin-right: 5px;
    display: inline-block;
    vertical-align: middle;
}

.overlay .clickthrough-container .clickthrough-item span {
    display: inline-block;
    vertical-align: middle;
}

.overlay.ads-playing {
    display: none;
}

.overlay.quarter-screen:not(.fullscreen) .bottom-bar {
    padding: 0 10% 10px 10%;
}

@media (max-width: 991px) {
    .overlay.quarter-screen:not(.fullscreen) .bottom-bar {
        padding: 0 5% 10px 5%;
    }
}

.overlay.tint {
    background: rgba(0, 54, 99, 0.2);
}

.overlay-inner-tint {
    background: linear-gradient( to bottom, #00366399 0, rgba(0, 54, 99, 0.2) 20%, rgba(0, 54, 99, 0.2) 80%, #00366399 100%);
    width: 100vw;
    height: 100vh;
    position: relative;
    z-index: 1;
}

.bottom-bar-under-overlay {
    position: absolute;
    bottom: calc(79px + 1em);
    width: 100%;
    padding: 0 3em;
    z-index: 0;
}

.player:-webkit-full-screen {
    width: 100vw;
    height: 100vh;
    background: #000;
    display: flex;
    align-items: center;
    padding: 0 !important;
}

.player:-webkit-full-screen .video-wrapper {
    width: 100%;
}

.hide-cursor {
    cursor: none;
}

.overlay .bottom-controls-hider,
.overlay .middle,
.overlay .progress-bar-hider,
.overlay .top-bar {
    transition: opacity 0.3s;
}

.overlay .hide-controls .bottom-controls-hider,
.overlay .hide-controls .middle,
.overlay .hide-controls .progress-bar-hider,
.overlay .hide-controls .top-bar {
    opacity: 0.0001;
}

.overlay .show-controls .bottom-controls-hider,
.overlay .show-controls .middle,
.overlay .show-controls .progress-bar-hider,
.overlay .show-controls .top-bar {
    opacity: 1;
}

.overlay .show-controls .bottom-bar {
    background: linear-gradient( to top, rgba(0, 0, 0, 0.9) 0, rgba(0, 0, 0, 0.8) 10%, rgba(0, 0, 0, 0) 80%);
}

.overlay .hide-controls.has-loading-indicator-no-padding .middle {
    opacity: 1;
}

.hidden-button {
    opacity: 0;
    position: absolute;
}

.overlay .idle {
    display: flex;
    padding: 3em;
    height: 100%;
}

.overlay .idle .year {
    font-family: appFontLight, "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin-bottom: 1em;
}

.overlay .idle .description {
    font-family: appFontLight, "Helvetica Neue", Helvetica, Arial, sans-serif;
    max-width: 650px;
}

.overlay .idle .episode {
    margin-bottom: 1em;
}

.overlay .idle .back-button {
    float: left;
    height: 45px;
}

.overlay .idle .back-button-transition>svg {
    transition: all ease-in-out 0.3s;
    height: 40px;
    width: 40px;
}

.overlay .idle .back-button:focus .back-button-transition>svg,
.overlay .idle .back-button:hover .back-button-transition>svg {
    margin: -5px;
    height: 50px;
    width: 50px;
}

.overlay .idle .synopsis {
    padding-top: 0;
    padding-left: 20px;
}

.overlay .idle .synopsis .title {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding-top: 0;
}

.overlay .not-there {
    height: 200px;
    position: absolute;
    margin: auto;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    text-align: center;
}

.overlay .not-there .not-there-title {
    font-size: 32px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.overlay .not-there .not-there-message {
    font-size: 16px;
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 1em 0;
}

.overlay .not-there button {
    width: 240px;
    min-height: 40px;
}

.synopsis .episode {
    display: flex;
    margin: 11px 0 1em 0;
}

.synopsis .episode span {
    color: #7397a9;
    margin-left: 5px;
    margin-right: 5px;
    padding: 0 5px;
}

.synopsis .title {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 32px;
}

.synopsis .description {
    max-width: 750px;
}

.synopsis .year {
    margin-bottom: 1em;
}

.overlay .back-button {
    cursor: pointer;
}

.play-pause-large-icon {
    animation: 2s linear 0s fadePlayPause;
    opacity: 0;
    width: 100px;
    height: 100px;
    top: calc(50% - 50px);
    left: calc(50% - 50px);
    position: absolute;
}

.airplay-icon {
    border: none;
    height: 22px;
    width: 28px;
    margin: 0 30px 0 0;
    padding: 0;
    -webkit-mask-image: -webkit-named-image(wireless-playback);
    -webkit-mask-size: 100%;
    background: #fff;
    cursor: pointer;
}

.airplay-icon.airplay-active {
    background: #0094d9;
}

@keyframes fadePlayPause {
    0% {
        opacity: 1;
    }
    50% {
        opacity: 1;
    }
    100% {
        opacity: 0.001;
    }
}

.player .video-wrapper {
    font-size: 1rem;
}

.player .video-wrapper .shaka-text-container {
    position: absolute;
    pointer-events: none;
    left: 0;
    right: 0;
    top: 0;
    bottom: 30px;
    z-index: 10;
    width: 100%;
    min-width: 48px;
    transition: bottom cubic-bezier(0.4, 0, 0.6, 1) 0.1s;
    transition-delay: 0.5s;
    font-size: \max(2.2vmin, 14px);
    line-height: 1.4;
}

.player .video-wrapper .shaka-text-container * {
    font-size: \max(2.2vmin, 14px);
    line-height: 1.4;
}

.player .video-wrapper .shaka-text-container span {
    background-color: rgba(0, 0, 0, 0.8);
    color: #fff;
    display: inline-block;
}

.player .video-wrapper .shaka-text-container .shaka-nested-cue:not(:last-of-type):after {
    content: " ";
    white-space: pre;
}

.player .video-wrapper video::-webkit-media-text-track-container {
    position: fixed;
    top: auto;
    bottom: 15px;
    z-index: 10;
    transition: bottom cubic-bezier(0.4, 0, 0.6, 1) 0.1s;
    transition-delay: 0.5s;
}

.player .video-wrapper video::-webkit-media-text-track-display {
    font-size: \max(2.2vmin, 14px);
}

.player .video-wrapper.overlay-shown .shaka-text-container {
    bottom: 90px;
    transition-delay: 0s;
}

.player .video-wrapper.overlay-shown video::-webkit-media-text-track-container {
    bottom: 45px;
    transition-delay: 0s;
}

.player .video-wrapper.captions-disabled .shaka-text-container {
    display: none !important;
}

.player .video-wrapper.captions-disabled video::-webkit-media-text-track-container {
    visibility: hidden;
}

.player .video-wrapper.force-caption-style .shaka-text-container span {
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
    font-size: \max(2.2vmin, 14px) !important;
    color: #fff !important;
    background-color: #000 !important;
}

.player .video-wrapper.force-caption-style video::cue {
    color: #fff !important;
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif !important;
}

.player .video-wrapper.force-caption-style video::-webkit-media-text-track-display-backdrop {
    background-color: #000 !important;
}

.player .video-wrapper.force-caption-style video::-webkit-media-text-track-display {
    font-size: \max(2.2vmin, 14px) !important;
}

.player .video-wrapper.set-caption-style .shaka-text-container span {
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: \max(2.2vmin, 14px);
    color: #fff;
    background-color: #000;
}

.player .video-wrapper.set-caption-style video::cue {
    color: #fff;
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.player .video-wrapper.set-caption-style video::-webkit-media-text-track-display-backdrop {
    background-color: #000;
}

.player .video-wrapper.set-caption-style video::-webkit-media-text-track-display {
    font-size: \max(2.2vmin, 14px);
}

.player .video-wrapper .shaka-controls-container,
.player .video-wrapper .shaka-spinner-container {
    display: none !important;
}

.live-tv .player .video-wrapper video::-webkit-media-text-track-container {
    position: absolute;
}

.live-tv .player:not(.fullscreen) .video-wrapper .shaka-text-container,
.live-tv .player:not(.fullscreen) .video-wrapper .shaka-text-container *,
.live-tv .player:not(.fullscreen) .video-wrapper video::-webkit-media-text-track-display {
    font-size: \max(0.61875vw, 14px);
}

.live-tv .player:not(.fullscreen) .video-wrapper.force-caption-style .shaka-text-container,
.live-tv .player:not(.fullscreen) .video-wrapper.force-caption-style .shaka-text-container *,
.live-tv .player:not(.fullscreen) .video-wrapper.force-caption-style video::-webkit-media-text-track-display {
    font-size: \max(0.61875vw, 14px) !important;
}

.live-tv .player:not(.fullscreen) .video-wrapper.set-caption-style .shaka-text-container,
.live-tv .player:not(.fullscreen) .video-wrapper.set-caption-style .shaka-text-container *,
.live-tv .player:not(.fullscreen) .video-wrapper.set-caption-style video::-webkit-media-text-track-display {
    font-size: \max(0.61875vw, 14px);
}

@media (max-width: 992px) {
    .live-tv .player .video-wrapper .shaka-text-container,
    .live-tv .player .video-wrapper .shaka-text-container *,
    .live-tv .player .video-wrapper video::-webkit-media-text-track-display {
        font-size: \max(1.2375vw, 14px);
    }
    .live-tv .player .video-wrapper.force-caption-style .shaka-text-container,
    .live-tv .player .video-wrapper.force-caption-style .shaka-text-container *,
    .live-tv .player .video-wrapper.force-caption-style video::-webkit-media-text-track-display {
        font-size: \max(1.2375vw, 14px) !important;
    }
    .live-tv .player .video-wrapper.set-caption-style .shaka-text-container,
    .live-tv .player .video-wrapper.set-caption-style .shaka-text-container *,
    .live-tv .player .video-wrapper.set-caption-style video::-webkit-media-text-track-display {
        font-size: \max(1.2375vw, 14px);
    }
}

.ads-active .video-wrapper .shaka-text-container {
    display: none !important;
}

.bottom-bar .progress-bar {
    width: 100%;
    padding: 15px 0 1em 0;
}

.bottom-bar .progress-bar.volume {
    width: 100px;
    padding: 13px 0;
    margin-bottom: 0;
    margin-top: -5px;
    display: inline-block;
    vertical-align: middle;
}

.bottom-bar .progress-bar .progress-bar-bg {
    width: 100%;
    height: 3px;
    background: #004f91;
    position: relative;
}

.bottom-bar .progress-bar .buffering,
.bottom-bar .progress-bar .handle,
.bottom-bar .progress-bar .level,
.bottom-bar .progress-bar .playback {
    position: absolute;
    top: 0;
    left: 0;
}

.bottom-bar .progress-bar .buffering {
    background: #003663;
    width: 70%;
    height: 100%;
}

.bottom-bar .progress-bar .playback {
    height: 100%;
    background: #0094d9;
    width: 50%;
}

.bottom-bar .progress-bar .handle {
    border-radius: 100%;
    left: 50%;
}

.bottom-bar .progress-bar .handle.scrub {
    transform: translate3d(-10px, -8px, 0);
    border-width: 10px;
    border-color: #0094d9;
    border-style: solid;
}

.bottom-bar .progress-bar .handle.volume {
    padding: 0;
    transform: translate3d(-7px, -5.5px, 0);
    border-width: 7px;
    border-color: #fff;
    border-style: solid;
}

.bottom-bar .progress-bar .level {
    background: #fff;
    height: 100%;
}

.progress-bar.closed {
    opacity: 0.001;
    width: 0 !important;
}

.progress-bar {
    opacity: 1;
    transition: all 0.3s ease;
}

.tooltip-wrap {
    position: relative;
}

.tooltip-wrap .tooltip-inner {
    text-align: center;
    position: absolute;
    z-index: 190;
    background: #061016;
    border-radius: 4px;
    top: -65px;
    left: -10px;
    padding: 0 10px;
    line-height: 26px;
    white-space: nowrap;
}

.tooltip-wrap .tooltip-inner.left,
.tooltip-wrap .tooltip-inner.manimise-tooltip {
    top: -70px;
    right: 0;
    left: auto;
}

.tooltip-wrap .tooltip-inner.closed-captions-tooltip {
    right: -21px;
}

.synopsis .background-image {
    width: 100%;
    height: 100%;
    background: 0 0 !important;
}

.synopsis .background-tint {
    background: rgba(6, 16, 22, 0.85);
    height: 100%;
}

.synopsis .content-left .title {
    font-size: 40px;
}

.synopsis .content-left .mobile-image-channel,
.synopsis .content-left .mobile-image-show {
    display: none;
}

.synopsis .content-left .mobile-image-channel img,
.synopsis .content-left .mobile-image-show img {
    max-width: 100%;
}

.synopsis .content-left .mobile-image-show img {
    margin: 0 auto;
    display: block;
    border-radius: 8px;
}

.background-image {
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center center;
}

.synopsis-inner {
    padding: 107px 5% 0 5%;
    position: relative;
    background: 0 0;
    user-select: none;
}

.synopsis .content-left {
    display: inline-block;
    vertical-align: top;
    width: 60%;
}

.synopsis .content-left .heading {
    margin-bottom: 33px;
}

.synopsis .content-left .heading p {
    font-size: 20px;
}

.synopsis .content-left .sub-heading {
    margin-top: 5px;
    margin-bottom: 1em;
}

.synopsis .content-left .sub-heading .subheading-piece {
    font-size: 18px;
    display: inline-block;
    vertical-align: middle;
}

.synopsis .content-left .sub-heading .subheading-piece.piped {
    border-right: 1px solid #7397a9;
    padding-right: 12px;
    margin-right: 8px;
}

.synopsis .content-left .sub-heading .subheading-piece a {
    text-decoration: underline;
    cursor: pointer;
}

.synopsis .content-left .main .subTitle {
    font-size: 20px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 0 0 5px 0;
}

.synopsis .content-left .main .text {
    font-size: 18px;
}

.synopsis .content-left .main .details {
    font-size: 18px;
    width: 100%;
    color: #7397a9;
}

.synopsis .content-left .main .info-row {
    margin: 5px 0 0 0;
}

.synopsis .content-left .rating {
    font-size: 18px;
    vertical-align: middle;
    margin-top: 27px;
}

.synopsis .content-left .rating img {
    display: inline-block;
    height: 30px;
    width: 30px;
    vertical-align: middle;
    margin-right: 20px;
}

.synopsis .content-left .buttons {
    margin-top: 10px;
    display: inline-block;
    flex-wrap: wrap;
}

.synopsis .content-left .buttons a,
.synopsis .content-left .buttons button {
    padding: 10px 2em;
    min-width: 280px;
    width: initial;
    margin: 5px 0;
    display: inline-block;
    border-width: 0;
    min-height: 40px;
    flex: 40%;
    font-size: 18px;
}

.synopsis .content-left .buttons a.color-secondary,
.synopsis .content-left .buttons button.color-secondary {
    background: #061016;
    color: #fff;
}

.synopsis .content-left .buttons a.color-secondary:focus,
.synopsis .content-left .buttons a.color-secondary:hover,
.synopsis .content-left .buttons button.color-secondary:focus,
.synopsis .content-left .buttons button.color-secondary:hover {
    background: #112d3e;
}

.synopsis .content-left .buttons a:focus,
.synopsis .content-left .buttons a:hover,
.synopsis .content-left .buttons button:focus,
.synopsis .content-left .buttons button:hover {
    background: #00acfc;
}

.synopsis .content-left .buttons a .progress-bar-container,
.synopsis .content-left .buttons button .progress-bar-container {
    height: 3px;
    background: 0 0;
}

.synopsis .content-left .buttons a .progress-bar-container .progress-bar,
.synopsis .content-left .buttons button .progress-bar-container .progress-bar {
    background: rgba(255, 255, 255, 0.3);
}

.synopsis .content-left .buttons .info-span {
    min-height: 42px;
    display: inline-block;
    background: #061016;
    padding: 11px 10px;
    border: 2px solid #061016;
    font-size: 14px;
    line-height: 20px;
    position: relative;
}

.synopsis .content-left .buttons .info-span.has-svg {
    padding-left: 30px;
}

.synopsis .content-left .buttons .info-span svg {
    position: absolute;
    left: 10px;
    top: 12px;
    height: 15px;
    width: 15px;
    margin-right: 10px;
}

.synopsis .content-left .buttons .button-span {
    width: initial;
    margin-right: 10px;
    vertical-align: middle;
}

.synopsis .content-left .buttons .watchlist-icon {
    width: 19px;
    height: 19px;
    margin-right: 5px;
    margin-top: -4px;
    vertical-align: middle;
}

.synopsis .content-right {
    display: inline-block;
    vertical-align: top;
    width: 40%;
    padding-left: 10%;
}

.synopsis .content-right img {
    float: right;
    max-width: 100%;
    border-radius: 8px;
}

.synopsis .channel-image {
    max-height: 50px;
    margin-bottom: 25px;
}

.synopsis .image-container {
    width: 100%;
    overflow: auto;
}

.synopsis .lock-bar {
    display: flex;
    background: #061016;
    padding: 8px 10px;
    border: 2px solid #061016;
    vertical-align: middle;
    font-size: 14px;
}

.synopsis .lock-bar img,
.synopsis .lock-bar svg {
    height: 20px;
    padding-right: 10px;
    vertical-align: middle;
}

@media (max-width: 991px) {
    .synopsis .content-left .buttons button {
        flex: 0 0 100%;
        width: 100%;
    }
}

@media (max-width: 1615px) {
    .synopsis .content-left,
    .synopsis .content-right {
        width: 50%;
    }
    .synopsis .buttons.button-count-3>span {
        display: block;
    }
}

@media (max-width: 768px) {
    .synopsis .content-left .buttons span {
        width: 100%;
        margin-right: 0;
    }
    .synopsis .title {
        line-height: 40px;
        display: -webkit-box;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        max-height: 80px;
    }
    .synopsis .content-right {
        display: none;
    }
    .synopsis .content-left {
        width: 100%;
    }
    .synopsis .content-left .heading {
        display: inline-block;
        vertical-align: top;
        margin-bottom: 15px;
        width: 70%;
    }
    .synopsis .content-left .mobile-image-channel {
        display: inline-block;
        width: 30%;
        text-align: right;
        vertical-align: top;
    }
    .synopsis .content-left .mobile-image-show {
        display: block;
        margin-bottom: 30px;
    }
    .synopsis .content-left .buttons {
        text-align: center;
        display: block;
    }
    .synopsis .content-left .buttons .button-span {
        margin-right: 0;
    }
    .synopsis .content-left .buttons button {
        max-width: 450px;
    }
    .synopsis .channel-image {
        margin-bottom: 0;
    }
}

@media (min-width: 1920px) {
    .synopsis-inner {
        padding: 119.21px 80px 0 80px;
    }
}

@media (max-width: 544px) {
    .synopsis .content-left .heading {
        width: 100%;
    }
    .synopsis .content-left .heading .title {
        font-size: 32px;
    }
    .synopsis .channel-image {
        display: none;
    }
}

.aspect-16-9 {
    padding-top: 56.25%;
}

.aspect-26-9 {
    padding-top: 34.62%;
}

.aspect-2-3-portrait {
    padding: 0;
    padding-top: 150%;
}

.tile.see-all-tile .wrapper .inner .aspect-16-9 {
    padding-top: calc(56.25% + 59px);
}

.tile.see-all-tile .wrapper .inner .aspect-2-3-portrait {
    padding-top: calc(150% + 59px);
}

.tile.see-all-tile .wrapper .inner .see-all-image-and-text {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100%;
    height: 98px;
    text-align: center;
}

.tile.see-all-tile .wrapper .inner .see-all-image-and-text .see-all-image {
    height: 53px;
    margin-bottom: 25px;
}

.tile.see-all-tile .wrapper .inner .see-all-image-and-text .see-all-text {
    font-size: 20px;
    line-height: 20px;
}

.tile.see-all-tile .wrapper .inner .tile-description {
    display: none;
}

.tile {
    position: relative;
    display: inline-block;
    box-sizing: border-box;
    transition: all 0.3s ease-out;
    vertical-align: top;
    width: 50%;
    cursor: pointer;
}

.tile .wrapper {
    padding-right: 5px;
    padding-left: 5px;
    width: 100%;
    box-sizing: border-box;
    top: 0;
    left: 0;
    transition: all 0.3s ease;
}

.hero-carousel .tile {
    width: 100%;
}

.hero-carousel .tile .tile-image {
    transition: transform 0.3s linear;
}

.focus-based-carousel .tile {
    width: 33.33333%;
}

@media (min-width: 768px) {
    .hero-carousel .tile .wrapper {
        padding-right: 15px;
        padding-left: 15px;
    }
}

.tile .wrapper .inner {
    background-color: #061016;
    width: 100%;
    border-radius: 0;
    overflow: hidden;
}

.tile .tile-image {
    position: relative;
    width: 100%;
    background-color: #061016;
    background-repeat: no-repeat;
    background-position: 50% 50%;
    background-size: cover;
}

.tile .tile-image-holder,
.tile.image .tile-image {
    border-radius: 8px;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
}

.tile .tile-image .lock-cover {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
}

.tile .tile-image .lock-cover.lock-cover-alpha {
    background: rgba(0, 54, 99, 0.2);
}

.tile .tile-image .lock-cover .lock-icon {
    height: 50px;
}

.tile .tile-image .lock-cover .lock-icon img,
.tile .tile-image .lock-cover .lock-icon svg {
    height: 100%;
}

.tile .tile-image .lock-cover.center {
    align-items: center;
    justify-content: center;
}

.tile .tile-image .lock-cover.center .lock-icon {
    height: 30px;
}

.tile .tile-image .lock-cover.top {
    align-items: flex-start;
}

.tile .tile-image .lock-cover.bottom {
    align-items: flex-end;
}

.tile .tile-image .lock-cover.left {
    justify-content: flex-start;
}

.tile .tile-image .lock-cover.right {
    justify-content: flex-end;
}

.tile .tile-image .progress-bar-container~.lock-cover.bottom .lock-icon {
    margin-bottom: 4px;
}

.tile.image.focused .inner,
.tile.image:hover .inner {
    background-color: #0c1d29;
}

.tile.image .inner {
    transition: background 0.3s ease;
}

.tile.image .tile-image .tile-image-tint {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background: rgba(255, 255, 255, 0.2);
    opacity: 0.01;
    pointer-events: none;
    transition: 0.3s ease-out;
}

.tile.image .tile-image:hover .tile-image-tint,
.tile.image:focus .tile-image-tint {
    opacity: 1;
}

.progress-bar-container {
    position: absolute;
    bottom: 0;
    left: 0;
    height: 4px;
    width: 100%;
    background: #003663;
}

.progress-bar-container .progress-bar {
    height: 100%;
    background: #0094d9;
}

.tile p {
    margin: 0;
}

.tile .tile-description {
    color: #fff;
    text-align: left;
    padding: 0 10px;
}

.tile:not(.playable):focus {
    outline: 0;
}

.tile:not(.playable):focus .inner {
    outline: #4682b4 auto 5px;
}

.live-line2 {
    padding-bottom: 10px;
    color: #7397a9;
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    transition: all 0.3s ease;
}

.live-line2 .line-content {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.live-line2 .line-rating {
    margin-left: 6px;
}

.tile.playable .tile-description .text {
    display: inline-block;
    width: calc(100% - 50px);
}

.tile.playable .tile-description .info-logo {
    display: inline-block;
    margin: 0 5px 0 20px;
    cursor: pointer;
    display: inline-block;
    vertical-align: top;
    height: 59px;
}

.tile .info-logo svg {
    width: 25px;
    height: 25px;
    margin-top: 15px;
}

.tile .info-logo {
    display: none;
}

.tile.playable .tile-image .play-icon {
    height: 50px;
    width: 50px;
    position: absolute;
    transition: all 0.3s ease;
}

.tile.playable .tile-image .play-icon.center {
    width: 58px;
    height: 58px;
    top: calc(50% - 29px);
    left: calc(50% - 29px);
}

.tile.playable .tile-image .play-icon.top {
    top: 10px;
}

.tile.playable .tile-image .play-icon.bottom {
    bottom: 10px;
}

.tile.playable .tile-image .play-icon.left {
    left: 10px;
}

.tile.playable .tile-image .play-icon.right {
    right: 10px;
}

.tile.playable .tile-image .play-icon svg {
    width: 100%;
    height: 100%;
}

.tile.playable .tile-image .remove-icon,
.tile.playable .tile-image .spinner {
    transition: all 1s ease;
    position: absolute;
    top: calc(50% - 24px);
    left: calc(50% - 26px);
    cursor: pointer;
}

.tile.playable .tile-image .remove-icon:hover svg {
    transform: scale(1.15);
}

.tile:not(.playable).focused .inner {
    background-color: #0c1d29;
}

.tile:not(.playable) .inner {
    transition: background 0.3s ease;
}

.tile.playable .tile-description:focus,
.tile.playable .tile-description:hover {
    background-color: #0c1d29;
}

.play-icon svg,
.remove-icon svg {
    position: absolute;
    top: 0;
    left: 0;
}

.tile-description .line1 {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    padding: 10px 0 3px 0;
    font-size: 16px;
    height: 33px;
}

.tile-description .line2 {
    padding-bottom: 10px;
    color: #7397a9;
}

.live-line2,
.tile-description .line2 {
    font-size: 14px;
    height: 26px;
}

.tile-badge {
    position: absolute;
    z-index: 1;
    color: #fff;
    background: red;
    padding: 3px 4px 3px 8px;
    font-size: 15px;
    height: 28px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    max-width: 100%;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.tile-icon-badge {
    position: absolute;
    z-index: 1;
    height: 33%;
    max-width: 100%;
}

.tile-icon-badge img {
    height: 100%;
    max-width: 100%;
}

.tile-icon-badge.TOP {
    top: 0;
}

.tile-icon-badge.BOTTOM {
    bottom: 0;
}

.tile-icon-badge.LEFT {
    left: 0;
}

.tile-icon-badge.RIGHT {
    right: 0;
}

.portrait .tile-icon-badge {
    height: 25%;
}

p.line1,
p.line2 {
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.hidden-metadata .tile-description {
    display: none;
}

.hidden-metadata .tile.see-all-tile .wrapper .inner .aspect-16-9 {
    padding-top: 56.25%;
}

.hidden-metadata .tile.see-all-tile .wrapper .inner .aspect-2-3-portrait {
    padding-top: 150%;
}

.hidden-metadata .loading-tile .inner.aspect-16-9 {
    padding-top: 56.25%;
}

.hidden-metadata .loading-tile .inner.aspect-2-3-portrait {
    padding-top: 150%;
}

@media (min-width: 544px) {
    .landscape .tile {
        width: 33.33333%;
    }
    .portrait .tile {
        width: 25%;
    }
    .hero-carousel .tile {
        width: 100%;
    }
    .focus-based-carousel .tile {
        width: 33.33333%;
    }
    .tile-description .line1 {
        font-size: 16px;
        height: 33px;
    }
    .tile-description .line2 {
        font-size: 14px;
        height: 26px;
    }
    .tile.see-all-tile .wrapper .inner .see-all-image-and-text .see-all-text {
        font-size: 20px;
        line-height: 20px;
    }
    .tile.see-all-tile .wrapper .inner .aspect-16-9 {
        padding-top: calc(56.25% + 59px);
    }
    .tile.see-all-tile .wrapper .inner .aspect-2-3-portrait {
        padding-top: calc(150% + 59px);
    }
}

@media (min-width: 992px) {
    .landscape .tile {
        width: 25%;
    }
    .portrait .tile {
        width: 20%;
    }
    .hero-carousel .tile {
        width: 100%;
    }
    .focus-based-carousel .tile {
        width: 20%;
    }
    .tile-description .line1 {
        font-size: 16px;
        height: 33px;
    }
    .tile-description .line2 {
        font-size: 14px;
        height: 26px;
    }
    .tile.see-all-tile .wrapper .inner .see-all-image-and-text .see-all-text {
        font-size: 20px;
        line-height: 20px;
    }
    .tile.see-all-tile .wrapper .inner .aspect-16-9 {
        padding-top: calc(56.25% + 59px);
    }
    .tile.see-all-tile .wrapper .inner .aspect-2-3-portrait {
        padding-top: calc(150% + 59px);
    }
}

@media (min-width: 1200px) {
    .landscape .tile {
        width: 20%;
    }
    .portrait .tile {
        width: 14.28571%;
    }
    .hero-carousel .tile {
        width: 100%;
    }
    .focus-based-carousel .tile {
        width: 20%;
    }
    .tile-description .line1 {
        font-size: 16px;
        height: 33px;
    }
    .tile-description .line2 {
        font-size: 14px;
        height: 26px;
    }
    .tile.see-all-tile .wrapper .inner .see-all-image-and-text .see-all-text {
        font-size: 20px;
        line-height: 20px;
    }
    .tile.see-all-tile .wrapper .inner .aspect-16-9 {
        padding-top: calc(56.25% + 59px);
    }
    .tile.see-all-tile .wrapper .inner .aspect-2-3-portrait {
        padding-top: calc(150% + 59px);
    }
}

@media (min-width: 1920px) {
    .landscape .tile {
        width: 16.66667%;
    }
    .portrait .tile {
        width: 12.5%;
    }
    .hero-carousel .tile {
        width: 100%;
    }
    .focus-based-carousel .tile {
        width: 14.28571%;
    }
    .tile-description .line1 {
        font-size: 16px;
        height: 33px;
    }
    .tile-description .line2 {
        font-size: 14px;
        height: 26px;
    }
    .tile.see-all-tile .wrapper .inner .see-all-image-and-text .see-all-text {
        font-size: 20px;
        line-height: 20px;
    }
    .tile.see-all-tile .wrapper .inner .aspect-16-9 {
        padding-top: calc(56.25% + 59px);
    }
    .tile.see-all-tile .wrapper .inner .aspect-2-3-portrait {
        padding-top: calc(150% + 59px);
    }
}

.carousel-wrap {
    width: 100%;
    margin-top: 45px;
}

.carousel-inner-wrap {
    padding: 0 2.5%;
    position: relative;
}

.carousel-title {
    padding: 0 calc(2.5% + 5px);
}

@media (min-width: 544px) {
    .hero-carousel .carousel-inner-wrap {
        padding: 0 6%;
    }
}

.carousel {
    position: relative;
}

.carousel-wrap .header {
    position: relative;
}

.carousel-wrap .header.has-see-all {
    display: flex;
    justify-content: space-between;
}

.carousel-title,
.carousel-wrap .see-all {
    display: inline-block;
    margin-bottom: 10px;
}

.carousel-title {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 18px;
    color: #fff;
}

.carousel-wrap .see-all {
    flex: none;
    margin-right: 5%;
    vertical-align: middle;
    color: #7397a9;
    cursor: pointer;
    user-select: none;
}

.carousel-wrap .see-all:focus,
.carousel-wrap .see-all:hover {
    color: #fff;
    transition: 0.3s ease;
}

.carousel-wrap .edit-assets {
    position: absolute;
    right: 0;
    top: 0;
    margin-right: 5%;
    cursor: pointer;
}

.carousel-wrap .edit-assets .edit-icon {
    color: #7397a9;
}

.carousel-wrap .edit-assets .done {
    color: #fff;
}

.carousel-wrap .edit-assets .edit-icon:hover,
.carousel-wrap .edit-assets .edit-icon:hover svg path {
    color: #fff;
    fill: #fff;
}

.carousel-container {
    position: relative;
    white-space: nowrap;
    overflow-x: visible;
    visibility: visible;
    perspective: 0;
}

.carousel-container .first-tile {
    left: 20px;
}

.clicker {
    width: 2.5%;
    height: 100%;
    position: absolute;
    z-index: 1;
    text-align: center;
    cursor: pointer;
    display: flex;
    justify-content: center;
    transition: all 0.3s linear;
}

.clicker .arrow-svg {
    height: 28px;
    width: 14px;
    opacity: 0;
    transition: all 0.3s linear;
}

@media (min-width: 544px) {
    .hero-carousel .clicker {
        width: 6%;
    }
    .hero-carousel .clicker .arrow-svg {
        height: 48px;
        width: 24px;
    }
    .hero-carousel .clicker .clicker-box {
        top: calc(50% - 24px);
    }
    .hero-carousel .clicker.left {
        background: linear-gradient( to left, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.9) 100%);
    }
    .hero-carousel .clicker.left .clicker-box {
        left: 15px;
    }
    .hero-carousel .clicker.right {
        background: linear-gradient( to right, rgba(0, 0, 0, 0) 0, rgba(0, 0, 0, 0) 35%, rgba(0, 0, 0, 0.9) 100%);
    }
    .hero-carousel .clicker.right .clicker-box {
        right: 15px;
    }
}

.carousel-inner-wrap:hover .clicker .arrow-svg,
.clicker:focus .arrow-svg {
    opacity: 1;
}

.clicker-box {
    top: calc(50% - 14px);
    position: absolute;
    height: 28px;
}

.left.clicker {
    left: 0;
    border-radius: 0 8px 8px 0;
}

.left.clicker .clicker-box {
    left: 10px;
}

.right.clicker {
    right: 0;
    top: 0;
    border-radius: 8px 0 0 8px;
}

.right.clicker .clicker-box {
    right: 10px;
}

@media (max-width: 768px) {
    .left.clicker .clicker-box {
        left: calc(50% - 7px);
    }
    .right.clicker .clicker-box {
        right: calc(50% - 7px);
    }
}

.right.clicker {
    background: linear-gradient( to right, rgba(0, 0, 0, 0.3) 0, rgba(0, 0, 0, 0.9) 100%);
}

.left.clicker {
    background: linear-gradient( to right, rgba(0, 0, 0, 0.9) 0, rgba(0, 0, 0, 0.3) 100%);
}

@media (min-width: 1920px) {
    .carousel-inner-wrap,
    .carousel-title {
        padding: 0 80px;
    }
    .clicker {
        width: 80px;
    }
}

@media (max-width: 544px) {
    .carousel-inner-wrap {
        padding: 0 5%;
    }
    .carousel-title {
        padding: 0 calc(5% + 5px);
    }
    .clicker {
        width: 5%;
    }
}

@media (min-width: 544px) {
    .carousel-wrap {
        margin-top: 33px;
    }
    .carousel-title {
        font-size: 18px;
    }
}

@media (min-width: 992px) {
    .carousel-wrap {
        margin-top: 33px;
    }
    .carousel-title {
        font-size: 18px;
    }
}

@media (min-width: 1200px) {
    .carousel-wrap {
        margin-top: 33px;
    }
    .carousel-title {
        font-size: 18px;
    }
}

@media (min-width: 1920px) {
    .carousel-wrap {
        margin-top: 33px;
    }
    .carousel-title {
        font-size: 18px;
    }
}

.callToActionView {
    position: relative;
    width: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.loading-carousel {
    padding: 0 2.5%;
    overflow: hidden;
    white-space: nowrap;
}

.loading-carousel .loading-tile {
    display: inline-block;
    padding-right: 5px;
    padding-left: 5px;
}

.loading-tile .inner {
    width: 100%;
    display: block;
    animation-duration: 2s;
    animation-iteration-count: infinite;
    animation-name: load-fade;
    animation-delay: inherit;
    border-radius: 0;
}

.loading-tile .inner.aspect-16-9 {
    padding-top: calc(56.25% + 59px);
}

.loading-tile .inner.aspect-2-3-portrait {
    padding-top: calc(150% + 59px);
}

@keyframes load-fade {
    from {
        background-color: #061016;
    }
    20% {
        background-color: #08161e;
    }
    45% {
        background-color: #061016;
    }
    to {
        background-color: #061016;
    }
}

.loading-tile.pos-0 {
    animation-delay: 0s;
}

.loading-tile.pos-1 {
    animation-delay: 0.1s;
}

.loading-tile.pos-2 {
    animation-delay: 0.2s;
}

.loading-tile.pos-3 {
    animation-delay: 0.3s;
}

.loading-tile.pos-4 {
    animation-delay: 0.4s;
}

.loading-tile.pos-5 {
    animation-delay: 0.5s;
}

.loading-tile.pos-6 {
    animation-delay: 0.6s;
}

.loading-tile.pos-7 {
    animation-delay: 0.7s;
}

.loading-tile.pos-8 {
    animation-delay: 0.8s;
}

.grid {
    margin-top: 20px;
}

.grid .carousel-wrap {
    margin-top: 20px;
}

.channels .grid {
    margin-top: 40px;
}

.channels .grid .carousel-wrap .tile .wrapper {
    padding: 2px 5px;
}

.channels .grid .carousel-wrap .header {
    display: none;
}

.channels .grid .carousel-wrap {
    margin: 0;
}

.dropdown {
    margin-left: 5%;
    position: relative;
    user-select: none;
    width: 150px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.dropdown.open .options {
    opacity: 1;
    pointer-events: auto;
}

.dropdown .current {
    display: block;
    cursor: pointer;
    min-width: 100%;
    font-size: 16px;
}

.dropdown .current.text-only {
    cursor: default;
}

.dropdown .current .current-text {
    display: inline-block;
    width: calc(100% - 30px - 14px);
    vertical-align: middle;
}

.dropdown .current .caret {
    margin: 0 15px;
    width: 0;
    height: 0;
    display: inline-block;
    vertical-align: middle;
    margin-top: -2px;
    position: relative;
}

.dropdown .current .caret.caret-up {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-bottom: 7px solid #fff;
}

.dropdown .current .caret.caret-up .options {
    margin-top: 7px;
}

.dropdown .current .caret.caret-down {
    border-left: 7px solid transparent;
    border-right: 7px solid transparent;
    border-top: 7px solid #fff;
}

.dropdown .options {
    min-width: 150px;
    position: absolute;
    z-index: 1;
    pointer-events: none;
    opacity: 0.01;
    transition: opacity 0.3s ease;
    text-overflow: ellipsis;
    right: -36px;
    top: 15.5px;
}

.dropdown .options .arrow-box {
    border: 1px solid #061016;
    background: #061016;
    padding: 20px;
    min-width: 100%;
    margin-top: 10px;
    max-height: 240px;
    overflow-y: auto;
}

.dropdown .options .arrow-box:after,
.dropdown .options .arrow-box:before {
    content: " ";
    bottom: calc(100% - 11px);
    height: 0;
    width: 0;
    position: absolute;
    pointer-events: none;
    border: 10px solid transparent;
}

.dropdown .options .arrow-box:before {
    border-width: 12px;
    border-bottom-color: #061016;
    right: 25px;
}

.dropdown .options .arrow-box:after {
    border-bottom-color: #061016;
    right: 27px;
}

.dropdown .options .arrow-box span {
    color: #7397a9;
    transition: color 0.3s ease;
    cursor: pointer;
    display: block;
    padding: 5px 0;
    text-align: center;
}

.dropdown .options .arrow-box span:focus,
.dropdown .options .arrow-box span:hover {
    color: #fff !important;
}

.dropdown .options .arrow-box span:focus span,
.dropdown .options .arrow-box span:hover span {
    color: #fff !important;
}

.dropdown .options .arrow-box span.active,
.dropdown .options .arrow-box span.active span {
    color: #fff;
}

.live-tv .dropdown .options .arrow-box {
    max-height: 400px;
    min-width: 140%;
    margin-top: 10px;
    margin-left: -33.5px;
}

.live-tv .dropdown .options .arrow-box:after,
.live-tv .dropdown .options .arrow-box:before {
    bottom: calc(100% - 11px);
}

.live-tv .dropdown .options .arrow-box .item span {
    text-align: left;
    width: 100%;
}

.live-tv .dropdown .options .arrow-box .item span .dropdown-tick {
    float: right;
    border: solid #0094d9;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 6px 3px;
    width: auto;
    transform: rotate(45deg);
    margin-top: -1px;
}

.menu-bar .dropdown {
    width: 0;
    margin-left: 50%;
}

.menu-bar .dropdown .options {
    z-index: 106;
    transform: translateX(-17px) translateY(-35px);
}

.menu-bar .dropdown .arrow-box {
    padding: 0;
    line-height: normal;
    border-color: #061016;
}

.menu-bar .dropdown .arrow-box:before {
    border-bottom-color: #061016;
    right: 8px;
}

.menu-bar .dropdown .arrow-box:after {
    right: 10px;
}

.menu-bar .dropdown .arrow-box span {
    text-align: right;
    padding-right: 1em;
}

.menu-bar .dropdown .arrow-box span.username {
    color: #fff;
}

.menu-bar .dropdown .arrow-box span.hr {
    width: 100%;
    border-bottom: 1px solid #061016;
    padding: 0;
}

@media (max-width: 543px) {
    .live-tv .dropdown .arrow-box {
        min-width: 145%;
    }
}

.footer {
    position: absolute;
    left: 0;
    padding: 0 5%;
    width: 100%;
    color: #7397a9;
    font-size: 14px;
    vertical-align: middle;
    overflow: auto;
}

.footer.attached-footer {
    border-top: 1px solid #061016;
    height: 70px;
}

.footer .inner {
    height: 100%;
}

.footer .inner .clickable {
    cursor: pointer;
    color: #7397a9;
    transition: color 0.3s;
}

.footer .inner .clickable:focus,
.footer .inner .clickable:hover {
    color: #fff;
}

.footer .inner .non-clickable {
    color: #fff;
}

.footer .inner .item-row.icons svg {
    width: 24px;
    height: 24px;
}

.footer.LeftAligned .inner .item-row,
.footer.RightAligned .inner .item-row {
    line-height: 70px;
}

.footer.LeftAligned .inner .footer-item,
.footer.RightAligned .inner .footer-item {
    padding: 0 20px;
}

.footer.RightAligned .inner .item-row {
    text-align: right;
}

.footer.RightAligned .inner .item-row.icons {
    justify-content: center;
}

.footer.RightAligned .inner .footer-item:last-child {
    padding: 0 0 0 20px;
}

.footer.FillParentAligned .inner .item-row {
    line-height: 34.5px;
    display: flex;
    justify-content: space-evenly;
    align-items: center;
    flex-wrap: wrap;
}

.footer.FillParentAligned .inner .item-row.icons {
    justify-content: center;
}

.footer.FillParentAligned .inner .footer-item {
    padding: 0 20px;
}

@media (max-width: 543px) {
    .footer.LeftAligned .inner .item-row,
    .footer.RightAligned .inner .item-row {
        line-height: initial;
        text-align: center;
    }
    .footer.LeftAligned .inner .item-row.icons,
    .footer.RightAligned .inner .item-row.icons {
        justify-content: center;
    }
    .footer.LeftAligned .inner .footer-item,
    .footer.RightAligned .inner .footer-item {
        padding: 0 15px;
    }
    .footer.LeftAligned .inner .copyright,
    .footer.RightAligned .inner .copyright {
        display: block;
        width: 100%;
        height: 1em;
        text-align: center;
        margin: 0.65em 0;
    }
    .footer.RightAligned .inner .footer-item:last-child {
        padding: 0 15px;
    }
}

@media (max-width: 767px) {
    .footer.continuous-footer {
        position: relative;
        margin-bottom: -70px;
    }
    .footer.FillParentAligned .inner .footer-item {
        margin: auto;
        padding: 0 20px;
    }
}

@media (min-width: 544px) and (max-width: 991px) {
    .footer.LeftAligned .inner .copyright,
    .footer.RightAligned .inner .copyright {
        padding: 0 1.5em 0 0;
    }
}

@media (min-width: 992px) and (max-width: 1919px) {
    .footer.LeftAligned .inner .copyright,
    .footer.RightAligned .inner .copyright {
        padding: 0 2em 0 0;
    }
}

@media (min-width: 1920px) {
    .footer {
        padding: 0 80px;
    }
}

.modal-container .modal.faqs {
    width: 70%;
}

.modal-container .modal.faqs .top-line .title {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 24px;
}

.modal-container .modal.faqs .top-line .control {
    top: 5px;
}

.modal-container .modal.faqs .content {
    padding: 0;
}

.modal-container .modal.faqs .content .faqs-list {
    height: 60vh;
    overflow-y: auto;
    padding: 0 20px;
    margin: 20px 0;
}

.modal-container .modal.faqs .content .section {
    padding: 10px 15px;
    margin: 15px 0;
    border: 1px solid #fff;
    text-align: left;
}

.modal-container .modal.faqs .content .section:first-child {
    margin-top: 0;
}

.modal-container .modal.faqs .content .section:last-child {
    margin-bottom: 0;
}

.modal-container .modal.faqs .content .section .answer {
    height: 0;
    width: 100%;
    overflow: hidden;
}

.modal-container .modal.faqs .content .section .question {
    width: 100%;
    margin-bottom: 0;
    cursor: pointer;
    float: initial;
}

.modal-container .modal.faqs .content .section .question span {
    display: inline-block;
    vertical-align: middle;
    width: calc(100% - 26px);
}

.modal-container .modal.faqs .content .section .question .chevron {
    display: inline-block;
    vertical-align: middle;
    padding: 4px;
    margin-left: 15px;
    border-width: 0 3px 3px 0;
    border-style: solid;
    transform: translateY(-4px) rotate(45deg);
    transition: all 0.3s;
}

.modal-container .modal.faqs .content .section.open .question .chevron {
    transform: rotate(-135deg);
}

.modal-container .modal.faqs .content .section.open .answer {
    height: auto;
    padding-top: 10px;
}

@media (max-width: 991px) {
    .modal-container .modal.faqs {
        width: 90%;
    }
}

.modal-container .modal.privacy,
.modal-container .modal.terms {
    width: 70%;
}

.modal-container .modal.privacy .top-line .title,
.modal-container .modal.terms .top-line .title {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 24px;
}

.modal-container .modal.privacy .top-line .control,
.modal-container .modal.terms .top-line .control {
    top: 5px;
}

.modal-container .modal.privacy .content,
.modal-container .modal.terms .content {
    padding: 0;
}

.modal-container .modal.privacy .content .dialog,
.modal-container .modal.terms .content .dialog {
    display: block;
    width: 100%;
    height: 60vh;
    text-align: justify;
    margin: 20px 0;
    padding: 0 20px;
}

.modal-container .modal.privacy .content .dialog>span,
.modal-container .modal.terms .content .dialog>span {
    margin: 0;
}

@media (max-width: 991px) {
    .modal-container .modal.privacy,
    .modal-container .modal.terms {
        width: 90%;
    }
}

.modal-container .modal.image-modal {
    width: 70%;
}

.modal-container .modal.image-modal .content {
    padding: 0;
    height: 60vh;
    position: relative;
}

.modal-container .modal.image-modal .content .display-image {
    flex: auto;
    height: 0;
    object-fit: contain;
    margin: 10px;
}

.modal-container .modal.image-modal .content .display-image+p,
.modal-container .modal.image-modal .content .display-image+span {
    margin-top: 20px;
}

.modal-container .modal.image-modal .dialog {
    display: flex;
    width: 100%;
    height: 100%;
    flex-direction: column;
}

.modal-container .modal.iframe-modal {
    width: 90%;
    height: 90%;
    padding: 0;
}

.modal-container .modal.iframe-modal .top-line {
    flex: none;
}

.modal-container .modal.iframe-modal .content {
    height: 100%;
    padding: 0;
}

.modal-container .modal.iframe-modal .content iframe {
    width: 100%;
    height: 100%;
    border: none;
}

@media (max-width: 991px) {
    .modal-container .modal.image-modal {
        width: 90%;
    }
}

.tv-guide {
    height: 100vh;
}

.tv-guide .content {
    height: 100%;
}

.tv-guide .tv-guide-box {
    display: flex;
    height: 100%;
    flex-direction: column;
    overflow-x: hidden;
    overflow-y: auto;
    padding-top: 70px;
}

.tv-guide .tv-guide-box .tv-guide-heading {
    display: none;
}

.tv-guide .tv-guide-heading-line .dropdown {
    width: 240px;
    margin: 20px 5% 20px auto;
}

.tv-guide .tv-guide-heading-line .dropdown .options {
    width: 240px;
    z-index: 106;
}

.tv-guide .tv-guide-heading-line .dropdown .options .arrow-box {
    padding: 10px;
}

.tv-guide .tv-guide-heading-line .dropdown .current-text {
    text-align: right;
}

.tv-guide .carousel-wrap {
    margin-top: 0;
}

.tv-guide .tile.focused {
    z-index: 0;
}

.tv-guide .tv-guide-buttons {
    position: relative;
    width: 90%;
    max-width: 100%;
    margin: 20px auto 0;
    text-align: center;
}

.tv-guide .tv-guide-buttons button {
    margin: 10px;
}

.tv-guide .channels {
    width: 90%;
    max-width: 100%;
    min-height: 140px;
    margin: 10px auto 30px auto;
    border-left: none;
}

.tv-guide .channels .channels-inner .channels-list .channel {
    cursor: initial;
}

.tv-guide .channels .channels-inner .channels-list .channel .chevron {
    cursor: pointer;
    padding: 0 30px;
    margin-left: calc(100% - 73% - 170px - 8px - 2 * 30px);
}

.tv-guide.channels-container .tv-guide-box {
    padding-top: 0;
    border-left: 1px solid #061016;
}

.tv-guide.channels-container .tv-guide-box .tv-guide-heading-line {
    display: flex;
    flex: none;
    align-items: center;
    justify-content: space-between;
    padding: 0 5%;
    border-bottom: 1px solid #061016;
}

.tv-guide.channels-container .tv-guide-box .tv-guide-heading {
    display: block;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 16px;
    line-height: 43px;
}

.tv-guide.channels-container .tv-guide-box .dropdown {
    margin: 0;
}

.tv-guide.channels-container .tv-guide-box .dropdown .options .arrow-box {
    min-width: 0;
    margin-left: 0;
}

.tv-guide.channels-container .tv-guide-box .channels {
    width: 100%;
    margin: 0;
}

.tv-guide.channels-container .tv-guide-box .focus-based-carousel .tile {
    width: 33.33333%;
}

@media (max-width: 544px) {
    .tv-guide .tv-guide-buttons .on-now {
        max-width: 100px;
    }
    .tv-guide .channels {
        width: 100%;
    }
    .tv-guide .channels .channels-inner .channels-list .channel .chevron {
        margin-left: calc(100% - 73% - 100px - 8px - 2 * 10px);
        padding: 0 10px;
    }
}

.content.live {
    height: 100vh;
    overflow: hidden;
}

.live-tv {
    padding-top: 70px;
}

.live-tv .channels-container {
    z-index: 0;
    position: absolute;
    top: 70px;
    width: 50%;
    overflow: hidden;
    height: calc(100% - 70px);
    display: inline-block;
}

.live-tv .channels-container .tabs {
    background: #061016;
    z-index: 1;
    position: relative;
    border-left: 1px solid #061016;
    border-bottom: 1px solid #061016;
    white-space: nowrap;
    -ms-overflow-style: none;
    scrollbar-width: none;
    overflow-x: auto;
}

.live-tv .channels-container .tabs .dropdown-container {
    width: 170px;
    height: 43px;
    float: left;
    display: flex;
    align-items: center;
    overflow: visible;
    position: relative;
    border-right: 1px solid #061016;
    padding-left: 10px;
    background: #061016;
}

.live-tv .channels-container .tabs .tv-guide-link {
    display: inline-block;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    border-right: 1px solid #061016;
}

.live-tv .channels-container .tabs .tv-guide-anchor {
    text-decoration: none;
    -webkit-transition: all 0.3s ease;
    transition: all 0.3s ease;
    color: #7397a9;
    padding: 0 20px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    cursor: pointer;
    margin-right: 0;
    line-height: 43px;
    vertical-align: middle;
    height: 100%;
}

.live-tv .channels-container .tabs .tv-guide-anchor svg {
    vertical-align: middle;
    height: 15px;
    width: 15px;
    margin: -5px 0 0 10px;
}

.live-tv .channels-container .tabs .tv-guide-anchor:focus,
.live-tv .channels-container .tabs .tv-guide-anchor:focus a,
.live-tv .channels-container .tabs .tv-guide-anchor:hover,
.live-tv .channels-container .tabs .tv-guide-anchor:hover a {
    color: #fff;
}

.live-tv .channels-container .tabs .tab-container {
    position: relative;
    border-right: 1px solid #061016;
    display: inline-block;
    line-height: 38px;
}

.live-tv .channels-container .tabs .tab-container .tab {
    transition: color 0.3s ease;
    color: #7397a9;
    padding: 0 29px;
    user-select: none;
    cursor: pointer;
    margin-right: 0;
    font-size: 16px;
    line-height: 43px;
    vertical-align: middle;
    height: 100%;
    display: inline-block;
    position: relative;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.live-tv .channels-container .tabs .tab-container .tab:focus,
.live-tv .channels-container .tabs .tab-container .tab:hover {
    color: #fff;
}

.live-tv .channels-container .tabs .tab-container .lightbar {
    border-radius: 0;
    display: block;
    position: absolute;
    width: 100%;
    bottom: 0;
    height: 3px;
    background: #7397a9;
}

.live-tv .channels-container .tabs .tab-container:not(.active) .lightbar {
    display: none;
}

.live-tv .channels-container .tabs .tab-container.active {
    background: #061016;
}

.live-tv .channels-container .tabs .tab-container.active .tab {
    color: #fff;
}

.live-tv .channels-container .tabs .tab-container:focus .tab,
.live-tv .channels-container .tabs .tab-container:hover .tab {
    color: #fff;
}

.live-tv .left-section {
    height: calc(100vh - 70px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
    width: 50%;
    float: left;
}

.live-tv .left-section .player-container {
    background-size: 100% 100%;
    background-repeat: no-repeat;
    background-position: 50% 50%;
}

.live-tv .left-section .synopsis-container {
    width: 100%;
    padding: 40px 10% 0 10%;
    overflow-y: auto;
}

.live-tv .left-section .synopsis-container .bottom-image {
    display: none;
}

.live-tv .left-section .synopsis-container .top-image {
    display: block;
}

.live-tv .left-section .synopsis-container .title-image {
    align-self: flex-end;
    flex: 10%;
}

.live-tv .left-section .synopsis-container .title-image img {
    width: 80px;
    transition: all 0.3s ease;
}

.live-tv .left-section .synopsis-container .title-image img.channel-image-loading {
    opacity: 0;
}

.live-tv .left-section .synopsis-container .title {
    font-size: 24px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    line-height: 28px;
    padding-bottom: 5px;
}

.live-tv .left-section .synopsis-container .top-line {
    display: flex;
    justify-content: space-between;
}

.live-tv .left-section .synopsis-container .top-line .text {
    display: inline-block;
    flex: 80%;
}

.live-tv .left-section .synopsis-container .top-line .image {
    align-self: flex-end;
    flex: 10%;
}

.live-tv .left-section .synopsis-container .top-line .image img {
    height: 45px;
}

.live-tv .left-section .synopsis-container .description {
    margin-top: 40px;
    margin-bottom: 27px;
    color: #fff;
}

.live-tv .left-section .synopsis-container .episode-title {
    font-size: 18px;
    margin-bottom: 3px;
}

.live-tv .rating .image {
    height: 30px;
    width: 30px;
    display: block;
    float: left;
    margin-right: 20px;
}

.live-tv .rating .text {
    display: inline-block;
    line-height: 30px;
    vertical-align: middle;
    color: #fff;
    white-space: normal;
    overflow: auto;
}

.live-tv .rating .text span {
    line-height: 30px;
    vertical-align: middle;
}

.live-tv .rating .text .rating {
    line-height: 30px;
    white-space: normal;
    vertical-align: middle;
}

.live-tv .synopsis-pipeline {
    margin: 0 10px;
}

.live-tv .synopsis-pipeline.left-synopsis {
    color: #7397a9;
}

.live-tv .pull-right {
    float: right;
}

.live-tv .synopsis-toggle .chevron {
    display: inline-block;
    vertical-align: middle;
    line-height: 28px;
    cursor: pointer;
    padding-right: 0;
    height: 28px;
    width: 28px;
    text-align: center;
}

.live-tv .synopsis-toggle .chevron .arrow {
    padding: 6px;
    border-width: 0 5px 5px 0;
}

.live-tv .synopsis-toggle .chevron .arrow-up {
    transform: translateY(6px) rotate(-135deg);
}

.live-tv .synopsis-toggle .title-text {
    width: calc(100% - 28px);
    display: inline-block;
    vertical-align: middle;
}

.live-tv .player-container {
    position: relative;
}

.hidden {
    display: inherit;
}

.no-overflow {
    overflow: hidden;
}

.menu-type-side-menu .channels-container {
    top: 0;
    width: calc(50% - 125px);
}

.menu-type-side-menu-folded .channels-container {
    width: calc(50% - 50px);
}

@media (min-width: 992px) {
    .channels-container .channels .channels-inner .channels-list .channel .top-row .data {
        width: 75%;
        min-width: 200px;
    }
    .live-tv .synopsis-toggle .chevron {
        display: none;
    }
    .live-tv .synopsis-toggle .title-text {
        width: calc(100% - 80px);
    }
}

@media (min-width: 992px) and (max-width: 1099px) {
    .live-tv .channels-container .channels .channels-inner .channels-list .channel.not-entitled .top-row .upgrade {
        display: block;
        height: 45px;
        text-align: center;
        margin: 12.5px 10px;
    }
    .live-tv .channels-container .channels .channels-inner .channels-list .channel.not-entitled .top-row .upgrade .lock-icon {
        margin: 11px 0 0 14px;
    }
}

@media (max-width: 991px) {
    .hidden {
        display: none;
    }
    .live-tv .left-section {
        width: 100%;
        height: initial;
    }
    .live-tv .left-section .synopsis-container {
        max-height: 300px;
        padding: 30px 5% 20px 5%;
    }
    .live-tv .left-section .synopsis-container .bottom-image {
        display: block;
        margin: 5px 0;
    }
    .live-tv .left-section .synopsis-container .top-image {
        display: none;
    }
    .live-tv .left-section .synopsis-container .description {
        margin-top: 10px;
    }
    .live-tv .channels-container {
        position: static;
        width: 100%;
    }
    .live-tv .channels-container .channels {
        position: inherit;
    }
    .live-tv .channels-container .channels .channels-inner {
        position: inherit;
    }
    #player {
        min-height: 0;
    }
}

.menu-type-side-menu .live-tv {
    padding-top: 0;
}

@media (max-width: 650px) {
    .live-tv .player-container .player {
        padding: 0;
    }
}

@media (max-width: 543px) {
    .live-tv .channels-container .tabs .dropdown-container {
        width: 140px;
    }
    .live-tv .channels-container .tabs .tab-container .tab {
        padding: 0 20px;
    }
    .live-tv .channels-container .tabs .tv-guide-link {
        padding-left: 5px;
    }
    .live-tv .channels-container .tabs .tv-guide-anchor {
        padding: 0 10px;
    }
}

.channels {
    position: relative;
    overflow: scroll;
    scroll-behavior: smooth;
    width: 100%;
    height: calc(100% - 44px);
    overflow-x: hidden;
    border-left: 1px solid #061016;
}

.channels .channels-inner {
    width: 100%;
    position: absolute;
    height: 100%;
}

.channels .channels-inner .channels-list {
    overflow-x: hidden;
}

.channels .channels-inner .channels-list .channel {
    background: #061016;
    transition: background 0.3s ease;
    padding: 0;
    border-bottom: 1px solid #061016;
    cursor: pointer;
}

.channels .channels-inner .channels-list .channel .top-row {
    user-select: none;
    display: flex;
}

.channels .channels-inner .channels-list .channel .top-row .data {
    width: 73%;
}

.channels .channels-inner .channels-list .channel .top-row .title {
    font-size: 16px;
    color: #fff;
    padding: 5px 0;
    padding-top: 15px;
}

.channels .channels-inner .channels-list .channel .top-row .title .title-text {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    display: inline-block;
    white-space: nowrap;
    max-width: 80%;
    text-overflow: ellipsis;
    overflow: hidden;
    float: left;
}

.channels .channels-inner .channels-list .channel .top-row .title .rating {
    max-width: calc(20% - 10px);
    display: inline-block;
}

.channels .channels-inner .channels-list .channel .top-row .title .rating-line {
    margin-left: 0;
}

.channels .channels-inner .channels-list .channel .top-row .progress-bar-outer {
    display: inline-block;
    line-height: 20px;
    height: 20px;
    color: #7397a9;
    font-size: 14px;
}

.channels .channels-inner .channels-list .channel .top-row .progress-bar-outer .progress-bar-wrapper {
    position: relative;
    display: inline-block;
    width: 70px;
    margin: 0 10px;
}

.channels .channels-inner .channels-list .channel .top-row .progress-bar-outer .progress-bar-wrapper .progress-bar-container {
    width: 100%;
    height: 2px;
    top: -13px;
}

.channels .channels-inner .channels-list .channel .top-row .progress-bar-outer span {
    display: inline-block;
    width: 56px;
    font-size: 14px;
    overflow: hidden;
}

.channels .channels-inner .channels-list .channel .top-row .progress-bar-outer span.end-time {
    text-align: right;
}

.channels .channels-inner .channels-list .channel .top-row .channel-image {
    position: relative;
    width: 170px;
    flex-shrink: 0;
    height: 70px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.channels .channels-inner .channels-list .channel .top-row .channel-image img {
    max-height: 35px;
    max-width: 80%;
}

.channels .channels-inner .channels-list .channel .top-row .channel-image .lock-icon {
    position: absolute;
    height: 20px;
    top: calc(50% - 10px);
    right: 15px;
}

.channels .channels-inner .channels-list .channel .top-row .channel-image .lock-icon img,
.channels .channels-inner .channels-list .channel .top-row .channel-image .lock-icon svg {
    height: 100%;
    max-width: none;
}

.channels .channels-inner .channels-list .channel.synopsis-closed .synopsis {
    display: none;
}

.channels .channels-inner .channels-list .channel .synopsis {
    overflow: auto;
    color: #7397a9;
    padding: 0;
    padding-left: 170px;
    padding-bottom: 15px;
    padding-right: calc(10% + 16px);
}

.channels .channels-inner .channels-list .channel .synopsis p {
    font-size: 16px;
}

.channels .channels-inner .channels-list .channel .synopsis .genre-quality-info {
    margin-bottom: 0;
}

.channels .channels-inner .channels-list .channel .synopsis .rating {
    margin-top: 1em;
}

.channels .channels-inner .channels-list .channel .synopsis .text {
    color: #7397a9;
    font-size: 14px;
}

.channels .channels-inner .channels-list .channel.active,
.channels .channels-inner .channels-list .channel.child-focused,
.channels .channels-inner .channels-list .channel:focus,
.channels .channels-inner .channels-list .channel:hover {
    background: #061016;
}

.channels .channels-inner .channels-list .channel.active .progress-bar {
    background: #0094d9;
}

.channels .channels-inner .channels-list .channel .progress-bar {
    background: #fff;
    transition: background 0.3s ease;
}

.channels .channels-inner .channels-list .channel .progress-bar-container {
    background: #003663;
}

.channels .channels-inner .channels-list .channel:not(.synopsis-open) {
    height: 70px;
}

.channels .channels-inner .channels-list .channel.not-entitled .top-row .title {
    color: #7397a9;
}

.channels .channels-inner .channels-list .channel.not-entitled .top-row .progress-bar-outer .progress-bar-wrapper .progress-bar {
    background: #7397a9;
}

.channels .channels-inner .channels-list .channel.not-entitled .top-row .upgrade {
    display: flex;
    flex-direction: row;
    align-items: center;
    height: 70px;
    font-size: 16px;
    padding-left: 5px;
}

.channels .channels-inner .channels-list .channel.not-entitled .top-row .upgrade .lock-icon {
    height: 15px;
    margin: 0 30px 0 10px;
}

.channels .channels-inner .channels-list .channel.not-entitled .top-row .upgrade .lock-icon img,
.channels .channels-inner .channels-list .channel.not-entitled .top-row .upgrade .lock-icon svg {
    height: 100%;
}

.chevron {
    padding-right: calc(8% - 8px);
    line-height: 70px;
}

.chevron .arrow {
    border: solid #7397a9;
    border-width: 0 3px 3px 0;
    display: inline-block;
    padding: 4px;
    transition: all 0.3s ease;
}

.chevron .arrow-down {
    transform: rotate(45deg);
}

.chevron .arrow-up {
    transform: translateY(4px) rotate(-135deg);
}

.chevron:focus .arrow,
.chevron:hover .arrow {
    border-color: #fff;
}

@media (max-width: 523px) {
    .top-row .channel-image {
        max-width: 100px;
    }
    .top-row .upgrade {
        flex-direction: column !important;
        justify-content: center;
    }
    .top-row .upgrade span {
        display: none;
    }
    .top-row .upgrade .lock-icon {
        height: 15px !important;
        margin: 0 15px 0 5px !important;
    }
}

@media (min-width: 992px) and (max-width: 1200px) {
    .channels .channels-inner .channels-list .channel.not-entitled .top-row .title .title-text {
        max-width: 70%;
    }
    .channels .channels-inner .channels-list .channel.not-entitled .top-row .title .rating {
        max-width: calc(30% - 10px);
    }
    .channels .channels-inner .channels-list .channel.not-entitled .top-row .progress-bar-outer .progress-bar-wrapper {
        width: 50px;
    }
}

@media (max-width: 543px) {
    .channels .channels-inner .channels-list .channel .top-row .progress-bar-outer {
        line-height: 20px;
        height: 20px;
        font-size: 14px;
    }
    .channels .channels-inner .channels-list .channel .top-row .progress-bar-outer span {
        width: 44px;
        font-size: 14px;
    }
    .channels .channels-inner .channels-list .channel .top-row .progress-bar-outer .progress-bar-wrapper {
        width: 50px;
        margin: 0 5px;
    }
    .channels .channels-inner .channels-list .channel .synopsis {
        padding-left: 100px;
    }
}

.channel .title .rating {
    color: #7397a9;
    font-size: 14px;
    margin-left: 10px;
}

.channels::-webkit-scrollbar,
.synopsis-container::-webkit-scrollbar {
    width: 6px;
}

.channels::-webkit-scrollbar-track,
.synopsis-container::-webkit-scrollbar-track {
    background-color: transparent;
}

.channels::-webkit-scrollbar-thumb,
.synopsis-container::-webkit-scrollbar-thumb {
    background-color: #7397a9;
    border-radius: 3px;
}

.not-found {
    font-size: 24px;
}

.has-loading-indicator,
.has-loading-indicator-no-padding {
    display: flex;
    justify-content: center;
    min-height: 100vh;
    align-items: center;
    flex-direction: column;
}

.has-loading-indicator.splash-screen,
.splash-screen.has-loading-indicator-no-padding {
    opacity: 0;
    transition: opacity 0.6s;
}

.has-loading-indicator.splash-screen.loaded,
.splash-screen.loaded.has-loading-indicator-no-padding {
    opacity: 1;
}

.has-loading-indicator.splash-screen svg,
.splash-screen.has-loading-indicator-no-padding svg {
    margin: 0 5%;
    margin-bottom: 30px;
    height: auto;
    max-width: 480px;
    max-height: 250px;
}

@media (max-width: 480px) {
    .has-loading-indicator.splash-screen svg,
    .splash-screen.has-loading-indicator-no-padding svg {
        max-width: calc(100% - 5% * 2);
    }
}

.has-loading-indicator-no-padding {
    min-height: 100%;
}

.has-footer .has-loading-indicator,
.has-footer .has-loading-indicator-no-padding {
    min-height: calc(100vh - 70px);
}

.has-footer .has-loading-indicator .loading-indicator-container,
.has-footer .has-loading-indicator-no-padding .loading-indicator-container {
    margin-top: 70px;
}

.loading-indicator-container {
    width: 70px;
    height: 70px;
}

.loading-indicator-container .custom-image-indicator {
    position: relative;
}

.loading-indicator-container .custom-image-indicator img {
    width: 70px;
    height: 70px;
}

.loading-indicator-container .spinner {
    height: 100%;
    width: 100%;
    border-radius: 100%;
    position: relative;
    text-align: left;
    overflow: hidden;
}

.loading-indicator-container .spinner:after {
    content: "";
    position: absolute;
    height: calc(70px - 10px);
    width: calc(70px - 10px);
    border-style: solid;
    border-color: transparent;
    border-width: calc(10px / 2);
    border-radius: 100%;
    border-top-color: #fff;
}

.loading-indicator-container .spinner:before {
    content: "";
    position: absolute;
    height: calc(70px - 10px);
    width: calc(70px - 10px);
    top: calc(10px / 2);
    left: calc(10px / 2);
    border-radius: 100%;
    box-shadow: -28px -14px 21px 5.25px #fff;
}

@keyframes spinnerAnimation {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

.loading-indicator-container-small {
    width: 49px;
    height: 49px;
}

.loading-indicator-container-small .custom-image-indicator {
    position: relative;
}

.loading-indicator-container-small .custom-image-indicator img {
    width: 49px;
    height: 49px;
}

.loading-indicator-container-small .spinner {
    height: 100%;
    width: 100%;
    border-radius: 100%;
    position: relative;
    text-align: left;
    overflow: hidden;
}

.loading-indicator-container-small .spinner:after {
    content: "";
    position: absolute;
    height: calc(49px - 7px);
    width: calc(49px - 7px);
    border-style: solid;
    border-color: transparent;
    border-width: calc(7px / 2);
    border-radius: 100%;
    border-top-color: #fff;
}

.loading-indicator-container-small .spinner:before {
    content: "";
    position: absolute;
    height: calc(49px - 7px);
    width: calc(49px - 7px);
    top: calc(7px / 2);
    left: calc(7px / 2);
    border-radius: 100%;
    box-shadow: -19.6px -9.8px 14.7px 3.675px #fff;
}

@keyframes spinnerAnimation {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

.splash-animation-container {
    width: 100px;
    height: 100px;
}

.splash-animation-container .custom-image-indicator {
    position: relative;
}

.splash-animation-container .custom-image-indicator img {
    width: 100px;
    height: 100px;
}

.splash-animation-container .spinner {
    height: 100%;
    width: 100%;
    border-radius: 100%;
    position: relative;
    text-align: left;
    overflow: hidden;
}

.splash-animation-container .spinner:after {
    content: "";
    position: absolute;
    height: calc(100px - 14.28571px);
    width: calc(100px - 14.28571px);
    border-style: solid;
    border-color: transparent;
    border-width: calc(14.28571px / 2);
    border-radius: 100%;
    border-top-color: #fff;
}

.splash-animation-container .spinner:before {
    content: "";
    position: absolute;
    height: calc(100px - 14.28571px);
    width: calc(100px - 14.28571px);
    top: calc(14.28571px / 2);
    left: calc(14.28571px / 2);
    border-radius: 100%;
    box-shadow: -40px -20px 30px 7.5px #fff;
}

@keyframes spinnerAnimation {
    0% {
        transform: rotate(0);
    }
    100% {
        transform: rotate(360deg);
    }
}

.ua-barrier-loading.has-loading-indicator,
.ua-barrier-loading.has-loading-indicator-no-padding {
    min-height: calc(100vh - 70px);
}

.menu-bar-simple .menubar,
.ua-barrier .menubar {
    height: 70px;
    border-bottom: 1px solid #061016;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 5%;
}

.menu-bar-simple .menubar .errorPageLogo,
.ua-barrier .menubar .errorPageLogo {
    height: 40px;
    cursor: pointer;
}

.menu-bar-simple .menubar .errorPageLogo img,
.menu-bar-simple .menubar .errorPageLogo svg,
.ua-barrier .menubar .errorPageLogo img,
.ua-barrier .menubar .errorPageLogo svg {
    height: 40px;
    width: auto;
}

.chrome-logo {
    max-width: 100px;
}

.concurrent_tab_error .ua-barrier .content,
.error .ua-barrier .content {
    padding-top: 110px;
}

.ua-barrier .content {
    padding: 0 5%;
    padding-bottom: 70px;
}

.ua-barrier .content h1 {
    margin: 0.65em 0;
}

.ua-barrier .content p {
    font-size: 16px;
    color: #7397a9;
}

.ua-barrier .content hr {
    color: #555;
    border: none;
    border-top: 1px solid;
}

.ua-barrier .content a.get-button {
    text-decoration: none;
    display: inline-block;
    background: #0094d9;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    height: 46px;
    line-height: 46px;
    margin-bottom: 30px;
    padding: 0 33px;
    color: #fff;
    border-radius: 23px;
}

.ua-barrier .content .has-loading-indicator,
.ua-barrier .content .has-loading-indicator-no-padding {
    min-height: calc(100vh - 70px - 70px);
}

.ua-barrier .mobile-link {
    padding-top: 70px;
}

.chrome-download-button {
    background: #061016;
    display: block;
    width: 130px;
    padding: 15px 12px;
    text-align: center;
    text-decoration: none;
    margin-bottom: 150px;
}

.chrome-download-button:hover {
    background: #091720;
}

.store-badges {
    display: flex;
    align-items: center;
    margin: 30px 0;
}

.apple-store-button,
.google-play-button {
    display: inline-block;
}

.apple-store-button img {
    height: 45px;
}

.google-play-button img {
    height: 45px;
    margin-left: 25px;
}

.top-nav-button {
    display: inline-block;
    background: #061016;
    border-width: 0;
    margin-right: 5%;
    padding: 0;
}

.top-nav-button:focus,
.top-nav-button:hover {
    background: #091820;
}

.top-nav-button a {
    font-size: 14px;
    color: #fff;
    text-decoration: none;
    display: block;
    padding: 10px 30px;
    min-height: 35px;
}

.hr-margin {
    margin: 0;
}

.pin-entry .inputs {
    width: 55%;
    text-align: center;
}

.pin-entry>.inputs input {
    margin: 0 5px;
    font-size: 16px;
    text-align: center;
    background: #061016;
    color: #fff;
    -webkit-text-security: disc;
    width: 45px;
    height: 45px;
    border-radius: 22.5px;
    border: 1px solid;
}

.pin-entry>.inputs input.rectangular-style {
    width: 35px;
    height: 50px;
    border-radius: 2px;
    border: 1px solid #7397a9;
}

.pin-entry>.inputs input.rectangular-style:focus {
    border: 1px solid #fff;
}

.pin-entry>.inputs input:focus {
    outline: 0;
}

.pin-entry input::-webkit-credentials-auto-fill-button {
    visibility: hidden;
    display: none !important;
    pointer-events: none;
    position: absolute;
    right: 0;
}

.pin-entry .wrong-pin {
    display: block;
    text-align: center;
    color: #e8350c;
    padding-top: 10px;
}

.pin-entry .wrong-pin.above {
    padding-bottom: 20px;
}

@media (max-width: 991px) {
    .pin-entry .inputs {
        width: 100%;
    }
}

.mobile-linking {
    max-width: 500px;
    margin: 0 auto;
    text-align: center;
}

.mobile-linking .mobile-container {
    display: flex;
    flex-wrap: wrap;
    margin-top: 60px;
}

.mobile-linking .mobile-container .submit-btn {
    width: 80px;
    flex: none;
}

.mobile-linking .mobile-container .error-message {
    width: 100%;
    text-align: justify;
    margin-top: 2rem;
    color: #e8350c;
}

.mobile-linking .input-group {
    display: flex;
    flex: auto;
    line-height: 40px;
    margin-right: 40px;
    padding: 15px;
    background-color: #fff;
    border-radius: 4px;
}

.mobile-linking .input-group .divider {
    width: 1px;
    height: 100%;
    background-color: #333;
    margin: 0 15px;
}

.mobile-linking .input-group .dropdown {
    width: 100px;
    margin-left: 0;
}

.mobile-linking .input-group .dropdown .current-text {
    color: #333;
    font-size: 20px;
}

.mobile-linking .input-group .dropdown .caret {
    margin: 0;
}

.mobile-linking .input-group .phone-code {
    width: 100px;
    color: #333;
    font-size: 20px;
    cursor: default;
}

.mobile-linking .input-group input {
    flex: auto;
    width: 0;
    border-radius: 4px;
    border: none;
    outline: 0;
    font-size: 20px;
    color: 20px;
}

.mobile-linking .pin-container {
    margin-top: 60px;
}

.mobile-linking .pin-container .inputs {
    margin: 0 auto;
}

@media (max-width: 543px) {
    .mobile-linking .mobile-container .submit-btn {
        width: 100%;
        margin-top: 20px;
        padding: 10px 0;
    }
    .mobile-linking .input-group {
        margin-right: 0;
    }
}

.embedded-web-view {
    padding: 0;
    height: calc(100vh - 70px);
}

.embedded-web-view.has-loading-indicator,
.embedded-web-view.has-loading-indicator-no-padding {
    min-height: initial;
}

.embedded-web-view.has-loading-indicator .loading-indicator-container,
.embedded-web-view.has-loading-indicator-no-padding .loading-indicator-container {
    position: absolute;
    margin-top: initial;
}

.embedded-web-view.continuous-scrolling {
    height: 100vh;
}

.embedded-web-view.header-padding {
    padding-top: 70px;
}

.embedded-web-view .embedded-iframe {
    width: 100%;
    height: 100%;
    border: none;
}

.profile {
    position: fixed;
    left: 0;
    top: 0;
    z-index: 106;
    width: 100%;
    height: 100%;
}

.profile.profile-type-A {
    padding-top: 110px;
    background-color: #061016;
    text-align: center;
    overflow-y: auto;
}

.profile h1 {
    margin-top: 60px;
}

.profile h2 {
    margin: 0;
}

.profile h2 img {
    display: inline-block;
    height: 100px;
    width: 300px;
    object-fit: contain;
}

.profile .profile-list {
    display: flex;
    flex-direction: column;
    align-items: stretch;
    overflow-x: auto;
    margin-top: 40px;
}

.profile .profile-list .wrapper {
    display: flex;
    align-items: center;
    justify-content: space-evenly;
    min-width: max-content;
}

.profile .profile-list .profile-option {
    width: max-content;
    padding: 0 20px;
    cursor: pointer;
}

.profile .profile-list .profile-option img {
    display: block;
    width: 150px;
    margin: 0 auto 10px;
}

.profile .profile-list .profile-option p {
    margin: 0;
    font-size: 20px;
}

.menu-bar .profile-icon .toggleable-image img {
    height: 50px;
    width: 50px;
}

@media (max-width: 480px) {
    .profile.profile-type-A h1 {
        margin-top: 32px;
        font-size: 32px;
    }
    .profile.profile-type-A h2 img {
        width: 280px;
        height: 80px;
    }
    .profile.profile-type-A .profile-list .profile-option img {
        width: 120px;
    }
}

.carousel-list {
    padding-bottom: 40px;
    overflow: hidden;
}

.iframe-banner {
    width: 100%;
    margin: 33px 0;
}

.iframe-banner iframe {
    display: block;
    width: 100%;
    height: 100%;
    border: none;
}

.settings-page {
    padding: 70px 0 70px 0;
    max-width: 960px;
    margin: 0 auto;
}

.settings-page hr {
    border: 1px solid #061016;
}

.settings-page .section {
    padding: 15px 0;
}

.settings-page .section .topbar {
    margin-bottom: 31px;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.settings-page .section .topbar .change-button {
    vertical-align: middle;
    margin-right: 1em;
}

.settings-page .section .topbar .change-button button {
    margin: 0;
}

.settings-page .section label {
    display: block;
    cursor: pointer;
    line-height: 2.5em;
}

.settings-page .section label.checkbox {
    line-height: 1.3em;
    padding: 1em 0;
    vertical-align: middle;
    overflow: visible;
}

.settings-page .help-text {
    color: #7397a9;
    font-size: 14px;
    margin: 0.5em 0.5em 0.5em 0;
}

.settings-page .rating-line {
    vertical-align: middle;
    overflow: hidden;
    margin: 3px 0;
    padding: 0 20px;
    user-select: none;
    cursor: pointer;
}

.settings-page .rating-line.restricted {
    background: #003663;
}

.settings-page .rating-line.restricted:focus,
.settings-page .rating-line.restricted:hover {
    background: #061016;
}

.settings-page .rating-line.allowed {
    background: #061016;
}

.settings-page .rating-line.allowed:focus,
.settings-page .rating-line.allowed:hover {
    background: #003663;
}

.settings-page .rating-line.allowed,
.settings-page .rating-line.restricted {
    transition: all 0.3s ease;
}

.settings-page .rating-line>span {
    line-height: 48px;
    height: 100%;
    display: inline-block;
}

.settings-page .rating-line img {
    float: left;
    margin: 9px 0;
    height: 30px;
    width: 30px;
    margin-right: 20px;
}

.settings-page .rating-line .mark span {
    display: inline-block;
}

.settings-page .rating-line .mark svg {
    vertical-align: middle;
    margin-left: 20px;
}

.settings-page .rating-line.allowed .svg-container {
    padding-top: 0;
    padding-left: 1em;
}

.settings-page .rating-line .mark {
    float: right;
    color: #7397a9;
}

.settings-page .controls span.description {
    display: block;
    color: #7397a9;
}

.settings-page .controls label>div {
    display: inline-block;
    line-height: 1em;
    width: calc(100% - 22px - 0.75em);
}

.settings-page .controls label>div span {
    margin-top: 5px;
}

.settings-page .controls.privacy-settings label>div {
    vertical-align: top;
    margin-top: 4px;
}

.settings-page .controls.privacy-settings .misc-type a {
    line-height: 35px;
}

.settings-page .controls.data-usage label:not(:first-child) {
    margin-top: 5px;
}

.settings-page .controls.data-usage label>span {
    padding-bottom: 0.25em;
    float: left;
    line-height: initial;
}

.settings-page .controls {
    width: 60%;
    float: right;
    font-size: 14px;
    padding: 0 5px;
}

.settings-page .controls p {
    margin-top: 0;
}

.settings-page .controls .help-text span p {
    margin-top: 1em;
}

.settings-page .version-section {
    padding: 15px 0;
    font-size: 12px;
    color: #7397a9;
}

.settings-page.List .controls.data-usage label>span {
    margin-top: -2px;
}

.settings-page.Accordion .section .label {
    width: 100%;
    margin-bottom: 0;
    cursor: pointer;
}

.settings-page.Accordion .section .label .chevron {
    display: inline-block;
    padding: 4px;
    margin-left: 15px;
    border-width: 0 3px 3px 0;
    border-style: solid;
    transform: translateY(-4px) rotate(45deg);
    transition: all 0.3s;
}

.settings-page.Accordion .section .controls {
    height: 0;
    width: 100%;
    overflow: hidden;
}

.settings-page.Accordion .section.open .controls {
    height: auto;
}

.settings-page.Accordion .section.open .label {
    margin-bottom: 20px;
}

.settings-page.Accordion .section.open .label .chevron {
    transform: rotate(-135deg);
}

.settings-page.MasterDetail {
    padding: 70px 5% 0 5%;
    max-width: initial;
}

.settings-page.MasterDetail .MasterDetail-leftSide {
    padding: 15px 0;
    display: inline-block;
    width: calc(100% - 60%);
    vertical-align: top;
}

.settings-page.MasterDetail .MasterDetail-rightSide {
    display: inline-block;
    width: 60%;
    vertical-align: top;
}

.settings-page.MasterDetail .MasterDetail-rightSide .detail-back {
    margin-bottom: 20px;
    display: none;
}

.settings-page.MasterDetail .label {
    width: calc(100% - 48px - 2px);
    cursor: pointer;
    color: #7397a9;
    transition: all 0.3s;
    line-height: 48px;
    padding: 0 5px;
    position: relative;
}

.settings-page.MasterDetail .label.active,
.settings-page.MasterDetail .label:focus,
.settings-page.MasterDetail .label:hover {
    background: #061016;
    color: #fff;
}

.settings-page.MasterDetail .label.active:after,
.settings-page.MasterDetail .label:focus:after,
.settings-page.MasterDetail .label:hover:after {
    opacity: 1;
}

.settings-page.MasterDetail .label:after {
    content: " ";
    position: absolute;
    right: calc(-48px - 2px);
    pointer-events: none;
    height: 0;
    width: 0;
    border: 25px solid transparent;
    border-left-color: #061016;
    opacity: 0;
    transition: opacity 0.3s;
}

.settings-page.MasterDetail .controls {
    width: 100%;
}

.label {
    font-size: 18px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    width: calc(100% - 60%);
    height: 100%;
    float: left;
}

.label:not(.List) svg {
    vertical-align: middle;
    margin-top: -4px;
    margin-right: 15px;
    width: 30px;
    height: 30px;
}

.section {
    clear: both;
    overflow: auto;
}

.label .saving {
    color: #7397a9;
    font-size: 14px;
    margin-left: 2em;
    font-style: italic;
    opacity: 1;
}

.label .saving.fadeOut {
    opacity: 0;
}

label.disabled {
    color: #7397a9;
    cursor: not-allowed;
}

label.disabled input[type="checkbox"] {
    background: #7397a9;
    cursor: not-allowed;
}

label.disabled input[type="checkbox"]:focus,
label.disabled input[type="checkbox"]:hover {
    box-shadow: none;
}

label.disabled.radio span {
    cursor: not-allowed;
}

label.disabled.radio input[type="radio"]+span:focus:before,
label.disabled.radio input[type="radio"]+span:hover:before {
    box-shadow: none;
}

label.disabled.radio input[type="radio"]:checked+span:before {
    background: #7397a9;
}

.device-line {
    width: 100%;
    overflow: auto;
    margin-bottom: 3px;
    padding: 0 20px;
    background: #061016;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.device-line button {
    margin: 0;
    float: right;
    max-width: 40%;
}

.device-line .device-name {
    max-width: calc(100% - 40% - 2em);
    white-space: nowrap;
    line-height: 48px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.device-line.disabled .device-name {
    max-width: calc(100% - 40% - 2em);
}

.device-line.disabled span.registered {
    float: right;
    color: #7397a9;
    max-width: 40%;
    line-height: 48px;
}

.settings-page .controls.privacy-settings .misc-type a,
a.settings-button,
button.settings-button {
    display: inline-block;
    border-width: 0;
    font-size: inherit;
    cursor: pointer;
    padding: 0 40px;
    position: relative;
}

button.settings-button.secondary {
    background-image: none;
    background: #061016;
    color: #fff;
}

.content .buttons .settings-button,
.content .buttons .settings-page .controls.privacy-settings .misc-type a,
.settings-page .controls.privacy-settings .misc-type .content .buttons a {
    margin: 5px;
}

@media (max-width: 480px) {
    .modal-container.open .modal {
        min-width: 290px;
    }
    .modal-container.open .modal .buttons .settings-button,
    .modal-container.open .modal .buttons .settings-page .controls.privacy-settings .misc-type a,
    .settings-page .controls.privacy-settings .misc-type .modal-container.open .modal .buttons a {
        padding: 0 15px;
    }
}

@media (max-width: 728px) {
    .content .settings-page:not(.MasterDetail) .section .label {
        width: 100%;
    }
    .content .settings-page:not(.MasterDetail) .section .controls {
        width: 100%;
    }
}

@media (max-width: 991px) {
    .settings-page.MasterDetail .MasterDetail-leftSide {
        width: 100%;
    }
    .settings-page.MasterDetail .MasterDetail-leftSide.section-open {
        display: none;
    }
    .settings-page.MasterDetail .MasterDetail-rightSide {
        width: 100%;
    }
    .settings-page.MasterDetail .MasterDetail-rightSide:not(.section-open) {
        display: none;
    }
    .settings-page.MasterDetail .MasterDetail-rightSide .detail-back {
        display: block;
    }
}

@media (max-width: 1100px) {
    .settings-page:not(.MasterDetail) {
        padding: 70px 5% 70px 5%;
    }
}

.pin-entry-page {
    padding-top: 110px;
}

.pin-entry-page .title {
    margin-top: 0;
}

.pin-entry-page .line {
    display: flex;
    align-items: center;
}

.pin-entry-page .line .pin-entry {
    padding-top: 30px;
    padding-bottom: 20px;
    width: 80%;
}

.pin-entry-page .line .pin-entry .wrong-pin {
    padding-bottom: 0;
}

.pin-entry-page .line .label {
    font-size: 16px;
    width: 20%;
}

.pin-entry-page .pinupdatewrapper {
    margin: 30px 0;
}

.pin-entry-page .buttons {
    margin-top: 30px;
}

.pin-entry-page .buttons .settings-button,
.pin-entry-page .buttons .settings-page .controls.privacy-settings .misc-type a,
.settings-page .controls.privacy-settings .misc-type .pin-entry-page .buttons a {
    margin: 0 10px 0 0;
}

.pin-entry-page .error-message {
    color: #e8350c;
    height: 30px;
    line-height: 30px;
}

@media (max-width: 991px) {
    .pin-entry-page .pin-entry {
        width: 60%;
    }
    .pin-entry-page .label {
        width: 40%;
    }
}

.login-page {
    overflow-y: auto;
}

.login-page.ui-type-standard {
    background: #f3f3f3;
    color: #333;
    height: calc(100vh - 70px);
}

.login-page.ui-type-standard .login-page-container {
    padding: 0 15px;
    margin: 0 auto;
    max-width: 960px;
    height: 100%;
}

.login-page.ui-type-standard .login-page-container .login-page-content {
    padding: 110px 0 40px 0;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-page-title {
    font-size: 48px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin: 12px 0 10px 0;
    text-align: center;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-box {
    box-shadow: 0 10px 15px 0 rgba(0, 0, 0, 0.15);
    position: relative;
    font-size: 18px;
    color: #7397a9;
    border-radius: 4px;
    width: 930px;
    display: flex;
    margin: 0 auto;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-box .login-box-left {
    flex: 1;
    max-width: 465px;
    padding: 40px;
    background: #fff;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-box .login-box-right {
    flex: 1;
    max-width: 465px;
    background-color: #f3f3f3;
    display: flex;
    justify-content: center;
    position: relative;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-box .login-box-right .loading-indicator-container {
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    margin: auto;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-box .login-box-right .promo-image {
    flex: 1;
    height: 100%;
    background-repeat: no-repeat;
    background-size: auto 100%;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-box .login-box-right .promo-image.loaded {
    opacity: 1;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-box h1 {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    margin-top: 0;
    text-align: center;
}

.login-page.ui-type-standard .login-page-container .login-page-content button {
    border-radius: 28px;
}

.login-page.ui-type-standard .login-page-container .login-page-content .login-page-disclaimer {
    font-size: 12px;
    margin-top: 40px;
    text-align: center;
}

.login-page.ui-type-standard .login-page-container>.promo-image {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
}

.login-page.ui-type-standard .footer {
    background: #061016;
}

.login-page .login-page-container .marketing-page-content {
    position: absolute;
    display: flex;
    left: 0;
    top: 0;
    width: 100%;
    height: calc(100vh - 70px);
    justify-content: center;
    align-items: center;
    flex-direction: column;
}

.login-page .login-page-container .marketing-page-content svg {
    width: 28%;
    height: auto;
    max-height: 250px;
}

.login-page .login-page-container .marketing-page-content span {
    width: 44%;
}

.login-page .login-page-container .marketing-page-content button {
    width: 42%;
    border-radius: 8px;
    position: absolute;
    bottom: 70px;
}

.login-page .login-page-container .marketing-page-content a {
    position: absolute;
    top: 6%;
    right: 3%;
    display: block;
    padding: 10px;
    cursor: pointer;
}

.login-page .login-page-container .marketing-page-content a:focus,
.login-page .login-page-container .marketing-page-content a:hover {
    color: #fff;
}

.login-page .login-page-container .marketing-page-content a span {
    width: auto;
}

.login-page .login-page-container .active-content {
    opacity: 1;
    transition: opacity 0.3s;
}

.login-page .login-page-container .inactive-content {
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.3s;
}

.login-page.ui-type-frost,
.login-page.ui-type-panorama {
    background: #061016;
    color: #fff;
}

.login-page.ui-type-frost .login-page-container,
.login-page.ui-type-panorama .login-page-container {
    position: relative;
}

.login-page.ui-type-frost .login-page-container.continuous-footer .promo-image,
.login-page.ui-type-panorama .login-page-container.continuous-footer .promo-image {
    position: absolute;
    width: 100%;
}

.login-page.ui-type-frost .login-page-container.attached-footer .promo-image,
.login-page.ui-type-panorama .login-page-container.attached-footer .promo-image {
    flex: 1;
}

.login-page.ui-type-frost .login-page-container.attached-footer .login-page-content,
.login-page.ui-type-panorama .login-page-container.attached-footer .login-page-content {
    position: absolute;
}

.login-page.ui-type-frost .login-page-container .promo-image,
.login-page.ui-type-panorama .login-page-container .promo-image {
    height: 100%;
    background-repeat: no-repeat;
    background-size: cover;
    background-position: top;
    transition: opacity 0.3s ease-in-out;
    opacity: 0;
}

.login-page.ui-type-frost .login-page-container .promo-image.loaded,
.login-page.ui-type-panorama .login-page-container .promo-image.loaded {
    opacity: 1;
}

.login-page.ui-type-frost .login-page-container .logo-container svg,
.login-page.ui-type-panorama .login-page-container .logo-container svg {
    height: 50px;
    margin: 0 auto;
}

.login-page.ui-type-frost .login-page-container .login-page-content,
.login-page.ui-type-panorama .login-page-container .login-page-content {
    display: flex;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left {
    height: 100%;
    position: relative;
    padding: 40px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    width: 500px;
    margin-left: 50px;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left .login-box {
    width: 100%;
    max-height: 100%;
    display: flex;
    flex-direction: column;
    overflow: auto;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box .login-page-logo,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left .login-box .login-page-logo {
    display: block;
    margin-bottom: 20px;
    max-height: 250px;
    min-height: 50px;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box .login-title,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left .login-box .login-title {
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 20px;
    margin-top: 0;
    text-align: center;
    margin-bottom: 20px;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box button,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left .login-box button {
    border-radius: 8px;
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box input,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left .login-box input {
    border-radius: 8px;
    height: 3.5em;
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box .register-hint-text,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left .login-box .register-hint-text {
    margin-top: 20px;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box .register-now-holder,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left .login-box .register-now-holder {
    border: none;
    font-size: 20px;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box .register-now-holder a,
.login-page.ui-type-panorama .login-page-container .login-page-content .login-box-left .login-box .register-now-holder a {
    text-decoration: none;
    font-family: appFontRegular, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.login-page.ui-type-frost .login-page-container .footer,
.login-page.ui-type-panorama .login-page-container .footer {
    background: initial;
    border-top: none;
}

.login-page.ui-type-frost .login-page-container .loading-indicator-container,
.login-page.ui-type-panorama .login-page-container .loading-indicator-container {
    right: 25%;
}

.login-page.ui-type-frost .login-page-container .login-page-content {
    justify-content: center;
    padding-bottom: 70px;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left {
    margin-left: 0;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box {
    background: rgba(255, 255, 255, 0.15);
    backdrop-filter: blur(5px);
    border-radius: 8px;
    box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
    padding: 20px;
    max-height: 100%;
    overflow: auto;
    display: flex;
    flex-direction: column;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box .login-page-logo {
    min-height: 50px;
    margin-bottom: 0;
}

.login-page.ui-type-frost .login-page-container .login-page-content .login-box-left .login-box .register-now-holder {
    text-align: center !important;
    left: 0;
    bottom: calc(-50vh + 100px);
}

.login-page.ui-type-frost .login-page-container .login-page-content button {
    margin-top: 10px;
}

.login-page.ui-type-frost .login-page-container .login-page-content.marketing-provider-selection .login-box-left {
    padding: 0;
}

.login-page.ui-type-frost .login-page-container .login-page-content.marketing-provider-selection .login-box-left .login-box {
    backdrop-filter: none;
    background: rgba(0, 0, 0, 0.45);
    box-shadow: 0 0 10px 4px rgba(0, 0, 0, 0.6);
    padding: 40px 80px;
}

.login-page.ui-type-frost .login-page-container .login-page-content.marketing-provider-selection .login-box-left .login-box .login-provider-divider {
    text-align: center;
    margin: 15px 0 5px;
}

.login-page.ui-type-frost .login-page-container .login-page-content.marketing-provider-selection .login-box-left .login-box button.skip-button {
    background-color: #fff;
}

.login-page.ui-type-frost .login-page-container .login-page-content.marketing-provider-selection .login-box-left .login-box button.skip-button:focus,
.login-page.ui-type-frost .login-page-container .login-page-content.marketing-provider-selection .login-box-left .login-box button.skip-button:hover {
    background: #fff;
}

.login-page.ui-type-frost .login-page-container .loading-indicator-container {
    right: initial;
}

.login-page .login-page-container.has-loading-indicator,
.login-page .login-page-container.has-loading-indicator-no-padding {
    align-items: initial;
}

.login-page .login-page-container.has-loading-indicator .loading-indicator-container,
.login-page .login-page-container.has-loading-indicator-no-padding .loading-indicator-container {
    position: absolute;
    align-self: center;
}

.login-page input {
    background: 0;
    height: 3em;
    transition: border-color 0.3s ease, box-shadow 0.3s ease;
    display: block;
    width: 100%;
    padding: 0.5em 0.75em;
    font-size: 16px;
    color: #333;
    background-color: #fff;
    background-image: none;
    background-clip: padding-box;
    border: 1px solid #afafaf;
    border-radius: 2px;
}

.login-page input.invalidated {
    border: 1px solid #e8350c;
}

.login-page .invalid-input-text {
    color: #e8350c;
    font-size: 14px;
}

.login-page .forgot-password-line {
    text-align: right;
    font-size: 12px;
    margin-top: 0;
}

.login-page .forgot-password-line a {
    color: #333;
    text-decoration: none;
}

.login-page .forgot-password-line a:hover {
    text-decoration: underline;
}

.login-page.ui-type-frost .forgot-password-line a,
.login-page.ui-type-panorama .forgot-password-line a {
    color: #fff;
}

.login-page button {
    position: relative;
    border-style: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 56px;
    height: 56px;
    color: #fff;
    background: #0094d9;
    cursor: pointer;
    width: 100%;
    max-width: 480px;
    text-align: center;
    transition: all 0.3s ease;
    font-size: 20px;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    border-radius: 28px;
    margin: 20px auto 0 auto;
    flex: none;
    overflow: hidden;
}

.login-page button:focus,
.login-page button:hover {
    background: #00acfc;
}

.login-page button img,
.login-page button svg {
    position: absolute;
    left: 20px;
    top: 0;
    height: 56px;
    width: 56px;
    object-fit: contain;
}

.login-page .register-separator {
    margin: 30px 0;
    height: 1px;
    background: #afafaf;
}

.login-page .register-hint-text {
    text-align: center;
}

.login-page .register-hint-text span {
    display: block;
}

.login-page .register-now-holder {
    text-align: center;
    cursor: pointer;
    margin: 20px auto -10px auto;
    width: 100%;
    height: 56px;
    line-height: 56px;
    border: 1px solid #afafaf;
    border-radius: 28px;
    max-width: 480px;
}

.login-page .register-now-holder a {
    text-decoration: none;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

@media (max-width: 1024px) {
    .login-page .login-page-container .login-page-content .login-box {
        width: 465px;
    }
    .login-page .login-page-container .login-page-content .login-box .login-box-right {
        display: none;
    }
}

@media (min-width: 769px) {
    .login-page-container .promo-image {
        background-position: center;
    }
}

@media (max-width: 768px) {
    .login-page.ui-type-frost .login-box-left,
    .ui-type-panorama .login-box-left {
        margin-left: 0 !important;
    }
    .login-page.ui-type-frost:not(.ui-type-frost) .login-page-content,
    .ui-type-panorama:not(.ui-type-frost) .login-page-content {
        justify-content: center;
    }
    .login-page.ui-type-frost:not(.ui-type-frost) .register-now-holder,
    .ui-type-panorama:not(.ui-type-frost) .register-now-holder {
        text-align: center !important;
        bottom: 70px !important;
    }
    .login-page.ui-type-frost .login-page-container .marketing-page-content svg,
    .ui-type-panorama .login-page-container .marketing-page-content svg {
        width: 32%;
    }
    .login-page.ui-type-frost .login-page-container .marketing-page-content p,
    .ui-type-panorama .login-page-container .marketing-page-content p {
        width: 72%;
    }
    .login-page.ui-type-frost .login-page-container .marketing-page-content button,
    .ui-type-panorama .login-page-container .marketing-page-content button {
        width: 86%;
    }
}

@media (max-width: 544px) {
    .login-page.ui-type-frost .login-page-container .marketing-page-content svg,
    .ui-type-panorama .login-page-container .marketing-page-content svg {
        width: 48%;
    }
    .login-page.ui-type-frost .login-page-container .marketing-page-content button,
    .ui-type-panorama .login-page-container .marketing-page-content button {
        width: 84%;
    }
}

@media (min-width: 768px) and (max-width: 992px) {
    .ui-type-standard .login-page-container {
        width: 720px;
    }
}

@media (max-width: 480px) {
    .login-page-container .login-page-content .login-page-title {
        display: none;
    }
    .login-page-container .login-page-content .login-box {
        width: 100% !important;
    }
}

.top-nav .page {
    padding-top: 110px;
    padding-bottom: 20px;
    min-height: calc(100vh - 70px);
}

.top-nav .page.has-loading-indicator,
.top-nav .page.has-loading-indicator-no-padding {
    padding-top: 70px;
    padding-bottom: 0;
}

.top-nav .page .heading {
    margin: 0 5%;
    user-select: none;
    font-family: appFontLight, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 40px;
}

.top-nav .page.no-heading {
    margin-top: 0;
}

.top-nav .page.no-heading .heading {
    display: none;
}

.top-nav .page.no-heading .carousel-list>div:first-child .carousel-wrap {
    margin-top: 0;
}

@media (min-width: 1920px) {
    .top-nav .page .heading {
        margin: 0 80px;
        padding-left: 0;
    }
}

.search.has-loading-indicator,
.search.has-loading-indicator-no-padding {
    min-height: calc(100vh - 70px);
    padding-top: 70px;
}

.search .tab {
    display: inline-block;
    font-size: 18px;
    margin-right: 50px;
    position: relative;
    padding-bottom: 10px;
    user-select: none;
    cursor: pointer;
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
}

.search .tab .lightbar {
    height: 4px;
    width: 100%;
    position: absolute;
    bottom: 0;
    border-radius: 2px;
    background: #7397a9;
}

.search .tab.inactive {
    color: #7397a9;
}

.search .not-found {
    padding: 110px 5% 0 5%;
    font-size: 18px;
}

@media (max-width: 480px) {
    .search .tab {
        margin-right: 20px;
    }
}

.synopsis-carousels {
    padding-top: 20px;
    padding-bottom: 50px;
    overflow: hidden;
    background: linear-gradient(to bottom, rgba(6, 16, 22, 0.85), #061016);
}

.synopsis-carousels .carousel-wrap {
    margin-top: 10px;
}

.synopsis-carousels .carousel-wrap .header {
    display: none;
}

.synopsis-carousels .synopsis-carousel-title {
    font-family: appFontBold, "Helvetica Neue", Helvetica, Arial, sans-serif;
    font-size: 18px;
    margin: 0 5%;
    margin-top: 40px;
}

.synopsis-page .dropdown {
    width: max-content;
}

.synopsis-page .dropdown .current {
    font-size: 18px;
}

.synopsis-page .dropdown .current .current-text {
    width: auto;
    min-width: calc(110px - 20px);
}

.synopsis-page .dropdown .arrow-box {
    max-height: 150px;
    overflow-y: auto;
}

@media (max-width: 479px) {
    .synopsis-page .dropdown .arrow-box {
        max-height: 120px;
    }
}

.top-nav {
    position: relative;
    /* min-height: 100vh; */
}

/* .top-nav.has-footer {
    padding-bottom: 70px;
  } */

.top-nav.play {
    height: 100vh;
}

/* .top-nav .content {
    min-height: calc(100vh - 70px);
  } */

.top-nav.settings .footer {
    bottom: 0;
}

.footer a:hover {
    color: #fff;
    text-decoration: none;
    transition: color .3s;
}