:root {
  --pls-font-family: serif;
  --pls0-font-family: var(--pls-font-family);
  --pls-mobile-font-family: sans-serif;
  --pls-guide-channel-button-background-color: rgba(91, 91, 91, 0.5);
  --pls-guide-channel-button-border-left: 10px solid rgba(3, 0, 0, 0.4);
  --pls-font-size: 100%;
  --pls-font-color: inherit;
  --pls-font-weight: 400;
  --pls-font-style: normal;
  --pls-body-background: transparent;
  --pls-theme-accent: #ffffff;
  --pls-video-ticker-height: 5em;
  --pls-guide-ticker-offset: 0px;
}

body.guide-has-ticker {
  --pls-guide-ticker-offset: calc(var(--pls-video-ticker-height) + 1rem);
}

body {
  margin: 0px;
  /*  background: url(/img/cmw_loading_bg.jpg) no-repeat center center fixed;*/
  color: #000;
  font-family: var(--pls0-font-family, var(--pls-font-family));
  font-size: var(--pls-font-size);
  font-style: var(--pls-font-style);
  font-weight: var(--pls-font-weight);
  color: var(--pls-font-color, #000);
  background-color: var(--pls-body-background, transparent);
  overflow-x: hidden;
  overflow-y: hidden;
  -webkit-background-size: cover;
  -moz-background-size: cover;
  -o-background-size: cover;
  background-size: cover;
}

body,
input,
button,
textarea,
select {
  font-family: var(--pls0-font-family, var(--pls-font-family));
  font-style: var(--pls-font-style);
}

#pls_connection_notice {
  display: none;
  align-items: center;
  justify-content: center;
  position: fixed;
  inset: 0;
  padding: 24px;
  background: rgba(0, 0, 0, 0.88);
  z-index: 5000;
}

.pls_connection_notice_card {
  max-width: 680px;
  padding: 28px 32px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 14px;
  background: rgba(20, 24, 31, 0.96);
  box-shadow: 0 20px 50px rgba(0, 0, 0, 0.4);
  color: #fff;
  text-align: center;
}

.pls_connection_notice_card h2 {
  margin: 0 0 12px;
  font-size: 30px;
  line-height: 1.2;
}

.pls_connection_notice_card p {
  margin: 0;
  font-size: 18px;
  line-height: 1.5;
}

.theme_highlight{
  /*border-color: red !important;*/
  display:none;
}
#background_logo {
  background: url('https://cmwpublicinbox.blob.core.windows.net/6899fe8ea951b30718c14536-20250811143038/LogoMobile.png') no-repeat center center;
  top: 3%;
  width: 100%;
  height: 100%;
  z-index: 100;
  position: absolute;
  margin: 0 auto;
}
canvas {
  display: block;
  float: left;
/*  margin-left: 8px;
  margin-top: 8px;*/
}
/*CMW JW8 Controls Update - Moved the Channel Home button to top right corner */
#pls_inchannel_home_button{
  display: block;
  z-index: 1000;
  width: 22px;
  position: absolute;
  right: 26%;
  top: 1.8%;
  opacity: 0.5;
  filter: alpha(opacity=50);

}
/*CMW - Removed for JW8*/
/*
.jwplayer, #theVideo_view{
  min-height: 100%;
  position: absolute;
  z-index: 100;
}
.jw-rightclick {
  display: none !important;
}
div[class*="jw"]:focus {
  /*border: 1px solid yellow;
  outline: none;
}
.jw-title-primary{
  text-align: center !important;
}
*/
/*CMW fullScreen Mobile Player Control */

.player:-webkit-full-screen {
  width: 100%;
  height: 100%;
}
.player:-moz-full-screen {
  width: 100%;
  height: 100%;
}
#mfullScreen{
  position:absolute;
  top:10%;
  left:90%;
  width:25px;
  background:transparent;
  z-index: 100;

}


.jw-nextup-container{
  display: none !important;
}

.jw-preview {
  width: 100% !important;
  }

/* Hide JW native controls on desktop players only; mobile uses native controls (2026-02-20) */
#theVideo .jw-controls,
#theVideo .jw-controlbar,
#theVideo2 .jw-controls,
#theVideo2 .jw-controlbar {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
}


.jw-dock-button {
  right: 15% !important;
  min-height:50px;
  min-width:50px;
  top:-19px;

}
/* JW8 Edits */
.jw-icon-settings{
  display:none !important;/*redundant*/
}

/* Fix DocType Scrub Bar in JWPlayer */
.jw-slider-horizontal {
  height: 5px !important;
}
/* app css stylesheet */
/*! Gray v1.4.1 (https://github.com/karlhorky/gray) | MIT */

.grayscale {
  /* Firefox 10+, Firefox on Android */

  /*filter: url("data:image/svg+xml;utf8,<svg xmlns='http://www.w3.org/2000/svg'><filter id='grayscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0'/></filter></svg>#grayscale");*/
  /* IE 6-9 */

  filter: gray;
  /*
  Chrome 19+,
  Safari 6+,
  Safari 6+ iOS,
  Opera 15+
  */

  -webkit-filter: grayscale(100%);
}
.grayscale.grayscale-fade {
  -webkit-transition: -webkit-filter .5s;
  transition: filter .5s;
}
.grayscale.grayscale-off, .grayscale.grayscale-fade:hover {
  -webkit-filter: grayscale(0%);
  filter: none;
}
.grayscale.grayscale-replaced {
  filter: none;
  -webkit-filter: none;
}
.grayscale.grayscale-replaced > svg {
  opacity: 1;
  -webkit-transition: opacity .5s ease;
  transition: opacity .5s ease;
}
.grayscale.grayscale-replaced.grayscale-off > svg, .grayscale.grayscale-replaced.grayscale-fade:hover > svg {
  opacity: 0;
}
.outline-border{
  box-shadow: 0px 0px 6px 1px #000;
}
#loading {
  /*background-color: #000;*/
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0px;
  left: 0px;
  z-index: 200;
}
#loading img {
/*Center it*/
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
}
#message_main {
  position: absolute;
  padding: 20%;
}
#pls_guide_video_next, #pls_guide_video_prev{
  position: fixed;
  bottom: calc(28% + var(--pls-guide-ticker-offset));
  width: 25px;
  height: 40px;
  background-size: 100% 100%;
  display: none;
  cursor:pointer;
  z-index: 20;

}
#pls_guide_video_next{
  background-image: url("/img/pls_arrow_right_cmw.png");
  right: 0.5%;
}
#pls_guide_video_prev{
  left: 28%;
  background-image: url("/img/pls_arrow_left_cmw.png");
  border: 0px solid;
}
/*CMW*/
#pls_channel_video_next, #pls_channel_video_prev{
  position: absolute;
  top: 48%;
  width: 30px;
  height: 60px;
  background-size: 100% 100%;

  cursor:pointer;
  z-index: 110;
  opacity: 1;
  display: none inline-flex;

}
#pls_channel_video_next{
  background-image: url("/img/pls_arrow_right_cmw.png");
  right: 0.5%;
}
#pls_channel_video_prev{
  left: 0.5%;
  background-image: url("/img/pls_arrow_left_cmw.png");
}


#channelGuide {
  z-index: 10;
  position: relative;
  top: 0;
  bottom: auto;
  left: 1.25%;
  width: 27.5%;
  padding: 1%;
  overflow: visible;
}
#pls_guide_channel_next, #pls_guide_channel_prev{
  position: relative;
  z-index: 12;
  width: 45px;
  height: 40px;
  background-size: 100% 100%;
  margin-right: auto;
  margin-left: auto;
}
#pls_guide_channel_next{
  background-image: url("/img/pls_arrow_down.png");
}
#pls_guide_channel_prev{
  background-image: url("/img/pls_arrow_up.png");
}

#pls_guide_channel_next_box, #pls_guide_channel_prev_box{
  width: 92%;
  min-height: 42px;
  position: relative;
  z-index: 11;
  background-color: rgba(91, 91, 91, 0.5);
  cursor:pointer;
}

.menu {
/*  list-style: none;
  margin-bottom: 2em;
  padding: 0 0 0.5em;
  height: 300px;*/
  width: 92%;
  max-height: calc(52vh - 104px);
  overflow: hidden;
}
.menu .slick-list {
  max-height: calc(52vh - 104px);
  overflow: hidden;
}
.video_selected{
  cursor:pointer;
}
.menu .slick-vertical, .menu .slick-slide {
  border: none;
  outline: none;/*KAI2 CMW-9*/
}
#channelGuide .slick-slider {
  margin-bottom: 0px;
}
.menu:before {
  content: "";
}
.menu:after {
  content: "";
}
/*.menu > div {
  padding: 30px;
  width: 11em;
  max-width: 11em;
  word-wrap: break-word;
}*/
.menu > div:before {
  content: "";
}
.menu > div:nth-child(1):before {
  content: "";
  padding: 0;
}
.menu .channelButton {
  position: relative;
  z-index: 100;
  font-size: 1.4vw; /* 1.8vw */
  font-weight:600; /* RI Customization */
  padding: 15px 15px 15px;
  margin: 0.3em 1%;
  margin-top: 0.6em;
  text-align: left;
  /* background-color:rgba(0,0,0,0.6); */
  border-left: var(--pls-guide-channel-button-border-left, 10px solid rgba(3, 0, 0, 0.4));
  background-color: var(--pls-guide-channel-button-background-color, rgba(91, 91, 91, 0.5));
  cursor:pointer;
  transition: filter 0.15s ease;
}
.menu .channelButton:hover,
.menu .channelButton.selected,
.menu div.selected {
  border-left: var(--pls-guide-channel-button-border-left, 10px solid rgba(3, 0, 0, 0.4));
  background-color: var(--pls-guide-channel-button-background-color, rgba(91, 91, 91, 0.5));
}
.menu .channelButton:hover {
  filter: brightness(1.08);
}
.menu .channelButton.selected,
.menu div.selected {
  filter: brightness(1.16);
}
.channelButtonContent {
  display: flex;
  align-items: center;
  width: 100%;
  min-height: 0;
  height: auto;
  gap: 0.35em;
  overflow: hidden;
}
.channelButtonThumb {
  width: 52px;
  min-width: 52px;
  max-width: 52px;
  height: 52px;
  min-height: 52px;
  max-height: 52px;
  display: block;
  object-fit: cover;
  object-position: center;
  border-radius: 5px;
  background: transparent;
}
.channelButtonLabel {
  display: block;
  flex: 1 1 auto;
  min-width: 0;
  line-height: 1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
#channelGuide .channelButton {
  height: 1.65em;
  min-height: 1.65em;
  max-height: 1.65em;
  margin-top: 0.2em;
  margin-bottom: 0.2em;
  padding-top: 0.12em;
  padding-bottom: 0.12em;
  overflow: hidden;
  white-space: nowrap !important;
  text-overflow: ellipsis !important;
}
#channelGuide .channelButtonContent {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  width: 100%;
  min-height: 0;
  height: 1.1em;
  overflow: hidden !important;
  white-space: nowrap !important;
}
#channelGuide .channelButton img,
#channelGuide .channelButtonThumb {
  width: 1em !important;
  min-width: 1em !important;
  max-width: 1em !important;
  height: 1em !important;
  min-height: 1em !important;
  max-height: 1em !important;
  display: block;
  object-fit: cover !important;
  object-position: center center !important;
  border-radius: 3px;
  background: transparent;
  flex: 0 0 1em;
}
#channelGuide .channelButtonLabel {
  line-height: 1.1em;
  white-space: nowrap !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
}
#premium_button{
  position: absolute;
  font-size: 1.7vw;
  width: 15%;
  z-index:10;
  text-align: center;
  line-height: 4vh;
  text-decoration: none;
  margin-right: 10px;
  margin-left: auto;
  margin-top: 8px;
  height: 15px;
  color: #F6CB32;
  display: inline-table;
  padding: 6px;
  padding-bottom: 17px;
  background-color: rgba(15, 15, 15, 0.7);
  border-left: 8px solid rgba(3, 0, 0, 0.4);
  border-right: 8px solid rgba(3, 0, 0, 0.4);
  /*display:block;*/
  left:83%;
}

#premium_button_glass{
  position: absolute;
  font-size: 1.7vw;
  width: 13%;
  z-index: 10;
  top: .5%;
  right:.5%;
  line-height: 4vh;
  float: right;
  text-align: center;
  text-decoration: none;
  color: #ffffff;
  display: none;
  padding: 15px;
  padding-bottom: 10px;
  /*background-color: rgba(3, 0, 0, 0.4);*/
  /*background: linear-gradient(hsla(205, 74%, 52%, 1), hsla(202, 63%, 49%, .9));/*KAI2 BLUE - #2A95DF*/
  background:black;
  border-left: 10px solid;
  overflow: hidden;
  text-overflow: ellipsis;
}
#feed_box, #video_titles{
  font-size: 1.5em;
  white-space: nowrap;
  float: left;
  height: 42%;
  max-width: 95% !important;
  padding-top: .65%;

  overflow: hidden;
  text-overflow: ellipsis;
  z-index:9;
  position: relative;
  min-width: 70%;
  left:0px;

}
/*Feedbox Positioning*/
#feed_box li{
    margin-top: 10px;
    /*border:1px solid grey;*/

}

#feed_box li:first-child {
    margin-bottom:10px;
}

.feed_box_glass{
  position: fixed !important;
  left:.1%;
  top:96%;
  margin-bottom:2px;
  min-width: 100% !important;

  background-color: rgba(3, 0, 0, 0.4);
  border-left: 10px solid;
  z-index:10;
  white-space: nowrap;

}

#video_titles{
  color: #F6CB32;
}
#feed_list{
  margin: 2px !important;
  list-style: none;
  -webkit-padding-start: 0px;
}
#feed_list li{
  display: inline;
}
#glass_layout{
  display: none;
}

#videoTicker{
  width: 100%;
  position: fixed;
  left: 0;
  right: 0;
  height: 0;
  min-height: 0;
  background-color: black;
  bottom: 0;
  z-index: 100;
  display: block;
  opacity: 0;
  overflow: hidden;
}
#channelTickerShell{
  width: 100%;
  position: fixed;
  left: 0;
  right: 0;
  height: 0;
  min-height: 0;
  background: transparent;
  bottom: 0;
  z-index: 100;
  display: block;
  opacity: 0;
  overflow: hidden;
}
#topTicker, #bottomTicker{
  width: 100%;
  float: left;
  display: inline;

}
#topTicker{
  height: 65%;
  border-top: 1px solid white;
  background-color: black;
/*  border-bottom: 1px solid white;*/
}
#topLeftTicker, #topRightTicker{
  position: relative;
  display: inline;
  width: 20%;
  height: 100%;
  float:left;
}
#topLeftTicker{
  text-align:center;
  background-image: url("/img/ticker/sport_ticker_left.png");
  background-size: 100% 100%;
}
#topRightTicker{
  /*float:right;*/
  background-image: url("/img/ticker/sport_ticker_right.png");
  background-size: 100% 100%;
}
#middleContentTicker{
  position: relative;
  min-width:55%;
  display: inline;
  width:59%;
  padding-left: 1%;
  height: 100%;
  float:left;
  background-image: url("/img/ticker/ticker_center.png");
  background-size: 100% 100%;
}
#bottomTicker{
  height: 35%;
  /* background-image: url("/img/ticker/ticker_bottom_red.png");
  background-size: 100% 100%;*/

  border-top: 1px solid white;
  background: -moz-linear-gradient(top,  rgba(0,0,0,0.16) 0%, rgba(0,0,0,1) 17%, rgba(0,0,0,1) 61%, rgba(0,0,0,0.17) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(0,0,0,0.16)), color-stop(17%,rgba(0,0,0,1)), color-stop(61%,rgba(0,0,0,1)), color-stop(100%,rgba(0,0,0,0.17))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(0,0,0,0.16) 0%,rgba(0,0,0,1) 17%,rgba(0,0,0,1) 61%,rgba(0,0,0,0.17) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(0,0,0,0.16) 0%,rgba(0,0,0,1) 17%,rgba(0,0,0,1) 61%,rgba(0,0,0,0.17) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(0,0,0,0.16) 0%,rgba(0,0,0,1) 17%,rgba(0,0,0,1) 61%,rgba(0,0,0,0.17) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(0,0,0,0.16) 0%,rgba(0,0,0,1) 17%,rgba(0,0,0,1) 61%,rgba(0,0,0,0.17) 100%); /* W3C */
  /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#29000000', endColorstr='#2b000000',GradientType=0 );  IE6-9 */
}
.fullheight{
  min-height: 100% !important;
}

.gradient-fade-up{
  background: -webkit-linear-gradient(rgba(3, 10, 10, 0.05), rgba(3, 0, 0, 0.8)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(rgba(3, 10, 10, 0.05), rgba(3, 0, 0, 0.8)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgba(3, 10, 10, 0.05), rgba(3, 0, 0, 0.8)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(rgba(3, 10, 10, 0.05), rgba(3, 0, 0, 0.8)); /* Standard syntax */
}
.gradient-fade-down{
  background: -webkit-linear-gradient(rgba(3, 0, 0, 0.8), rgba(3, 10, 10, 0.05)); /* For Safari 5.1 to 6.0 */
  background: -o-linear-gradient(rgba(3, 0, 0, 0.8), rgba(3, 10, 10, 0.05)); /* For Opera 11.1 to 12.0 */
  background: -moz-linear-gradient(rgba(3, 0, 0, 0.8), rgba(3, 10, 10, 0.05)); /* For Firefox 3.6 to 15 */
  background: linear-gradient(rgba(3, 0, 0, 0.8), rgba(3, 10, 10, 0.05)); /* Standard syntax */
}
.gradient-fade2{
  /* Permalink - use to edit and share this gradient: http://colorzilla.com/gradient-editor/#ffffff+1,f9f9f9+100&amp;0+0,0.5+54,0+56 */
  background: -moz-linear-gradient(top,  rgba(255,255,255,0) 0%, rgba(255,255,255,0.01) 1%, rgba(252,252,252,0.5) 54%, rgba(252,252,252,0) 56%, rgba(249,249,249,0) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(255,255,255,0)), color-stop(1%,rgba(255,255,255,0.01)), color-stop(54%,rgba(252,252,252,0.5)), color-stop(56%,rgba(252,252,252,0)), color-stop(100%,rgba(249,249,249,0))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.01) 1%,rgba(252,252,252,0.5) 54%,rgba(252,252,252,0) 56%,rgba(249,249,249,0) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.01) 1%,rgba(252,252,252,0.5) 54%,rgba(252,252,252,0) 56%,rgba(249,249,249,0) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(top,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.01) 1%,rgba(252,252,252,0.5) 54%,rgba(252,252,252,0) 56%,rgba(249,249,249,0) 100%); /* IE10+ */
  background: linear-gradient(to bottom,  rgba(255,255,255,0) 0%,rgba(255,255,255,0.01) 1%,rgba(252,252,252,0.5) 54%,rgba(252,252,252,0) 56%,rgba(249,249,249,0) 100%); /* W3C */
  /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00f9f9f9', GradientType=0 ); /* IE6-9 */
}
.rounded-corners {
    -moz-border-radius: 0.3em;
    -webkit-border-radius: 0.3em;
    -khtml-border-radius: 0.3em;
    border-radius: 0.3em;
}
#channelGuide a, #channelGuide a:link, #channelGuide a:visited, #channelGuide a:active, #channelGuide a:hover {
  color: #FFF;
  text-decoration: none;
}
.fullscreen {
  position: relative;
}
#powered {
  position: absolute;
  top: 10%;
  right: 10px;
}
#powered a, #powered a:link, #powered a:visited, #powered a:active, #powered a:hover {
  color: #FFF;
  text-decoration: none;
}
#powered a img {
  resize: both;
  -webkit-transition: all 0.7s ease;
  transition: all 0.7s ease;
  width: 85px;
}
#guideBlur {
  width: 100%;
  height: 50%;
  z-index: 2;
  position: absolute;
  bottom: var(--pls-guide-ticker-offset);
  left: 0px;
  background-color: rgba(191, 191, 191, 0.4);
  display: none;
}
#fullbutton {
  display: inline-block;
  z-index: 105;
  cursor: pointer;
}
#playVideoAuto {
  display: none;
  z-index: 200;
  position: absolute;
  left: 35%;
  bottom: calc(5% + var(--pls-guide-ticker-offset));
  height:50px;
  vertical-align:middle;
  line-height: 45px;
}
#playVideoAuto img {
  padding-right: 4px;
  vertical-align: middle;
}
#playVideoAuto a {
  color: #fff;
  text-decoration: none;
}
#videoControls{
    z-index: 110;
    width:  30px;
    opacity: 1;
    display: inline-flex;
    position: absolute;
    -webkit-transition: opacity 1s;
    transition: opacity 1s;
    top: 0.10% !important;
    left:calc(41% - 200px)!important;/*Note - CENTER VIDEO CONTROLS HERE */
    margin:2px;
    padding:2px;


}
/*See CMW section below
input[type=range] {
    -webkit-appearance: none;
    background-color: silver;
    width: 100%;
    height:7px;
}

input[type="range"]::-webkit-slider-thumb {
    -webkit-appearance: none;
    background-color: #666;
    opacity: 0.5;
    width: 10px;
    height: 7px;
}*/
#audioToolTip{
  z-index: 111;
  width:  330px;
  opacity: 1;
  display: inline-flex;
  position: absolute;
  -webkit-transition: opacity 1s;
  transition: opacity 1s;
  top: 170% !important;
  left:calc(50% - 12px)!important;
  margin:2px;
  padding:2px;
  color:#fff;
  font-size: 1.0em;
  background:#000;
}
#videoControlsiPad {
  display: none;
  z-index: 200;
  position: absolute;
  left: 35%;
  bottom: 5%;
  height:50px;
  vertical-align:middle;
  line-height: 40px;
}
#videoControlsiPad img {
  padding-right: 4px;
  vertical-align: middle;
  padding-right: 10px;
  padding-left: 10px;
}
#videoControlsiPad a {
  font-size: 1.5em;
  color: #fff;
  text-decoration: none;
}
#rss_feed{
  position: absolute;
  top: 8px;
  width: 68%;
  left: 18%;
  font-size: 1.2em;
  text-align: left;
  overflow: hidden;
  white-space: nowrap;
  margin: 0;
  height: 31px;
  background-color: rgba(3, 0, 0, 0.4);
  border-left: 10px solid #fff;
}

#rss_list{
  list-style: none;
  margin: 0;
  padding-top: 3px;
  margin-left: 10px;
}

#rss_list li{
  padding-bottom: 10%;
}

#rss_list li a{
  color: #fff;
  text-decoration: none;
}

#fullbutton:after {
  display: inline-block;
  width: 100%;
  height: 100%;
  cursor: pointer;
  content: "full screen";
}
#name {
  position: absolute;
  top: 10px;
  left: 10px;
  z-index: 10;
}
#theVideo {
  position: fixed;
  inset: 0;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  overflow: hidden;
  background: #000;
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
  z-index: 0;
  pointer-events: none;
}
#theVideo .jwplayer,
#theVideo .jw-wrapper,
#theVideo .jw-media,
#theVideo .jw-media video,
#theVideo .jw-preview,
#theVideo .jw-video {
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important; /* fill guide background, no letterboxing */
}
#theVideo2 {
  position: absolute;
  inset: 0;
  width: 100vw;
  height: 100vh;
  min-height: 100vh;
  max-width: none;
  max-height: none;
  overflow: hidden;
  background: #000;
  z-index: 0;
}
#theVideo2 .jwplayer,
#theVideo2 .jw-wrapper,
#theVideo2 .jw-media,
#theVideo2 .jw-video,
#theVideo2 .jw-media video,
#theVideo2 .jw-preview,
#rundownVideo .jwplayer,
#rundownVideo .jw-wrapper,
#rundownVideo .jw-media,
#rundownVideo .jw-video,
#rundownVideo .jw-media video {
  width: 100% !important;
  height: 100% !important;
}
#theVideo2 .jw-media video,
#theVideo2 .jw-preview {
  object-fit: cover !important;
}
.theVideo2sport{
  height: 90% !important;
}
.feed_box_sport, #video_titles{
  font-size: 1.0em !important;
  height: 51% !important;
}

.theVideo2glass{
  height: 100% !important;
}

#logo_guide_link {
  display: none;
  position: absolute;
  inset: 0;
  height: 100%;
  width: 100%;
  z-index: 10;
}

#guideLogoBox {
  z-index: 10;
  position: fixed;
  top: 10vh;
  left: 5vw;
  right: auto;
  margin-left: 0;
  margin-top: 0;
  padding: 0;
  height: 96px;
  width: 18vw;
  background-color: transparent;
  background-position: left top !important;
  background-repeat: no-repeat;
  background-size: contain !important;
  background-clip: border-box;
  background-origin: border-box;
  transform: none !important;
  contain: paint;
  bottom: auto;
  display: block;
  cursor: pointer;
  box-sizing: border-box;
  overflow: hidden;
}

#logo_3d{
  width: 25%;
  position: fixed;
  top: 10px;
  left: 10px;
  z-index: 10;
  display: none;
  /*background-color: black;*/
}

#logo img {
  resize: both;
  -webkit-transition: all 0.7s ease;
  transition: all 0.7s ease;
}
#logo_inchannel {
  position: absolute;
  /*bottom: 30px;*/
  left: 0px;
  z-index: 110;
  height: 96px;
  /*width: 96px;*/

  top: 0%;
}
/*#logo_inchannel_ticker{
  position: relative;
  z-index: 110;
  float: left;
  margin: 1em 3em;
  width: 10em;
}*/
#logo_inchannel_ticker, .logo_3d_inchannel_ticker{
  position: relative;
  z-index: 10;
  /*width: 11em;*/
/*  height: 6em;
  margin-top: -1.25em;*/
  max-width: 11em;
  max-height: 6em;
  margin-top: -1.25em;
  margin-left: auto;
  margin-right: auto;
  display: none;
}
.logo_3d_inchannel_ticker{
  margin-top: -3.5em;
}

#name {
  z-index: 10;
  font-size: 20px;
}
/* ===== clock widget (clockController.js) ===================== */
/*
#inchannelDesc, #inchannelTime {
  z-index: 12;
  position: absolute;
  bottom: 77px;
  left: 110px;
  font-size: 12px;
/ *  font-size: 1.1vw;* /
  padding: 5px 15px;
  text-align: left;
  background-color: rgba(3, 0, 0, 0.4);
  display: none;
}
#inchannelTime {
  padding: 3px 10px;
  bottom: 104px;
  display: block;
}
*/
.clock {
  z-index: 12;
  position: absolute;
  bottom: 101px;
  left: 110px;
  display: block;
  font-size: 15px;
  padding: 3px 15px;
  text-align: left;
  background-color: rgba(3, 0, 0, 0.4);
  cursor: pointer;
}

#inchannelDesc {
  z-index: 12;
  position: absolute;
  bottom: 77px;
  left: 110px;
  display: none;
  font-size: 14px;
  padding: 3px 15px;
  text-align: left;
  background-color: rgba(3, 0, 0, 0.4);
  cursor: pointer;

}
#inchannelNowPlaying {
  z-index: 10;
  position: absolute;
  top: 30px;
  left: 110px;
  font-size: 20px;
/*  font-size: 1.6vw;*/
  max-width: 65%;
  line-height: 0.8em;
  padding: 15px;
  margin-top: 15px;
  text-align: left;
  background-color: rgba(3, 0, 0, 0.4);
  /*background-color:rgba(191, 191, 191,0.5);*/

  display: none;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  border-right: 10px solid;
}
#inchannelUpNext {
  font-family: var(--pls0-font-family, var(--pls-font-family, 'Source Sans Pro', sans-serif)) !important;
  z-index: 100;
  position: fixed;
  bottom: calc(var(--pls-video-ticker-height) + 0.5rem);
  right: 1rem;
  font-size: 20px;
  line-height: 1.1;
  padding: 10px 15px;
  /*margin-right: 45%;*/
  text-align: left;
  width: auto;
  max-width: min(55%, calc(100% - 2rem));
  min-height: 0;
  max-height: 2.8em;
  height: auto;
  background-color: rgba(3, 0, 0, 0.4);
  /*background-color:rgba(191, 191, 191,0.5);*/
  white-space: nowrap;
  display: none;
  border-left: 10px solid;
  overflow: hidden;
  text-overflow: ellipsis;
}
.qrTitle{
  bottom: 1.1%;
  right: 90px;
  display: none;
  position: fixed;
  color: black;
  z-index: 1000;
  font-size:.8em;
  bottom: 65%;
  margin-bottom:-53vh;
}
.qrTitleVideo {
  font-size:.9em;
  color:black;
  position: absolute;
  top: 32%;
  right: -0.5%;
  z-index: 1000;
  width: 120px;
  height: auto;

}

#qrCodeImageUrl, #remoteStatusMessage {
  z-index: 10;
  border-radius: 0.5em;
  display: none;
  position: absolute;
  bottom: calc(0.5% + var(--pls-guide-ticker-offset));
  right: 55px;
  margin-bottom: 0%;
  padding: 1px;
  width: 120px;
  /*height: 120px;*/
  background-color: rgba(3, 0, 0, 0.4);
  border-left: 0px solid;
  vertical-align:middle;

}
#qrCodeImageUrl img {
  opacity: 0.9;
  filter: alpha(opacity=90);
  /* For IE8 and earlier
  max-width: 100%*/

}
#remoteStatusMessage_inChannel {
  position: absolute;
  top:97% !important;
  left:calc(100% - 305px);
  z-index: 110;
  border-radius: 0.5em;
  max-height:100%;
  max-width:100%;
  padding: 1px;
  width: 294px ;
  height: 124px ;
  display: none;
  vertical-align: middle;
  background-color: rgba(3, 0, 0, 0.4);
  border-left: 0px solid;

}
#qrCodeImageContainer,
.qrCodeImageContainer{
  position: absolute;
  top: 19%;
  right: 1%;
  z-index: 110;
  height:120px;
  width:120px;
  display:none;
  overflow:hidden;
}

#qrCodeImageUrl_inChannel {
 /*position: absolute;
  top: 19%;
  right: 1%;
  z-index: 110;
  border-radius: 0.5em;
  padding: 1px;
  width: 120px ;
  height: 120px ;
  display: table-cell;
  vertical-align: middle;
  */
  margin:auto;
  display:block;
  border:none;
  max-height:100%;
  max-width:100%;
  object-fit: contain;

}
#qrCodeImageUrl_inChannel img {
  opacity: 0.9;
  filter: alpha(opacity=90);
  /* For IE8 and earlier
  width: 100%;*/
}
#guide {
  z-index: 10;
  color: #FFF;
  text-decoration: none;
  position: absolute;
  top: 8px;
  font-size: 20px;
  padding: 3px 3px 3px;
  text-align: left;
  background-color: rgba(191, 191, 191, 0.5);
}
#guide a, #guide a:link, #guide a:visited, #guide a:active, #guide a:hover {
  color: #FFF;
  text-decoration: none;
}
#channelVideos {
  z-index: 10;
  position: absolute;
  bottom: calc(17% + var(--pls-guide-ticker-offset)); /* 20%; */
  left: 30%;
  display: inline-block;
  height: 28%;
  overflow: hidden;
  width: 67%; /* 69% */
}
.videoMenu img {
  width: 90%;
  margin: 0 10px;
  resize: both;
  -webkit-transition: all 0.7s ease;
  transition: all 0.7s ease;
  border-radius: .3em;
}
#channelVideos .slick-slide{
  margin-top: 1em;
}

.menu.pls-slick-short-list .slick-track,
.videoMenu.pls-slick-short-list .slick-track {
  margin-left: 0 !important;
  margin-right: auto !important;
}

.slick-prev::before, .slick-next::before {
    font-size: 70px !important;
}
.slick-next, .slick-prev {
  display: block;
  height: 40% !important;
  width: 10% !important;
  top: 30% !important;
  z-index: 10;
}
.slick-next{
  right: 1.5% !important;
}
.slick-prev {
  left: -1% !important;
}

@media (max-width: 1366px) {
  #channelGuideContainer {
    top: calc(51% - var(--pls-guide-ticker-offset));
  }

  #channelVideos {
    left: 26%;
    width: 71%;
    bottom: calc(14% + var(--pls-guide-ticker-offset));
  }

  #theVideo2 {
    max-height: none;
  }
}

@media (max-width: 1024px) {
  #channelGuideContainer {
    top: calc(57% - var(--pls-guide-ticker-offset));
  }

  #channelVideos {
    left: 18%;
    width: 78%;
    bottom: calc(12% + var(--pls-guide-ticker-offset));
    height: 24%;
  }

  #guideLogoBox,
  #logo_3d {
    width: min(34%, 240px);
  }

  .slick-prev::before,
  .slick-next::before {
    font-size: 56px !important;
  }
}

@media (min-width: 1025px) {
  #guideLogoBox {
    top: 10vh;
    left: 96px;
  }
}

@media (min-width: 1025px) and (min-height: 769px) {
  #guideLogoBox {
    min-height: 130px;
  }
}

/* v2.04.6 tablet desktop-shell layout.
   Applies to tablet viewports after they route to the desktop Guide shell. */
@media (min-width: 768px) and (max-width: 1180px) {
  #guideLogoBox {
    width: min(28vw, 220px);
    height: 76px;
  }

  #logo_3d {
    width: min(28vw, 220px);
    height: min(16vh, 150px);
  }

  #liveStream {
    width: min(20vw, 190px);
    height: min(7vh, 68px);
    font-size: max(12px, min(1.4vw, 16px));
    padding: 10px 8px;
  }

  #channelGuide {
    width: 24%;
    left: 1.5%;
  }

  #channelGuideContainer {
    top: calc(48% - var(--pls-guide-ticker-offset));
  }

  .menu,
  .menu .slick-list {
    max-height: calc(44vh - 84px);
  }

  .menu .channelButton {
    font-size: max(10px, 1.25vw);
  }

  #channelVideos {
    left: 24%;
    width: 73%;
    bottom: calc(15% + var(--pls-guide-ticker-offset));
    height: 22%;
  }

  #channelVideoTitle,
  #channelTitle {
    left: 32%;
    max-width: 45%;
    bottom: calc(23vh + var(--pls-guide-ticker-offset));
    font-size: max(11px, 1.3vw);
  }

  /* v2.04.12 tablet video aspect-ratio fix — normal and custom fullscreen views.
     Constrain #theVideo2 to the available tablet landscape viewport.
     aspect-ratio preserves 16:9; max-width/max-height prevent overflow on both axes.
     object-fit: contain on inner elements prevents stretching.
     Does not change custom video controls. */
  #theVideo2 {
    max-width: 100vw !important;
    max-height: 100vh !important;
    width: 100vw !important;
    height: calc(100vw * 9 / 16) !important;
    overflow: hidden !important;
    inset: auto !important;
    top: 50% !important;
    left: 0 !important;
    transform: translateY(-50%) !important;
  }

  #theVideo2 .jwplayer,
  #theVideo2 .jw-wrapper,
  #theVideo2 .jw-media,
  #theVideo2 .jw-video,
  #theVideo2 .jw-media video,
  #theVideo2 .jw-preview {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
  }
}

@media (min-width: 2200px) {
  #channelVideos {
    left: 34%;
    width: 58%;
  }

  #theVideo2 {
    max-width: none;
    margin-left: 0;
    margin-right: 0;
  }
}

/* v2.04.6 large-screen guide stabilization.
   Freeze desktop Guide proportions above the 1920px design range.
   Placed after @media (min-width: 2200px) so these caps win via cascade. */
@media (min-width: 1921px) {
  #guideLogoBox {
    left: min(5vw, 96px);
    width: min(18vw, 346px);
    height: 96px;
  }

  #liveStream {
    right: min(5vw, 96px);
    width: min(18vw, 346px);
    height: min(7vh, 76px);
    font-size: min(1.4vw, 27px);
  }

  #channelVideos {
    left: min(30%, 576px);
    width: min(67%, 1286px);
    max-height: 302px;
  }

  #channelVideoTitle,
  #channelTitle {
    font-size: min(1.3vw, 25px);
  }

  #premium_button {
    font-size: min(1.7vw, 33px);
  }
}

/*.videoMenu div{
  width: 50%;
}*/
/*#videoMenu {
  margin: 0;
  padding: 0;
  list-style-type: none;
  text-align: left;
  overflow-x: scroll;
  overflow-y: hidden;
}
#videoMenu li {
  display: inline;
  margin: 0;
  padding: 5px;
}*/
.choosen img{
  box-sizing: border-box;
  -moz-box-sizing: border-box;
  -webkit-box-sizing: border-box;
  border-bottom: 10px solid; /* #21ff00 */
  width: 95%;
}
.grey_video img{
  filter: contrast(100%);
  filter: gray;
  /* IE6-9 */

  filter: grayscale(100%);
  -webkit-filter: grayscale(100%) brightness(70%) contrast(100%);
  /* Chrome 19+, Safari 6+, Safari 6+ iOS */

  /*filter: url("data:image/svg+xml;utf8,<svg version='1.1' xmlns='http://www.w3.org/2000/svg' height='0'><filter id='greyscale'><feColorMatrix type='matrix' values='0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0 0 0 1 0' /></filter></svg>#greyscale");*/
  border-bottom: 10px solid #fff;
}
/*#videoMenu img {
  width: 23%;
  resize: both;
  -webkit-transition: all 0.7s ease;
  transition: all 0.7s ease;
  border-radius: .3em;
}*/
#videoMenu .video_title {
  z-index: 200;
  width: 30em;
  word-wrap: break-word;
}
#channelVideoTitle, #channelTitle{
  font-size: 1.3vw;
  font-weight:600; /* RI Customization */
  z-index: 10;
  position: absolute;
  bottom: calc(15vh + var(--pls-guide-ticker-offset));
  left: 30.75%;
  max-width: 47%;
  padding: 12px 12px 12px;
  margin-top: 15px;
  text-align: left;
  /*background-color: rgba(0, 0, 0, 0.5);*/
  word-wrap: break-word;
  border-bottom: 10px solid; /* #21ff00 */
  display: none;
}
#guideTickerShell {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 0;
  min-height: 0;
  background: transparent;
  z-index: 1000;
  overflow: hidden;
  opacity: 0;
}
body.guide-has-ticker #guideTickerShell {
  height: var(--pls-video-ticker-height);
  min-height: var(--pls-video-ticker-height);
  opacity: 1;
}
#guideTrack {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  white-space: nowrap;
  will-change: transform;
  font-size: 34px;
  font-weight: bold;
  color:black;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  width: 100%;
  min-width: var(--ticker-min-width);
  box-sizing: border-box;
  background: transparent;
  font-family: var(--pls0-font-family, var(--pls-font-family, 'Source Sans Pro', sans-serif));
}
#guideTrack.has-ticker {
  height: 100%;
  min-height: 100%;
}
#guideMarquee {
  position: relative;
  height: 0;
  overflow-x: hidden;
  display: none;
  width: 100%;
  padding: 0;
  margin: 0;
  top: 0;
  font-family: var(--pls0-font-family, var(--pls-font-family, 'Source Sans Pro', sans-serif));
}
#guideTrack.has-ticker #guideMarquee {
  height: 100%;
  display: flex;
  align-items: center;
  animation: fadeIn .5s;
  margin-left: 10px;
  margin-right: 10px;
  top: 0;
}
#guideMarquee:empty {
  height: 0 !important;
  display: none !important;
  padding: 0 !important;
  margin: 0 !important;
}
#channelTitle {
  bottom: calc(45% + var(--pls-guide-ticker-offset));
  padding: 10px 10px 10px;
  margin-top: 10px;
  /*max-width: 64%;*/
  display:none;
}
#liveStream {
  font-size: 1.4vw;
  line-height: 1;
  z-index: 10;
  position: fixed;
  top: 20px;
  right: 5vw;
  color: #ffffff;
  margin-left: 0;
  margin-top: 0;
  height: 7vh;
  width: 18vw;
  background-color: rgba(0, 0, 0, 0.5);
  word-wrap: break-word;
  border-right: 10px solid;
  border-left: 10px solid;
  bottom: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 15px 10px 15px;
  cursor: pointer;
}


#liveStreamLink{
  display: none;
  position: relative;
  display: inline-block; /* ensures it has box dimensions */
}

/* v2.04.12 tablet portrait — landscape-only lock.
   Portrait is not a supported layout on tablet. Hide all guide surfaces so
   the user sees a plain dark screen. No overlay element is added.
   Rotating to landscape restores the existing landscape view automatically. */
@media (min-width: 768px) and (max-width: 1180px) and (orientation: portrait) {
  #guide_container,
  #guideLogoBox,
  #logo_guide_link,
  #logo_3d,
  #liveStreamLink,
  #loginDiv,
  #theVideo2,
  #guideTickerShell {
    display: none !important;
    visibility: hidden !important;
  }

  #pls_connection_notice {
    visibility: visible !important;
  }

  div[style*="z-index: 99999"][style*="translate(-50%, -50%)"] {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
  }

  #theVideo {
    background: #000 !important;
    background-image: none !important;
  }
}

/* v2.04.11 iPad Mini desktop-shell landscape alignment.
   Keep channel title, video rail, and video arrows on one shared axis. */
@media (min-width: 768px) and (max-width: 1180px) and (max-height: 820px) {
  #channelVideos {
    left: 25.5%;
    width: 72.5%;
    bottom: calc(29% + var(--pls-guide-ticker-offset));
    height: 18%;
  }

  #channelVideoTitle,
  #channelTitle {
    left: 25.5%;
    max-width: 52%;
  }

  #channelVideoTitle {
    bottom: calc(21% + var(--pls-guide-ticker-offset));
  }

  #pls_guide_video_prev {
    left: 23%;
  }

  #pls_guide_video_next {
    right: 0.5%;
  }

  #pls_guide_video_next,
  #pls_guide_video_prev {
    bottom: calc(36% + var(--pls-guide-ticker-offset));
    z-index: 60;
  }

  /* v2.04.12 iPad Mini landscape video aspect-ratio fix.
     For iPad Mini landscape (1024x768): calc(100vw * 9/16) = 576px which fits
     within the 768px viewport height — width-driven approach from the standard
     tablet block above is correct; no separate height-driven override needed. */
}

@media (min-width: 768px) and (max-width: 1024px) and (min-height: 700px) and (max-height: 820px) and (orientation: landscape) {
  #channelGuideContainer,
  #channelVideos {
    top: calc(55% - var(--pls-guide-ticker-offset));
  }

  #channelVideos {
    bottom: auto;
  }
}

@media (min-width: 1025px) {
  #guideLogoBox {
    position: fixed !important;
    top: 10vh !important;
    left: 96px !important;
    right: auto !important;
    bottom: auto !important;
    margin: 0 !important;
    transform: none !important;
    background-position: left center !important;
  }

  /* v2.05.02 — Desktop alignment: pin channel rail and video thumbnails to #channelTitle bottom.
     #channelTitle bottom sits at calc(55% - ticker) from the viewport top (base rule:
     bottom: calc(45% + ticker)). Both #channelGuideContainer and #channelVideos are
     anchored to that same value so the channel button row and the first video thumbnail
     share a common top edge across all desktop widths (1025px+).
     Using top-based positioning here overrides the max-width: 1366px bottom-based
     override (which shifted #channelVideos top to 58% - ticker, creating a 3% gap). */
  #channelGuideContainer {
    top: calc(55% - var(--pls-guide-ticker-offset));
  }

  #channelGuide .menu,
  #channelGuide .menu .slick-list {
    max-height: calc(36vh - 84px);
  }

  #channelVideos {
    top: calc(55% - var(--pls-guide-ticker-offset));
    bottom: auto;
  }
}

@media screen and (max-width: 1024px) {
  #liveStreamLink {
    margin-top: 14vh !important;
  }
}


#twitter_box {
  position: absolute;
  top: 80px;
  right: 10px;
  z-index: 101;
}
#pls_inchannel_play_button {
  display: none;
}

#pls_inchannel_unmute_button {
  display: none;
}
#newsGuide {
  z-index: 10;
  position: absolute;
  top: 0px;
  left: 33%;
  max-width: 50%;
  padding: 19px 20px 20px;
  text-align: left;
  /*background-color:rgba(191, 191, 191,0.5);*/

  display: none;
  border-bottom: 10px solid;
  background-color: rgba(3, 0, 0, 0.4);
}
#newsGuide .news_header {
  z-index: 15;
  font-weight: bold;
  font-size: 1.0vw;
  max-width: 50%;
  white-space: nowrap;
  overflow: hidden;
}
.news_header{
  padding: 0px 10px;
}
#newsGuide .news_title {
  font-size: 20px;
  font-size: 1.6vw;
  word-wrap: break-word;
  overflow: hidden;
}
#newsGuide a {
  color: #fff;
  text-decoration: none;
}
#newsGuide .news_body {
  font-size: 16px;
  font-size: 1.3vw;
  word-wrap: break-word;
  overflow: hidden;
}
#newsGuide .bing_power {
  font-size: 13px;
  position: absolute;
  right: 20px;
}
#feedBoxInchannel {
  z-index: 10;
  position: absolute;
  bottom: 0px;
  right: 0px;
  max-width: 20%;
  padding: 19px 20px 20px;
  margin-top: 15px;
  text-align: left;
  background-color: rgba(3, 0, 0, 0.4);
  /*background-color:rgba(191, 191, 191,0.5);*/

  display: none;
  border-top: 10px solid;
}
#feedBoxInchannel a {
  color: #fff;
  text-decoration: none;
}
#feedBoxInchannel .news_header {
  font-weight: bold;
  font-size: 1.1vw;
  max-width: 50%;
  white-space: nowrap;
  overflow: hidden;
}
#feedBoxInchannel .news_title {
  font-size: 1.6vw;
  word-wrap: break-word;
  overflow: hidden;
}
#feedBoxInchannel .news_body {
  font-size: 1.2vw;
  word-wrap: break-word;
  overflow: hidden;
}
#feedBoxInchannel .bing_power {
  font-size: 13px;
  position: absolute;
  right: 20px;
}



.animate-enter,
.animate-leave
{
    -webkit-transition: all 1s cubic-bezier(0.250, 0.250, 0.750, 0.750);
    -moz-transition: all 1s cubic-bezier(0.250, 0.250, 0.750, 0.750);
    -ms-transition: all 1s cubic-bezier(0.250, 0.250, 0.750, 0.750);
    -o-transition: all 1s cubic-bezier(0.250, 0.250, 0.750, 0.750);
    transition: all 1s cubic-bezier(0.250, 0.250, 0.750, 0.750);
    /*position: relative;*/
    /*display: block;*/
}

/*.animate-enter.animate-enter-active,
.animate-leave {*/
.animate-enter {
    opacity: 1;
    /*right: 0;*/
    /*height: 30px;*/
}

/*.animate-leave.animate-leave-active,
.animate-enter {*/
.animate-leave {
    opacity: 0;
    /*right: -50px;*/
    /*height: 0px;*/
}



.weather {
  z-index: 10;
  position: absolute;
  bottom: 155px;
  font-size: 1.2vw;
  left: 0px;
  max-width: 25%;
  text-align: left;
  padding: 5px;
  background-color: rgba(3, 0, 0, 0.4);
  /*background-color:rgba(191, 191, 191,0.5);*/

  border-right: 10px solid;
  /*display: none;*/
}
.weather .location {
  font-size: 1.1vw;
}
.weather .temp {
  font-size: 1.1vw;
}
.weather .weather_currently {
  font-size: 1.1vw;
}


i {
  color: #fff;
  font-family: weather;
  font-size: 120px;
  font-weight: normal;
  font-style: normal;
  line-height: 0.75;
}
.icon-0:before { content: ":"; }
.icon-1:before { content: "p"; }
.icon-2:before { content: "S"; }
.icon-3:before { content: "Q"; }
.icon-4:before { content: "S"; }
.icon-5:before { content: "W"; }
.icon-6:before { content: "W"; }
.icon-7:before { content: "W"; }
.icon-8:before { content: "W"; }
.icon-9:before { content: "I"; }
.icon-10:before { content: "W"; }
.icon-11:before { content: "I"; }
.icon-12:before { content: "I"; }
.icon-13:before { content: "I"; }
.icon-14:before { content: "I"; }
.icon-15:before { content: "W"; }
.icon-16:before { content: "I"; }
.icon-17:before { content: "W"; }
.icon-18:before { content: "U"; }
.icon-19:before { content: "Z"; }
.icon-20:before { content: "Z"; }
.icon-21:before { content: "Z"; }
.icon-22:before { content: "Z"; }
.icon-23:before { content: "Z"; }
.icon-24:before { content: "E"; }
.icon-25:before { content: "E"; }
.icon-26:before { content: "3"; }
.icon-27:before { content: "a"; }
.icon-28:before { content: "A"; }
.icon-29:before { content: "a"; }
.icon-30:before { content: "A"; }
.icon-31:before { content: "6"; }
.icon-32:before { content: "1"; }
.icon-33:before { content: "6"; }
.icon-34:before { content: "1"; }
.icon-35:before { content: "W"; }
.icon-36:before { content: "1"; }
.icon-37:before { content: "S"; }
.icon-38:before { content: "S"; }
.icon-39:before { content: "S"; }
.icon-40:before { content: "M"; }
.icon-41:before { content: "W"; }
.icon-42:before { content: "I"; }
.icon-43:before { content: "W"; }
.icon-44:before { content: "a"; }
.icon-45:before { content: "S"; }
.icon-46:before { content: "U"; }
.icon-47:before { content: "S"; }

#stockTicker{
  position: relative;
  width: 100%;
  text-align: left;
}
.stocks {
  z-index: 10;
  position: absolute;
  top: 2px;
  left: 18%;
  max-width: 75%;
  padding: 5px;
  text-align: left;
  background-color: rgba(3, 0, 0, 0.4);
  /*background-color:rgba(191, 191, 191,0.5);*/

  /*display: none;*/
  border-left: 10px solid;
}
.stocks ul, #stockTicker ul {
  padding: 4.5px 15px;
  margin:0;
  display: inline;
}
.stocks li, #stockTicker li {
  list-style-type: none;
  display: inline;
  margin: 0;
  margin-right: 5px;
}
#stockTicker span{
  margin-right: 10px;
}
#bingTicker, #rssTicker, #stockTicker{
  overflow: hidden;
  display: block !important;/*none;*/
  margin-bottom: -3px;
}
/*#stockTicker{
  display: block;
}*/
#bingTicker ul, #rssTicker ul{
  margin:-4;
  padding: 0 !important;

}
#bingTicker li, #rssTicker li{
  list-style-type: none;
}
#powered_by{
  color: #fff;
  text-decoration: none;
  margin-top: .2% !important;
  font-size:.9em;
}
li a{
   color: #fff;
   text-decoration: none;
 }
.green{
  color: green;
}
.red{
  color: red;
}
#debug_nav {
  z-index: 10;
  position: absolute;
  top: 25%;
  left: 0px;
  display: none;
}

#pipVideo{
  display: none;
}

#view_container{
  display:block;
  height:100vh;
  /*overflow-y: scroll;*/
}

.gig-bar-container img {
/*    width: 75%;*/
    width: 90%;
    margin: 8%;
}
.gig-bar-container{
    text-align: center;
}

#searchField{
  padding: 5px;
  overflow: hidden;
  outline-width: 0;
  color: #fff;
  font-weight: 600;
}


#searchBar {
    background-color: #7A7A7A;
    width: 22.5%;
    position: relative;
    height: 40px;
    left: 2.5%;
    opacity: 0.9;
    border-radius: 4px;
    display:none;
/*    box-shadow: inset 0px 0px 20px rgba(0,0,0,1);
    -webkit-box-shadow: inset 0px 0px 20px rgba(0,0,0,1);
    -moz-box-shadow: inset 0px 0px 20px rgba(0,0,0,1);*/
}
#channelGuideContainer {
    position: absolute;
    min-height: 0;
    width: 98%;
    /* top is set per-breakpoint in the media query blocks below:
       ≤1024px → calc(57% - ticker) via max-width:1024px
       ≥1025px → calc(55% - ticker) via min-width:1025px (v2.05.02) */
    bottom: auto;
}
#searchButton, #resetButton {
    width: 10%;
    padding-bottom: 2%;
    float: left;
}
.vid-control-spacer{
  padding: 0px 8px;
}
.inchannel-time-label{
  color: #fff;
  font-size: 1.00em;
  font-weight: 600;
  line-height: 32px;
  min-width: 38px;
  text-align: center;
  text-shadow: 0 1px 2px rgba(0,0,0,0.75);
  white-space: nowrap;
}
/*CMW - 6-23-22 - Fixed JW Control bar showing*/
.jw-controlbar {
  display:flex!important;
}

/*#resetButton{
  float: right;
}*/
#searchField, #searchFieldMessage {
    left: 36px;
    width: 69%;
    height: 20px;
    float: left;
}
/*#searchFieldMessage{
  left: 5px;
  width: 320px;
  top: 40%;
  font-size: 0.8em;
  text-align: center;
  color: red;
  display: none;
}*/
#searchFieldMessage {
  width: 72%;
  top: 20%;
  text-align: center;
  color: white;
  position: absolute;
  display: none;
}

.closeTab{
  width: 20px;
  height: 20px;
  position: relative;
  z-index: 500;
  float: right;
  background-image: url('/img/cmw_logo.png');
  background-size: 100% 100%;
}

@media (min-width: 1300px) {
  #premium_button {
      line-height: 3.5vh !important;
  }
}

/*@media (max-width: 1000px) {
  div.gig-button-container{
    padding: 0px !important;
  }
}*/

/************************* shared mobile/tablet styles ***************************/

.backgroundGradientGlass{
  background: -moz-linear-gradient(left,  rgba(0,0,0,0.7) 0%, rgba(0,0,0,0.1) 38%, rgba(0,0,0,0.1) 63%, rgba(0,0,0,0.7) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.7)), color-stop(38%,rgba(0,0,0,0.1)), color-stop(63%,rgba(0,0,0,0.1)), color-stop(100%,rgba(0,0,0,0.7))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(left,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.1) 38%,rgba(0,0,0,0.1) 63%,rgba(0,0,0,0.7) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(left,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.1) 38%,rgba(0,0,0,0.1) 63%,rgba(0,0,0,0.7) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(left,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.1) 38%,rgba(0,0,0,0.1) 63%,rgba(0,0,0,0.7) 100%); /* IE10+ */
  background: linear-gradient(to right,  rgba(0,0,0,0.7) 0%,rgba(0,0,0,0.1) 38%,rgba(0,0,0,0.1) 63%,rgba(0,0,0,0.7) 100%); /* W3C */
  /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#b3000000', endColorstr='#b3000000',GradientType=1 ); /* IE6-9 */
}

.backgroundGradientSport{
  background: -moz-linear-gradient(45deg,  rgba(0,0,0,0.6) 0%, rgba(0,0,0,0.6) 65%, rgba(0,0,0,0) 66%, rgba(0,0,0,0) 68%, rgba(0,0,0,0.6) 69%, rgba(0,0,0,0.6) 81%, rgba(0,0,0,0.4) 82%, rgba(0,0,0,0.4) 91%, rgba(0,0,0,0.2) 92%, rgba(0,0,0,0.2) 100%); /* FF3.6+ */
  background: -webkit-gradient(linear, left bottom, right top, color-stop(0%,rgba(0,0,0,0.6)), color-stop(65%,rgba(0,0,0,0.6)), color-stop(66%,rgba(0,0,0,0)), color-stop(68%,rgba(0,0,0,0)), color-stop(69%,rgba(0,0,0,0.6)), color-stop(81%,rgba(0,0,0,0.6)), color-stop(82%,rgba(0,0,0,0.4)), color-stop(91%,rgba(0,0,0,0.4)), color-stop(92%,rgba(0,0,0,0.2)), color-stop(100%,rgba(0,0,0,0.2))); /* Chrome,Safari4+ */
  background: -webkit-linear-gradient(45deg,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 65%,rgba(0,0,0,0) 66%,rgba(0,0,0,0) 68%,rgba(0,0,0,0.6) 69%,rgba(0,0,0,0.6) 81%,rgba(0,0,0,0.4) 82%,rgba(0,0,0,0.4) 91%,rgba(0,0,0,0.2) 92%,rgba(0,0,0,0.2) 100%); /* Chrome10+,Safari5.1+ */
  background: -o-linear-gradient(45deg,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 65%,rgba(0,0,0,0) 66%,rgba(0,0,0,0) 68%,rgba(0,0,0,0.6) 69%,rgba(0,0,0,0.6) 81%,rgba(0,0,0,0.4) 82%,rgba(0,0,0,0.4) 91%,rgba(0,0,0,0.2) 92%,rgba(0,0,0,0.2) 100%); /* Opera 11.10+ */
  background: -ms-linear-gradient(45deg,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 65%,rgba(0,0,0,0) 66%,rgba(0,0,0,0) 68%,rgba(0,0,0,0.6) 69%,rgba(0,0,0,0.6) 81%,rgba(0,0,0,0.4) 82%,rgba(0,0,0,0.4) 91%,rgba(0,0,0,0.2) 92%,rgba(0,0,0,0.2) 100%); /* IE10+ */
  background: linear-gradient(45deg,  rgba(0,0,0,0.6) 0%,rgba(0,0,0,0.6) 65%,rgba(0,0,0,0) 66%,rgba(0,0,0,0) 68%,rgba(0,0,0,0.6) 69%,rgba(0,0,0,0.6) 81%,rgba(0,0,0,0.4) 82%,rgba(0,0,0,0.4) 91%,rgba(0,0,0,0.2) 92%,rgba(0,0,0,0.2) 100%); /* W3C */
  /* filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#99000000', endColorstr='#33000000',GradientType=1 ); */
}
/* Cube Style Default */
.cubeimg {
/*  width: 80px;*/
  width: 100%;
  height: 100%;
  z-index: 5;
}

/* keyframes for rotating animation */
@-webkit-keyframes cube-spin {
    from { -webkit-transform: rotateY(0); }
    to { -webkit-transform: rotateY(-360deg); }
}

@-ms-keyframes cube-spin {
    from { ms-transform: rotateY(0); }
    to { ms-transform: rotateY(-360deg); }
}

@keyframes cube-spin {
    from { transform: rotateY(0); }
    to { transform: rotateY(-360deg); }
}

/* scene wrapper */
.wrapper{
  height: 200px;
  margin-top:0px;
  position:relative;
-webkit-perspective: 800px;
-webkit-perspective-origin: 50% -150px;
-webkit-transform: translate3d(0,0,1px);
-moz-perspective: 800px;
-moz-perspective-origin: 50% -150px;
-ms-perspective: 800px;
-ms-perspective-origin: 50% 75px;
perspective: 700px;
perspective-origin: 50% 300px;
}

/* cube wrapper */
.cube{
  position: relative;
  margin: 0 auto;
  width: 150px;
  padding-top: 35px;
  z-index: 150px;
-webkit-transform: translate3d(0,0,1px);
-webkit-transform-style: preserve-3d;
-webkit-animation: cube-spin 10s infinite linear;
-moz-transform-style: preserve-3d;
-moz-animation: cube-spin 10s infinite linear;
-ms-transform-style: preserve-3d;
-ms-animation: cube-spin 10s infinite linear;
transform-style: preserve-3d;
animation: cube-spin 10s infinite linear;
}

/* outer cube */
b{
  position:absolute;
  width:150px;
  height:150px;
  display:block;
  background: #888888;
  box-shadow:inset 0 0 30px rgba(0,0,0,0.2);
  font-size:20px;
  text-align:center;
  line-height:150px;
  color:rgba(0,0,0,0.5);
  font-family:sans-serif;
  text-transform:uppercase;
  transition: all 1s linear;
}
b.back{
-webkit-transform: translateZ(-75px) rotateY(180deg);
-moz-transform: translateZ(-75px) rotateY(180deg);
-ms-transform: translateZ(-75px) rotateY(180deg);
transform: translateZ(-75px) rotateY(180deg);
}
b.right{
-webkit-transform: rotateY(-270deg) translateX(75px);
-webkit-transform-origin: top right;
-moz-transform: rotateY(-270deg) translateX(75px);
-moz-transform-origin: top right;
-ms-transform: rotateY(-270deg) translateX(75px);
-ms-transform-origin: top right;
transform: rotateY(-270deg) translateX(75px);
transform-origin: top right;
-webkit-transform-origin-x: 100%;
-webkit-transform-origin-y: 0%;
}
b.left{
-webkit-transform: rotateY(270deg) translateX(-75px);
-webkit-transform-origin: center left;
-moz-transform: rotateY(270deg) translateX(-75px);
-moz-transform-origin: center left;
-ms-transform: rotateY(270deg) translateX(-75px);
-ms-transform-origin: center left;
transform: rotateY(270deg) translateX(-75px);
transform-origin: center left;
-webkit-transform-origin-x: 0%;
-webkit-transform-origin-y: 50%;
}
b.top{
-webkit-transform: rotateX(-90deg) translateY(-75px);
-webkit-transform-origin: top center;
-moz-transform: rotateX(-90deg) translateY(-75px);
-moz-transform-origin: top center;
-ms-transform: rotateX(-90deg) translateY(-75px);
-ms-transform-origin: top center;
transform: rotateX(-90deg) translateY(-75px);
transform-origin: top center;
-webkit-transform-origin-x: 50%;
-webkit-transform-origin-y: 0%;
}
b.bottom{
-webkit-transform: rotateX(90deg) translateY(75px);
-webkit-transform-origin: bottom center;
-moz-transform: rotateX(90deg) translateY(75px);
-moz-transform-origin: bottom center;
-ms-transform: rotateX(90deg) translateY(75px);
-ms-transform-origin: bottom center;
transform: rotateX(90deg) translateY(75px);
transform-origin: bottom center;
-webkit-transform-origin-x: 50%;
-webkit-transform-origin-y: 100%;
}
b.front{
-webkit-transform: translateZ(75px);
-moz-transform: translateZ(75px);
-ms-transform: translateZ(75px);
transform: translateZ(75px);
}

/* Cube Style Small */
.cubeimgSmall {
  width: 80px;
  z-index: 5;
}

/* keyframes for rotating animation */
@-webkit-keyframes cube-spin {
    from { -webkit-transform: rotateY(0); }
    to { -webkit-transform: rotateY(-360deg); }
}

@-ms-keyframes cube-spin {
    from { ms-transform: rotateY(0); }
    to { ms-transform: rotateY(-360deg); }
}

@keyframes cube-spin {
    from { transform: rotateY(0); }
    to { transform: rotateY(-360deg); }
}

/* scene wrapper */
.wrapperSmall{
  height: 300px;
  margin-top:0px;
  position:relative;
-webkit-perspective: 800px;
-webkit-perspective-origin: 50% -175px;
-webkit-transform: translate3d(0,0,1px);
-moz-perspective: 800px;
-moz-perspective-origin: 50% -175px;
-ms-perspective: 800px;
-ms-perspective-origin: 50% 60px;
perspective: 800px;
perspective-origin: 50% -175px;
}

/* cube wrapper */
.cubeSmall{
  position: relative;
  margin: 0 auto;
  width: 80px;
  padding-top: 35px;
  z-index: 150px;
-webkit-transform: translate3d(0,0,1px);
-webkit-transform-style: preserve-3d;
-webkit-animation: cube-spin 10s infinite linear;
-moz-transform-style: preserve-3d;
-moz-animation: cube-spin 10s infinite linear;
-ms-transform-style: preserve-3d;
-ms-animation: cube-spin 10s infinite linear;
transform-style: preserve-3d;
animation: cube-spin 10s infinite linear;
}

/* outer cube */
.cubeSmall b{
  position:absolute;
  width:80px;
  height:80px;
  display:block;
  background: #888888;
  box-shadow:inset 0 0 30px rgba(0,0,0,0.2);
  font-size:20px;
  text-align:center;
  line-height:80px;
  color:rgba(0,0,0,0.5);
  font-family:sans-serif;
  text-transform:uppercase;
  transition: all 1s linear;
}
.cubeSmall b.back{
-webkit-transform: translateZ(-40px) rotateY(180deg);
-moz-transform: translateZ(-40px) rotateY(180deg);
-ms-transform: translateZ(-40px) rotateY(180deg);
transform: translateZ(-40px) rotateY(180deg);
}
.cubeSmall b.right{
-webkit-transform: rotateY(-270deg) translateX(40px);
-webkit-transform-origin: top right;
-moz-transform: rotateY(-270deg) translateX(40px);
-moz-transform-origin: top right;
-ms-transform: rotateY(-270deg) translateX(40px);
-ms-transform-origin: top right;
transform: rotateY(-270deg) translateX(40px);
transform-origin: top right;
-webkit-transform-origin-x: 100%;
-webkit-transform-origin-y: 0%;
}
.cubeSmall b.left{
-webkit-transform: rotateY(270deg) translateX(-40px);
-webkit-transform-origin: center left;
-moz-transform: rotateY(270deg) translateX(-40px);
-moz-transform-origin: center left;
-ms-transform: rotateY(270deg) translateX(-40px);
-ms-transform-origin: center left;
transform: rotateY(270deg) translateX(-40px);
transform-origin: center left;
-webkit-transform-origin-x: 0%;
-webkit-transform-origin-y: 50%;
}
.cubeSmall b.top{
-webkit-transform: rotateX(-90deg) translateY(-40px);
-webkit-transform-origin: top center;
-moz-transform: rotateX(-90deg) translateY(-40px);
-moz-transform-origin: top center;
-ms-transform: rotateX(-90deg) translateY(-40px);
-ms-transform-origin: top center;
transform: rotateX(-90deg) translateY(-40px);
transform-origin: top center;
-webkit-transform-origin-x: 50%;
-webkit-transform-origin-y: 0%;
}
.cubeSmall b.bottom{
-webkit-transform: rotateX(90deg) translateY(40px);
-webkit-transform-origin: bottom center;
-moz-transform: rotateX(90deg) translateY(40px);
-moz-transform-origin: bottom center;
-ms-transform: rotateX(90deg) translateY(40px);
-ms-transform-origin: bottom center;
transform: rotateX(90deg) translateY(40px);
transform-origin: bottom center;
-webkit-transform-origin-x: 50%;
-webkit-transform-origin-y: 100%;
}
.cubeSmall b.front{
-webkit-transform: translateZ(40px);
-moz-transform: translateZ(40px);
-ms-transform: translateZ(40px);
transform: translateZ(40px);
}


/*CMW */

/* KAI2 - JBK - October 2020*/
.slider{
    /*-webkit-appearance: none !important;*/
    width:100%;
}

input[type=range]::-webkit-slider-runnable-track {
    width: 300px;
    height: 6px;
    background: #484848;
    border: none;
    border-radius: 3px;
    cursor: pointer;
}

input[type=range]::-webkit-slider-thumb {
    -webkit-appearance: none;
    border: none;
    height: 13px;
    width: 13px;
    border-radius: 50%;
    background: #1e3f5a;
    margin-top: -5px;
    cursor: pointer;
}

input[type=range]:focus {
    outline: none;
}

input[type=range]:focus::-webkit-slider-runnable-track {
    background: #484848;
}

/* JBK */

/*KAI2 DUX-38 - Social Sharing */
.jw-settings-menu{
  margin-bottom:70vh!important;
}


/*/KAI2 DUX-37*/
.desktopFooterText{
  text-align: center;
  color: white;
  font-size: 0.5em;
  display: block;
  width:100%;
  margin: 0 auto;
  position: absolute;
  bottom: 2px;

}
.header-footer-link {
  display: inline-block;
  margin-right: 3px;
  margin-left: 3px;
  font-size:9px;
  color: rgba(255, 255, 255, 0.6);
  line-height: 15px;
  font-weight: 300;
  letter-spacing: 1px;
  text-decoration: none;
  text-transform: uppercase;
}
.video_thumbnail_container {
  position: relative;
  text-align: center;
  vertical-align: middle;
  margin: auto;
  z-index: 1001;
  overflow: hidden;   /* allow cropping */
  /* IMPORTANT: do NOT add height:100% unless parent has a fixed height */
}

/* Crop to the container WITHOUT stretching */
.video_thumbnail_container img.guide_videos {
  width: 100%;
  height: auto;        /* prevents stretching */
  display: block;
  /* crop effect comes from max-height if container has a height */
  max-height: 100%;
  object-fit: cover;   /* only matters when both width & height are constrained */
}

/* RI - Play Icon strech fix */
.guideIconPlay{
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index:1001;
  opacity: 0.9;
  width: 22% !important;
  height: auto !important;
  max-width: 90px;
  max-height: 90px;
  min-width: 40px;
  min-height: 40px;
  aspect-ratio: 1 / 1;
  object-fit: contain;
  border-bottom: 0px solid !important;
}

/*CMW ScreenSaver**/
.video_tooltip {
  border: 1px solid #cccccc;
  background-color: #000000;
  position: absolute;
  padding: 3px 8px;
  font-size: 12px;
  z-index: 9999;
  margin-left: 30px;
  text-align: center;
  margin-top: 10px;
  max-width: 240px;
  display:none;
}
/* do not remove */
$size: 100px;


#screenSaver img, div {
  width: 100px;
  height: 100px;
}
div.x active{
  position: fixed;
  top: 0%;
  bottom: 0;
  left: 0;
  right: 0;
  cursor: wait;
  z-index: 100000;
  background: black;
  opacity: 0;
}
/*CMW Slepp Mode ScreenSaver */
.x {
  width: 100%;
  margin: 0px auto;

  animation: x 13s linear infinite alternate;
}
.y {
  animation: y 7s linear infinite alternate;
}
@keyframes x {
  100% {
    transform: translateX( calc(100vw - 100px) );
  }
}
@keyframes y {
  100% {
    transform: translateY( calc(100vh - 100px) );
  }
}



/*JBK Sharing Modal*/
.sharingPopUp{
  position:absolute;
  top:15%;
  left:33%;
  z-index:99;
  background-color: gray;
  color: black;

}
/* JBK Login Form - On Guide.jade */

#loginForm{
  border: 4px solid #707070;
  width: 30%;
  height: 40%;
  position: fixed;
  left: 36%;
  top: 20%;
  display:none;
  background-image: url("/img/login background box.png");
  background-size: cover;
}

input[type=text], input[type=password] {
  width: 74%;
  padding: 10px 10px;
  margin: 6% 1px;
  display: inline-block;
  border: 1px solid #000;
  box-sizing: border-box;
  height: 18%;
}

button {
  background-color: #4CAF50;
  color: white;
  padding: 14px 20px;
  margin: 8px 0;
  border: none;
  cursor: pointer;
  width: 100%;
}

button:hover {
  opacity: 0.8;
}

.loginbtn {
  width: 74%;

}
.imgcontainer {
  text-align: center;
  margin: 24px 0 12px 0;
}

#loginNetwork{
  width: 40%;
  border-radius: 50%;
  font-size: 160%;
  color: #707070;
}
#tickerDiv{
  margin-left:2px;
}
#tickerForm{
  display:inline-block!important;

  display: table;
  border: 2px solid red;
  border-radius:8px;
}
#ticTable{
  border-spacing:0; /* Removes the cell spacing via CSS */
  border-collapse: collapse;  /* Optional - if you don't want to have double border where cells touch */
  border:3px solid red;
  margin:2px;
  padding:3px;

}
/* Ticker Form */
.tickertable{
    display:table;
    border-collapse:collapse;
    align-self:center;
    text-align:center;
    display: flex;
    overflow:hidden;
    line-height: 1.0em;
  }
  .ticker-table {
    width: 100%;
    display: table;
    border-collapse:collapse;
    overflow:hidden;
    border:1px solid red;
    border-radius: 5px;
  }
  #ticker-table-body{
    display: table-row-group;
    display:flex;
    align-items: center;
    align-content: center;
  }
  .ticker-table-row{
    display: table-row;
    line-height: 3em;
      border:1px solid red;
  }
  .ticker-table-body-cell{
    display: table-cell;
  }
  .leftCell{
    text-align: left;
    margin-left: 1px;;
    vertical-align: middle;
    width:99%;
    display:inline-table;
    font-size:1.3em;
    font-weight:600;

  }
  .rightCell{
    text-align: left;
    vertical-align: middle;
    width:85%;
    font-size:1.3em;
    font-weight:600;

  }

/* End Ticker Form */

#saveTickerForm{
  width: 33%;
  border-spacing:0; /* Removes the cell spacing via CSS */
  border-collapse: collapse;  /* Optional - if you don't want to have double border where cells touch */
  font-size:1.8em;
  text-align: center;
  font-weight: 500;
  border:1px solid black;
  border-radius:6px;
}
#ticSTitle{
  font-size: small;
  color: #8080808c;
  display: block;
  position: absolute;
  right: 5px;
  top: .5%;
  font-weight: 200;
  text-align: right;
}
.ticInput{
  display:inline-block;
  width:93%!important;
  max-height:50px;
  margin: 3%!important;
  font-size:.75em;
  max-width:93%;
}

@keyframes fadeIn {
    from {opacity:0;}
    to {opacity:1;}
}
@keyframes fadeOut {
    from {opacity:1;}
    to {opacity:0;}
}
:root{
  --ticker-min-width:150vw;
}
#track {/*See guide-mobi.css for mobile #track css*/
  position: fixed;
  white-space: nowrap;
  will-change: transform;
  /*animation: marquee 12s linear infinite; - see videoPlayer.js*/
  font-size: 34px;
  font-weight: bold;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 1000;
  color:black;
  height:0;
  width: 100%;
  min-width:var( --ticker-min-width);
  overflow:hidden;
  opacity:0;
  box-sizing: border-box;
  background: #000;
  font-family: var(--pls0-font-family, var(--pls-font-family, 'Source Sans Pro', sans-serif));
}
#videoTicker #track {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  height: 100%;
  min-height: 100%;
  background: transparent;
}
#channelTickerTrack {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  white-space: nowrap;
  will-change: transform;
  font-size: 34px;
  font-weight: bold;
  color:black;
  height: 100%;
  min-height: 100%;
  overflow: hidden;
  width: 100%;
  min-width: var(--ticker-min-width);
  box-sizing: border-box;
  background: transparent;
  font-family: var(--pls0-font-family, var(--pls-font-family, 'Source Sans Pro', sans-serif));
}
#track.has-ticker {
  height: var(--pls-video-ticker-height);
  min-height: var(--pls-video-ticker-height);
  overflow:hidden;
  opacity:1;
}
#videoTicker #track.has-ticker {
  height: 100%;
  min-height: 100%;
}
#channelTickerTrack.has-ticker {
  height: 100%;
  min-height: 100%;
}
#marquee {
  position: relative;
  /*
  width: var( --ticker-min-width);
    max-width: var( --ticker-min-width);
    min-width:var( --ticker-min-width);
    border:1px solid red;
  */
  height: 0;
  overflow-x: hidden;
  display:none;
  width: 100%;
  margin-left:0;
  margin-right:0;
  top:0;
  font-family: var(--pls0-font-family, var(--pls-font-family, 'Source Sans Pro', sans-serif));

  /*animation: fadeIn 1.5s; marquee 1s linear infinite;*/
}
#channelTickerMarquee {
  position: relative;
  height: 0;
  overflow-x: hidden;
  display:none;
  width: 100%;
  margin-left:0;
  margin-right:0;
  top:0;
  font-family: var(--pls0-font-family, var(--pls-font-family, 'Source Sans Pro', sans-serif));
}
#track.has-ticker #marquee {
  height: 100%;
  display:flex;
  align-items:center;
  animation: fadeIn .5s;
  margin-left:10px;
  margin-right:10px;
  top:0;
}
#videoTicker #track.has-ticker #marquee {
  display: flex !important;
}
#channelTickerTrack.has-ticker #channelTickerMarquee {
  height: 100%;
  display:flex;
  align-items:center;
  animation: fadeIn .5s;
  margin-left:10px;
  margin-right:10px;
  top:0;
}
#marquee:empty {
  height: 0 !important;
  display:none !important;
  margin:0 !important;
  top:0 !important;
}
#channelTickerMarquee:empty {
  height: 0 !important;
  display:none !important;
  margin:0 !important;
  top:0 !important;
}
/*@keyframes marquee {
  0% { left: 0; }
  100% { left: -100%; }
}*/
@keyframes marquee {
  from { transform: translateX(0); }
  to { transform: translateX(-50%);}
}

#lDiv{
  float:left;
  width:27vw;
}
#netLogo{
  height:12vh;
  margin-top:1.5%;
  margin-left:2%;
}
#ticTitle{
  font-size:1.4em;
  font-weight:700;
  color:white;
  margin-top:3px;
  margin-left:0px;
  max-width:80%;
}
#formButtonDiv{
  display: flex;
  justify-content: center;
}
#marquee-ticker-link{
  text-decoration:none;
  color:gray;
  font-family: inherit !important;
  font-style: inherit !important;
  font-weight: inherit !important;
}
#tickerSelect{
  width:97%!important;
  min-height:3vh
}
#wrapper{
  height:100%;
  overflow:auto;
}