.logo {
  text-decoration: none 
}
.logo:hover,
.logo:focus {
  text-decoration: none 
}
.logo h1 {
  margin: 0;
  line-height: 1;
  color: #f7fbff;
  text-transform: uppercase;
  font-family:"Sinkin Sans 900 X Black Italic"; 
  font-size: 1em;
  font-size: 0.85em 
}
.logo h1 span {
  font-family: "Roboto Condensed", sans-serif !important;
  font-weight: 700;
  font-style: italic;
  font-size: 1em;
  position: relative;
  top: -1px;
  background-color: #daa300;
  padding: 0.1em 0.25em;
  border-radius: 2px 
}
@media (max-width:576px) {
  .logo h1 {
    font-size: 0.8em 
  }
}
@media (max-width:400px) {
  .logo h1 {
    font-size: 0.65em 
  }
}
.btn {
  border: none;
  font-size: 0.7rem;
  padding: 0.5rem 1.5rem;
  text-transform: uppercase;
  line-height: 1 
}
@media (max-width:576px) {
  .btn {
    padding: 0.5rem 0.875rem 
  }
}
.btn-primary {
  background-color: #daa300;
  color: #f7fbff 
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:not(:disabled):not(.disabled):active {
  background-color: #a77d00;
  border: none;
  box-shadow: none 
}
.btn-secondary {
  opacity: 0.65;
  background-color: transparent;
  border: 1px solid rgba(255, 255, 255, 0.5) 
}
.btn-secondary:hover,
.btn-secondary:focus,
.btn-secondary:not(:disabled):not(.disabled):active {
  opacity: 1;
  border: 1px solid rgba(255, 255, 255, 0.5);
  box-shadow: none;
  background-color: transparent 
}
.btn-outline {


}
.btn-outline:hover,
.btn-outline:focus {
  border: 1px solid #a77d00;
  color: #f7fbff;
  box-shadow: none 
}
.btn-shade {
  background-color: #0f151c;
  color: #f7fbff 
}
.btn-shade:hover,
.btn-shade:focus {
  background-color: #17212d;
  color: #f7fbff;
  box-shadow: none 
}
.btn-lg {
  padding: 0.8em 2em;
  font-size: 1.25em;
line-height: 1.5 }
.navbar .navbar-nav .nav-link--border {
  border:1px solid rgba(255, 255, 255, 0.5);
  border-radius:3px;
  padding:.5rem 1.2rem;
  margin-right:.5em
}
.navbar .navbar-nav .nav-link--primary {
  background-color: transparent !important
  border:1px solid #57f398;
  border-radius:3px;
  padding:.5rem 1.2rem;
    border: 1px solid #daa300;
  color: #f7fbff;
}
.player__live {
  position: absolute;
  top: 1em;
  right: 1em;
  z-index: 10 
}
.live-badge {
  display: inline-flex;
  align-items: center;
  padding: 0.35em 0.5em;
  border: 1px solid rgba(255, 255, 255, 0.5);
  border-radius: 0.25rem 
}
.live-badge span {
  font-size: 0.7em;
  line-height: 1;
  text-transform: uppercase 
}
.live-badge__icon {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin-right: 0.25em;
  background-color: #fc0017;
  border-radius: 50%;
  -webkit-animation-name: pulse;
  -webkit-animation-duration: 4s;
  -webkit-animation-iteration-count: infinite;
  animation-name: pulse;
  animation-duration: 2s;
  animation-iteration-count: infinite 
}
.player__preloader {
  display: none;
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 5 
}
.player__preloader .preloader {
  position: absolute;
  width: 100%;
  max-width: 480px 
}
.player__preloader span {
  display: block;
  font-size: 0.875em;
  color: rgba(255, 255, 255, 0.5);
  text-align: center;
  margin-top: 1em 
}
.player__poster {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  background: #0c1117;
  z-index: 5 
}
.player__poster__state {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: 100% 
}
@media (max-width:576px) {
  .player__poster__state>p {
    font-size: 0.85em 
  }
}
.player__poster__cta {
  display: flex;
  align-items: center;
  justify-content: center;
  position: absolute;
  width: 100%;
  height: 100%;
  color: #fff;
  text-transform: uppercase;
  cursor: pointer 
}
.player__poster__cta:hover,
.player__poster__cta:focus {
  text-decoration: none;
  color: #fff 
}
.player__poster__cta__play-icon {
  display: flex;
  align-items: center;
  height: 40px;
  padding: 0.35em 1.5em;
  margin: 0 0.5em;
  border-radius: 5px;
  border: 2px solid #daa300;
  -webkit-transition: border 0.3s ease-in-out;
  transition: border 0.3s ease-in-out 
}
.player__poster__cta__play-icon>i {
  font-size: 1.25em;
  -webkit-transition: transform 0.2s ease-in-out;
  transition: transform 0.2s ease-in-out 
}
.player__poster__cta__play-icon:hover,
.player__poster__cta__play-icon:focus {
  border: 2px solid #fff 
}
.player__poster__cta__play-icon:hover>i,
.player__poster__cta__play-icon:focus>i {
  -webkit-transform: scale(0.9);
  transform: scale(0.9) 
}
.player__poster__cover {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: -1;
  width: 100%;
  height: 100%;
  object-fit: cover;
  background-size: cover;
  background-repeat: no-repeat 
}
.player__poster__cover.default {
  background-image: url("../img/player-poster-cover.jpg") 
}
.player__poster__cover.channel-bein {
  background-image: url("../img/player-poster-bein.jpg") 
}
.player__poster__cover.channel-tsn {
  background-image: url("../img/player-poster-tsn.jpg") 
}
.player__poster__cover.channel-cbc {
  background-image: url("../img/player-poster-cbc.jpg") 
}
.player__poster__cover.channel-fox {
  background-image: url("../img/player-poster-fox.jpg") 
}
.player__poster__cover.channel-sportsnet {
  background-image: url("../img/player-poster-sportsnet.jpg") 
}
.player__poster__cover__overlay {
  position: relative;
  height: 100% 
}
.player__poster__cover__overlay:before {
  content: "";
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  z-index: 5;
  width: 100%;
  height: 100%;
  background: rgba(12, 17, 23, 0.5) 
}
.player__poster__cover__overlay.channel:before {
  background: rgba(12, 17, 23, 0.8) 
}
.player__poster__cover__score {
  position: absolute;
  top: 40px;
  left: 50%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%);
  text-align: center 
}
@media (max-width:768px) {
  .player__poster__cover__score {
    top: 20px 
  }
}
.player__poster__cover__teams {
  position: absolute;
  top: 0;
  right: 0;
  left: 0;
  bottom: 0;
  display: flex;
  align-items: center 
}
.player__poster__cover__teams>img {
  position: absolute;
  width: 50% 
}
.player__poster__cover__teams>img:first-child {
  left: -5%;
  -webkit-transform: perspective(460px) rotateX(20deg) rotateY(45deg) rotateZ(0deg);
  transform: perspective(460px) rotateX(20deg) rotateY(45deg) rotateZ(0deg);
  transform-origin: center center 0 
}
.player__poster__cover__teams>img:last-child {
  right: -5%;
  -webkit-transform: perspective(460px) rotateX(20deg) rotateY(-45deg) rotateZ(0deg);
  transform: perspective(460px) rotateX(20deg) rotateY(-45deg) rotateZ(0deg);
  transform-origin: center center 0 
}
.player__poster .thumb {
  position: relative;
  height: 100%;
  width: 100%;
  z-index: -1 
}
.player__poster .thumb>img {
  opacity: 0.25;
  padding: 2.5rem 
}
.player__poster>img {
  cursor: pointer;
  opacity: 0.5;
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  transition: opacity 0.3s ease-in, transform 0.1s ease-in 
}
.player__poster>img:hover {
  opacity: 1;
  -webkit-transform: translate(-50%, -50%), scale(0.9);
  transform: translate(-50%, -50%), scale(0.9) 
}
.subplayer {
  padding: 1.5em 0 
}
.img-channel {
  max-width: 80px;
  opacity: 0.3 
}
.text-right {
  text-align:right!important
}
section.tint {
  background: #0f151c 
}
.divider {
  width: 100%;
  height: 1px;
  background-color: rgba(247, 251, 255, 0.1) 
}
.device-features__brands {
  margin-bottom: 0.5em 
}
.device-features__brands img {
  margin: 1em;
  opacity: 0.5 
}
.btn-shade {
  background-color: #0f151c;
  color: #f7fbff 
}
.btn-shade:hover,
.btn-shade:focus {
  background-color: #17212d;
  color: #f7fbff;
  box-shadow: none 
}
.btn-lg {
  padding: 0.8em 2em;
  font-size: 1.25em;
  line-height: 1.5 
}
.btn-md {
  padding: 0.8em 2em;
  font-size: 1em;
  line-height: 1 
}
.btn-outline {
  border: 1px solid #daa300;
  color: #f7fbff;
  background-color: transparent 
}
.text {
  color: #fff;
  font-size: 1em;
  margin-bottom: 0.5em 
}
.media__description {  font-family: "Roboto Condensed", sans-serif;
  font-weight: 400;
  font-size: 16px;
  color: #f7fbff;}
  .footer {
  border-top:1px solid rgba(248,251,255,.1);
  padding:1.6em 0;  margin-top: 10em;
}
.footer .copyright {
  font-size:.8em;
  color:rgba(248,251,255,.6)
}
.footer__wrapper {
  display:flex;
  justify-content:space-between;
  align-items:center
}
@media(max-width:575px) {
  .footer__wrapper {
    flex-direction:column
  }
}
.footer__links>a {
  color:rgba(248,251,255,.6);
  text-decoration:none;
  font-size:.8em
}
.footer__links>a:not(last-child) {
  margin-right:1.6em
}
section {
  padding: 4em 0;
}
@media (max-width:768px) {
  section {
    padding: 1em 0 
  }
}
section.tint {
  background: #0f151c 
}
section.shade {
  background: #030506 
}
.navbar>.container-fluid {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-wrap:wrap;
  flex-wrap:wrap;
  -ms-flex-align:center;
  align-items:center;
  -ms-flex-pack:justify;
  justify-content:space-between
}
.navbar-brand {
  display:inline-block;
  padding-top:.3125rem;
  padding-bottom:.3125rem;
  margin-right:1rem;
  font-size:1.25rem;
  line-height:inherit;
  white-space:nowrap
}
.navbar-brand:focus,
.navbar-brand:hover {
  text-decoration:none
}
.navbar-nav {
  display:-ms-flexbox;
  display:flex;
  -ms-flex-direction:column;
  flex-direction:column;
  padding-left:0;
  margin-bottom:0;
  list-style:none
}
.navbar-dark .navbar-nav .nav-link {font-size: 16px;
  color:rgba(255,255,255,.5)
}
.navbar-dark .navbar-nav .nav-link:focus,
.navbar-dark .navbar-nav .nav-link:hover {
  color:rgba(255,255,255,.75)
}