html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	font-family:'Exo 2', arial, verdana, sans-serif;
	font-size:10px;
	line-height:10px;
}

html,body { width:100%; height:100%; }

.player { position:relative; margin:0 auto; overflow:hidden; width:100vw; height:56.25vw; visibility: visible; }
.header { position:absolute; margin:0 auto; overflow:hidden; width:100vw; }
.headerText { font-size:20px; font-size:2.0rem; height:80px; line-height:80px; padding-left:10px; }
.header.hide { display:none; }
.video-js .vjs-title-bar { background: rgba(0, 0, 0, 0.5); color: white; display: none; font-size:11px !important; font-size:1.1rem !important; height:25px !important; line-height:25px !important; padding-left:10px; position: absolute; top: 0; left: 0; width: 100%; }
.video-js.vjs-paused.vjs-has-started .vjs-title-bar,
.video-js.vjs-user-active.vjs-has-started .vjs-title-bar { display: block; }

.upper{ margin:0 auto; overflow:hidden; } 
.video { margin:0 auto; overflow:hidden; z-index:1999; }
/*#videoPlayer { display:inline-block !important; }  causes issues with fullscreen */
.videoOverlay { margin:0 auto; overflow:hidden; position:absolute; top:25px; right:0; bottom:0; left:0; z-index:2000; cursor:pointer; background:#000; color:#FFF; display:none; }
.videoDetails { position:absolute; top:10px; left:10px; right:10px; font-size:1.2rem; line-height:1.4rem; }
.countDown { position:absolute; bottom:10px; left:10px; right:10px; font-size:1.2rem; line-height:1.4rem; }

.underlayImage { display:block; width:100%; height:calc(100% / (16/9)); position:relative; }
.static { margin:10px auto; overflow:hidden; width:300px; display:none; }
.videoUnderlayMargins { position:relative; margin:10px; }
.underlayTitle { font-weight: bold; font-size:13px; font-size:1.3rem; line-height:14px; line-height:1.45rem; margin:10px; }
.underlayTime { font-weight:bold; font-size:11px; font-size:1.1rem; line-height:13px; line-height:1.3rem; position:absolute; right:10px; bottom:15px; left:10px; }
.underlayDivider { float: left; font-size:11px; font-size:1.1rem; line-height:13px; line-height:1.3rem; margin:0 5px; }
.underlaySummary { font-size:11px; font-size:1.1rem; line-height:13px; line-height:1.3rem; margin:0 10px; }

.videoLandscape { position:absolute; top:0; left:0; z-index:2000; background:#000; }
.lower{ margin:0 auto; overflow:hidden; }
.sliderNav { height:40px; margin:0 auto; overflow:hidden; position:relative; }
.frameLoader { margin:0 auto; overflow:hidden; position:absolute; top:50px; right:0; bottom:0; left:0; z-index:300; display:none; }
.feedNav { position:relative; margin:10px auto; overflow:hidden; height:30px; }
.companyNav { position:absolute; top:0; right:0; bottom:0; left:0; margin:0 auto; overflow:hidden; height:41px; z-index:100; display:none; }
.prevArrow { margin:0 auto; overflow:hidden; position:absolute; top:3px; left:10px; width:0; height:0;  z-index:99; }
.feedHeader { position:absolute; top:0; right:0; bottom:0; left:0; height:30px; margin:0 auto; overflow:hidden; }
.feedTitle { width:200px; height:30px; margin:0; overflow:hidden; line-height:30px; line-height:3.0rem; font-size:18px; font-size:1.8rem; font-weight:bold; text-align:center; }
 
.companion { width:300px; position: absolute; background: none; bottom:35px; right:calc(50% - 150px); display:none; }
.companion a img { width: 100% !important; height: auto !important; }
.overlayCompanionClose { cursor: pointer; position: absolute; bottom: 90px; right: calc(50% - 158px); background: #000; width: 15px; height: 15px; border-radius: 15px; color: #FFF; text-align: center; line-height: 15px; display:none; }
.vjs-remaining-time-display { line-height:3em; }

/* *** BEGIN ANIMATED COMPONENTS *** */

.videoUnderlay { position:absolute; overflow:hidden; top:0; left:-50%; bottom:0; z-index: 3002; width:50%; background:rgba(0, 0, 0, 0.75) none repeat scroll 0 0; }
.videoUnderlay.close{ left:-50%; }
.videoUnderlay.open{ left:0;}

.playlist { margin:0 auto; position:absolute; top:25px; bottom:0; right:-50%; width:50%; z-index:3004; background:#D2D2D2; }
.playlist.close { right:-50%; }
.playlist.open { right:0; }

.menuButton { position:absolute; height:25px; width:50%; right:calc(-50% + 25px); top:0; cursor:pointer; z-index:3005; }
.menuButton.close { right:calc(-50% + 25px); }
.menuButton.open { right:0; }
.menuButton.hidden { display: none; }

.headerNowPlaying { display:block; position:absolute; right:0; top:0; height:25px; z-index:3001; width:100%; background: rgba(0, 0, 0, 0.65) none repeat scroll 0 0; color: #fff; }

.animateOn .animateRight { transition:right 0.35s ease-out; }
.animateOn .animateLeft { transition:left 0.35s ease-out; }
.animateOn .animateFade { transition:opacity 0s ease-out; }

/* *** END ANIMATED COMPONENTS *** */

.feedFrame { margin:0 auto; overflow:visible; position:absolute; top:50px; right:0; bottom:0; left:0; background:#D2D2D2; }
.feedContent { margin:0 auto; position:absolute; top:0; right:0; bottom:0; left:0; }
.feedPlaylist { margin:0 auto; float:left; position:absolute; top:0; right:0; bottom:0; left:0; }
.feedPlaylist.hover { height:114px; }
.page { margin:0 auto; position:absolute; top:0; right:0; bottom:0; left:0; }
.playlistSlider { margin:0 auto; width:100%; }
.companyFrame { margin:0 auto; overflow:hidden; z-index:50; display:none; }
.menuIcon { width:30px; height:30px; margin:10px; float:left; }

.contentHeader { height:51px; }
.homeLink { display:none; float:left; font-size:19px; font-size:1.9rem; line-height:51px; line-height:5.1rem; }
.homeLink a { font-size:19px; font-size:1.9rem; line-height:51px; line-height:5.1rem; }
.categoryHeader { float:left; font-size:19px; font-size:1.9rem; line-height:51px; line-height:5.1rem; }

.leagueLogo { margin-left:10px; width:200px; height:50px; }

.companyStories { margin:0 auto; overflow:hidden; position:absolute; right:0; bottom:0; left:0; }

.companyContent { margin:0 auto; overflow:visible; }
.companyTitle { margin:0 auto; overflow:hidden; font-size:19px; font-size:1.9rem; line-height:40px; line-height:4.0rem; text-align:center; position:absolute; top:0; right:0; bottom:0; left:40px; }

.companyPlaylist { margin:0 auto; position:relative; }
.companyPlaylist.hover { height:114px; }
.companyHeader { display:none; position:relative; z-index:101; height:40px; }
.backButton { float:left; width:40px; height:40px; }
.pageWrapper { margin:0 auto; position:absolute; top:0; right:0; bottom:0; left:0; }
.item { height:76px; width:100%; margin:0 auto; overflow:hidden; cursor:pointer; }
.active { background:#e1e1e1; }
.storyLoader { position:absolute; top:0; left:0; right:0; bottom:0; display:none; }

.itemDetails  { margin:0 auto; overflow:hidden; height:76px; width:100%; }
.itemThumbnail { width:100px; height:56px; float:left; margin:10px; }
.thumb  { width:100px; height:56px; }
.itemTitle { margin:0 10px 0 0; font-size:13px; line-height:15px; font-size:1.3rem; line-height:1.55rem; font-family:'Open Sans', arial, sans-serif; color:#181818; }
.storyAge { margin:0 auto; overflow:hidden; line-height:15px; line-height:1.5rem; font-size:10px; font-size:1rem; position:absolute; left:0; top:8px; }

#mainScrollbar { width:43px; height:460px; margin:0 auto; overflow:hidden; position:absolute; right:0; top:51px; }

.iScrollLoneScrollbar { position:absolute; width:8px; right:5px; bottom:5px; top:5px; border-radius:10px; }
.scrollHandle { width:8px !important; height:89px !important; margin-left:0; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }

.scrollbarWrapper { width:20px; position:absolute; top:0; bottom:0; right:160px; background:#BFBFBF; }
.categoryContainer .iScrollLoneScrollbar { position:absolute; width:8px; height:400px; right:16px; top:14px; border-radius:10px; }
.categoryContainer .iScrollLoneScrollbar .scrollHandle { width:20px !important; height:87px !important; margin-left:-6px; -webkit-border-radius:10px; -moz-border-radius:10px; border-radius:10px; }
.errorMsg { font-size:1.5rem; position:absolute; top:50%; right:10px; left:10px; line-height:2rem; margin-top:-2rem; text-align:center; color: white;}

#overlayCompanion1close { z-index: 99; display: block; cursor: pointer; left: 50%; top: auto; bottom: 70px; margin-left: 136px; position: absolute; background: rgba(69,69,69,0.8); color: #fff; font-size: 2em; line-height: 1; padding: 1px 2px; border-radius: 20%; }
.playCircle, .playButton { height: 53px; width: 53px; border-radius: 4px; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); }
.playArrow, .playButtonArrow { width: 0; height: 0; border-style: solid; border-width: 10px 0 10px 16px; top:50%; left:50%; transform:translate(-45%,-50%); position:absolute; }
.playVideoArrow { width:0; height:0; border-style:solid; border-width:5px 0 5px 8px; border-color: transparent transparent transparent #ffffff; position:absolute; top:50%; transform:translate(0,-50%); }
.playVideoText { position:absolute; left:15px; top:50%; transform:translate(0,-50%); }
.playVideoText .playVideo, .playVideoText .seperator, .playVideoText .videoLength { float:left; }
.playVideoText .seperator { margin:0 5px; }
.playlistTime { color:#181818; position:absolute; bottom:7px; font-weight:bold; }
.videoTime { position:absolute; bottom:0; right:0; padding:3px; background:#000; background:rgba(0,0,0,0.60); color:#FFF; }

/* style to prevent default ie drag */ 
.feedFrame, .companyFrame { touch-action: none; -ms-touch-action: none; } 

/* The rule below is to resolve animation resizing issues during IMA/DFP ad playback*/
#videoPlayer_ad > div, #videoPlayer_ad iframe {width:100% !important; height:100% !important; }
/*
#aniplayer-overlay, #aniplayer, #aniplayer #playerDiv, #aniplayer #playerDiv * { top: 0 !important; right: 0 !important; bottom: 0 !important; left: 0 !important; width: 100% !important; height: 100% !important; transform: none !important; -webkit-transform: none !important; }
#aniplayer #logo_Button { margin: 0px 0px -32px 100% !important; right: 57px !important;}
#aniplayer #bottomPlayer {width: 100% !important; }
#aniplayer #soundButton { margin: 0px 0px -32px 100% !important; right: 32px !important; }
*/
.jw-background-color { background:rgba(0,0,0,0.65); }
.jwplayer.jw-state-paused.jw-skin-seven .jw-display-icon-container { display: table; }
.jwplayer.jw-state-paused.jw-skin-seven.jw-flag-user-inactive  .jw-controlbar { display: none !important; }
.jwplayer.jw-flag-media-audio.jw-flag-user-inactive .jw-controlbar { display: none !important; }
.jwplayer.jw-flag-media-audio.jw-flag-dragging .jw-controlbar { display: table !important; }
.jwplayer.jw-skin-seven .jw-display-icon-container { border-radius: 10%; border: 0px solid #333; }
.jwplayer.jw-skin-seven .jw-display-icon-container { position: relative; top: 50%; display: table; height: 5em; width: 5em; margin: -2.5em auto 0; cursor: pointer; }
.jwplayer.jw-skin-seven .jw-display-icon-container .jw-button-color:hover { color: #fff;}

/* Rules for the layout of the player when it is in floating mode */
.float .player { height:calc(56.25vw + 25px); }
.float .video { position:absolute; top:25px; right:0; bottom:0; left:0; }
.float .menuButton { display:none; }
.float .closeFloat { width:20px; height:20px; position:absolute; top:3px; right:3px; background:#000; border-radius:10px; }
.float .closeButton { position:absolute; right:3px; top:3px; width:20px; height:20px; background:#000; border-radius:50%; z-index:3004; }
.float .closeButton:before, .float .closeButton:after { position:absolute; top:50%; left:50%; content:''; height:14px; width:2px; background-color:#FFF; display:block;}
.float .closeButton:before { transform:translate(-50%,-50%) rotate(45deg); }
.float .closeButton:after { transform:translate(-50%,-50%) rotate(-45deg); }
.float .header { background:#BA0700; background:rgba(168,7,0,1); height:25px; }
.float .headerNowPlaying { background:none; }
.float .jwplayer.jw-skin-seven .jw-display-icon-container { height:2.75em; width:2.75em; margin:0 auto; transform:translate(0,-50%); }
.float .jw-skin-seven .jw-display-icon-container>.jw-icon { font-size:1em; }

@media only screen 
and (min-width : 200px) {
	.headerClass { height:25px; line-height:25px; line-height:2.5rem; }
	.headerText { display:none; }
	
	.nowPlayingMargins { margin:0 35px 0 10px; line-height:25px; line-height:2.5rem; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; font-size:1.1rem; font-weight:bold; }
	.thumb { width:80px; height:45px; }
	.item { border:0 none; height:60px; }
	.itemThumbnail { height: 45px; margin:7px; width: 80px; position:relative; }
	.videoPosition { top: 0; }
	.video { right: 0; position:relative; }
	.underlayHeight { height:auto; top: 0; }
	.menuIcon { height: 15px; margin: 5px; width: 15px; }
	.feedNav { height: 25px; margin:0 auto; }
	.feedHeader { height: 25px; right:13px; }
	.feedFrame { top:25px; }
	.feedTitle { font-size:15px; font-size:1.5rem; height:25px; line-height:25px; line-height:2.5rem; width:100%; }
	.story { width:100%; height:60px; }
	.itemDetails { height:60px; }
	.thumbTitle { height:60px; }
	.thumbTitleText { right:20px; margin:0; top:0; bottom:0; }
	.thumbTitleP { position:absolute; top:3px; bottom:17px; }
	.itemTitle { font-size: 1.1rem; line-height: 1.2em; font-weight:bold; }
	.storyAge { top:3px; display:none; }
	.playButton { display:none; }
	.frameLoader  { top:25px; }
	.scrollbarWrapper { border-left:0 none; right:0; }
	.poweredBy { display:none; }
}

@media only screen 
and (min-width : 180px) and (max-width : 460px) { 
	
	/* *** BEGIN ANIMATED COMPONENTS *** */

	.videoUnderlay { left:-100%; width:100%; }
	.videoUnderlay.close{ left:-100%; }
	.float .videoUnderlay { top:25px; }

	.playlist { right:-100%; width:100%; }
	.playlist.close { right:-100%; }

	.menuButton { width:100%; right:calc(-100% + 25px); }
	.menuButton.close { right:calc(-100% + 25px); }

	/* *** END ANIMATED COMPONENTS *** */
	
	.underlayImage { display:none; }
	
}

@media all and (-ms-high-contrast: none), (-ms-high-contrast: active) {
/* IE10+ CSS fix for ad height issue */
	.ima-ad-container div:first-child, .ima-ad-container div iframe { height:100%!important; }
}

.float .vjs-title-bar,
.float .feedNav
{
	display: none !important;
}

.video-js .vjs-volume-menu-button.vjs-hidden
{
	display: flex !important;
	width: 4em !important;
}
