@import url("https://fonts.googleapis.com/css2?family=Poppins:wght@400;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Catamaran:wght@400;700&display=swap");

:root {
    --background-color: linear-gradient(0deg, rgba(5, 5, 5, 0.8), rgba(5, 5, 5, 0.8)), linear-gradient(180deg, rgba(5, 5, 5, 0) 18.98%, #050505 100%);
    --background-font-color: #fafafb;
    --card-font-color: #fafafb;
    --menu-background-color: linear-gradient(0deg, rgba(5, 5, 5, 0.8) 0%, rgba(5, 5, 5, 0.8)) 100%;
    --button-font-color: #fafafb;
    --card-active-boxshadow: drop-shadow(0px 0px 50px var(--card-focused-shadow-color));
    --card-active-bordercolor: 2px solid var(--card-focused-color);
    --button-active-boxshadow: 0px 0px 16px rgba(0, 0, 0, 0.4), 0px 0px 40px rgba(220, 24, 10, 0.8);
    --poster_drop_shadow: drop-shadow(0px 0px 40px #000000);
    --active-font-color: #fafafb;
    --background-transparence: rgba(255, 255, 255, 0);
    --background-gray: rgba(14, 30, 35, 1);
    --red-primary:#32b2bc;
}

body {
    width: 120em;
    height: 67.5em;
    margin: 0;
    padding: 0;
    background-size: cover;
    font-size: 16px;
    font-family: Catamaran;
    line-height: 22px;
    font-weight: normal;
    color: var(--background-font-color);
    overflow: hidden;
    transition: background 0.5s linear;
    background: #0e1e23  no-repeat center;
}

#lottie {
    width: 480px;
    height: 260px;
    display: flex;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
    text-align: center;
    opacity: 1;
    margin: auto;
    justify-content: center;
    align-items: center;
    left: 37.5%;
    right: 37.5%;
    top: 37.96%;
    bottom: 37.9%;
    position: absolute;
}

.loader_con {
    width: 100%;
    height: 100%;
    background: #0e1e23;
    z-index: 999999;
    position: absolute;
}

.container-fluid {
    padding: 0;
}
.network-container {
    z-index: 1000;
    width: 100%;
    height: 100%;
    position: absolute;
    background: #0e1e23;
    top: 0px;
    left: 0px;
}

.row {
    margin-right: 0 !important;
    margin-left: 0 !important;
}

.left-sec {
    position: fixed;
    width: 7%;
    background: rgba(14, 30, 35, 1);
    height: 100%;
    z-index: 99;
    transition: all 0.3s;
    -webkit-transition: all 0.3s;
}
.left-sec.full-menu{
    background: var(--background-gray) !important;
    width: 20%;
}

.right-sec {
    width: 100%;
    position: relative;
    height: 100vh;
    color: #fafafb;
    z-index: 9;
    overflow: hidden;
}

/* Navbar */

.navbar {
    padding-top: 2.5em;
    height: 100%;
    box-shadow: 6px 2px 13px 3px #000000;
    display: flex;
}

.navbar .navbar-nav {
    display: flex;
    flex-direction: column;
    align-items: center;
    width: 100%;
    height: 100%;
    margin: 0;
    padding: 0;
}

.side_menu_list{
    margin-left: 10px !important;
}

.navbar .navbar-nav .nav-item {
    height: 4em;
    margin-bottom: 0.5em;
    width: 105%;
    display: -webkit-box;
    padding: 5px;
    border: 4px solid transparent;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.navbar .navbar-nav .nav-item.focused {
    background: rgba(50, 178, 188, 0.4);
    box-shadow: 0 0 20px rgba(50, 178, 188, 0.376);
    border: 4px solid #32b2bc;
}

navbar .navbar-nav .nav-item.focused img{
    width: 3em;
    height: 3em;
}

.navbar .logo-wrapper {
    width: auto;
    height: 10em;
    margin-bottom: 2em;
    margin-left: 0;
}

.navbar .logo-wrapper .logo {
    width: 86.9px;
    height: 51.4px;
    object-fit: contain;
}

.navbar .navbar-nav .nav-item > img {
    width: 30px;
    height: 30px;
    margin: 0.5em 2em 0 1em;
}

.navbar .navbar-nav .nav-item > span{
    font-size: 2.2em;
    margin-left: 0.5em;
    font-family: Catamaran;
    margin-top: 0.6em;
}

.navbar .navbar-nav .nav-item.selected > span {
    color: #fafafb;
}

.navbar .navbar-nav .nav-item.home > img {
    content:url('../images/home_icon.svg');
}

.navbar .navbar-nav .nav-item.home.selected > img{
    content:url('../images/home_active_icon.svg');
}

.navbar .navbar-nav .nav-item.search > img{
    content: url('../images/search_icon.svg');
}

.navbar .navbar-nav .nav-item.search.selected > img {
    content: url('../images/search_active_icon.svg');
}

.navbar .navbar-nav .nav-item.movie > img {
    content: url('../images/3.svg');
}

.navbar .navbar-nav .nav-item.movie.selected > img {
    content: url('../images/3_active.svg');
}

.navbar .navbar-nav .nav-item.series > img {
    content: url('../images/4.svg');
}

.navbar .navbar-nav .nav-item.series.selected > img {
    content: url('../images/4_active.svg');
}

.navbar .navbar-nav .nav-item.channel > img {
    content: url('../images/5.svg');
    width: 30px !important;
    height: 30px !important;
}

.navbar .navbar-nav .nav-item.channel.selected > img {
    content: url('../images/5_active.svg');
    width: 3.1em !important;
    height: 3.1em !important;
    margin: 0em 1.8em 0 0.5em;
}

.navbar .navbar-nav .nav-item.channel.selected > span {
    margin-left: 0.2em;
}

.navbar .navbar-nav .nav-item.favorite > img {
    content: url('../images/mylist_icon.svg');
}

.navbar .navbar-nav .nav-item.favorite.selected > img {
    content: url('../images/mylist_active_icon.svg');
}

.navbar .navbar-nav .nav-item.profile {
    margin-top: 10em;
}

.navbar .navbar-nav .nav-item.profile > img {
    content: url('../images/myacc_icon.svg');
}

.navbar .navbar-nav .nav-item.profile.selected > img {
    content: url('../images/myacc_active_icon.svg');
}

.navbar .navbar-nav .nav-item.help > img {
    content: url('../images/8.svg');
}

.navbar .navbar-nav .nav-item.help.selected > img {
    content: url('../images/8_active.svg');
}

.top-sec {
    position: fixed;
    width: 100%;
    top: 0;
    height: 40rem;
    z-index: 21;
    padding-left: 10%;
    margin-top: 0;
    color: #fafafb;
    display: flex;
    flex-direction: row;
}

.bottom-sec {
    position: fixed;
    width: 100%;
    height: 26rem;
    z-index: 23;
    bottom: 0;
    left: 0;
    padding-left: 10%;
}

.img-sec {
    width: 64em;
    height: 38em;
    position: absolute;
    right: 0;
}

.img-sec .posterImg,.img-sec .posterImg1 {
    width: 64em;
    height: 38em;
}

.img-sec .overlay {
    width: 100%;
    height: 39em;
    position: absolute;
    left: -1px;
    bottom: -2px;
    background: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, #0e1e23  100%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 70%, #0e1e23  100%);
}
.detail-sec {
    width: 73%;
    float: left;
    display: flex;
    align-items: center;
}

.detail-sec .detail-info {
    position: relative;
    top: 0;
    left: 0;
}

.detail-sec .strip-sec {
    position: absolute;
    left: 0;
    top: 0;
    width: 60em;
    height: 60em;
    background-image: url('../images/brandng_asts.webp');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    z-index: 2;
}

.detail-sec .strip-sec .content-title {
    font-size: 3.7em;
    color: #fafafb;
    font-weight: bold;
    margin-top: 3.8em;
    margin-left: 4em;
    width: 10em;
    margin-bottom: 1em;
    text-align: left;
    line-height: 1.3;
    height: 2.4em;
    overflow: hidden;
    text-overflow: ellipsis;
}

.detail-sec .strip-sec .content-detail {
    font-size: 22px;
    color: #fafafb;
    font-weight: normal;
    display: flex;
    flex-direction: column;
    width: 30em;
    margin-left: 14.5em;
    font-family:Catamaran-Regular;
}

.detail-sec .strip-sec .content-detail .content-desc {
    max-width: 30em;
    font-size: 1.3em;
    margin-bottom: 1em;
    display: flex;
    flex-direction: row;
}

.detail-sec .strip-sec .content-detail .content-desc img {
    height: 2em;
    width: 2em;
    margin-right: 0.2em;
    margin-top: -0.5em;
}

.detail-sec .strip-sec .content-detail .content-desc .content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: normal;
}

.detail-sec .strip-sec .content-detail .content-genre {
    font-size: 1em;
    color: #fafafb;
    font-weight: bold;
    display: flex;
    flex-direction: column;
    width: 28em;
    margin-left: 20em;
}

.detail-sec .strip-sec .episode-btn {
    font-size: 1.3em;
    color: #fafafb;
    margin-left: 15em;
    margin-top: 2em;
    margin-bottom: 2em;
    border: 4px solid #32b2bc;
    padding: 15px 15px 15px 15px;
    display: inline-block;
}

.detail-sec .strip-sec .episode-btn.focused {
    background: rgba(50, 178, 188, 0.4);
    box-shadow: 0px 0px 10px rgba(50, 178, 188, 0.376);
}

.detail-sec .strip-sec .watch-now-section {
    margin-left: 19.5em;
    display: flex;
    flex-direction: row;
    height: 4.37em;
}

.detail-sec .strip-sec .watch-now-section .watch-now-btn {
    font-size: 1.7em;
    color: #fafafb;
    border: 4px solid #fafafb;
    padding: 20px 20px 20px 20px;
    margin-right: 2em;
}

.detail-sec .strip-sec .watch-now-section .watch-now-btn.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 4px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}

.detail-sec .strip-sec .watch-now-section .info-btn {
    font-size: 1.7em;
    border: 4px solid #fafafb;
    background: url('../images/info.svg') no-repeat center;
    background-size: cover;
    width: 2.5em;
    margin-right: 1em;
}

.detail-sec .strip-sec .watch-now-section .info-btn.focused {
    background-color: rgba(50, 178, 188, 0.4);
    box-shadow: 0px 0px 10px rgba(50, 178, 188, 0.376);
    border: 4px solid #32b2bc;
}

.detail-sec .strip-sec .watch-now-section .watch-list-btn {
    font-size: 1.7em;
    border: 4px solid #fafafb;
    background-image: url('../images/mylist_icon.svg');
    background-position: center;
    background-repeat: no-repeat;
    background-size: 50%;
    width: 2.5em;

}

.detail-sec .strip-sec .watch-now-section .watch-list-btn.focused {
    background-color: rgba(50, 178, 188, 0.4);
    box-shadow: 0 0 10px rgba(50, 178, 188, 0.376);
    border: 4px solid #32b2bc;
}

.detail-sec .strip-sec .watch-now-section .watch-list-btn.active {
    border: 4px solid #32b2bc;
}

.dtls-sec {
    width: 77rem;
    float: left;
    display: flex;
    align-items: center;
}

.dtls-sec div .title {
    position: relative;
    font-family: Catamaran;
    line-height: 40px;
    align-items: center;
    text-transform: uppercase;
    color: var(--background_font_color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: bold;
    font-style: normal;
    font-weight: 700;
    font-size: 64px;
    line-height: 56px;
    align-items: center;
    text-transform: uppercase;
}

.dtls-sec div .subTitle {
    align-items: center;
    color: var(--background_font_color);
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 32px;
    line-height: 48px;
    display: flex;
}

.dtls-sec div .contentdescription {
    margin-bottom: 0;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--background_font_color);
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 30px;
    display: flex;
    align-items: center;
    display: block;
    display: -webkit-box;
}

#viewDtlsBtn .focused {
    background: var(--button-focused-color);
    border-radius: 23px;
    font-weight: 700;
    color: var(--button-focused-font-color);
    box-shadow: var(--button-active-boxshadow);
    letter-spacing: 2px;
    height: 66px;
    border-radius: 100px;
    letter-spacing: 0px;
    font-family: Catamaran;
    font-size: 28px;
}

.watch-action {
    position: relative;
    height: 66px;
    margin-right: 20px;
    background: var(--button-unfocused-color);
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 30px;
    color: var(--button-unfocused-font-color);
    text-align: center;
    border-radius: 100px;
    padding: 0 24px;
}

.carousel-indicators {
    top: 31rem;
}

.carousel-indicators .active {
    opacity: 1;
    background-color: var(--button-focused-color);
    border-top: 10px solid transparent;
    border-bottom: 10px solid transparent;
}

/* card section */

.row-header {
    font-family: Catamaran;
    font-style: normal;
    font-weight: bold;
    font-size: 28px;
    line-height: 42px;
}

.homepagecontent_div {
    width: 100%;
    float: left;
    display: inline-flex;
    overflow: hidden;
    padding-left: 0;
    touch-action: none;
    user-select: none;
    -webkit-user-drag: none;
    -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
    transform: translate3d(0px, 0px, 0px);
    transition: transform 0.5s ease-out;
    border: 4px solid transparent;
}

.customsec {
    background-size: cover;
    border: 4px solid transparent;
    padding: 0px;
    margin: 11px 11px;
    margin-right: 2px;
    box-sizing: border-box;
    opacity: 1;
    height: 210px;
    width: 356.2px;
    min-width: 356.2px;
}

.customCard {
    height: 201px;
    overflow: hidden;
}

.customcard-body {
    height: 205px !important;
    padding: 7px;
    position: relative;
}

.cardsection:hover .contenttitle {
    display: none;
}

.homepagecontent_div .focused,
.searchcontent_div .focused {
    opacity: 1.6;
    z-index: 100;
    border: 4px solid #32b2bc;
}

.cardsection.focused .customcard-body{
    height: 205px !important;
    background: rgba(50, 178, 188, 0.376);
}

.cardsection.focused .customCardforLive .customcardLive-body {
    background: rgba(50, 178, 188, 0.376);   
    padding: 1px 2px 3px 2px;
}

.customsecLive.focused .customCardforLive .customcardLive-body {
    background: rgba(50, 178, 188, 0.376);
}

.cardsection.focused .customcard-body .img-class{
    background: rgba(50, 178, 188, 0.376) 0 0 no-repeat padding-box;
    box-shadow: 0 0 20px rgba(50, 178, 188, 0.376);
}
.cardsection.focused .customcard-bodyLive .img-classforlive{
    background: rgba(50, 178, 188, 0.376) 0 0 no-repeat padding-box;
    box-shadow: 0 0 20px rgba(50, 178, 188, 0.376);
}


.customcard-body .new-icon{
    position: absolute;
    height: 4em;
    width: 6em;
    right: -16px;
    top: 7em;
}

.focused .customcard-body::before {
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background: #000000bd;
    background: linear-gradient(0deg, #000000, rgba(0, 0, 0, 0) 0%);
}

.img-class {
    height: 187px;
    width: 332px;
}
.seeAll_img{
    width: 309px;
}
.cardsection.focused .customcard-body .img-class.seeAll_img{
    width: 309px;
}
.cardsection.focused .customcard-body .img-class.seeAll_img, .focused .continue_seeAll {
    height: 186px !important;
}
.viewDetails {
    font-size: 20px;
    font-weight: 800;
    color: #fafafb;
    position: absolute;
    left: 18px;
    right: 0;
    bottom: 5em;
    top: initial;
    text-align: center;
    display: none;
}

.focused .viewDetails {
    display: none;
}

.contenttitle {
    font-size: 20px;
    font-weight: 800;
    color: #fafafb;
    position: absolute;
    left: 8px;
    right: 0px;
    bottom: 30px;
    top: initial;
    text-align: left;
    margin: 0;
    height: 25px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 96%;
    z-index: 99;
}

.focused .contenttitle {
    display: none;
}

.focused .contenttitleshort {
    display: none;
}

.contenttitleshort {
    font-size: 14px;
    font-weight: 400;
    color: #fafafb;
    position: absolute;
    left: 8px;
    right: 0;
    bottom: 8px;
    top: initial;
    text-align: left;
    margin: 0;
    height: 25px;
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    width: 96%;
    z-index: 99;
}

.carousel-item img {
    width: 100%;
    height: 100vh;
}

.cardsection .viewall {
    display: -webkit-box;
    text-align: center;
    margin-left: auto;
    font-size: 24px;
    margin-right: auto;
    font-weight: 800;
    color: #fafafb;
    width: 90%;
    top: -66%;
    position: relative;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
    line-height: 1.4;
}

.customCardforLive {
    overflow: hidden;
    height: 100%;
    width: 100%;
}

.focused .customCardforLive .viewall {
    display: -webkit-box;
}

.customCardforLive .viewall {
    position: relative;
    display: -webkit-box;
    text-align: center;
    margin-left: auto;
    font-size: 24px;
    margin-right: auto;
    font-weight: 800;
    color: #fafafb;
    width: 90%;
    top: -65%;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.titleheader {
    font-family: Catamaran;
    font-style: normal;
    font-weight: bold;
    font-size: 36px;
    color: #fafafb;

    font-stretch: normal;
    font-style: normal;
    line-height: 1.28;
    letter-spacing: normal;
    text-align: left;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Login Page */

.search_screen_holder {
    width: 120em;
    height: 68em;
}


.keyboard .focused .anchortext {
    color: var(--background-font-color);
    width: 89px;
    height: 82px;
    margin-left: 1px;
    margin-bottom: 16px;
    margin-top: 0px;
    background: var(--button-focused-color);
    position: relative;
    display: block;
}


.focused svg g {
    fill: var(--background-font-color) !important;
}

/* Profile Page */

.maindetailscon {
    width: 100%;
    margin: 0 auto;
    margin-top: 111px;
}

.profileimage {
    float: left;
    width: 40%;
    text-align: right;
}

.profiledata {
    padding-left: 191px;
}

.buttoncard {
    padding: 0;
    position: relative;
    margin-top: 10px;
    padding: 40px 0px 0px 191px;
}

#buttoncard .focused {
    background: var(--button-focused-color);
    color: var(--button-focused-font-color);
    box-shadow: 0 0 30px rgb(255 255 255 / 36%);
    box-shadow: var(--card-active-boxshadow);
    outline: none;
    background-color: rgba(50, 178, 188, 0.4);
    box-shadow: 0px 0px 10px rgba(50, 178, 188, 0.376);
    border: 4px solid #32b2bc  !important;
}

.profilepagebutton {
    position: relative;
    height: 60px !important;
    margin: 20px 19px 0px 0px;
    background: none;
    font-style: normal;
    text-align: center;
    padding: 12px 28px;
    letter-spacing: 2px;
    border: 4px solid #FFFFFF !important;
    object-fit: contain;
    font-family: Catamaran;
    font-size: 24px;
    font-weight: normal;
    font-stretch: normal;
    line-height: 1;
    letter-spacing: normal;
    color: var(--white-primary);
}

.blue-btn {
    border: none;
}

.profileimg {
    border-radius: 50%;
    border: 6px solid white;
    margin: 80px 0;
    width: 225.74px;
    height: 225.74px;
}


.profileTitle {
  height: 46px;
  margin: 33px 77px 12px 0;
  object-fit: contain;
  font-family: Catamaran;
  font-size: 28px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.29;
  letter-spacing: normal;
  text-align: left;
  color: #fafafb;
}

.profileDetails,
.subscriptionDetails .subscribedUser span, .voucherUser span,
.subscriptionDetails .unsubscribedUser {
  font-family: Catamaran;
  font-size: 22px;
  font-weight: normal;
  font-stretch: normal;
  font-style: normal;
  line-height: 1.36;
  letter-spacing: normal;
  text-align: left;
}

.userDiv {
    z-index: 99999;
    position: relative;
    height:100%;
}


.msgWithImg {
    width: 50%;
    left: 28%;
    position: absolute;
    top: 39%;
    text-align: center;
    z-index: 10;
}

.msgWithImg p .fa {
    font-size: 98px;
}

.msgWithImg .msg {
    font-size: 45px;
    line-height: 100px;
}

.msgWithImg .icon {
    margin-bottom: 67px;
}

.listing .bannersmall {
    display: flex;
    flex-direction: row;
    padding: 0px;
    position: fixed;
    width: 100%;
    top: 41px;
    z-index: 999;
    padding-left: 11%;
}

.listing .bannersmall img {
    position: static;
    width: 219px;
    height: 321px;
    left: 0;
    top: 0;
    flex: none;
    order: 0;
    align-self: flex-start;
    margin: 0 0;
    background: #1c262d;
    transition: background 0.6s linear;
}

.listing .bannersmall .topcontent {
    display: flex;
    flex-direction: column;
    flex: none;
    order: 1;
    width: 48%;
    margin: auto 47px;
}

.bannersmall .topcontent .title {
    position: relative;
    font-family: Catamaran-Bold;
    align-items: center;
    text-transform: uppercase;
    color: var(--background_font_color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-style: normal;
    font-weight: bold;
    font-size: 64px;
    line-height: 61px;
}

.bannersmall .topcontent .subTitle {
    align-items: center;
    color: var(--background_font_color);
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 32px;
    line-height: 48px;
    display: flex;
}

.bannersmall .topcontent .seasons {
    position: static;
    left: 0;
    right: 63.54%;
    top: 0;
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 27px;
    line-height: 53px;
    align-items: center;
    color: var(--background_font_color);
}


.bannersmall .topcontent .contentdescription {
    margin-bottom: 0;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--background_font_color);
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 36px;
    align-items: center;
    display: -webkit-box;
}

.container-fluid .list-container {
    padding-left: 10%;
    position: fixed;
    top: 53%;
    z-index: 99;
    width: 100%;
}
.list-container.live-details {
    top: 60%;
}

/* Continue Watch */

.customList {
    display: block !important;
}

.customList .customsec {
    width: 327.29px;
    float: left;
    min-width: 320px;
    height: 209px;
    overflow: hidden;
}

.customList .cardsection.focused .customcard-body .img-class,
.customList .cardsection .customcard-body .img-class{
    width: 305px;
}

/* Live Channel */


.listing .rightTopseclive {
    position: relative;
    display: flex;
    flex-direction: row;
    padding: 0;
    width: 89%;
    height: 34em;
    left: 11%;
    top: 0;
    z-index: 99;
}

.listing .rightTopseclive .onair{
    width: auto;
    height: 3.5em;
    margin-left: 4.5em;
}
.listing .rightTopseclive .tag-line{
    width: auto;
    font-size: 1.3em;
    z-index: 9;
    margin:1em 1.5em 3em 4.5em;
}
.listing .rightTopseclive .watch-now-section {
    margin-left: 6em;
    display: flex;
    flex-direction: row;
    height: 4.37em;
    margin-top: 2.5em;
}

.listing .rightTopseclive .watch-now-section .watch-now-btn {
    color: #fafafb;
    border: 3px solid #fafafb;
    margin-right: 2em;
    width: auto;
    max-height: 60px;
    height: auto;
    padding: 12px 38px 9px 38px;
    font-size: 30px;
    font: normal normal normal 24px/36px Catamaran;
}

.listing .rightTopseclive .watch-now-btn.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}

.listing .rightTopseclive .watch-now-section .info-btn {
    font-size: 1.3em;
    border: 3px solid #fafafb;
    background: url('../images/info.svg') no-repeat center;
    background-size: cover;
    margin-right: 1em;
    width: 56px;
    height: 56px;
}

.listing .rightTopseclive .watch-now-section .info-btn.focused {
    background-color: rgba(50, 178, 188, 0.4);
    box-shadow: 0 0 10px rgba(50, 178, 188, 0.376);
    border: 4px solid #32b2bc;
}

.listing .rightTopseclive .iconImg {
    height: 260px;
    align-self: center;
    filter: saturate(1.3);
    margin-top: 4em;
    width: 430px;
}

.listing .rightTopseclive .posterImg,.listing .rightTopseclive .posterImg1 {
    width: 454px;
    height: 302px;
    left: 0;
    top: 10px;
    flex: none;
    order: 0;
    align-self: center;
    margin: 0;
    filter: saturate(1.3);
}

.listing .rightTopseclive .img-sec {
    width: 64em;
    height: 38em;
    position: absolute;
    right: 0;
}

.listing .rightTopseclive .img-sec .posterImg, .listing .rightTopseclive .img-sec .posterImg1 {
    width: 64em;
    height: 38em;
}

.listing .rightTopseclive .img-sec .overlay {
    width: 100%;
    height: 39em;
    position: absolute;
    left: -2px;
    bottom: -2px;
    background: linear-gradient(to left, rgba(0, 0, 0, 0) 0%, #0e1e23  100%), linear-gradient(to bottom, rgba(0, 0, 0, 0) 70%, #0e1e23  100%);
}

.listing .rightTopseclive .topcontent {
    width: 85%;
    margin-top: 40px;
    padding-left: 2em;
}

.listing .rightTopseclive .topcontent .title {
    position: relative;
    font-family: Catamaran;
    line-height: 40px;
    align-items: center;
    color: var(--background_font_color);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: bold;
    font-style: normal;
    font-weight: bold;
    font-size: 64px;
    line-height: 61px;
    align-items: center;
    text-transform: uppercase;
}

.listing .rightTopseclive .topcontent .subTitle {
    align-items: center;
    color: var(--background_font_color);
    text-overflow: ellipsis;
    overflow: hidden;
    white-space: nowrap;
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 32px;
    line-height: 48px;
    display: flex;
}

.listing .rightTopseclive .topcontent .seasons {
    position: static;
    left: 0%;
    right: 63.54%;
    top: 0px;
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 27px;
    line-height: 53px;
    align-items: center;
    color: var(--background_font_color);
}

.listing .rightTopseclive .topcontent .contentdescription {
    margin-bottom: 0;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    color: var(--background_font_color);
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 20px;
    line-height: 36px;
    display: flex;
    align-items: center;
    display: block;
    display: -webkit-box;
}

.customsecLive {
    background-size: cover;
    padding: 0;
    margin: 11px;
    border: 2px solid #6c757d40;
    box-sizing: border-box;
    opacity: 1.6;
    overflow: hidden;
    width: 25em;
    height: 15em;
}

.customcardBodyLive {
    background: rgba(50, 178, 188, 0.376);
    flex: 1 1 auto;
    padding: 0;
    position: relative;
    width: 25em;
    height: 15em;
}

.img-classforlivechannel {
    width: 100%;
    height: 100%;
}

.customsecLive.focused .img-classforlivechannel{
    width: 94%;
    height: 90%;
    margin-left: 2%;
    margin-top: 2%;
    background: #32b2bc  0 0 no-repeat padding-box;
    box-shadow: 0 0 20px rgba(50, 178, 188, 0.376);
}


.focused .customCardLive .viewDetails {
    font-size: 25px;
    font-weight: 800;
    color: #fafafb;
    position: absolute;
    left: 4px;
    right: 0;
    bottom: 9em;
    top: initial;
    text-align: center;
}

.customCardLive .viewDetails {
    font-size: 20px;
    font-weight: 800;
    color: #fafafb;
    position: absolute;
    left: 4px;
    right: 0;
    bottom: 5em;
    top: initial;
    text-align: center;
}

.customCardLive {
    overflow: hidden;
}

.continueseek {
    background: #32b2bc;
    height: 5px;
    /* position: absolute; */ /* fix for continue seek position issue for lg 1280 resolution*/
    bottom: 5px;
}

/* Profile Inner */

.page_header {
    position: relative;
    margin-left: 13%;
    padding-top: 4%;
    z-index: 99999;
}

.page_title {
    font-family: Catamaran;
    font-style: normal;
    font-weight: bold;
    font-size: 48px;
    line-height: 72px;
    margin-bottom: 49px;
    padding-top: 31px;
}

.page_data {
    overflow: hidden;
    margin-left: 13%;
    z-index: 99;
    position: relative;
}

.page_inner_text {
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 28px;
    line-height: 42px;
    padding-top: 0%;
    transition: transform 0.5s ease-out;
}

.page_inner_text p span span span {
    color: #FFFFFF !important;
}

.page_inner_text ol li span strong {
    font-size: 34px !important;
}

.page_inner_text p span, .page_inner_text  span  {
    font-size: 28px !important;
}

/* Language page */

.right-sec-inner {
    position: relative;
    z-index: 99;
    padding-left: 10%;
    width: 100%;
}

.language_listing_sec {
    margin-top: 29%;
    margin-left: 18%;
}

.lang_title {
    float: left;
    font-size: 47px;
    font-weight: bolder;
    text-shadow: 1px 1px #fafafb;
}

.lang_list {
    float: left;
    margin-top: 19px;
    margin-left: 110px;
    transition: transform 0.5s ease-out;
}

.lang_list li {
    font-size: 45px;
    list-style: none;
    height: 79px;
}

.lang_list li.focused {
    color: var(--button-focused-color);
    font-weight: 800;
    text-shadow: 2px 2px;
}

.modal-content {
    height: 318px;
    border-radius: 33px;
    background: rgba(255, 255, 255, 1);
}

.alert-title {
    color: #fafafb;
    text-align: center;
    font-family: Catamaran;
    font-style: normal;
    font-weight: bold;
    font-size: 48px;
    line-height: 72px;
}

.alert-desc {
    color: #000;
    margin-bottom: 28px;
    padding: 7px 10px;
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 29px;
    line-height: 43px;
    text-align: center;
}

.modal {
    z-index: 99999;
}

.fieldsblanks {
    margin: 0 auto;
    margin-top: 47px;
    width: 780px;
    text-align: center;
    height: 3em;
}

.fieldsblanks p {
    font-size: 23px;
}

.channelsViewAll {
    display: flex;
    align-items: center;
    text-align: center;
    justify-content: center;
}

.channelsPlusIcon {
    left: 6% !important;
    top: 10px !important;
}

.customcard-bodyLive {
    display: block;
    align-items: center;
    width: 100%;
    height: 100%;
    position: relative;
}
.customcard-bodyLive .img-classforlive{
    width: 96%;
    height: 94%;
    margin-left: 2%;
    margin-top: 2%;
}

.customsecLive.focused .img-classforlive{
    width: 96%;
    height: 94%;
    margin-left: 2%;
    margin-top: 2%;
    background: #32b2bc  0 0 no-repeat padding-box;
    box-shadow: 0 0 20px rgba(50, 178, 188, 0.376);
}

#seasons {
    font-size: 24px;
    line-height: 30px;
}

.plus_icon {
    position: relative;
    left: 42%;
    top: -148px;
}

.empty_img {
    width: 136px;
    margin-bottom: 38px;
}

/* welcome screen */
.welcome-container {
    position: relative;
    left: 0;
    top: 0;
    margin: 0;
    padding: 0;
    background-position: center;
    background-size: cover;
    width: 120em;
    height: 68em;
    display: flex;
    flex-direction: column;
    justify-content: center;
}
.welcome-container .welcome-strip{
    background-image: url("../images/inch_scr_brandg_asts.svg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    width: 100%;
    height: 100%;
    position:absolute;
    top: 0;
    left: 0;
}

.welcome-container .language {
    position: absolute;
    top: 50px !important;
}

.lang_expanded .language{
    right: 50px;
    top: 70px !important;
}
.login_page.lang_expanded .onboard-menu-list-wrapper .language{
    margin-top: 0px;
}

.slider-wrapper {
    height: auto;
    width: 100%;
    position: relative;
    top: 8em;
}

.slide-image-container {
    width: 54em;
    height: 37em;
    background-position: center;
    background-size: cover;
    position: relative;
    bottom: 6em;
    left: 33em;
}

.slide-collection-image {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    height: 37em;
    width: 100%;
    position: relative;
    bottom: 10em;
    display: none;
}

.slide-collection-image .item {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-right: 5em;
}

.slide-collection-image .item img {
    height: 15em;
    width: 15em;
    margin-bottom: 2em;
}

.slide-collection-image .item span {
    font-size: 2em;
}

.page-indicator {
    position: relative;
    bottom: 2em;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 2em;
    left: 1em;
    display: none;
}


.page-indicator .indicator {
    width: 1em;
    height: 1em;
    background-color: #fafafb;
    margin-right: 1em;
    border: none;
    margin-top: 0.5em;
}

.page-indicator .indicator.active {
    width: 1.5em !important;
    height: 1.5em !important;
    background-color: #32b2bc !important;
    outline: 1px solid #fafafb;
    outline-offset: 4px;
}

.heading {
    text-align: center;
    letter-spacing: 0px;
    color: #fafafb;
    opacity: 1;
    font-size: 3em;
    font-style: normal;
    font-weight: bold;
    word-spacing: 0.20em;
    font-family: Catamaran;
    position: relative;
    bottom: 1em;
}

.sub-heading {
    text-align: center;
    letter-spacing: 0px;
    color: #fafafb;
    opacity: 1;
    font-size: 1.7em;
    font-style: normal;
    font-weight: normal;
    font-family: Catamaran;
    margin-top: 1em;
    position: relative;
    bottom: 1.5em;
}

.child-sub-heading {
    text-align: center;
    letter-spacing: 0px;
    color: #fafafb;
    opacity: 1;
    font-size: 1.4em;
    font-style: normal;
    font-weight: normal;
    font-family: Catamaran;
    margin-top: 1em;
    position: relative;
    bottom: 2.2em;
}

.slider-button {
    position: relative;
    bottom: 1em;
    left: 25em;
    width: 11em;
    height: 2em;
    font: var(--unnamed-font-style-normal) normal var(--unnamed-font-weight-medium) 20px/var(--unnamed-line-spacing-24) var(--unnamed-font-family-catamaran);
    color: var(--white-primary);
    text-align: center;
    font-weight: normal;
    font-style: normal;
    letter-spacing: 0.6px;
    color: #fafafb;
    background: var(--red-primary) 0 0 no-repeat padding-box;
    background: transparent 0% 0% no-repeat padding-box;
    box-shadow: 0px 0px 20px none;
    border: 2px solid #707070;
    opacity: 1;
    font-size: 2em;
    outline: none !important;
}

.slider-button.focused {
    background: #32b2bc  0% 0% no-repeat padding-box;
    box-shadow: 0px 0px 20px rgba(50, 178, 188, 0.376);
    border: none;
}

/* New login page */

.main {
    width: 120em;
    height: 67.5em;
    background-image: url(../images/auth_bg_img.webp);
    overflow: hidden;
    background-size: cover;
}

.main .main-strip {
    position: relative;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background-image: url(../images/auth_brandng_asts.webp);
    overflow: hidden;
    background-size: cover;
}

.main .main-overlay {
    position: relative;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    overflow: hidden;
    background-size: cover;
    background: linear-gradient(289.8deg, #0e1e23 0.19%, #0e1e23 38.78%, #0e1e23 92.72%);
}

.header {
    z-index: 9;
    width: 100%;
    height: 8em;
    background-color: rgba(14, 30, 35, 1);
    display: flex;
    align-items: center;
    position: relative;
}

.header .back {
    color: #fafafb;
    text-decoration: none;
    font-size: 2.5em;
    margin-left: 50px;
    padding: 0.4em 0.6em 0.4em 0.3em;
    font-weight: bold;
}

.header .back > img {
    position: relative;
    height: 1.2em;
    left: 0;
    top: -3px;
    margin: 0 auto;
    transform: rotate(89deg);
}

.header span.focused {
    background: #32b2bc;
    box-shadow: 0px 0px 20px rgba(50, 178, 188, 0.376);
}

.header .logo {
    position: relative;
    left: -6em;
    height: 6em;
    margin: 0 auto;
}

.language {
    color: #fafafb;
    margin-right: 50px;
    position: absolute;
    right: 0;
}

.middle-container {
    display: flex;
    flex-direction: row;
    padding: 50px;

}

.middle-content {
    z-index: 1;
    width: 60%;
    display: inline-block;
    color: #fafafb;
    padding-top: 3em;
}

.linking-device {
    z-index: 1;
    width: 40%;
    display: flex;
    flex-direction: column;
}

#line1 {
    font-size: 3em;
    font-weight: 500;
    line-height: 0.8;
}

#line2 {
    font-size: 2.1em;
    padding: 1em 0 0 0;
    line-height: 0.5;
}

#line3 {
    font-size: 1.4em;
    padding: 1em 0 0 0;
    line-height: 1;
}

#line4, #line5, #line6 {
    font-size: 2.1em;
    padding: 1em 0 0 0;
    line-height: 1;
}

.middle-content img {
    padding-top: 30px;
    height: 23em;
    width: 23em;
    border: 0;
}

.lang {
    font-weight: bold;
    color: #fafafb;
    font-size: 36px;
    padding: 0.62em;
    cursor: pointer;
    position: relative;
    margin-bottom: 0;
    text-decoration: underline;
    font-family: Catamaran;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 0.67;
    letter-spacing: normal;
}

.lang.focused {
    width: auto;
    height: 2em !important;
    background-color: #32b2bc !important;
    box-shadow: 0px 0px 20px rgba(50, 178, 188, 0.376);
}

ul.select {
    margin: 0;
    padding: 0;
    display: none;
    position: absolute;
    right: -0.5em;
    font-size: 2em;
    top: 2.5em;
    z-index: 99;
}

ul.select > li {
    text-align: right;
    font-size: 0.8em;
    padding: 0.5em;
    cursor: pointer;
    list-style-type: none;
    margin-left: 5px;
    color: #fafafb;
    text-decoration: none;
    flex-direction: row;
    justify-content: flex-end;
    font-weight: normal;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
}

ul.select > li > img {
    margin-right: 1em;
    position: relative;
    height: 1em;
    width: 1em;
    top: 0em;
    left: 0.5em;
}

ul.select > li > span {
    font-size: 1em;
    margin-left: 0 !important;
    text-shadow: 2px 2px 5px rgba(0,0,0,0.8);
}

 ul.select > li.focused {
    background: rgba(50, 178, 188, 0.4);
    border: 2px solid #32b2bc;
}

.search_result_holder .new_auth {
    background-color: transparent;
}

.keyboard .key_row {
    width: 83%;
    background: #191919;
}


.linking-device .fieldsblanks {
    height: 2.37em;
}


* {
    outline: none;
}

/*------New search page css start */

.right-sec .strip-sec {
    position: absolute;
    left: 0;
    top: 0;
    width: 65em;
    height: 75em;
    display: inline-block;
    background: url(../images/brandng_asts.webp), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0,0,0,0.5) 100%);
    background-repeat: no-repeat;
    background-size: 90%;
}


.right-sec .search-result-section {
    position: absolute;
    top: 0;
    left: 8%;
    width: 90%;
    height: 100%;
}

.right-sec .search-result-section .top-sec {
    width: 100%;
    height: 140px;
    position: relative;
    left: 0;
    top: 67px;
    display: flex;
    flex-direction: row;
    padding: 0;
}

.right-sec .search-result-section .top-sec .search-icon {
    width: 6em;
    height: 6em;
    border: 4px solid #fafafb;
    background-size: 50%;
    background: url(../images/search_icon.svg) no-repeat center;
    position: absolute;
    bottom: 1em;
    left: 0;
}

.right-sec .search-result-section .top-sec .search-icon.focused {
    background-size: 50%;
    border: 4px solid #32b2bc;
    background: rgba(50, 178, 188, 0.4) url(../images/search_icon.svg) no-repeat center;
}

.right-sec .search-result-section .top-sec .search-field {
    width: 95%;
    min-height: 2.3em;
    border: 4px solid #fafafb;
    position: absolute;
    bottom: 0.4em;
    left: 1em;
    text-align: left;
    font-size: 42px;
    display: flex;
    padding-left: 1em;
    padding-right: 1em;
    align-items: center;
    box-sizing: border-box;
    height: auto;
    line-height: 34px;
    overflow: hidden;
    white-space: nowrap;
    background-color: rgba(14, 30, 35, 1);
    color: #fafafb;
}

.right-sec .search-result-section .bottom-sec {
    width: 100%;
    height: 80%;
    position: relative;
    left: 0;
    top: 54px;
    overflow: hidden;
    padding-left: 0;
}

.right-sec .search-result-section .bottom-sec .list-container {
       width:600px;
        height:700px
    }

.right-sec .search-result-section .bottom-sec .no-result {
    margin-top: 1em;
    font-size: 28px;
    margin-left: 2em;
    margin-bottom: 1.5em;
    color: #32b2bc;
    word-break: break-all;
    margin-right: 0.5em;
}

.right-sec .search-result-section .bottom-sec .sug-text {
    margin-top: 1em;
    font-size: 32px;
    margin-left: 1.7em;
    margin-bottom: 1.5em;
    color: #fafafb;
}

.right-sec .search-result-section .bottom-sec .list-row {
    list-style: none;
    width: 100%;
    height: 700px;
    margin-left: 3em;
    display: block;
    flex-direction: row;
    padding: 0;
    margin-bottom: 1em;
    position: relative;
}

.right-sec .search-result-section .bottom-sec .list-row .list-item {
    flex: none;
    height: 12em;
    width: 20em;
    margin-right: 1em;
    background-size: cover;
    background: none no-repeat center;
    border: 4px solid transparent;
    display: inline-block;
}

.right-sec .search-result-section .bottom-sec .list-row .list-item .img-class {
    height: 10.6em;
    width: 18.6em;
    position: relative;
    top: 0.5em;
    left: 0.5em;
    border: none;
}

.right-sec .search-result-section .bottom-sec .list-row .list-item.focused {
    background: rgba(255, 81, 81, 0.5);
    border: 4px solid #32b2bc;
}

/*------ New search page css end ---------*/

/*------ Details Page css start ----------*/
.details-page .right-sec {
    background: rgba(0,0,0, 0.5);
}
.right-sec .logo {
    position: absolute;
    top: 2em;
    left: 2em;
    height: 8em;
    width: 8em;
    background-size: contain;
    background: url(../images/app_logo.webp) no-repeat center;
}

.details-section {
    position: absolute;
    top: 0;
    left: 15%;
    width: 85%;
    height: 100%;
    display: flex;
    flex-direction: column;
}

.details-section .content-title {
    font-size: 65px;
    color: #fafafb;
    font-weight: bold;
    margin-top: 0.8em;
    width: 13em;
    margin-bottom: 1em;
    text-align: left;
    line-height: 1.25;
    height: auto;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    font-family: Catamaran;
    margin-top: 2em;
}

.details-section .content-detail {
    font-size: 1em;
    color: #fafafb;
    font-weight: bold;
    display: flex;
    flex-direction: column;
    width: 30em;
    margin-left: 5.5em;
    margin-bottom: 0.5em;
}

.details-section .content-detail .content-desc {
    max-width: 30em;
    font-size: 1.3em;
    margin-bottom: 1em;
    display: flex;
    flex-direction: row;
}

.details-section .content-detail .content-desc img {
    height: 2em;
    width: 2em;
    margin-right: 0.2em;
    margin-top: -0.5em;
}

.details-section .content-detail .content-desc .content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 20px;
    font-style: normal;
    font-weight: normal;
    font-family: Catamaran;
}

.details-section .content-detail .content-gener,
.details-section .content-detail .content-duration {
    text-align: left;
    font-size: 22px;
    font-style: normal;
    font-weight: normal;
    font-family: Catamaran;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    display: flex;
    flex-direction: column;
    width: 28em;
    margin-left: 0;
    margin-bottom: 10px;
}
.details-section .content-detail .content-gener{
    white-space: nowrap;
    margin-top: 6px;
}
.content-detail .content-gener{
    z-index: 5;
}
.details-section .content-detail .content-duration{
    margin-top: -35px;
    margin-bottom: 12px;
}
.details-section .episode-btn {
    font-size: 1.3em;
    color: #fafafb;
    margin-left: 4.5em;
    margin-top: 1em;
    margin-bottom: 1em;
    border: 4px solid #32b2bc;
    padding: 15px 15px 15px 15px;
    width: 9em;
    font-family: Catamaran;
    text-align: center;
    display: none;
}

.details-section .watch-now-section {
    margin-left: 6em;
    display: flex;
    flex-direction: row;
    margin-bottom: 2%;
}

.details-section .watch-now-section .watch-now-btn,
.details-section .watch-now-section .subscribe-to-watch, .details-section .watch-now-section .upgrade-plan, .details-section .watch-now-section .cant-watch {
    font-size: 1.7em;
    color: #fafafb;
    border: 3px solid #fafafb;
    padding: 25px 40px 20px 40px;
    margin-right: 1em;
    font-family: Catamaran;
    padding-top: 25px;
    padding-right: 40px;
    padding-bottom: 20px;
    padding-left: 40px;
}

.details-section .watch-now-section .watch-now-btn.focused,
.details-section .watch-now-section .subscribe-to-watch.focused, .details-section .watch-now-section .upgrade-plan.focused, .details-section .watch-now-section .cant-watch.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}

.details-section .watch-now-section .trailer-btn {
    font-size: 1.7em;
    border: 3px solid #fafafb;
    background: url(../images/play_icon.svg) no-repeat 22%;
    background-size: 16%;
    margin-right: 1em;
    padding: 22px 30px 21px 100px;
    display: none;
}

.details-section .watch-now-section .trailer-btn.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}


.details-section .my-list-btn.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376) !important;
}


.details-section .episodes-list-btn.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}


.details-section .audio-subtitle-btn.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}


.details-section .remove-from-continue-watch-list-btn.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}

.details-section .back-btn.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}

.details-section .sinopsis {
    width: 32em;
    margin-left: 4em;
    text-align: left;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 24px;
    font-size: 22px;
    font-style: normal;
    font-weight: normal;
    font-family: Catamaran;
    object-fit: contain;
    font-stretch: normal;
    line-height: 1.36;
    letter-spacing: normal;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}

.details-section .starring {
    font-size: 22px;
    width: 29em;
    margin-left: 4em;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    text-align: left;
    max-width: 30em;
    font-family: Catamaran;
    height: 1.5em;
    margin-bottom: 10px;
    display: none;
    overflow: hidden;
    -webkit-line-clamp: 1;
    line-clamp: 1;
    text-overflow: ellipsis;
    font-weight: normal;
    line-height: 1.5;
}

.details-section .creator {
    font-size: 22px;
    width: auto;
    margin-left: 4em;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    text-align: left;
    max-width: 30em;
    font-family: Catamaran;
    height: 2em;
    margin-bottom: 24px;
    display: none;
    overflow: hidden;
}

.right-sec .side-menu {
    position: absolute;
    top: 0;
    right: -40em;
    width: 40em;
    height: 100%;
    background: rgba(14, 30, 35, 1);
    display: flex;
    flex-direction: row;
}

.right-sec .side-menu.episode {
    width: 100vw;
    right: -100vw;
    background: rgba(14, 30, 35, 1);
}

.right-sec .side-menu .menu-border {
    width: 4.5em;
    height: 100%;
    border: 4px solid #fafafb;
    margin-right: 4%;
    display: flex;
    align-items: center;
    justify-content: center;
}

.right-sec .side-menu .menu-border.focused {
    background-color: rgba(50, 178, 188, 0.4);
    box-shadow: 0 0 10px rgba(50, 178, 188, 0.376);
    border: 4px solid #32b2bc  !important;
}

.right-sec .side-menu .menu-border .arrow {
    height: 4em;
    width: 3em;
    background-size: contain;
    background: url(../images/side_panel_arrow.svg) no-repeat center;
}

.right-sec .side-menu .menu-list-wrapper {
    position: relative;
    top: 0;
    left: 0;
    width: 35em;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: url("../images/side_panel_brandng_asts.svg") no-repeat;
    background-size: 100%;
}
.right-sec .side-menu .menu-list-wrapper.episode {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: flex-start;
    background: none;
}

.right-sec .side-menu .menu-list-wrapper .list-wrapper {
    height: auto;
    width: 28em;
    position: relative;
    top: 0;
    color: #fafafb;
    padding-top: 5em;
    margin-bottom: 2em;
}

.right-sec .side-menu .menu-list-wrapper .list-wrapper .list-header {
    text-align: right;
    font: normal normal bold 36px/46px Catamaran;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    margin-bottom: 1em;
    padding-right: 1em;
}

.right-sec .side-menu .menu-list-wrapper .list-wrapper .list {
    list-style: none;
}

.right-sec .side-menu .menu-list-wrapper .list-wrapper .list .list-item {
    text-align: right;
     font: normal normal normal 28px/60px Catamaran;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    border:2px solid transparent;
    padding-right: 1em;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.right-sec .side-menu .menu-list-wrapper .list-wrapper .list .list-item.focused {
    background-color: rgba(50, 178, 188, 0.4);
    box-shadow: 0 0 10px rgba(50, 178, 188, 0.376);
    border: 2px solid #32b2bc;
}

.right-sec .side-menu .menu-list-wrapper .sub-list-wrapper {
    padding-top: 2em;
}

.right-sec .side-menu .menu-list-wrapper .season-list {
    list-style: none;
    display: inline;
    width: 240px;
    font-size: 30px;
    overscroll-behavior-y: auto;
    overflow: hidden;
    margin-top: 80px;
    padding: 0;
    height: min-content;
}

.right-sec .side-menu .menu-list-wrapper .season-list .list-item {
    background-color: transparent;
    border: 1px solid #fafafb;
    padding: 4px 22px 4px 22px;
    margin-bottom: 24px;
    box-sizing: border-box;
    font-family: Catamaran;
    font-size: 24px;
    font-weight: 700;
    font-stretch: normal;
    font-style: normal;
    line-height: 39px;
    letter-spacing: 0.42px;
    text-align: center;
    color: #fafafb;
    width: 240px;
    height: 48px;
    border-radius: 4px;
    overflow: hidden;
}

.right-sec .side-menu .menu-list-wrapper .season-list .list-item.active {
    background: #32b2bc;
    border: 1px solid #32b2bc;
    color: #ffffff !important;
    border-radius: 4px;
    font-size: 24px;
}

.right-sec .side-menu .menu-list-wrapper .season-list .list-item.focused {
    border: 1px solid #32b2bc;
    color: #32b2bc;
    border-radius: 4px;
}
.right-sec .side-menu .menu-list-wrapper .season-list .list-item.focused.active {
    font-size: 28px;
}

.right-sec .side-menu .menu-list-wrapper .episode-list {
    list-style: none;
    font-size: 30px;
    height: 100%;
    overflow-y: hidden;
    width: 1490px;
    padding: 0;
    margin-left: 30px;
    margin-top: 80px;
}

.right-sec .side-menu .menu-list-wrapper .episode-list .list-item {
    width: 1480px;
    height: 270px;
    margin-bottom: 40px;
    font-size: 30px;
    display: flex;
    flex-direction: column;
    position: relative;
    top: 0;
}

.right-sec .side-menu .menu-list-wrapper .episode-list .list-item .image {
    border-radius: 5px;
    width: 480px;
    height: 270px;
}
.right-sec .side-menu .menu-list-wrapper .episode-list .list-item .image.focused {
    border: 4px solid #32b2bc;
}

.right-sec .side-menu .menu-list-wrapper .episode-list .list-item .watched-progress {
    width: 472px;
    height: 8px;
    background: #4D4D4D;
    display: inline-block;
    padding: 0;
    position: absolute;
    left: 4px;
    bottom: 12px;
}

.right-sec .side-menu .menu-list-wrapper .episode-list .list-item .watched-progress .progress-active {
    position: relative;
    left: 0;
    top: 0;
    width: 50%;
    height: 8px;
    background: #32b2bc;
}

.right-sec .side-menu .menu-list-wrapper .episode-list .list-item .episode-number{
 margin-top: 5px;
 font-size: 20px;
 display: inline-block;
 margin-left: 3%;
}

.right-sec .side-menu .menu-list-wrapper .episode-list .list-item .title {
    font-size: 24px;
    font-weight: 700;
    line-height: 39px;
    display: -webkit-box;
    margin-left: 24px;
    position: absolute;
    left: 33%;
    width: 750px;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.right-sec .side-menu .menu-list-wrapper .episode-list .list-item .description {
    margin-top: 12px;
    font-size: 22px;
    display: inline-block;
    margin-left: 24px;
    width: 970px;
    height: 216px;
    overflow: hidden;
    line-height: 36px;
    font-family: Catamaran;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
    color: #e5e5e5;
    position: absolute;
    top: 15%;
    left: 33%;
}


/*------ Details Page css end ----------*/


/* New css for lang in profile page */

.userDiv #lang_list li.focused {
    margin-left: 38%;
}

.profilepage_info_txt{
    width: 100%;
    height: 36px;
    margin: 10px 0;
    object-fit: contain;
    font-family: Catamaran;
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: left;
    color: #fafafb  !important;
    padding: 50px 15px 10px 191px;
  }

.logout_btn {
    margin-top: 50px;
    width: auto;
    height: auto;
}

  /* New css changes for profile inner pages */

.profile_inner.strip-sec{
    background-image: url('../images/profile_internal.webp');
    width: 110%;
    height: 100%;
    background-color:#292828a1;
    
 }
 .page_inner_text>table{
     width: 60% !important;
 }
 .page_inner_text>table,td{
     font-size: 40px !important;
 }
 .page_inner_text>table,td span{
     font-size: 28px !important;
 }

 .page_header {
    position: relative;
    margin-left: 7%;
    padding-top: 4%;
    z-index: 99999;
}

.page_title {
    font-family: Catamaran;
    font-style: normal;
    font-weight: bold;
    font-size: 48px;
    line-height: 72px;
    margin-bottom: 49px;
    padding-top: 31px;
}

.page_data {
    overflow: hidden;
    margin: 0px 4% 0px 7%;
    z-index: 99;
    position: relative;
}
.profile_hd{
    width: 154px;
    height: 36px;
    color: #999999;
    object-fit: contain;
    font-family: Catamaran;
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: left;
  }
  .profile_val{
    color: #fafafb  !important;
    margin: 12px 0px 12px 31px;
    object-fit: contain;
    font-family: Catamaran;
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: left;
    white-space: nowrap;
  }
.page_inner_text {
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    font-size: 28px;
    line-height: normal;
    padding-top: 0%;
    transition: transform 0.5s ease-out;
}

.page_inner_text p span span span {
    color: #fafafb  !important;
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    line-height: normal;
}

.page_inner_text ol li span strong {
    font-size: 34px !important;
    font-family: Catamaran;
}

.page_inner_text p, .page_inner_text p span {
    font-size: 28px !important;
    font-family: Catamaran;
    font-style: normal;
    font-weight: normal;
    line-height: normal;
    color: #fafafb  !important;
}
/* fix to avoid on click for href links  */
.page_inner_text a{
    pointer-events: none;
  }

  .userDiv .right-sec .side-menu .menu-list-wrapper .list-wrapper{
    width: 31em;
  }

  .userDiv .right-sec .side-menu .menu-list-wrapper .list-wrapper .list .list-item:hover{
    background-color: rgba(50, 178, 188, 0.4);
    box-shadow: 0 0 10px rgba(50, 178, 188, 0.376);
    border: 2px solid #32b2bc;
  }
  .Lang-side-nav .list-item span{
    font-size: 24px;
  }

  .Lang-side-nav .list-item img{
    padding-right: 20px;
  }

  /* new css for bug fixes */
  .details-section .watch-now-section .continue-watch-btn, .details-section .watch-now-section .start-over-btn, .details-section .watch-now-section .buy-or-rent{
    font-size: 1.6em;
    color: #fafafb;
    border: 3px solid #fafafb;
    padding: 20px 38px 20px 38px;
    margin-right: 1em;
    font-family: Catamaran;
  }
  .details-section .watch-now-section .continue-watch-btn.focused, .details-section .watch-now-section .start-over-btn.focused, .details-section .watch-now-section .buy-or-rent.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}

/* fix for side menu */
.navbar .navbar-nav .nav-item > span{
    font-size: 28px;
}

/* my account internal page font fix */
.page_inner_text ul span{
    font-size: 19pt;
}

.side-menu .menu-list-wrapper .list-wrapper .list .check{
    content:url('../images/selctd_mark.svg');
    width: 1em;
    margin-right: 1em;
}


 
  /* css for new signin screen changes sales funnel*/
  .login_page .header{
    height: 170px;
}
.qr-code img{
    padding-top: 30px;
  height: 23em;
  width: 23em;
  border: 0;
}

.login_container{
    width: 1447px;
  height: 623.5px;
  margin: 131px 236.5px 155.3px 236.5px;
}

.login_page #line2{
    width: 774px;
    height: auto;
    font-family: Catamaran;
    font-size: 36px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.13;
    letter-spacing: normal;
    text-align: left;
    color: #e5e5e5;
    padding: 1em 0 15px 0;
}

.login_page #line3{
width: 774px;
height: auto;
font-family: Catamaran;
font-size: 36px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.13;
letter-spacing: normal;
text-align: left;
color: #e5e5e5;
padding: 1em 0 15px 0;
}

.login_page .point3{
 width: 774px;
height: auto;
font-family: Catamaran;
font-size: 36px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.13;
letter-spacing: normal;
text-align: left;
color: #e5e5e5;
padding: 1em 0 15px 0;
}

.login_page .qr-text{
width: 374px;
height: 82px;
font-family: Catamaran;
font-size: 28px;
font-weight: normal;
font-stretch: normal;
font-style: normal;
line-height: 1.29;
letter-spacing: normal;
text-align: center;
color: #fafafb;
padding-top: 20px;
}

.login_page .auth_code{
width: fit-content;
display:inline-block;
height: 163.5px;
opacity: 0.9;
box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.16);
border: solid 2px #fafafb;
text-align: center;
min-width: 350px;
}
.login_code{
width: fit-content;
height: 131px;
font-family: Catamaran;
font-size: 80px;
font-weight: bold;
font-stretch: normal;
font-style: normal;
line-height: 2;
letter-spacing: 20px;
text-align: center;
color: #e5e5e5;
margin:0px 20px 0px 40px;
}
.login_code_dup {
    color: rgba(250, 250, 250, 0.2);
}

/* welcome page slider image css */
.slide-collection-image .item.image1 img {
    width: 172.6px;
    height: 169.5px;
    object-fit: contain;
}
.slide-collection-image .item.image2 img {
    width: 187.8px;
    height: 144.7px;
    object-fit: contain;
    margin-bottom: 3.8em;
}
.slide-collection-image .item.image3 img {
    width: 178.1px;
    height: 170.8px;
    object-fit: contain;
}
.slide-collection-image .item.image4 img {
    width: 167.1px;
    height: 161.7px;
    object-fit: contain;
}

.live_landing .strip-sec{
    position: absolute;
    left: -110px;
    top: 0;
    width: 49em;
    height: 51em;
    background-image: url('../images/brandng_asts.webp');
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
}
/* width */
::-webkit-scrollbar {
    width: 5px;
  }
  
  /* Track */
  ::-webkit-scrollbar-track {
    background: #70707026;
    box-shadow: inset 0 0 1px #707070; 
  }
   
  /* Handle */
  ::-webkit-scrollbar-thumb {
    background: #707070; 
  }

  /* exit popup */
  .exit-strip-sec{
    width: 544px;
    height: 544px;
    object-fit: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #191919;
    margin: auto;
    border: 2px solid #32b2bc;
}
.popup-alert{
    width: 608px;
    height: auto;
    padding: 40px;
    background: #191919; 
    border: solid 1px #32b2bc;
}
.popup-alert .exitpoupup-row .part-1{
    width: unset;
    margin-left: 0px;
}
.popup-alert .exitpoupup-row .part-2{
    width: unset;
    max-height: unset;
    margin-left: 0px;
    font-weight: 400;
    font-size: 30px;
}
.exitpoupup-row .alert-title {
    width: 304px;
    object-fit: contain;
    font-family: Catamaran;
    font-size: 32px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.25;
    letter-spacing: normal;
    text-align: center;
    color: var(--white-primary);
    margin-left: 6%;
    margin-top: 4%;
    max-height: 120px;
    height: auto;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal
  }
  .exitpoupup-row .alert-desc{
    width: 300px;
    object-fit: contain;
    font-family: Catamaran;
    font-size: 18px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.2;
    letter-spacing: normal;
    text-align: center;
    color: var(--white-primary);
    margin-left: 8%;
    max-height: 90px;
    height: auto;
    top: 0px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 4;
    -webkit-box-orient: vertical;
    white-space: normal;
}

#noBtn,
#yesBtn , #logoutBtn, #cancelBtn {
    width: 336px;
    height: 40px;
    border: solid 1px #32b2bc;
    font-family: Catamaran;
    font-size: 14px;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.71;
    letter-spacing: 0.42px;
    text-align: center;
    color: #fafafb;
    transition: color .0s ease-in-out,background-color .0s ease-in-out,border-color .0s ease-in-out,box-shadow .0s ease-in-out;
}
.popup-alert #logoutBtn, .popup-alert #cancelBtn{
    width: 100%;
}
.popup-alert #logoutBtn.focused, .popup-alert #cancelBtn.focused{
    width: 100%;
    background-color: #32b2bc;
}
#noBtn.focused,
#yesBtn.focused,
#logoutBtn.focused,
#cancelBtn.focused {
    width: 338px;
    height: 44px;
    object-fit: contain;
    background-color: #32b2bc;
}
.exitpoupup-row{
    margin-top: 3%;
}
.exit-alert-icon{
    margin: auto;
    margin-bottom: 7%;
    display: block;
}

/* add blur background on popup enable */
/* .modal-open>.container-fluid {
    filter: blur(5px);
} */
.modal-content1{
    pointer-events: auto;
}
.popup-alert .modal-content1{
    width: 100%;
}
/* css for top desc for live carousel in home page focus */
.listing .live-carousel-desc .rightTopseclive{
    left: 18%;
}

/* css for episodes seek for side nav */
.sidenav_epi_duration {
    font-size: 22px;
    color: #fafafb;
    font-family: Catamaran;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    line-height: 36px;
    position: absolute;
    right: 2.5%;
    display: -webkit-box;
    width: 170px;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
    text-align: right;
}

.clock_img {
    position: absolute;
    right: 0;
    width: 32px;
    height: 32px;
}

.details-section .my-list-btn.added_btn{
    background: url(../images/remv_frm_watc_list.svg) no-repeat 10%;
}
.onboard-menu-list-wrapper ul.select > li{
    padding: 0.7em;
}
.onboard-side-menu {
    position: absolute;
    top: 0;
    height: 100%;
    display: flex;
    flex-direction: row;
    right: 0;
}
.lang_expanded .onboard-side-menu{
    background: linear-gradient(243deg, rgba(23, 23, 24, 0.73) 103%, rgba(14, 30, 35, 1) 56%, rgba(14, 30, 35, 1) 14%);
    height: 1920px;
}
.lang_expanded .onboard-menu-list-wrapper{
    position: relative;
    top: 0;
    left: 0;
    width: 35em;
    height: 100%;
    display: flex;
    flex-direction: column;
    background: url("../images/side_panel_brandng_asts.svg") no-repeat;
    background-size: 100%;
}
.login_page .onboard-menu-list-wrapper .language{
    margin-top: 45px;
    right: 40px;
}
.title_img{
    overflow: visible !important;
    margin-top: 8% !important;
    margin-bottom: 22% !important; 
}
.title_img img{
    width: 476px;
    height: 300px;
    object-fit: contain;
}
.details-section .title_img{
    margin-top: 4% !important;
    margin-bottom: 0.7em !important;
}
.details-section .title_img img{
    height: 250px;
}
.onair_text{
    font-stretch: normal;
    font-style: normal;
    text-align: right;
    vertical-align: middle;
    color: #32b2bc;
    font-family: Catamaran;
    width: 117px;
    height: 49px;
    object-fit: contain;
    font-size: 30px;
    font-weight: bold;
    line-height: 0.8;
    letter-spacing: normal;
}
.onair img{
    height: 3.5em;
}

/* content Image icon for channel */
.channel-card-inner .viewall {
    width: 100% !important;
}
.channel-view-icon {
    position: relative;
    top: -140px;
    left: 42%;
}

.userDiv .Lang-side-nav.side-menu .menu-list-wrapper .list-wrapper .list .list-item{
    line-height: 1.9;
    margin-left: 38%;
}

.language .select {
    width: 8em;
}

.no-content-block{
    display: flex;
    align-items: center;
    margin-bottom: 3em;
    margin-left: 5em;
    z-index: 9;
}

.no-content-block img {
    margin-right:2em;
    width: 4em;
}

#no-content-text {
    font-size: 24px;
    z-index: 9;
}
  
/* age rating  detail page*/

.live-detail-section .more-about-btn{
    display: table;
    justify-content: center;
    align-items: center;
    width: fit-content;
    margin-left: 6em;
    border: solid 3px transparent;
    margin-top: 24% !important;
}


.details-section .more-about-btn.focused,
.live-detail-section .more-about-btn.focused{
	box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376) !important;
}


.live-detail-section .more-about-btn.focused{
    border: solid 2.5px #32b2bc;
}

.right-sec .more-about .menu-list-wrapper{
    text-align: right;
    padding-right: 2em;
    color: #fafafb;
}

#menu-list-wrapper-moreabout {
    padding-top: 7em;
}
.more-about-text {
    font-size: 24px;
}

.more-about-title_local {
    font-size: 36px;
    font-weight: bold;
    margin: 0.5em 0;
    line-height: 1em;
}

.more-about-duration .time-img{
    display: none;
}

.time-img{
    margin-left: 0.5em;
    width: 30px;
    height: 22px;
}

.more-about-des {
    font-size: 22px;
    color: rgba(250, 250, 251, 0.8);
    line-height: 32px;
    margin: 3em 0 1.5em 2.5em;
    word-break: break-word;
}

.list-heading {
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 0.5em;
}
.more-about-list {
    margin-top: 3em;
}
.more-about-list ul {
    list-style: none;
}
.more-about-list ul li {
    font-size: 22px;
    color: rgba(250, 250, 251, 0.8);
    line-height: 32px;
}

.rating-icons {
    margin-bottom: 2em;
    text-align: right;
    align-items: center;
    justify-content: end;
}

.rating-icons .smart-sign-img {
    margin: 0;
    opacity: 0.5;
    width: 3em;
    height: 3em;
    margin-left: 0.5em;
}

.maturity-head-sign{
    display: none;
    align-items: center;
    margin-bottom: 0.6em;
    font-size: 24px;
    margin-right: 0px;
}

.maturity-head-sign img {
    margin-right: 0.6em;
    margin-left: auto;
}

.smart-sign-text {
    background: rgba(255, 255, 255, 0.2);
    color: #fafafb;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: auto;
    max-width: 98%;
    border-radius: 3px;
    letter-spacing: 0.6px;
    margin: 2px 4px;
    padding: 9px 20px;
    display: inline-block;
    font-size: 20px;
    font-weight: 300;
    margin-right: 0px;
    margin-bottom: 0px;
    margin-left: 6px;
}

.inner-scroller {
    /* overflow-y: auto; */
    padding-bottom: 2em;
}
.more-content {
    margin-right: 1em;
}

.details-page #side-menu-more-about,
.details-page #side-menu-episode,
.details-page #side-menu-language {
    z-index: 99;
    transition: 0.2s ease-in-out all;
}
/* parental control in profile page */
.pin_control{
    margin-left: 7.5em;
    margin-top: 3em;
    margin-bottom: -1em;
    padding-left: 75px;
}

.parent-control-sec {
    width: 885px;
    height: 781px;
    object-fit: contain;
    background-repeat: no-repeat;
    background-position: center;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: #191919;
    border: 2px solid #32b2bc;
    margin: auto;
    object-fit: cover;
}
#parentalBlock {
    padding: 3em 2em;
    color: #fafafb;
}
.parentalHeading{
    font-size: 36px;
    font-weight: normal;
    display: flex;
    align-items: center;
    justify-content: center;
}
.pinControlRow {
    display: flex;
    align-items: center;
    padding: 3.3em 0 1.5em 0;
}
.pinControlRow .keyBoard{
    background-color: #191919;
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.84);
    padding: 1em;
    margin-left: 3em;
}
.keyboardRow {
    display: flex;
}
.keyBlock.focused,.confirmButton.focused,.backButton.focused{
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}
.keyBlock.singleDelete img{
    height: 1em;
}
.keyBlock.DeleteAll img{
    height: 1.2em;
}
.parentalPin {
    display: flex;
    flex-direction: row;
    margin: 5em 0 8em 0;
}
.pinBlock {
    width: 80px;
    height: 80px;
    background: #fafafb;
    margin: 0.7em;
    padding: 3.5em 2em 1em 1.8em;
    position: relative;
}
.pinBlock span{
    color: #0e1e23;
    object-fit: contain;
    font-family: Catamaran;
    font-size: 70px;
    font-weight: bold;
    font-stretch: normal;
    font-style: normal;
    line-height: 0.17;
    letter-spacing: normal;
    text-align: left;
}
.pintitle {
    font-size: 20px;
    width: 400px;
}
.pinLabel{
    font-size: 16px;
    font-weight: bold;
}
.keyBlock{
    font-size: 42px;
    padding: 1em;
    width: 90px;
    height: 90px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #8f8f8f;
    border: solid 3px transparent;
}
.confirmButton,
.backButton{
    font-size:  24px;
    padding:  0.8em;
    border:  1px solid #fafafb;
    display:  flex;
    align-items:  center;
    justify-content:  center;
    margin: 0.6em 0;
}
.confirmText,
.confirmButton img{
    margin-left: auto;
}

.backText,
.backButton img {
    margin-right: auto;
}

.activate-input {
    position: absolute;
    font-size: 5em;
    bottom: 0.1em;
    left: 20%;
    display: none;
    width: 47.5px;
    height: 0;
    object-fit: contain;
    border: solid 4px #707070;
    -webkit-animation: 1s blink step-end infinite;
    -moz-animation: 1s blink step-end infinite;
    -ms-animation: 1s blink step-end infinite;
    -o-animation: 1s blink step-end infinite;
    animation: 1s blink step-end infinite;
    display: none;
}
.pinBlock-error .pinBlock{
    border: solid 2px #d41b20;
}
.error-msg-block{
    margin: 6em 0em 0em 0em;
    position: absolute;
    width: 15em;
    text-align: center;
    color: #32b2bc;
    left: 16%;
}
.pinBlock-error .error-msg-block{
    display:  block !important;
}

#pin_popup_backButton {
    margin-top: 3em;
}
/* parental control ends */
.more-about-duration{
    font-size: 19px;
}

.live-detail-section {
    z-index: 9;
}

/* new css for genre/curation carousel in home page*/
.title-on-img {
    font-family: Catamaran;
    font-size: 26px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.32;
    letter-spacing: normal;
    text-align: center;
    color: #fafafb;
    position: absolute;
    word-break: break-word;
    width: 95%;
    vertical-align: -webkit-baseline-middle;
    top: 23%;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
    height: 100px;
    justify-content: center;
    align-items: center;
    display: flex;
    padding-left: 10%;
    padding-right: 10%;
    height: auto;
    top: 44%;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;

}
.group-collection-tagline{
    width: 580px;
    height: 36px;
    object-fit: contain;
    font-family: Catamaran;
    font-size: 22px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.36;
    letter-spacing: normal;
    text-align: left;
    color: #fafafb;
}
.strip_for_group_item{
    position: absolute;
    margin-left: -400px;
}
.group_item_shadow {
    position: absolute;
    height: 152px;
    top: 6px;
    right: 6px;
}

/* channels icons center alignment new change*/
.channel-icon{
    position: absolute;
    bottom: 13%;
    left: 20%;
    align-items: center;
    width: auto;
    height: 150px;
}
.customcardBodyLive .channel-icon{
    bottom: 22%;
    left: 22%;
}

/* live channels blur image and stripe image new changes*/
.live_land_poster_image{
    margin-right: 178px;
}
.live_img{
    filter: blur(2px);
    -webkit-filter: blur(2px);
}
.customsec_livecard .strip_for_live_card{
    position: absolute;
    width: 96%;
    height: 94%;
    margin-left: -95%;
    margin-top: -54%;
}
.customcardBodyLive .strip_for_live_card{
    margin-top: 7px;
    margin-left: -400px;
    height: 236px;
}
.viewall_live .strip_for_live_card{
    margin-left: -305px;
    height: 186px;
    width: 305px;
}

.home_dynamic_page .customsec_livecard .strip_for_live_card{
    position: absolute;
}
.home_dynamic_page .focused.customsec_livecard .strip_for_live_card{
    width: 96%;
    height: 94%;
    margin-left: -95%;
    margin-top: -54%;
}
.customsec_livecard.viewallcolor .live_img{
    filter: blur(0px);
    -webkit-filter: blur(0px);
}
/* top in region css */
.top_in_region_widget_card.cardsection .customcard-body{
    padding: 7px;
}
.top_in_region_widget_card .numberKey{
    width: 62px;
    height: 90%;
    text-shadow: 0 3px 6px rgba(0, 0, 0, 0.3);
    -webkit-text-stroke: 0px #fafafb;
    font-family: Catamaran;
    font-size: 180px;
    font-weight: 600;
    font-stretch: normal;
    font-style: normal;
    line-height: 0.13;
    letter-spacing: normal;
    text-align: center;
    color: #fafafb;
    position: absolute;
    top: 62%;
    left: 40px;
}
.top_in_region_widget_card{
    width: 517px;
    height: 292px;
    min-width: 515px;
}
.top_in_region_widget_card .customCard{
    height: 292px;
}
.top_in_region_widget_card.focused .customcard-body,
.top_in_region_widget_card .customcard-body {
    height: 285px !important;
}
.top_in_region_widget_img{
    width: 490px !important;
    height: 269px !important;
}
.top_in_region_widget_card .plus_icon{
    position: relative;
    top: -180px;
    left: 45%;
}

.top_in_region_widget_card .viewall{
    line-height: 1.5em;
    top: -64%;
    left: 2%;
    position: relative;
}
.top_in_region_widget_card .num_border{
    position: absolute;
    top: 44px;
    left: 7px;
}
.top_in_region_widget_card.focused .num_border {
    left: 7px;
}
.top_in_region_widget_card:nth-child(n+10) .numberKey{
    left: 12px;
    font-size: 140px;
}
.top_in_region_widget_card:nth-child(n+20) .numberKey{
    font-size: 120px;
}
.top_in_region_widget_card:nth-child(6) .numberKey,
.top_in_region_widget_card:nth-child(8) .numberKey{
    top: 64%;
}
.content_genre_oncard{
    position: absolute;
    right: 26px;
    font-size: 24px;
    width: 300px;
    height: 46px;
    font-family: Catamaran;
    font-size: 28px;
    margin-top: 40%;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1;
    letter-spacing: normal;
    text-align: right;
    color: #fafafb;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.adjustment_layer_on_card{
    position: absolute;
    left: 7px;
    top: 7px;
    background-color: #121213;
    opacity: 0.5;
}

/*view all page card css*/
.customList .cardsection .customcard-body .img-class.seeAll_img, .continue_seeAll{
    height: 191px !important;
}
.customList .viewall_live.cardsection .customcard-body .img-class.seeAll_img{
    width: 305px;
}
.customList .cardsection .customcard-body {
    height: 205px !important;
    padding: 7px;
}
.view_all_page .list-container {
    top: 52%;
}

/*new requirement changes group collection carousel imgs */
.row_group_collection .customsec{
    height: 172px;
    width: 245px;
    min-width: 255px;
}
.row_group_collection .customCard {
    height: 170px;
}
.row_group_collection .cardsection .customcard-body {
    height: 165px !important;
    padding: 7px;
}
.row_group_collection .cardsection .customcard-body .img-class {
    height: 151px;
    width: 234px;
}
.row_group_collection .cardsection .viewall {
    font-size: 20px;
    margin-top: 1%;
}
.row_group_collection .plus_icon {
    top: -114px;
    left: 40%;
    width: 45px;
}
.customList .group_item_shadow {
    position: absolute;
    height: 198px;
    top: 0px;
    right: 7px;
}
.group_collection_seeAll .titleheader{
    font-size: 62px;
    margin-bottom: -20px;
    font-weight: 600;
    line-height: 1.94;
    margin-left: 10px;
}
.group_collection_seeAll.view_all_page .list-container{
    top: 502px;
}
.group_collection_seeAll .detail-sec .strip-sec .content-title{
    font-size: 90px;
    margin-top: 1.8em;
    margin-left: 2em;
    line-height: 1;
    height: 2em;
    width: 8em;
    margin-bottom: 0.5em;
}
.group_collection_seeAll .img-sec .posterImg, .img-sec .posterImg1,
.view_all_page .img-sec .posterImg{
    width: 897px;
    height: 488px;
}
.group_collection_seeAll .img-sec,
.view_all_page .img-sec{
    width: 897px;
    height: 488px;
}
.group_collection_seeAll .right-sec .strip-sec,
.view_all_page .right-sec .strip-sec{
    background: url(../images/brandng_asts.webp), linear-gradient(to left, rgba(0, 0, 0, 0) 0%,#171710 100%);
    background-repeat: no-repeat;
    background-size: 90%;
    width: 925px;
    height: 488px;
}
.group_collection_seeAll .top-sec,
.view_all_page .top-sec{
    height: 488px;
}
.group_collection_seeAll .title-on-img {
    font-size: 35px;
    height: auto;
    top: 39%;
    line-height: 1.32;
    text-overflow: ellipsis;
    -webkit-line-clamp: 2;
    display: -webkit-box;
    -webkit-box-orient: vertical;
}
.group_collection_seeAll .cardsection .customcard-body {
    height: 215px !important;
    padding-left: 8px;
    padding-right: 7px;
    padding-top: 8px;
}

.group_collection_seeAll .customList .customsec{
    height: 215px;
    width: 322px;
    min-width: 322px;
}
.group_collection_seeAll .customCard {
    height: 209px;
}
.group_collection_seeAll .customList .cardsection.focused .customcard-body .img-class,
.group_collection_seeAll .customList .cardsection .customcard-body .img-class {
    width: 296px;
}
.group_collection_seeAll .customList .group_item_shadow {
    height: 198px;
    top: 5px;
    right: 6px;
}
/* scroll carousel end changes */
.bottom-sec .row, .home_dynamic_page .slidSectiondata .row,
.fav_page .slidSectiondata .row{
    overflow: hidden;
}
.home_dynamic_page .homepagecontent_div{
    overflow: visible;
}
/* css for marquee */
.marquee {
    white-space: nowrap;
    overflow: hidden;  
}
.marquee{
     animation: marquee 20s linear infinite;
}

@keyframes marquee {
0% {
  transform: translate(0%, 0);
}    
 50% {
 transform: translate(-100%, 0);
 }
 50.001% {
 transform: translate(8%, 0);
 }
100% {
    transform: translate(-100%, 0);
 }
}
/* css for new menu  template changes */
.nav-item div{
  overflow: hidden;
}
.nav-item span{
   font-size: 28px;
   margin-left: 0.5em;
   font-family: Catamaran;
   line-height: 48px;
   display: inline-block;
   width: 234px;
   white-space: nowrap;
   text-overflow: ellipsis;
   overflow: hidden;
}

/* Home page banner */
.right-sec .home-banner {
    position: absolute;
    width: 65em;
    height: 75em;
    left: 0;
    top: 0;
    background: url(../images/brandng_asts.webp), linear-gradient(to left, rgba(0, 0, 0, 0) 0%, rgba(0,0,0,0.5) 100%);
    background-repeat: no-repeat;
    background-size: 90%;
    z-index: 1;
}
.detail-sec .home-banner .content-title {
    font-size: 3.7em;
    color: #fafafb;
    font-weight: bold;
    margin-top: 3.45em;
    margin-left: 3.6em;
    width: 100%;
    margin-bottom: 1em;
    text-align: left;
    line-height: 1;
    height: 2em;
    overflow: hidden;
    z-index: 2;
    text-overflow: ellipsis;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
}
.detail-sec .home-banner .title_img {
    margin-left: 3.7em;
    margin-top: 6% !important;
}
.detail-sec .home-banner .content-detail {
    font-size: 22px;
    color: #fafafb;
    font-weight: normal;
    display: flex;
    flex-direction: column;
    width: 77em;
    margin-left: 10em;
    font-family:Catamaran-Regular;
    position: absolute;
    top: 18em;
    white-space: nowrap;
    overflow-x: hidden;
    line-height: 2;
}
.detail-sec .home-banner .content-detail .content-desc {
    max-width: 30em;
    font-size: 1.3em;
    margin-bottom: 1em;
    display: flex;
    flex-direction: row;
}

.detail-sec .home-banner .content-detail .content-desc img {
    height: 2em;
    width: 2em;
    margin-right: 0.2em;
    margin-top: -0.5em;
}
.detail-sec .home-banner .content-detail .content-desc .content {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    font-weight: normal;
}
.home-banner-more-details-btn {
    font-size: 1.6em;
    color: #fafafb;
    border: 3px solid #fafafb;
    padding: 20px 38px 20px 38px;
    position: absolute;
    margin-left: 8.5em;
    top: 18em;
    font-weight: bold;
    border: 3px solid #32b2bc;
}
.home-banner-slider {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-left: 13em;
    position: absolute;
    top: 35em;
    z-index: 2;
}
.home-banner-slider-item {
    width: 1.5em;
    height: 1.5em;
    border: 1px solid #32b2bc;
    margin: 12px;
}
.home-banner-slider-item.active {
    background-color: #32b2bc;
}

.detail-sec .home-banner .title_text {
    font-size: 1.2em;
    margin-top: -2.5em;
    margin-bottom: 0.5em;
    margin-left: 11.4em;
}
.optionsContainer {
    display: flex;
    align-items: flex-start;
    flex-direction: column;
    height: 39%;
    overflow-y: auto;
    padding-bottom: 15px;
    position: relative;
}
/* Keyboard changes */
.right-sec .search-result-section .bottom-sec .list-row {
    width: 100%;
}
.right-sec .search-result-section .top-sec .keyboardSearchInput.focused {
    border: 4px solid #32b2bc;
}

/* Content details page */


/* Mouse navigation on carousel changes */
.arrowItem {
    display: flex;
    flex-direction: row;
    align-items: center;
    width: 100px;
    padding: 0px 24px 0px 80px;
    height: 210px;
    margin-top: 68px;
}
.portraitImg .arrowItem {
    margin-top: 58px;
}
.leftArrowItem {
    justify-content: flex-start;
    position: absolute;
    background: linear-gradient(90deg, #000000 20%, rgba(0, 0, 0, 0) 100%);
    margin-left: -1px;
}
.rightArrowItem {
    justify-content: flex-end;
    position: absolute;
    right: 0;
    background: linear-gradient(270deg, #000000 20%, rgba(0, 0, 0, 0) 100%);
}
.leftArrowImage {
    margin-left: -60px;
}
.favContentDiv {
    overflow: unset;
}
.rightArrowImage {
    display: block !important;
}

/* Content details page changes for options container */
.details-section .more-about-btn, .details-section .my-list-btn, .details-section .episodes-list-btn, .details-section .remove-from-continue-watch-list-btn, .details-section .audio-subtitle-btn, .details-section .back-btn, .live-detail-section .more-about-btn {
    border: 3px solid transparent;
    background-size: 10%;
    text-align: left;
    font: normal normal normal 28px/36px Catamaran;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    margin-top: 0.4em;
    margin-left: 3.3em;
    font-size: 30px;
    display: table;
    justify-content: center;
    align-items: center;
    width: fit-content;
    padding: 13px 40px;
}
.details-section .more_about_icon, .details-section .my_list_icon, .details-section .episodes-list-icon, .details-section .continue-watch-icon, .details-section .audio-subtitle-icon, .details-section .back-icon, .live-detail-section .more_about_icon, .live-detail-section .back_btn_icon {
    margin-right: 58px;
    display: table-cell;
    width: 50px;
    text-align: center;
}
.details-section .more_about_icon img, .details-section .my_list_icon img, .details-section .episodes-list-icon img, .details-section .continue-watch-icon img, .details-section .audio-subtitle-icon img, .details-section .back-icon img, .live-detail-section .more_about_icon img, .live-detail-section .back_btn_icon img {
    margin-left: -9px;
    width: 70%;
}
.details-section .more_about_text, .details-section .my_list_text, .details-section .episodes-list-text, .details-section .continue-watch-text, .details-section .audio-subtitle-text, .details-section .back-text, .live-detail-section .more_about_text, .live-detail-section .back_btn_text {
	font-size: 30px;
    font: normal normal normal 28px/36px Catamaran;
    display: -webkit-box;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    margin-left: 52px;
}

/* Content details page side menu episode desing change */

#menu-border-episode {
    margin-left: 40px;
    margin-right: 30px;
    border: none;
    background: none;
    box-shadow: none;
}

.episodePlayIcon {
    position: absolute;
    bottom: 28px;
    left: 20px;
}

.seasonSynopsis {
    font-family: 'Catamaran';
    font-weight: 500;
    font-style: normal;
    font-size: 22px;
    line-height: 36px;
    margin-bottom: 40px;
    text-align: justify;
    width: 1440px;
}

/* Content detail page local title changes */
.details-section .title_text {
    font-size: 28px;
    margin-bottom: 33px;
    margin-left: 88px;
    font-weight: 700;
    line-height: 46px;
    width: 13em;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.details-section .title_text_local {
    font-size: 60px;
    margin-bottom: 33px;
    margin-left: 88px;
    font-weight: 700;
    line-height: 98px;
    margin-top: 100px;
    width: 90%;
    white-space: normal;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
}

.below_title_text {
    font-size: 28px !important;
    margin-bottom: 33px !important;
    margin-left: 88px !important;
    line-height: 65px !important;
    margin-top: unset !important;
}

.more-about-title {
    font-size: 24px;
    font-weight: 700;
    line-height: 39px;
}

/* Home page local & original title change */
.detail-sec .strip-sec .title_text {
    margin-left: 9em;
    font-weight: 700;
    font-size: 28px;
    line-height: 1;
    margin-bottom: 12px;
    max-height: 118px;
}

.detail-sec .strip-sec .title_text_local {
    font-weight: 700;
    font-size: 60px;
    line-height: 1;
    margin-top: 3.8em;
    margin-left: 4em;
    width: 90%;
    margin-bottom: 12px;
    text-align: left;
    max-height: 118px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.home_below_title_text {
    margin-left: 9em !important;
    font-weight: 700 !important;
    font-size: 28px !important;
    max-height: 58px !important;
}

.home_below_title_text_hero_banner {
    margin-left: 8em !important;
    font-weight: 700 !important;
    font-size: 28px !important;
    max-height: 58px !important;
    margin-top: -84px !important;
}

.hero-banner-iconImg {
    width: 450px !important;
    height: 225px !important;
}

/* Concurrent streaming popup changes */
.concurrentPopupScreen {
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.8);
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 10;
}
.concurrentPopupBox {
    width: 544px;
    height: auto;
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: #191919;
    padding: 40px 24px;
    flex-direction: column;
}
.concurrentPopupHeading {
    width: 496px;
    height: auto;
    font-family: 'Catamaran';
    font-style: normal;
    font-weight: 700;
    font-size: 32px;
    line-height: 52px;
    text-align: center;
    color: #fafafb;
    margin-bottom: 24px;
}
.concurrentPopupImage.img {
    width: 60px;
    height: 60px;
    margin-bottom: 24px;
}
.concurrentPopupdesc {
    width: 496px;
    font-family: 'Catamaran';
    font-style: normal;
    font-weight: 700;
    font-size: 24px;
    line-height: 39px;
    text-align: center;
    color: #fafafb;
    margin-bottom: 24px;
}
.concurrentPopupButtons {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.concurrentPopupRedirectButton {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0px 20px;
    width: 496px;
    height: 48px;
    font-family: 'Catamaran';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    text-align: center;
    color: #fafafb;
    border: 1px solid #32b2bc;
    margin-bottom: 24px;
}
.concurrentPopupBackButton {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 0px 20px;
    width: 496px;
    height: 48px;
    border: 1px solid #32b2bc;
    font-family: 'Catamaran';
    font-style: normal;
    font-weight: 700;
    font-size: 16px;
    line-height: 26px;
    text-align: center;
    color: #fafafb;
}

.concurrentPopupBtn.focused{
    background: #32b2bc;
}
/**** device management styles begin ****/
.device-list {
    position: relative;
    display: flex;
    flex-direction: column;
    width: 100%;
    height: auto;
    z-index: 99;
    top: 92px;
    justify-content: center;
    align-items: center;
}

.device-notify-info ,.device-logout{
    font-style: normal;
    font-weight: 400;
    font-size: 27px;
    line-height: 46px;
    color: #999999;
    text-align: center;
    margin-bottom: 0px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    height: 48px;
}

.device-list .device-logout {
    font-weight: 700;
    display: block;
    text-align: center;
    text-decoration: underline !important;
    margin: 9px 0px;
}

.device-list .device-logout.focused {
    border: 1px solid #32b2bc;
    display: flex;
    align-items: center;
    padding: 0px 20px;
    margin: 9px 20px;
    justify-content: center;
    text-decoration: none !important;
}

.device-list .title {
    font-style: normal;
    font-weight: 700;
    font-size: 40px;
    line-height: 54px;
    margin-bottom: 25px;
    text-align: center;
    padding: 0px 100px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box !important;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
}

.devices-container {
    margin: 30px auto 0px 13%;
    display: flex;
    flex-wrap: wrap;
    left: 11%;
    overflow-y: auto;
    height: 705px;
    width: 1500px;
}
.exitpoupup-row #logoutBtn{
    font-family: Catamaran;
    font-size: 28px;
    font-weight: 700;
    line-height: 46px;
    letter-spacing: 0px;
    text-align: center;
    height: 64px!important;
    border-radius: 0px;
    width: 100%;
    overflow: hidden;
}

.exitpoupup-row #cancelBtn{
    background: transparent;
    border: 1px solid #32b2bc!important;
    height: 64px!important;
    border-radius: 0px;
    width: 100%;
    font-family: Catamaran;
    font-size: 28px;
    font-weight: 700;
    line-height: 46px;
    letter-spacing: 0px;
    margin-top: 20px;
    overflow: hidden;
}

.devices-container .device {
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    padding: 20px;
    width: 700px;
    height: 315px;
    background: #000;
    border: 1px solid #3d3d3d;
    margin: 15px 40px 15px 3px;
}
.device.focused{
    border: 1px solid #32b2bc;
}

.devices-container .device .deviceStatus{
    width: 300px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: block;
}
.device .dt-btn {
    white-space: nowrap;
    margin: 0px;
    padding: 0px;
    background: transparent;
    font-weight: 700;
    font-size: 24px;
    line-height: 39px;
    display: flex;
    align-items: center;
    text-align: right;
    color: #999;
    padding: 0px 20px;
}
.deviceStatus{
    color: #FFFFFF !important;
}
.device .dt-btn.focused {
    border: 1px solid #32b2bc;
    padding: 0px 20px;
    display: flex;
    justify-content: center;
    color: #32b2bc;
    font-weight: 700;
}

.edit-btn {
    border: 1px solid transparent !important;
}

.edit-btn.focused {
    border: 1px solid #32b2bc !important;
}

.dt-btn img {
    padding-right: 8px;
}

.device-detail {
    display: flex;
    flex-direction: column;
    text-align: left;
    width: 100%;
}

.devices-container .device .device-detail .device-name,
.devices-container .device .device-detail .ip,
.devices-container .device .device-detail .place,
.devices-container .device .device-detail .date {
    font-weight: 400;
    font-size: 26px;
    line-height: 43px;
    display: flex;
    align-items: center;
    color: #999;
    margin-bottom: 15px;
}

.devices-container .device .device-detail .device-name {
    display: flex;
    justify-content: space-between;
    font-weight: 400;
    font-size: 30px;
    line-height: 49px;
    color: #fafafb;
    border-bottom: 1px solid rgba(153, 153, 153, 0.5);
    padding-bottom: 12px;
}

.devices-container .device .device-detail .place {
    display: flex;
    justify-content: space-between;
    margin-bottom: 0px;
}

.device-icon,
.ip-icon,
.time-icon,
.location-icon {
    border: 1px solid transparent;
    margin-right: 10px;
    min-width: 25px;
}

.device-name-container {
    display: flex;
    align-items: center;
    column-gap: 4px;
    width: 100%;
}

.overlay-container {
    display: none;
    width: 100vw;
    height: 100vh;
    background-color: #000;
    z-index: 99;
    position: absolute;
    top: 0px;
    left: 0px;
}

.input-texture {
    margin: 80px;
}

.overlay-container .input-texture input {
    height: 80px;
    width: 100%;
    left: 1em;
    border: 2px solid #32b2bc;
    background: #000;
    color: #fafafb;
    text-align: left;
    font-size: 42px;
    line-height: 34px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    padding-left: 1em;
    padding-right: 1em;
}
.device-alert-icon{
    width: 60px;
    height:60px;
    display: block;
}

/* pop up */

.popup-box {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0px;
    left: 0px;
    z-index: 99;
    background: rgba(0, 0, 0, 0.8);
    display: none; 
    align-items: center;
    justify-content: center;
}
.edit-signout-popup {
    display: flex;
    align-items: center;
    justify-content: center;
    height: 533px;
    position: absolute;
    z-index: 2;
    background:rgba(25, 25, 25, 1);
    width: 979px;
    padding:75px;
}
.edit-signout-popup .btn-back {
    position: absolute;
    top: 40px;
    left: 40px;
}
.edit-signout-popup .concurrent-img {
    width: 445px;
}
.edit-signout-popup .popup-info {
    width: 100%;
}
.edit-signout-popup .popup-info .title {
    font-weight: 700;
    font-size: 32px;
    line-height:52.48px;
    color: #fafafb;
    text-align: center;
    margin-bottom: 40px;
}
.edit-signout-popup .popup-info .info {
    font-weight: 400;
    font-size: 26px;
    line-height: 42.64px;
    color: #fafafb;
    margin-bottom: 52px;
}
.edit-signout-popup .popup-info .action-btns {
    display: flex;
    flex-direction: column;
}
.edit-signout-popup .popup-info .action-btns .btn-solid {
    background: #32b2bc !important;
    color:#fafafb;
    border-radius: 0px;
    min-width: 140px;
    font-size: 32px;
    height: 74px;
    width: auto;
    font-weight: 400;
}
.edit-signout-popup .popup-info .action-btns .btn-clear {
    border: 2px solid rgba(255, 255, 255, 1);
    color: #ffffff!important;
    border-radius: 0px;
    font-size: 32px;
    height: 74px;
    width: auto;
    font-weight: 400;
    display:flex;
    align-items: center;
    justify-content:space-between;
    margin-bottom: 40px;
}
.edit-signout-popup .popup-info .action-btns .btn-clear span {
    font-weight: 400!important;
}
.edit-signout-popup .popup-info .action-btns .btn-clear.focused {
    border: 2px solid #32b2bc;
    color:#fafafb;
}
.edit-signout-popup .popup-info .action-btns .btn-clear.signout{
    display:unset;
}
.buttoncard_row_1 {
    white-space: nowrap;
}
.device .dt-btn span {
    width: 300px;
    overflow: hidden;
    text-overflow: ellipsis;
}


/**** device management styles end ****/

/* handling different banner layouts */
.portrait_banner_with_metadata_title_img {
    width: 280px !important;
    height: 420px !important;
    margin-top: 5% !important;
}
.portrait_banner_with_metadata_content_title {
    margin-left: 521px !important;
    font-size: 20px !important;
}
.portrait_banner_with_metadata_content_title_local {
    margin-top: -119px !important;
    margin-bottom: 20px !important;
    font-size: 60px !important;
}
.portrait_banner_with_metadata_content_title_local, .portrait_banner_with_metadata_content_detail, .portrait_banner_with_metadata_btn {
    margin-left: 555px !important;
}
/* handling banner layouts in details page */
.portrait_banner_with_metadata_descriptionSection {
    height: 100%;
    display: flex;
    justify-content: center;
    flex-direction: column;
}
.portrait_banner_with_metadata_details-section {
    flex-direction: row !important;
}
.portrait_banner_with_metadata_details-section_title_text {
    margin-left: 89px !important;
}
.portrait_banner_with_metadata_details-section_title_text_local {
    font-size: 60px !important;
    line-height: 98px !important;
}
.portrait_banner_with_metadata_details-section_title_img {
    width: auto !important;
}
.portrait_banner_with_metadata_details-section_icon_img {
    width: 455px !important;
    height: 696px !important;
}
.portrait_banner_with_metadata_details-section_imageSection {
    display: flex !important;
    align-items: center !important;
}
.portrait_banner_with_metadata_detail_section_top_container {
    display: flex;
    align-items: center;
    justify-content: center;
}

/* VOD player CSS begin */
.player_page {
    font-size: 1.5em;
    padding: 0;
    margin: 0;
    width: 100%;
    height: 100%;
    overflow: hidden;
    background-color: #000000;
    color: silver;
    font-family: Catamaran;
    line-height: 1;
}
.player-container {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    margin: 0;
    padding: 0;
}
.player-container .video-container video {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: #000000;
}
#ad-container video{
    z-index: 10;
}
.player-container .player-controls {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background: linear-gradient( 0deg,rgba(0,0,0,.8),rgba(46,46,46,0) 45%)!important;
    z-index: 99;
    display: none;
}
.player-container .player-controls .player-title {
    display: flex;
    align-items: center;
    position: relative;
    top: 0;
    height: 100px;
    font-size: 1.5em;
    color: #fafafb;
    padding: 20px 0 20px 50px;
    box-sizing: border-box;
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.1));
}
.player-container .player-controls .seek-bar {
    width: 90%;
    height: 0.3em;
    position: relative;
    top: 75%;
    left: 5%;
    background: lightgray;
}
.player-container .player-controls .seek-bar .player_progress,
.player_progress_for_mouse {
    height: 7.2px;
    width: 0;
    position: absolute;
    top: 0;
    left: 0;
}
.player-container .player-controls .seek-bar .player_progress{
    background: #32b2bc;
    transition: all linear 0.2s;
}
.player-container .player-controls .seek-bar .player_progress .circle,
.player_progress_for_mouse span{
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    position: absolute;
    height: 1.2em;
    width: 1.2em;
    right: -1em;
    top: -0.45em;
}
.player-container .player-controls .seek-bar .player_progress .circle{
    background-image: url("../images/seek_progress_icon.svg");
}
.player-container .player-controls .seek-bar.focused .player_progress .circle{
    background-image: url("../images/seek_progress_focused_icon.svg");
    width: 40px;
    height: 42px;
    top: -0.75em;
}
.player-container .player-controls .seek-bar {
    width: 90%;
    height: 0.3em;
    position: relative;
    top: 75%;
    left: 5%;
    background: lightgray;
}
.player-container .player-controls .controls {
    height: 4.5em;
    top: 81.7%;
}
.player-container .player-controls .controls .control {
    width: 3.5em;
    height: 3em;
    margin-right: 2em;
}
.player-container .player-controls .controls .control:nth-child(2).focused {
    background-image: url("../images/plr_cntrl_subtitle_actv_icon.svg");
}
.player-container .player-controls .controls {
    width: 90%;
    position: relative;
    left: 5%;
    display: flex;
    flex-direction: row;
    align-items: center;
    padding-left: 10px;
    box-sizing: border-box;
}
.player-container .player-controls .controls .timer {
    color: #fafafb;
    font-size: 30px;
    position: absolute;
    right: 0;
    top: 0;
}
.player-container .player-controls .controls .control:nth-child(1) {
    background-image: url("../images/plr_cntrl_play_icon.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;

}
.player-container .player-controls .controls .control:nth-child(1).focused {
    background-image: url("../images/plr_cntrl_play_actv_icon.svg");
}
.player-container .player-controls .controls .control:nth-child(2) {
    background-image: url("../images/plr_cntrl_subtitle_icon.svg");
    background-repeat: no-repeat;
}
.player-container .player-controls .controls .control:nth-child(3) {
    background-image: url("../images/plr_cntrl_channel_icon.svg");
    background-position: center;
    background-repeat: no-repeat;

}
.player-container .player-controls .controls .control:nth-child(3).focused {
    background-image: url("../images/plr_cntrl_channel_actv_icon.svg");
    background-position: center;
    background-repeat: no-repeat;
    background-size: 92% !important;
}
.player-container .player-controls .controls .control:nth-child(4) {
    background-image: url("../images/plr_cntrl_start_over_icon.svg");
    background-position: center;
    background-repeat: no-repeat;

}
.player-container .player-controls .controls .control:nth-child(5) {
    background-image: url("../images/plr_cntrl_next_eps_icon.svg");
    background-position: 2px 4px;
    background-repeat: no-repeat;

}
.player-container .player-controls .controls .control:nth-child(6) {
    background-image: url("../images/plr_cntrl_eps_icon.svg");
    background-position: 2px 7px;
    background-repeat: no-repeat;
}
.player-container .player-controls .controls .control:nth-child(6).focused {
    background-image: url("../images/plr_cntrl_eps_actv_icon.svg");
    background-position: 2px 7px;
    background-repeat: no-repeat;
    background-size: 99%;
}
.player-container .player-controls .controls.live .control:nth-child(1) {
    display: block
}
.player-container .player-controls .controls.live .control:nth-child(2) {
    display: block
}
.player-container .player-controls .controls.live .control:nth-child(3) {
    display: block;
    background-size: 84%;
    margin-bottom: 14px;
}
.player-container .player-controls .controls.live .control:nth-child(3).focused {
       margin-bottom: 0px;
}
.player-container .player-controls .controls.live .control:nth-child(4) {
    display: none
}
.player-container .player-controls .controls.live .control:nth-child(5) {
    display: none
}
.player-container .player-controls .controls.live .control:nth-child(6) {
    display: none
}
.player-container .player-controls .controls.movie .control:nth-child(1),
.player-container .player-controls .controls.series .control:nth-child(1){
    display: block
}
.player-container .player-controls .controls.movie .control:nth-child(2),
.player-container .player-controls .controls.series .control:nth-child(2) {
    display: block
}
.player-container .player-controls .controls.movie .control:nth-child(3),
.player-container .player-controls .controls.series .control:nth-child(3) {
    display: none
}
.player-container .player-controls .controls.movie .control:nth-child(4),
.player-container .player-controls .controls.series .control:nth-child(4) {
    display: block
}
.player-container .player-controls .controls.movie .control:nth-child(5) {
    display: none;
}
.player-container .player-controls .controls.series .control:nth-child(5) {
    display: block
}
.player-container .player-controls .controls.movie .control:nth-child(6) {
    display: none;
}
.player-container .player-controls .controls.series .control:nth-child(6) {
    display: block
}
.player-container .player-controls .controls.adsPlay .control:nth-child(1){
    display: block;
}
.player-container .player-controls .controls.adsPlay .control:not(:nth-child(1)){
    display: none;
}
.player-container #player-controls.adsPlay .control:nth-child(1){
    display: block;
}
.player-container #player-controls.adsPlay .control:not(:nth-child(1)){
    display: none;
}
.player_page .side-menu {
    position: absolute;
    top: 0;
    right: 0;
    width: 28em;
    height: 100%;
    background: rgba(14, 30, 35, 1);
    display: flex;
    flex-direction: row;
    z-index: 99;
    visibility: hidden;
}
.player_page .side-menu.channels{
    width: 26em;
} 
.player_page .side-menu .menu-border {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 4em;
    height: 100%;
    border-left: 4px solid transparent;
    border-right: 4px solid transparent;
    box-shadow: 6px 0 20px 0 rgba(0, 0, 0, 0.2);
    background: linear-gradient(193deg, rgba(14, 30, 35, 1) 53%, rgba(14, 30, 35, 1) 33%, rgba(14, 30, 35, 1) 15%);
}
.player_page .side-menu.channels .menu-border {
    width: 3em;
}
.player_page .side-menu .menu-border.focused {
    background: rgba(50, 178, 188, 0.4);
    box-shadow: 0 0 10px rgba(50, 178, 188, 0.376);
    border: 4px solid #32b2bc  !important;
}
.player_page .side-menu .menu-border .arrow {
    height: 4em;
    width: 3em;
    background-size: contain;
    background: url(../images/side_panel_arrow.svg) no-repeat center;
}
.player_page .side-menu .menu-list-wrapper {
    position: relative;
    top: 0;
    left: 0;
    width: 25em;
    height: 100%;
    display: flex;
    flex-direction: column;
}
.player_page .side-menu .menu-list-wrapper .list-wrapper {
    height: auto;
    width: 25em;
    position: relative;
    top: 0;
    color: #fafafb;
    margin-bottom: 2em;
    padding: 5em 2em 0 0;
    box-sizing: border-box;
}
.player_page .side-menu .menu-list-wrapper .list-wrapper .list-header {
    text-align: right;
    font: normal normal bold 36px/46px Catamaran;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    margin-bottom: 1em;
    padding-right: 1em;
}
.player_page .side-menu .menu-list-wrapper .list-wrapper .list {
    list-style: none;
}
.player_page .side-menu .menu-list-wrapper .list-wrapper .list .check{
    content:url('../images/selctd_mark.svg');
    width: 1em;
    margin-right: 1em;
}
.player_page .side-menu .menu-list-wrapper .list-wrapper .list .list-item {
    font-family: Catamaran;
    font-size: 28px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.9;
    letter-spacing: normal;
    text-align: right;
    padding-right: 1em;
    box-sizing: border-box;
    border: solid 3px transparent;
}
.player_page .side-menu .menu-list-wrapper .list-wrapper .list .list-item.focused {
    box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 3px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376);
}
.player_page .side-menu .menu-list-wrapper .sub-list-wrapper {
    padding-top: 2em;
}
.player_page .side-menu.episode{
    width: 100%;
    background: rgba(14, 30, 35, 1);
}
.player_page .side-menu .menu-list-wrapper.episode {
    width: 100%;
    display: flex;
    flex-direction: row;
    align-items: start;
    justify-content: flex-start;
    background: none;
}
.player_page .side-menu .menu-list-wrapper .season-list {
    list-style: none;
    display: inline;
    width: 240px;
    font-size: 30px;
    overscroll-behavior-y: auto;
    overflow: hidden;
    margin-top: 80px;
    padding: 0;
}
.player_page .side-menu .menu-list-wrapper .season-list .list-item{
    background-color: transparent;
    border: 2px solid #fafafb;
    padding: 4px 22px 4px 22px;
    margin-bottom: 24px;
    box-sizing: border-box;
    font-family: Catamaran;
    font-size: 24px;
    font-weight: 700;
    font-stretch: normal;
    font-style: normal;
    line-height: 39px;
    letter-spacing: 0.42px;
    text-align: center;
    color:#fafafb;
    width: 240px;
    height: 48px;
    border-radius: 4px;
    overflow: hidden;
}
.player_page .side-menu .menu-list-wrapper .season-list .list-item.active{
    background: #32b2bc;
    border: 1px solid #32b2bc;
    color: #ffffff !important;
    border-radius: 4px;
    font-size: 24px;
}
.player_page .side-menu .menu-list-wrapper .season-list .list-item.focused{
    border: 1px solid #32b2bc;
    color: #32b2bc;
    border-radius: 4px;
}
.player_page .side-menu .menu-list-wrapper .season-list .list-item.focused.active {
    font-size: 28px;
}
.player_page .side-menu .menu-list-wrapper .episode-list {
    list-style: none;
    font-size: 30px;
    height: 100%;
    overflow-y: hidden;
    width: 1490px;
    padding: 0;
    margin-left: 30px;
    margin-top: 80px;
}
.player_page .side-menu .menu-list-wrapper .episode-list .list-item{
    width: 1480px;
    height: 270px;
    margin-bottom: 40px;
    font-size: 30px;
    display: flex;
    flex-direction: column;
    position: relative;
    top: 0;
}
.player_page .side-menu .menu-list-wrapper .episode-list .list-item .image{
    border-radius: 5px;
    width: 480px;
    height: 270px;
}
.player_page .side-menu .menu-list-wrapper .episode-list .list-item .image.focused {
    border: 4px solid #32b2bc;
}
.player_page .side-menu .menu-list-wrapper .episode-list .list-item .watched-progress {
    width: 448px;
    height: 8px;
    background: #4D4D4D;
    display: inline-block;
    padding: 0;
    border-radius: 0px 0px 0px 4px;
    position: absolute;
    left: 20px;
    bottom: 12px;
}
.player_page .side-menu .menu-list-wrapper .episode-list .list-item .watched-progress .progress-active{
    position: relative;
    left: 0;
    top: 0;
    width: 50%;
    height: 8px;
    background: #32b2bc;
}
.player_page .side-menu .menu-list-wrapper .episode-list .list-item .episode-number{
    margin-top: 5px;
    font-size: 20px;
    display: inline-block;
    margin-left: 3%;
}
.player_page .side-menu .menu-list-wrapper .episode-list .list-item .title{
    font-size: 24px;
    font-weight: 700;
    line-height: 39px;
    display: -webkit-box;
    margin-left: 24px;
    position: absolute;
    left: 33%;
    width: 750px;
    text-overflow: ellipsis;
    overflow: hidden;
    -webkit-line-clamp: 1;
    -webkit-box-orient: vertical;
    white-space: normal;
}
.player_page .side-menu .menu-list-wrapper .episode-list .list-item .description{
    margin-top: 12px;
    font-size: 22px;
    display: inline-block;
    margin-left: 24px;
    width: 970px;
    height: 216px;
    overflow: hidden;
    line-height: 36px;
    font-family: Catamaran;
    font-weight: 500;
    font-stretch: normal;
    font-style: normal;
    letter-spacing: normal;
    text-align: left;
    color: #e5e5e5;
    position: absolute;
    top: 15%;
    left: 33%;
}
.player_page .side-menu .menu-list-wrapper.channels {
    width:24em;
    align-items: center;
}
.player_page .side-menu .menu-list-wrapper .title-wrapper{
    width: 65%;
    height:0;
    position: relative;
    top: 4em;
}
.player_page .side-menu .menu-list-wrapper .title-wrapper .title,
.player_page .side-menu .menu-list-wrapper .title-wrapper .live-title{
    font-family: Catamaran;
    font-size: 28px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.29;
    letter-spacing: normal;
    text-align: left;
    color: #fafafb;
}
.player_page .side-menu .menu-list-wrapper .title-wrapper .sub-title,
.player_page .side-menu .menu-list-wrapper .title-wrapper .live-sub-title{
    font-family: Catamaran;
    font-size: 16px;
    font-weight: normal;
    font-stretch: normal;
    font-style: normal;
    line-height: 1.5;
    letter-spacing: normal;
    text-align: left;
    color: rgba(250, 250, 251, 0.8);
    width: 369px;
    height: 27px;
}
.player_page .side-menu .menu-list-wrapper .channels-list {
    list-style: none;
    display: inline;
    float: left;
    position: relative;
    left:40px;
    top: 6em;
    width: 12em;
    font-size: 30px;
    margin: 0;
    padding: 0;
    max-height: 32em;
    overflow-y: hidden;
}
.player_page .side-menu .menu-list-wrapper .channels-list .channel-list-item{
    padding: 10px 10px 0 10px;
    background-color: transparent;
    border: 2px solid transparent;
    width:auto;
    max-width: 11em;
    margin-bottom:0;
    text-align: center;
    box-sizing: border-box;
    font-size: 30px;
    color: #fafafb;
    position: relative;
}
.player_page .side-menu .menu-list-wrapper .channels-list .channel-list-item .player_live_card{
    width: 100%;
}
.player_page .side-menu .menu-list-wrapper .channels-list .channel-list-item.focused{
    background-color: rgba(50, 178, 188, 0.4);
    box-shadow: 0 0 10px rgba(50, 178, 188, 0.376);
    border: 2px solid #ff0000;
    color: #fafafb;
}
.player_page .side-menu .menu-list-wrapper .channels-list .channel-list-item.d-none{
    display: none;
}
.loader {
    position: absolute;
    top: calc(50% - 100px);
    left: calc(50% - 100px);
    z-index: 9;
}
.media {
    position: absolute;
    top: calc(50% - 45px);
    left: calc(50% - 32.5px);
    padding:0px;
    z-index: 9;
    display: none;
}
.media img {
    width: auto;
    height: auto;
    opacity: 0.8;
}

.player-container .player-controls .controls .control:nth-child(1),
.player-container .player-controls .controls .control:nth-child(2),
.player-container .player-controls .controls .control:nth-child(3),
.player-container .player-controls .controls .control:nth-child(4),
.player-container .player-controls .controls .control:nth-child(5),
.player-container .player-controls .controls .control:nth-child(6)
{
    background-position: 2px 7px;
    background-repeat: no-repeat;
    background-size: 96%;
    height: 135%;
}
.player-container .player-controls .controls .control:nth-child(6){
    background-size: 99%;
}
.player-container .player-controls .controls .control:nth-child(3).focused{
    background-position: initial;
}
.player-container .player-controls .seek-bar{
    top: 77.4%;
}
.play-active:nth-child(1) {
    background-image: url("../images/plr_cntrl_pause_icon.svg") !important;
}
.pause-active:nth-child(1) {
    background-image: url("../images/plr_cntrl_play_icon.svg") !important;
}
.play-active:nth-child(1).focused {
    background-image: url("../images/plr_cntrl_pause_actv_icon.svg") !important;
}
.pause-active:nth-child(1).focused {
    background-image: url("../images/plr_cntrl_play_actv_icon.svg") !important;
}
.player-container .player-controls .controls .control:nth-child(4).focused {
    background-image: url("../images/plr_cntrl_start_over_actv_icon.svg");
}
.player-container .player-controls .controls .control:nth-child(5).focused {
    background-image: url("../images/plr_cntrl_next_eps_actv_icon.svg");
}
::-webkit-scrollbar {
    width: 5px;
}
::-webkit-scrollbar-track {
    background: #70707026;
    box-shadow: inset 0 0 1px #707070;
}
::-webkit-scrollbar-thumb {
    background: #707070; 
}
.d-none{
    display: none;
}
.player-label {
    position:absolute;
    top: -70%;
    font-size: 1.4em;
    border: 1px solid #fafafb;
    background-color: #0e1e23;
    padding: 8px 10px;
    color: rgba(250, 250, 251, 0.8);
    text-shadow: none;
    display: none;
}
.player-label::before, .player-label:after {
    content: "";
    position: absolute;
    border-style: solid;
    border-color: transparent;
    top: 100%;
    left: 36px;
    transform: translate(-50%,0);
    border-bottom: 0;
}
.player-label::before {
    border-width: 10px;
    bottom: -10.4px;
    border-top-color: #fafafb;
}
.player-label::after {
    border-width: 9px;
    bottom: -9px;
    border-top-color: #0e1e23;
}
.control.focused .player-label {
    display: block;
}
.player_page .side-menu .menu-list-wrapper .channels-list .channel-list-item .player_live_card{
    filter: blur(2px);
    -webkit-filter: blur(2px);
    padding-bottom: 11px;
}
.channel-list-item .channel-list-icon{
    position: absolute;
    bottom: 18%;
    left: 30%;
    align-items: center;
    width: 150px;
    height: 116px;
}
.channel-list-item .strip_for_live_card{
    margin-left: -306px;
    width: 306px;
    position: absolute;
}
.pinpop-modal-dialog{
    pointer-events: auto;
}
.PlayerErrorScreen {
    width: 1920px;
    height: 1080px;
    background-color: #0e1e23;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.PlayerErrorImage {
    background: url('../images/not_avbl_icon.svg') no-repeat center;
    width: 135px;
    height: 122px;
    margin-bottom: 63px;
    background-size: 120px
}
.playerErrorMessage {
    width: 1500px;
    font-style: normal;
    font-weight: 400;
    font-size: 40px;
    line-height: 52px;
    color: white;
    text-align: center;
    margin-bottom: 88px;
    overflow: hidden;
    white-space: normal;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}
.PlayerErrorBackButton {
    font-style: normal;
    font-weight: 400;
    font-size: 28px;
    line-height: 31px;
    color: white;
    padding: 11px 72px;
}
.PlayerErrorBackButton.focused {
    border: solid 3px #32b2bc;
    background-color: #0e1e23;
    outline: none;
}
.thumb_preview{
    display: none;
    position: absolute;
    z-index: 99;
    top: -5.8em;
    left: -3em;
    transition: all 0.1s linear 0s;
}
/* VOD player CSS end */

/* Live channel detail page style css start*/
.right-sec-livedetail .sinopsis{
	width: 32em;
    margin-left: 4.4em;
    height: 4.5em;
    text-align: left;
    letter-spacing: 0;
    color: #fafafb;
    opacity: 1;
    white-space: pre-wrap;
    overflow: hidden;
    text-overflow: ellipsis;
    margin-bottom: 60px;
    font-size: 22px;
    font-style: normal;
    font-weight: normal;
    font-family: Catamaran;
    object-fit: contain;
    font-stretch: normal;
    line-height: 1.5;
    letter-spacing: normal;
}
.live-detail-section .back_btn_text{
	font-size: 30px;
    font: normal normal normal 28px/36px Catamaran;
}
.live-detail-section .back-btn.focused {
	box-shadow: 0 0 15px 0 #32b2bc;
    border: solid 2.5px #32b2bc;
    background-color: rgba(50, 178, 188, 0.376) !important;
}
.right-sec-livedetail{
    background: rgba(0, 0, 0, 0.5);
}
.live-detail-section .back-btn{
    display: table;
    justify-content: center;
    align-items: center;
    width: fit-content;
    padding: 6px 40px;
    margin-left: 6em;
    padding-right: 10em;
    border: 2.5px solid transparent;
}
.live-detail-section .back_btn_icon{
	margin-right: 70px;
}
.live-detail-section .back-btn img{
    width: 30px;
    height: 36px;
}
/* Live channel detail page style css end*/

/* signIn-signUp page CSS start*/
.signIn-signUp {
    width: 100vw;
    height: 100vh;
    display: flex;
    background-image: url(../images/signup-signin-bg2.webp), linear-gradient(271deg, #0C2744 54.01%, rgba(12, 39, 68, 0.40) 122.29%);
    background-color: lightgray;
    background-repeat: no-repeat;
    align-items: center;
}
.signIn-signUp-imgContainer {
    flex: 2;
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
}
.signIn-signUp-intro {
    color: #FFF;
    font-family: Catamaran;
    font-size: 52px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-left: 144px;
}
.signIn-signUp-logo {
    width: 257px;
    object-fit: contain;
    margin-left: 144px;
    z-index: 2;
    margin-bottom: 50px;
}
.signIn-signUp-line {
    width: 1px;
    height: 666px;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.signIn-signUp-redirectionContainer {
    flex: 2;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    width: 100%;
    height: 100%;
}
.signIn-signUp-heading {
    color: #FFF;
    font-family: Catamaran;
    font-size: 45px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    text-align: center;
}
.signIn-signUp-boxes {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
}
.credentials, .scanQR {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
}
.credentials-box, .scanQR-box {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 246px;
    height: 246px;
    border-radius: 8px;
    margin: 55px 18px 25px 18px;
    background: rgba(255, 255, 255, 0.10);
}
.credentials-titie, .scanQR-titie {
    color: #FFF;
    font-family: Catamaran;
    font-size: 28px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    text-align: center;
    width: 246px;
    text-overflow: ellipsis;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    white-space: normal;
}
.signIn-screen, .signUp-screen, .verification-screen, .resetpwd-screen {
    background: #000;
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    width: 100vw;
    height: 100vh;
}
.signIn-logo {
    width: 142px;
    height: 85px;
    object-fit: contain;
    margin-top: 43px;
}
.signIn-heading, .signUp-heading, .verification-heading, .resetpwd-heading {
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 48px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-top: 93px;
}
.signIn-info, .signUp-info, .verification-info, .resetpwd-info {
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 32px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 24px;
}
.signIn-Error-info, .signUp-Error-info, .verification-Error-info, .resetpwd-Error-info {
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    border: 3px solid #32b2bc;
    padding: 8px 16px;
    margin-top: 24px;
    width: 1000px;
}
.signIn-details-container, .signUp-details-container, .resetpwd-details-container {
    display: flex;
    align-items: flex-start;
    justify-content: center;
    flex-direction: column;
    margin-top: 30px;
}
.input-heading {
    color: #FFF;
    font-family: Catamaran;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
.signIn-input, .signUp-input, .resetpwd-input {
    display: flex;
    align-items: center;
    justify-content: center;
}
#signIn-email-input, #signIn-password-input, 
#signUp-name-input, #signUp-email-input, #signUp-password-input,
#resetpwd-email-input, #resetpwd-password-input {
    width: 1000px;
    height: 63px;
    padding-left: 12px;
    border-radius: 4px;
    color: #1D1D1D;
    background: #fff;
    font-family: Catamaran;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
}
#signIn-password-input, #signUp-password-input, #resetpwd-password-input {
    width: 933px;
    padding: 0px 12px;
}
.password-icon {
    display: flex;
    width: 59px;
    height: 60px;
    padding: 0px 12px;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: #FFF;
    margin-left: 4px;
}
.signIn-buttons-container, .signUp-buttons-container, .verification-buttons-container, .resetpwd-buttons-container {
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: 1000px;
    height: 70px;
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin: 30px 0;
}
.signIn-back-btn, .signIn-forgotpwd, .signIn-next-btn,
.signUp-back-btn, .signUp-forgotpwd, .signUp-next-btn,
.verification-back-btn, .verification-next-btn,
.resetpwd-back-btn, .resetpwd-next-btn, .resetpwd-confirm-btn {
    padding: 16px 59px;
    border-radius: 4px;
}
.signIn-back-btn, .signUp-back-btn, .verification-back-btn {

}
.signIn-forgotpwd, .signUp-forgotpwd {

}
.signIn-next-btn, .signUp-next-btn, .verification-next-btn, .resetpwd-next-btn {
    background: rgba(255, 255, 255, 0.20);
}
.signUp-redirect, .signIn-redirect, .verification-resend, .resetpwd-resend {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1000px;
    height: 63px;
    padding: 0 20px;
    border-radius: 4px;
    border: 2px solid #fff;
}
.signUp-redirect>span, .signIn-redirect>span, .verification-resend>span, .resetpwd-resend>span {
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 24px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
}
.signUp-redirect span:nth-child(2), .signIn-redirect span:nth-child(2), .verification-resend span:nth-child(2), .resetpwd-resend span:nth-child(2) {
    font-weight: 700;
    margin-left: 4px;
}
.verification-heading, .resetpwd-heading {
    margin-top: 10px;
}
.verification-logo {
    width: 90px;
    height: 90px;
    margin-top: 46px;
}
.verification-input-container, .resetpwd-input-container {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1000px;
    margin: 20px 0;
}
.verification-input-container .codeInput, .resetpwd-input-container .codeInput{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 74px;
    height: 74px;
    padding: 11px 0px;
    border-radius: 4px;
    margin-right: 10px;
    color: #0C2744;
    text-align: center;
    font-family: Catamaran;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.resetpwd-confirm-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1000px;
    height: 63px;
    border: 2px solid #fff;
    border-radius: 4px;
}
.resetpwd-popup {
    display: flex;
    align-items: center;
    justify-content: center;
    position: absolute;
    top: 0;
    z-index: 2;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.6);
}
.resetpwd-popup-box {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background: #191919;
    border: 2px solid #32b2bc;
    padding: 40px;
}
.resetpwd-popup-heading {
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 32px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-top: 60px;
}
.resetpwd-popup-info {
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 24px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    margin-top: 40px;
}
.resetpwd-popup-img {
    width: 100px;
    height: 100px;
    margin-top: 40px;
}
.resetpwd-popup-btn {
    display: flex;
    width: 464px;
    height: 48px;
    padding: 0px 20px;
    justify-content: center;
    align-items: center;
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin: 40px 0px;
    border-radius: 4px;
    background: #32b2bc;
}

.verification-screen {
    position: absolute;
    top: 0;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.6);
    z-index: 3;
}
.verification-screen-popup {
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    width: 1000px;
    padding: 60px;
    border: 2px solid #32b2bc;
    background: #191919;
}
.verification-screen-heading {
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 38px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.verification-screen-input-container {
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 32px;
}
.verification-screen-left {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    flex-direction: column;
    margin-right: 32px;
    height: 340px;
}
.verification-screen-left-text {
    color: #FFF;
    font-family: Catamaran;
    font-size: 26px;
    font-style: normal;
    font-weight: 400;
    line-height: normal;
    width: 560px;
    margin-bottom: 53px;
}
.verification-screen-left-inputs {
    display: flex;
    align-items: center;
    justify-content: center;
}
.verification-screen-left-error-info {
    color: #32b2bc;
    text-align: center;
    font-family: Catamaran;
    font-size: 24px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
    margin-top: 50px;
}
.verification-screen-right .keyBoard{
    background-color: #191919;
    box-shadow: 0 3px 20px 0 rgba(0, 0, 0, 0.84);
}
.verification-screen-resend-btn {
    display: flex;
    height: 48px;
    padding: 0px 20px;
    flex-direction: row;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    border: 1px solid #FFF;
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 24px;
    font-style: normal;
    font-weight: 300;
    line-height: normal;
    margin: 32px;
    width: 100%;
    overflow: hidden;
}
.verification-screen-resend-btn span:not(:last-child) {
    margin-right: 10px;
}
.verification-screen-resend-btn span:not(:nth-child(1)) {
    font-weight: 700;
}
.verification-screen-btnContainer {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
}
.verification-screen-backBtn {
    display: flex;
    width: 398px;
    height: 48px;
    padding: 0px 20px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.verification-screen-confirmBtn{
    display: flex;
    width: 398px;
    height: 48px;
    padding: 0px 20px;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    border-radius: 4px;
    background: rgba(255, 255, 255, 0.20);
    color: #FFF;
    text-align: center;
    font-family: Catamaran;
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: normal;
}
.verification-screen .pinBlock {
    padding: 0;
    display: flex;
    align-items: center;
    justify-content: center;
}
.signIn-signUp .language {
    top: 50px;
}

.credentials-box.focused, .scanQR-box.focused,
.signIn-back-btn.focused, .signIn-forgotpwd.focused , .signIn-next-btn.focused, .signUp-redirect.focused,
.signUp-back-btn.focused,  .signUp-forgotpwd.focused, .signUp-next-btn.focused, .signIn-redirect.focused,
.verification-back-btn.focused, .verification-next-btn.focused, .verification-resend.focused, 
.resetpwd-back-btn.focused, .resetpwd-next-btn.focused, .resetpwd-confirm-btn.focused, .resetpwd-resend.focused, .password-icon.focused,
.verification-screen-confirmBtn.focused,  .verification-screen-backBtn.focused{
    background: #32b2bc;
    border: none;
}
#signIn-email-input.focused, #signIn-password-input.focused, 
#signUp-name-input.focused, #signUp-email-input.focused, #signUp-password-input.focused,
#resetpwd-email-input.focused, #resetpwd-password-input.focused,
.verification-screen-resend-btn.focused {
    border: 2px solid #32b2bc;
}
#lottie-animation {
    position: absolute;
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(0,0,0,0.6);
    z-index: 99;
}
/* signIn-signUp page CSS end*/

/* Pin control popup css for player page */
.player_page #parentalBlock {
    padding: 1em 2em;
}
.player_page .pinControlRow {
    padding: 1.3em 0 0.5em 0;
}
.player_page .parentalPin {
    margin: 2em 0 4em 0;
}
.player_page .pinBlock {
    padding: 2.3em 1em 1em 1em;
}
.player_page .error-msg-block {
    margin: 4.5em 0em 0em 0em;
    left: 13%;
}
.player_page .pinControlRow .keyBoard {
    margin-left: 1em;
}
.player_page #side-menu-language {
    background-image: url("../images/side_panel_brandng_asts.svg");
    background-repeat: no-repeat;
}

/* Portarait images css */
.portraitImg .customCard {
    height: 347px;
}
.portraitImg .customsec {
   margin-top: 0;
   margin-bottom: 0;
   margin-right: 0;
   height: 347px;
   width: 240px;
   min-width: 240px;
   overflow: hidden;
}
.portraitImg .cardsection.focused .customcard-body {
    height: 347px !important;
}
.portraitImg .customcard-body {
    height: 347px !important;
    padding: 9px;
}
.portraitImg .img-class {
    height: 322.5px;
    width: 215px;
}
.portraitImg .titleheader {
    margin-left: 15px;
}
.portraitImg .plus_icon {
    left: 38%;
    top: -220px;
}
.portraitImg .cardsection .viewall {
    top: -57%;
}
.tvLinkColor{
    color:#32b2bc;
}
button:focus {
    outline: none;
}

#networkModal .modal-dialog{
    max-width: 100%;
    height: 100%;
    margin: 0px;
}
.network-connection-div {
    height: 1080px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #0e1e23;
    width: 100%;
}
 
.network-connection-div .content-div {
    /*text-align: center;
    margin-top: 162px;*/
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
}
 
.network-connection-div .content-div .title {
    font-family: Catamaran;
    font-size: 80px;
    font-weight: 700;
    line-height: 104px;
    text-align: center;
    margin: 32px 0px;
}
.dialog-content {
    margin-bottom:48px;
}
.dialog-content, 
.network-connection-div .content-div {
    font-family: Catamaran;
    font-size: 28px;
    font-weight: 400;
    line-height: 35.28px;
    text-align: center;
}
 
.content-div .network-btns-div {
    justify-content: center;
}
 
.content-div .network-btns-div .left-btns {
    display: flex;
    /* gap: 16px; */
}
#retryBtn{
    margin-right:16px;
}
 
.content-div .network-btns-div .left-btns button {
    font-family: Calibri;
    font-size: 28px;
    font-weight: 700;
    line-height: 34.18px;
    padding: 16px 48px;
    border-radius: 4px;
    color: #ffffff;
    background-color: #FCFCFC4D;
}
#retryBtn.focused, #exitBtn.focused{
    background-color: #32b2bc!important;
}
 
.btn-primary {
    background: #03AAD3;
}
 
.btn-secondary {
    background: #FCFCFC4D;
}