﻿@charset "UTF-8";
/* CSS Document */

.height-control img {
    height: 9.041666666667vw;
    width: 100%;
}

.news-card .height-control img {
    height: 8.241666666667vw;
    width: 100%;
}

.logo-background {
    background-color: #232426;
}

.yupptv-logo-width {
    width: 100%;
}

.yupptv-logo-img-padding {
    padding: 0px 10px;
}

.premiumicon {
    margin-top: 0.520833333vw;
    position: absolute;
    margin-left: 1px;
}

.grid-logo-align-center {
    margin-top: 25%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    margin-bottom: 25%;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
}

.grid-logo-align {
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
}

.yupptv-blur-img-center-align {
    position: absolute;
    height: 100%;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.thumbnail-card-logo-margin {
    margin-top: 3.645833333vw;
}

.yupptv-card-box-shadow-thumbnail {
    /*box-shadow: 0 1px 4px 0 rgba(0, 0, 0, 0.2);*/
    margin-bottom: 4px;
}

    .yupptv-card-box-shadow-thumbnail:hover {
        border-radius: 4px;
    }

.yupptv-black-line-seperator {
    height: 1px;
    opacity: 0.5;
    background-color: #000000;
}

.yupptv-gray-line-seperator {
    height: 1px;
    opacity: 0.2;
    background-color: #9ea2ac;
}

.yupptv-thumbnail-premium-icon {
    margin-top: 10px;
    position: absolute;
    width: 4.791666666666667vw;
}

.yupptv-left-border-radius {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.yupptv-right-border-radius {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.yupptv-thumbnail-premium-text {
    top: 0.15625vw;
    margin-left: 10.820513%;
    position: absolute;
    vertical-align: middle;
}

.yupptv-premium-text {
    top: 1px;
    margin-left: 12.820512821%;
    position: absolute;
    vertical-align: middle;
}

.yupptv-gradient-zoom:after {
    background: linear-gradient(to bottom, rgba(0, 0, 0, 0.5) 0%, rgba(0, 0, 0, 0) 15%, rgba(0, 0, 0, 0) 70%, rgba(0, 0, 0, 0.85) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#40000000', endColorstr='#a6000000', GradientType=0);
    top: 0px;
    height: 100%;
    content: '';
    position: absolute;
    display: block;
    border-radius: 0px;
    width: 100%;
}

.yupptv-gradient-zoom:hover {
    width: 100%;
    margin: auto;
}

.yupptv-blur {
    -webkit-filter: blur(10px);
    filter: blur(10px);
}

.yupptv-trending-channel {
    background-image: url("/assets/3.jpg");
    height: auto;
    opacity: 0.7;
    padding: 25% 0;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.yupptv-gradient-bottom {
    width: 100%;
    margin: auto;
}

    .yupptv-gradient-bottom:after {
        display: block;
        position: absolute;
        background-image: linear-gradient( to bottom, rgba(255, 255, 255, 0) 30%, rgba(0, 0, 0, 0.40) 100%);
        top: 0px;
        content: '';
        height: 100%;
        width: 100%;
    }

.yupptv-gradient-right {
    width: 100%;
    margin: auto;
}

    .yupptv-gradient-right:after {
        display: block;
        position: absolute;
        background: linear-gradient(to right, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.77) 53%, rgba(0, 0, 0, 0.8) 55%, rgba(0, 0, 0, 1) 100%);
        filter: progid: DXImageTransform.Microsoft.gradient( startColorstr='#00000000', endColorstr='#000000', GradientType=1);
        top: 0px;
        content: '';
        height: 100%;
        width: 100%;
    }

.yupptv-zoom {
    -webkit-transition-duration: .3s;
    transition-duration: .3s;
    -webkit-transition-timing-function: ease-out;
    transition-timing-function: ease-out;
}

    .yupptv-zoom:after {
        border-radius: 4px;
        height: 100%;
        width: 100%;
        -webkit-transform: scale(1, 1);
        -ms-transform: scale(1, 1);
        transform: scale(1, 1);
        -webkit-transition-duration: .3s;
        transition-duration: .3s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
    }

    .yupptv-zoom:hover {
        background: #373737;
        border-radius: 4px;
        -webkit-transform: scale(1.1, 1.1);
        -ms-transform: scale(1.1, 1.1);
        transform: scale(1.1, 1.1);
        -webkit-transition-duration: .7s;
        transition-duration: .7s;
        -webkit-transition-timing-function: ease-out;
        transition-timing-function: ease-out;
    }

.yupptv-overflow {
    overflow: hidden;
    position: relative;
}

.yupptv-watchcount-text {
    top: 0.520833333vw;
    padding-right: 0.520833333vw;
    position: absolute;
}

.yupptv-red-circle {
    width: 6px;
    height: 6px;
    background-color: #ed1c24;
    border-radius: 50%;
    margin-top: 8px;
    margin-right: 5px;
    float: left;
}

.yupptv-grid-red-circle {
    width: 0.4166666666666667vw;
    height: 0.4166666666666667vw;
    background-color: #ed1c24;
    border-radius: 50%;
    position: absolute;
}

.yupptv-text-padding {
    margin: 3px 8px;
}

.yupptv-thumbnail-circle-margin {
    position: absolute;
    bottom: 10px;
    left: 15px;
}

.yupptv-grid-circle-margin {
    top: 0.9375vw;
    left: 0.78125vw;
}

.yupptv-card-text {
    bottom: 1.666666667vw;
    left: 1.614583333vw;
    position: absolute;
}

.yupptv-card-text-margin-grid {
    left: 14.903846154%;
}

.yupptv-card-subtext {
    font-size: 1.1428571428571428em;
    color: #333;
}

.yupptv-card-title {
    top: 0.625vw;
    margin-left: 1.614583333333333vw;
    color: #ffffff;
}

.yupptv-card-sub-title {
    padding-left: 1.614583333333333vw;
    color: #9ea2ac;
    margin-top: 0.625vw;
}

.yupptv-grid-shadow-box {
    box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.55);
    border-radius: 4px;
}

.premium-tag-font {
    font-size: 0.875em;
    font-style: italic;
    position: absolute;
    margin-left: 0.520833333vw;
    text-align: center;
}

.premium-tag-font-grid {
    font-size: 0.875em;
    font-style: italic;
    position: absolute;
    margin-left: 0.572916667vw;
    text-align: center;
}

.premium-tag-grid {
    font-size: 0.875em;
    font-style: italic;
    position: absolute;
    left: 0;
    width: 85%;
    text-align: center;
}

.premium-tag-font-tvs {
    font-size: 1em;
    font-style: italic;
    position: absolute;
    margin-left: 0.520833333vw;
    text-align: center;
}

.watching-count-font {
    font-size: 0.875em;
}

.card-title-font {
    font-size: 0.875em;
}

.yupptv-grid-background {
    background-color: #222325;
    box-shadow: 0px 2px 4px 0 rgba(0, 0, 0, 0.55);
    border-top-left-radius: 4px;
    border-top-right-radius: 4px;
}

.yupptv-grid-cardtext-box {
    background-color: #1d1e20;
    box-shadow: 0px 2px 6px 0 rgba(0, 0, 0, 0.55);
    border-bottom-left-radius: 4px;
    border-bottom-right-radius: 4px;
    margin-bottom: 1%;
    padding: 0px;
}

.ellipsis {
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.yupptv-img-width {
    width: 100% !important;
}

.yupptv-squarecard-btn {
    font-size: 1em;
    border-radius: 3px;
    color: #888;
    background-color: transparent;
    border: solid 1px #b8b8b8;
    outline: none;
    padding: 3px 8px;
}

.yupptv-text-align-left {
    text-align: left;
}

.yupptv-news-text {
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 1.049868766vw;
    white-space: normal;
    font-size: 1.1428571428571428em;
    background: #FFF;
}

.yupptv-news-subtext {
    padding-top: 5px;
    padding-bottom: 15px;
    padding-left: 15px;
    padding-right: 15px;
    color: #888888;
    font-size: 0.875em;
    background: #FFF;
    border-radius: 4px;
}

.yupptv-news-subtext-ct {
    padding-top: 6px;
    padding-bottom: 10px;
    padding-left: 15px;
    padding-right: 1.049868766vw;
    color: #888888;
    font-size: 1em;
    background: #FFF;
    border-radius: 0px 0px 4px 4px;
}

.yupptv-news-text-ct {
    padding-top: 10px;
    padding-left: 15px;
    padding-right: 1.049868766vw;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    font-size: 1.1428571428571428em;
    background: #FFF;
    color: #555 !important;
}

.yupptv-news-card {
    position: absolute;
    right: 8px;
    bottom: 4px;
    width: 62px;
    line-height: 15px;
}

.yupptv-news-clock-img-margin {
    margin-right: 4px;
    float: left;
}

.yupptv-news-channel-margin {
    float: left;
    font-size: 1.0em;
    line-height: 20px;
}

.yupptv-news-channel-category-margin {
    /*margin-right: 15px;*/
}

.yupptv-news-showtime-font {
    font-size: 1em;
    color: #FFFFFF;
}

.yupptv-news-text-big {
    padding-top: 2.049868766vh;
    padding-bottom: 2.049868766vh;
    padding-left: 0px;
    padding-right: 0px;
    margin-right: 1.8vh;
    white-space: normal;
    font-size: 1.4em;
    position: absolute;
    right: 1vw;
    top: 2.2047vw;
    width: 9.9737vw;
    border-bottom: 1px solid #888888;
}

.yupptv-news-subtext-big {
    padding-top: 3.5vh;
    display: block;
    padding-bottom: 12px;
    color: #888888;
    font-size: 0.675em;
    padding-right: 1.049868766vw;
    position: absolute;
    right: -1vw;
}

.yupptv-tvshow-title {
    font-size: 1.1428571428571428em;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
    width: 90%;
    /*	padding-top: 6px;*/
}

.yupptv-tvshow-timings {
    /*padding-top: 4px;*/
    color: #888888;
    font-size: 1em;
    text-overflow: ellipsis;
    white-space: nowrap;
    overflow: hidden;
}

.yupptv-tvShows-card {
    background-color: #FFF;
    margin-right: 15px;
}

.yupptv-tvshow-line-indicator-beforewatch {
    background-color: #4a4a4a;
}

.yupptv-tvshow-logo {
    padding: 10px 0px;
}

.yupptv-tvshow-line-indicatoe-watch {
    height: 2px;
    opacity: 1;
    background-color: #ff4e00;
}

.yupptv-tvshow-card-footer-margin {
    margin-bottom: 10px;
    margin-top: 10px;
    margin-left: 15px;
    margin-right: 0px;
}

.yupptv-show-title-margin {
    /*margin-left: 15px;*/
    color: #333;
}

.yupptv-tray-margin-bottom {
    margin-bottom: 59px;
}



.yupptv-payPerViewCard-title {
    padding: 3px 5px 0px;
    font-size: 1.1428571428571428em;
}

.yupptv-payPerViewCard-year {
    padding: 3px 5px 5px;
    font-size: 1em;
    color: #888888;
}

/* For new live tv card*/

.yupptv-card-box-shadow-thumbnail {
    /*    box-shadow: 0 1px 3px rgba(0, 0, 0, 0.85);*/
    border-radius: 4px;
    margin-bottom: 4px;
}

.yupptv-left-border-radius {
    border-top-left-radius: 4px;
    border-bottom-left-radius: 4px;
}

.logo-background {
    background-color: #FFF;
}

.grid-logo-align {
    position: absolute;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    top: 50%;
    left: 50%;
}

.yupptv-logo-img-padding {
    padding: 0px 10px;
}

.yupptv-logo-width {
    width: 100%;
}

.yupptv-overflow {
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.25);
}

.live-card-yupptv-overflow {
    overflow: hidden;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0);
}

.yupptv-right-border-radius {
    border-top-right-radius: 4px;
    border-bottom-right-radius: 4px;
}

.yupptv-img-width {
    width: 100%;
}

.premium-tag-font {
    font-size: 0.875em;
    font-style: italic;
    position: absolute;
    margin-left: 0.520833333vw;
    text-align: center;
}

.premiumicon {
    margin-top: 0.520833333vw;
    position: absolute;
    margin-left: 1px;
}
