/*group list*/
.group{padding: 49px 0 49px 72px;}
.group li{margin: 0 33px 0 0; text-align: center; float: left;width: 149px;height: 201px;}
.group .logo{border-radius: 6px; -moz-border-radius: 6px;}
.group .group-title{display: block;  color:#474747;font-size: 14px;font-weight: bold;white-space: pre-wrap;text-overflow: ellipsis;}

/*group-info*/

.group-info{padding:14px 31px;}

.group-info .all-group{font-size: 14px; color: #474747; font-weight: bold; text-decoration: none; padding: 16px 13px 12px 51px; position: relative; border:1px solid #eee;
    border-radius: 5px; -moz-border-radius: 5px; display: inline-block;}
.group-info .all-group:hover{background:#f6f6f6;}
.group-info .all-group:after{content: " "; width: 0; height: 0; border-top: 12px solid transparent;	border-right: 20px solid #ccc;	border-bottom: 12px solid transparent;
    position: absolute; top:13px; left: 14px;}

.group-info .group-info-box{margin:0 0 21px 0;}
.group-info .group-info-box #content{/* position: absolute; */left: -31px;width: 1036px; margin: 0 auto;}
.group-info .group-info-box #content .b-tv object {height: 583px;}
.group-info .head-block h1{padding-top: 10px;}

.group-info .channel-list{margin: 27px 0; background:#f6f6f6; text-align: center; padding: 10px 20px 20px 20px; border:1px solid #eee; border-radius: 5px; -moz-border-radius: 5px; position: relative;}
.group-info .channel-list .group-channels {text-align: left;}
.group-info .channel-list .top-button {margin: 6px 6px 14px 0;}
.group-info .group-channels .channel{margin: 0 10px 10px 0; position: relative; float: left; display: block;background: #fff;border: 1px solid #ccc;}
.group-info .group-channels a{overflow: hidden; width: 268px; height: 108px; padding: 15px;}
.group-info .group-channels a:focus {outline:none; box-shadow: inset 0 0 0 3px #bbb;}
.group-info .group-channels .active:before {
    content: "now-playing";
    display: inline-block;
    background: red;
    color: #fff;
    padding: 0 4px;
    position: absolute;
    right: 0;
    top: 0;
}
.group-info .group-channels img{float: left; border:1px solid #e7e7e7; vertical-align: top; margin-right: 11px;}
.group-info .group-channels span{display: block; font-size: 14px; font-weight: bold; color:#474747; text-decoration: none;overflow: hidden;white-space: nowrap;text-overflow: ellipsis;}
.group-info .group-channels p{font-size: 13px; color: #474747; height: 82px; overflow: hidden; padding-bottom: 0;}
.group-info .channel-info{width: 180px; height: 76px; overflow: hidden;}
.group-info .channel-info .channel_title { min-width: 160px; display: inline-block;}
.group-info .nearby .crumb{cursor: pointer; padding:5px 25px ;font-size:14px;  position: relative; border:1px solid #eee;
    border-radius: 5px; -moz-border-radius: 5px; display: inline-block; }
.group-info .nearby img{vertical-align: middle; margin: 0 12px;}
.group-info .nearby .crumb:hover{background:#f6f6f6;}

.group-info .nearby .crumb.left[data-icon]:before{left: 0}
.group-info .nearby .crumb.right[data-icon]:before{right: 0}
.group-info .nearby .crumb[data-icon]:before{
    top: 50%;
    color: #717171;
    margin-top: -0.5em;
    position: absolute;
    font-size: 1.2em;
}

.group-info .share-layer-description {
    top: 55px;
    margin-top: 0;
}

.group-info #share-layer {
    top: 121px;
}

.group-info #share-layer .title-share-channel {
    margin: 35px auto 20px;
}

.group-info #vod_suggestions {
	top: 33% !important;
}

.group-info #share-layer img {
    float: none;
    margin: 0;
}
.group-info .share-layer-description a.share-closer {
    margin-top: 20px;
}

.group-info .nearby {
    text-align : center;
    width: 100%;
}


.group-info .nearby .all {
    padding-left : 40px;
}

.group-info #referrals-link {
    background-color : #f6f6f6;
    border-bottom    : none;
    border-radius    : 5px;
    margin-bottom    : 15px;
}

#content.hovered .containeer-control, #content.hovered .switch .button {
    visibility : visible;
    opacity: 1;
    transition: all .7s;
    -moz-transition: all .7s;
    -webkit-transition: all .7s;
    -o-transition: all .7s;
}

.group-info .containeer-control, .group-info .switch .button {
    visibility : hidden;
    position   : absolute;
    z-index    : 1;
}

.group-info .containeer-control {
    opacity: 0;
    bottom: 120px;
    left: 0;
    right: 0;
    padding: 24px 70px;
    background-color: rgb(0, 0, 0);
    background-color: rgba(0, 0, 0, 0.8);
    transition: all .7s ease 3s;
    -moz-transition: all .7s ease 3s;
    -webkit-transition: all .7s ease 3s;
    -o-transition: all .7s ease 3s;
}

.group-info .containeer-control .tvg {
    background : none;
}

.group-info .containeer-control .tvg_car {
    color : #fff;
    font  : normal 14px/21px Helvetica, Tahoma, sans-serif;
}

.group-info .containeer-control #tvg_carousel {
    list-style : none;
}
#tvg_carousel  .prog-title {
    color: #A09B9B;
    margin-top: 10px;
}

.group-info .containeer-control #tvg_carousel li .button{
    padding: 4px;
    font-size: 12px;
}
.group-info .containeer-control #tvg_carousel li {
    max-height : 210px;
    overflow-y : auto;
    overflow-x : hidden;
}

.group-info .containeer-control #tvg_carousel li::-webkit-scrollbar {
    width : 10px;
    height: 16px;
    cursor: pointer;
}

.group-info .containeer-control #tvg_carousel li::-webkit-scrollbar-thumb {
    background-color  : rgba(43, 43, 43, 0.82);
    -webkit-box-shadow: inset 1px 0px 3px rgb(214, 214, 214);
    border-radius     : 50px;
    border            : 1px solid rgb(92, 92, 92);
}

.group-info .containeer-control #tvg_carousel .time_item {
    color     : rgb(255, 255, 255);
    color     : rgba(255, 255, 255, 0.5);
    font-size : 11px;
}

.group-info #content .loading {
    width            : 37px;
    height           : 37px;
    position         : absolute;
    top              : 50%;
    left             : 50%;
    z-index          : 10;
    margin           : -18px 0 0 -18px;
    background-image : url(../../../img/loaders/loader-gray-big.gif);
}

.group-info .switch .button.gray:after, .group-info .containeer-control .list::after {
    background-image  : url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAABIAAAAzCAMAAACt4Kj2AAABhlBMVEXR0dFzc3PQ0NBzc3NycnJra2tzc3Nra2tycnItLS0uLi6oqKh4eHh4eHhxcXFxcXFzc3NFRUXY2NjX19dsbGxFRUXMzMz////ExMT///9xcXH///90dHT///94eHjU1NRzc3NxcXH////Q0NBtbW3Pz894eHjS0tL///+ysrKtra3z8/PW1tbq6uo2NjYAAAAAAADY2Njq6urq6uqIiIgAAAD///9xcXEAAABycnL///94eHj///9ycnJ1dXXy8vIUFBRxcXH///9xcXHt7e1xcXHv7+9xcXEAAADh4eHu7u5xcXHt7e3////h4eFzc3Pi4uLq6upsbGz09PT///94eHh4eHhxcXEUFBQAAADq6ur///8AAABxcXFxcXHd3d2CgoK4uLiAgIB5eXmUlJSEhITMzMzLy8t+fn65ubk+Pj5ERETh4eHi4uK3t7f///+9vb3c3Nzj4+NAQEB9fX3b29vk5OTOzs5sbGySkpKMjIydnZ3Kysp8fHy+vr53d3fq6upxcXHrumXfAAAAXXRSTlP9/v77+fn+/f37+V4KDgoN7fTy8vL370D3Ej8Xlw0W+fcSDvLv7RX7Fjo6l+8S7Q4K+QoNOhcJCRaxChQUroCAsSMTE7GuriQUrrF4s3mx/q4TzM4kAbEBswEBAQDN4tIPAAABrUlEQVR42lXP51MTURTG4fPFDyiIFBFUkGJBSSChBKRjocNQooHsuWNZCRpqSAglhL1/uufwXhby+7TzzLkz+xLflO5n7k/jmyCr8YGB+CqMINY21FsLIyfFuqdFa9fUSGRNZG9oaA8mpHKSH2EeyZ/cGKUXrD3Iz7M0nz+wdiFNIvtZFbXsvhgdyrNBdg3K00PaurY2tw5Zz1l7vUXbaqdiIqcq28TOQmFiZ9GoyLGIEiwSEZkWEYLlent/QIRgD/v6qkRAsBhzTOWOvlUzP045gnw3NbUPPsII4vtPGo2BESQoNDUHxnxVI9wUMi0vzpwRbjKfmLudkd6oSOMZsYkUyU35TEVtV412Ar/wnl0fhP7S7IUfmDHI53NjLpfJE/NhEI9YLQjehqL/5S2qtXU4EYL57a9FvogIwX53vfEhQrBXrZ3vRECwUeZRCMiVWjJLqUp6aYyZrCSjgdDchkoJ5KB8VTKlKaXh58OAzeTK0YonNCfXAHbRuZEAt+QrPWIE+ify02zM3KNk8Vdx86oMBHHiWYKTwIpBwHBQiBWD0J9wUFjP7aC7PAz6D7zZR56mppSgAAAAAElFTkSuQmCC);
    background-repeat : no-repeat;
}

.group-info .switch .button {
    font-size : 14px;
}

.group-info .switch .button.gray:after {
    content  : "";
    position : absolute;
    display  : block;
    height   : 17px;
}

.group-info .switch .button.gray.prev:after, .group-info .switch .button.gray.next:after {
    width : 9px;
    top   : 7px;
}

.group-info .switch .button.gray.prev:after {
    left                : 8px;
    background-position : 0 -17px;
}

.group-info .switch .button.gray.next:after {
    right               : 6px;
    background-position : -9px -17px;
}

.group-info .switch .button.next, .group-info .switch .button.prev {
    top : 82px;
}


.group-info .switch .button.next {
    right   : 10px;
    padding : 7px 25px 7px 10px;
}

.group-info .switch .button.prev {
    left    : 5px;
    padding : 7px 7px 7px 27px;
}

.group-info .containeer-control .on-now-item, .group-info .containeer-control .on-next-item {
    display            : block;
    padding            : 0 2px;
    width              : 65px;
    text-align         : center;
    color              : #fff;
    text-shadow        : 1px 1px 2px #000;
    height             : 21px;
    border-radius      : 2px;
    -moz-border-radius : 2px;
    font               : bold 10px/21px Helvetica, Tahoma, sans-serif;
    text-transform     : uppercase;
    -moz-box-sizing    : border-box;
    box-sizing         : border-box;
}

.group-info .containeer-control .on-now-item {
    background : #c13434 no-repeat 0 0 none;
}

.group-info .containeer-control .on-next-item {
    background : #909090 no-repeat 0 0 none;
}
.group-info .containeer-control .tvg-promo {
    box-shadow: none;
}

.group-info .containeer-control .list {
    position: absolute;
    display: block;
    width: 70px;
    top: 0;
    bottom: 0%;
    cursor: pointer;
}
        .group-info .containeer-control .list::after {
            content: "";
            position: absolute;
            top: 50%;
            width: 10px;
            height: 18px;
            margin-top: -9px;
        }
    .group-info .containeer-control .tvguide-button-prev {
        left: 0;
    }
        .group-info .containeer-control .tvguide-button-prev::after {
            background-position: 1px 1px;
            left: 60%;
            margin-left: -5px;
        }
    .group-info .containeer-control .tvguide-button-next {
        right: 0;
    }
        .group-info .containeer-control .tvguide-button-next::after {
            background-position: -9px 1px;
            right: 60%;
            margin-right: -5px;
        }

.group-info #tvg_carousel .name {
    margin-top    : 10px;
    display       : inline-block;
    max-width     : 590px;
    overflow      : hidden;
    text-overflow : ellipsis;
    white-space   : nowrap;
}

.group-info .containeer-control .duration, .group-info .containeer-control .finished_in_holder {
    position : absolute;
    color    : #fff;
    font     : normal 14px/21px Helvetica, Tahoma, sans-serif;
    top      : 65px;
}

.group-info .containeer-control .finished_in_holder {
    right : 70px;
}

.group-info .containeer-control .duration {
    left : 220px;
}

.group-info #trialView {
    text-align: center;
}

.group-info #trialView .alert {
    text-align: left;
}

.group-info #trialView .message {
    padding: 10px 0;
}

.group-info #trialView #continue_free_sd_button {
    margin-top: 10px;
}

/*=================hot task FILMONCOM-2870 =====================*/
.base-box{
    padding-top: 0;
}

.group-info .switch.t .button {
    visibility: visible;
}

.group-info .switch.t .button.next, .group-info .switch.t .button.prev {
    top : 28px;
}

.group-info .switch.t .button.prev {
    left: 0px;
    z-index: 16;
}

.group-info .switch.t .button.next {
    right: 0px;
    z-index: 16;

}


.group-info .player-group .nearby .crumb{
    padding: 7px 0;
    width: 80px;
    text-align: left;
}

.group-info .player-group .nearby .prev {
    /*position: absolute;*/
    left: 0px;
    z-index: 10;
    /*top: 3px;*/
    font-weight: normal;
    padding-left: 20px;
    padding-right: 5px;
}


.group-info .player-group .nearby .green-button {
    position: absolute;
    z-index: 10;
    top: 10px;
    left: 120px;

}
.group-info .player-group .nearby .next {
    /* position: absolute; */
    right: 0px;
    z-index: 10;
    /*top: 3px;*/
    font-weight: normal;
    padding-right: 20px;
    padding-left: 5px;

}
.group-info .player-group .nearby .prev .data-icon-ellipsis {
    left: 3px;
}.group-info .player-group .nearby .next .data-icon-ellipsis {
     right: 3px;
 }

.group-info .player-group .group-title.nearby{
    padding: 8px 0 6px;
    border-bottom: 1px solid rgb(210,210,210);
}

.group-info .player-group .group-title.nearby span{
    font-size: 17px;
    font-weight: bold;
    line-height: 33px;

}
.group-info .player-group .toggle-chat-button{display: none;}

.data-icon-ellipsis{
    position: absolute;
    top: 50%;
    font-size: 14px;
    margin-top: -.5em;
    padding: 0;
}
.group-info-box .tv-player, .group-info-box  .b-tv__player__holder {
    height: 583px !important;
    width: auto !important;
}
.group-info-box .tv-player {
    min-height: 468px;
    background-color: black;
}

.group-info-box .b-tv__head {
    width: 450px;
    text-align: center;
    overflow: hidden;
    margin: 0 auto;
    float: none!important;
}

.group-info-box h3.b-tv__head {
    white-space: nowrap;
    overflow: hidden;
}

.group-info-box .b-tv_main .q_picker {
    right: 80px;
    position: absolute;
}

/* player-buttons-tvguide-chat positioning and overlaying workarounds (puke) */

.group-info #content #video-player #main_tv {
    z-index: 11;
}

.group-info #content #video-player .tv-player {
    position: relative;
    z-index: 11;
}
    .group-info #content #video-player .tv-player .alert.free-sd-mess {
        top: 86px;
        bottom: 44px;
    }

.group-info #content #video-player .tv-player #flash_holder_list.b-tv__player__holder {
    position: relative !important;
}

.group-info #content #video-player .tv-player .button.black.tool-chat {
    position: absolute;
    z-index: 12;
}

.group-info #content #video-player .tv-player .share-layer,
.group-info #content #video-player .tv-player .chat-layer {
    position: absolute;
    z-index: 14;
}

.group-info #content .switch .button.prev,
.group-info #content .switch .button.next,
.group-info #content .containeer-control {
    position: absolute;
    z-index: 13;
    margin-top: 22px;
}
.group-info .switch .button {
    display: none!important;
}
.group-info .switch.t .button {
    display: block!important;
}

.group-info #content #video-player .tool-chat {
    top: 44px;
}

.group-info #content #video-player #chat-layer {
    z-index: 15;
}


.group-info #content #video-player #chat-layer #chat-layer-flash-holder object {
    height: 100%;
}

.group-info #content #chat-layer .chat-layer-hide .chat-closer {
    padding: 220px 0 200px 0;
}

.contain {
  width: 100%;
}
.row {
  overflow: scroll;
  width: 100%;
}
.row__inner {
  transition: 450ms transform;
  font-size: 0;
  /*white-space: nowrap;*/
  margin: 39.3125px 0;
  padding-bottom: 10px;
}
.tile {
  position: relative;
  display: inline-table !important;
  width: 250px;
  float: unset !important;
  white-space: normal;
  height: 140.625px;
  margin-right: 10px;
  font-size: 20px;
  cursor: pointer;
  transition: 450ms all;
  transform-origin: center left;
}
.tile__img {
  width: 250px;
  height: 140.625px;
  -o-object-fit: cover;
     object-fit: cover;
}
.tile__details {
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  font-size: 10px;
  opacity: 0;
  background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0) 100%);
  transition: 450ms opacity;
}
.tile__details:after,
.tile__details:before {
  content: '';
  position: absolute;
  top: 50%;
  left: 50%;
  display: #000;
}
.tile__details:after {
  margin-top: -25px;
  margin-left: -25px;
  width: 50px;
  height: 50px;
  border: 3px solid #ecf0f1;
  line-height: 50px;
  text-align: center;
  border-radius: 100%;
  background: rgba(0,0,0,0.5);
  z-index: 1;
}
.tile__details:before {
  content: '▶';
  left: 0;
  width: 100%;
  font-size: 30px;
  margin-left: 7px;
  margin-top: -18px;
  text-align: center;
  z-index: 2;
}
.tile:hover .tile__details {
  opacity: 1;
}
.tile__title {
  position: absolute;
  bottom: 0;
  padding: 10px;
}
.row__inner:hover {
  /*transform: translate3d(-62.5px, 0, 0);*/
}
.row__inner:hover .tile {
  opacity: 0.3;
}
.row__inner:hover .tile:hover {
  transform: scale(1.1);
  opacity: 1;
}
.tile:hover ~ .tile {
 /* transform: translate3d(125px, 0, 0);*/
}


/* end */
