@import url('//fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700'); /*Theme Tool v1.0.1*/ /*------------------------------------*\ Default Theme Colours - Light \*------------------------------------*/ :root { /* Background color #fff using HSL */ --hue-background: 192; --saturation-background: 16.1%; --light-background: 93.9%; --opacity-background: 1; /* Base text color #1F1F1F using HSL */ --hue-text: 0; --saturation-text: 0%; --light-text: 12.2%; --opacity-text: 1; /* Primary color #283593 using HSL */ --hue-primary: 200; --saturation-primary: 100%; --light-primary: 36.5%; --opacity-primary: 1; /* Primary text color */ --primary-text: #fff; /* Secondary color #FFFFFF using HSL */ --hue-secondary: 204; --saturation-secondary: 15%; --light-secondary: 92%; --opacity-secondary: 1; /* Secondary text color */ --hue-secondary-text: 181; --saturation-secondary-text: 100%; --light-secondary-text: 91.8%; --secondary-text-hsl: var(--hue-secondary-text), var(--saturation-secondary-text), var(--light-secondary-text); --secondary-text: hsl(var(--secondary-text-hsl)); --size-left: 145px; /*------------------------------------*\ /* Base theme colors */ --theme-background: hsla(var(--hue-background), var(--saturation-background), var(--light-background), var(--opacity-background)); --theme-background-lighten: hsla(var(--hue-background), var(--saturation-background), calc(var(--light-background) + 15%), var(--opacity-background)); --theme-background-darken: hsla(var(--hue-background), var(--saturation-background), calc(var(--light-background) - 15%), var(--opacity-background)); --theme-text: hsla(var(--hue-text), var(--saturation-text), var(--light-text), var(--opacity-text)); --theme-text-lighten: hsla(var(--hue-text), var(--saturation-text), calc(var(--light-text) + 55%), var(--opacity-text)); --theme-text-darken: hsla(var(--hue-text), var(--saturation-text), calc(var(--light-text) - 35%), var(--opacity-text)); --theme-primary: hsla(var(--hue-primary), var(--saturation-primary), var(--light-primary), var(--opacity-primary)); --theme-primary-lighten: hsla(var(--hue-primary), var(--saturation-primary), calc(var(--light-primary) + 10%), var(--opacity-primary)); --theme-primary-darken: hsla(var(--hue-primary), var(--saturation-primary), calc(var(--light-primary) - 10%), var(--opacity-primary)); --theme-primary-text: #FFFFFF; --theme-secondary: hsla(var(--hue-secondary), var(--saturation-secondary), var(--light-secondary), var(--opacity-secondary)); --theme-secondary-lighten: hsla(var(--hue-secondary), var(--saturation-secondary), calc(var(--light-secondary) + 10%), var(--opacity-secondary)); --theme-secondary-darken: hsla(var(--hue-secondary), var(--saturation-secondary), calc(var(--light-secondary) - 10%), var(--opacity-secondary)); --theme-secondary-text: var(--secondary-text); --theme-body-font-family: Lato, Arial, 'Helvetica Neue', Helvetica, sans-serif; --theme-body-font-size: 14; --theme-body-font-weight: 400; --theme-body-font-style: normal; --theme-body-font-lineheight: 1.5; --theme-secondary-text-family: 'Oswald', serif; --theme-secondary-text-size: 14; --theme-secondary-text-style: normal; --theme-secondary-text-weight: 400; --theme-secondary-text-lineheight: 1.5; --theme-header-link: #0095A8; --theme-header-link-hover: #D5FEFF; --theme-header-border: #FFFFFF; --theme-header-border-size: 3; --header-menu-font-size: 19; --header-menu-font-transformation: capitalize; /*------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------*\ /* Body */ --body-background: var(--theme-background); --body-text-color: var(--theme-text); --body-font-family: 'Roboto', sans-serif; --body-font-size: calc(var(--theme-body-font-size) * 1px); --body-font-style: normal; --body-font-weight: 400; --hue-body-link: 187; --saturation-body-link: 100%; --light-body-link: 32.9%; --body-link-hsl: var(--hue-body-link), var(--saturation-body-link), var(--light-body-link); --body-link: hsl(var(--body-link-hsl)); --hue-body-link-hover: 200; --saturation-body-link-hover: 100%; --light-body-link-hover: 36.5%; --body-link-hover-hsl: var(--hue-body-link-hover), var(--saturation-body-link-hover), var(--light-body-link-hover); --body-link-hover: hsl(var(--body-link-hover-hsl)); /* Titles */ --theme-title-font-family: Lato, Arial, 'Helvetica Neue', Helvetica, sans-serif; --theme-title-font-size: 26; --theme-title-font-style: normal; --theme-title-font-weight: 700; --theme-title-font-transformation: none; /* Header colors */ --hue-header-bg: 0; --saturation-header-bg: 0%; --light-header-bg: 100%; --opacity-header-bg: 1; --header-bg-hsl: var(--hue-header-bg), var(--saturation-header-bg), var(--light-header-bg); --header-bg: hsl(var(--header-bg-hsl)); --header-link: var(--theme-header-link); --header-link-hover: var(--theme-header-link-hover); --header-border: var(--theme-header-border); --header-dropdown-bg: hsla(var(--header-bg-hsl), 0.9); --header-search-border: var(--header-link); --header-menu-font-family: Lato, Arial, 'Helvetica Neue', Helvetica, sans-serif; --header-menu-font-style: normal; --header-menu-font-weight: 700; --header-border-size: var(--theme-header-border-size); --hue-dropdown-bg-hover: 187; --saturation-dropdown-bg-hover: 100%; --light-dropdown-bg-hover: 32.9%; --dropdown-bg-hover-hsl: var(--hue-dropdown-bg-hover), var(--saturation-dropdown-bg-hover), var(--light-dropdown-bg-hover); --dropdown-bg-hover: hsl(var(--dropdown-bg-hover-hsl)); --hue-dropdown-link-hover: 181; --saturation-dropdown-link-hover: 100%; --light-dropdown-link-hover: 91.8%; --dropdown-link-hover-hsl: var(--hue-dropdown-link-hover), var(--saturation-dropdown-link-hover), var(--light-dropdown-link-hover); --dropdown-link-hover: hsl(var(--dropdown-link-hover-hsl)); /* Footer colors */ --theme-footer-border-size: 1; --hue-footer-bg: 187; --saturation-footer-bg: 100%; --light-footer-bg: 32.9%; --footer-bg-hsl: var(--hue-footer-bg), var(--saturation-footer-bg), var(--light-footer-bg); --footer-bg: hsl(var(--footer-bg-hsl)); --hue-footer-border: 187; --saturation-footer-border: 100%; --light-footer-border: 32.9%; --footer-border-hsl: var(--hue-footer-border), var(--saturation-footer-border), var(--light-footer-border); --footer-border: hsl(var(--footer-border-hsl)); --footer-border-size: var(--theme-footer-border-size); --hue-footer-text: 0; --saturation-footer-text: 0%; --light-footer-text: 100%; --footer-text-hsl: var(--hue-footer-text), var(--saturation-footer-text), var(--light-footer-text); --footer-text: hsl(var(--footer-text-hsl)); --hue-footer-link: 0; --saturation-footer-link: 0%; --light-footer-link: 100%; --footer-link-hsl: var(--hue-footer-link), var(--saturation-footer-link), var(--light-footer-link); --footer-link: hsl(var(--footer-link-hsl)); --hue-footer-link-hover: 181; --saturation-footer-link-hover: 100%; --light-footer-link-hover: 91.8%; --footer-link-hover-hsl: var(--hue-footer-link-hover), var(--saturation-footer-link-hover), var(--light-footer-link-hover); --footer-link-hover: hsl(var(--footer-link-hover-hsl)); --theme-footer-font-family: Lato, Arial, 'Helvetica Neue', Helvetica, sans-serif; --theme-footer-font-size: 14; --theme-footer-font-style: normal; --theme-footer-font-weight: 400; --footer-font-family: var(--theme-footer-font-family); --footer-font-size: var(--theme-footer-font-size); --footer-font-style: var(--theme-footer-font-style); --footer-font-weight: var(--theme-footer-font-weight); --footer-logo-vidflex: block; --footer-logo-telus: none; --footer-logo-combo: none; --footer-logo-realm: none; --footer-logo-onviva: none; --footer-logo-onviva-combo: none; --footer-logo-rdigital: none; --footer-logo-rdigital-combo: none; --footer-logo-color: #ffffff; --footer-logo-onviva-color: #ffffff; /* Button colors */ --hue-btn-primary-bg: 187; --saturation-btn-primary-bg: 100%; --light-btn-primary-bg: 32.9%; --btn-primary-bg-hsl: var(--hue-btn-primary-bg), var(--saturation-btn-primary-bg), var(--light-btn-primary-bg); --btn-primary-bg: hsl(var(--btn-primary-bg-hsl)); --hue-btn-primary-color: 0; --saturation-btn-primary-color: 0%; --light-btn-primary-color: 100%; --btn-primary-color-hsl: var(--hue-btn-primary-color), var(--saturation-btn-primary-color), var(--light-btn-primary-color); --btn-primary-color: hsl(var(--btn-primary-color-hsl)); --hue-btn-primary-border: 187; --saturation-btn-primary-border: 100%; --light-btn-primary-border: 32.9%; --btn-primary-border-hsl: var(--hue-btn-primary-border), var(--saturation-btn-primary-border), var(--light-btn-primary-border); --btn-primary-border: hsl(var(--btn-primary-border-hsl)); --hue-btn-primary-bg-hover: 0; --saturation-btn-primary-bg-hover: 0%; --light-btn-primary-bg-hover: 100%; --btn-primary-bg-hover-hsl: var(--hue-btn-primary-bg-hover), var(--saturation-btn-primary-bg-hover), var(--light-btn-primary-bg-hover); --btn-primary-bg-hover: hsl(var(--btn-primary-bg-hover-hsl)); --hue-btn-primary-color-hover: 187; --saturation-btn-primary-color-hover: 100%; --light-btn-primary-color-hover: 32.9%; --btn-primary-color-hover-hsl: var(--hue-btn-primary-color-hover), var(--saturation-btn-primary-color-hover), var(--light-btn-primary-color-hover); --btn-primary-color-hover: hsl(var(--btn-primary-color-hover-hsl)); --hue-btn-primary-border-hover: 187; --saturation-btn-primary-border-hover: 100%; --light-btn-primary-border-hover: 32.9%; --btn-primary-border-hover-hsl: var(--hue-btn-primary-border-hover), var(--saturation-btn-primary-border-hover), var(--light-btn-primary-border-hover); --btn-primary-border-hover: hsl(var(--btn-primary-border-hover-hsl)); --btn-primary-bg-active: var(--theme-primary-lighten); --btn-primary-color-active: var(--theme-primary-text); --btn-primary-border-active: var(--theme-primary-lighten); --hue-btn-secondary-bg: 0; --saturation-btn-secondary-bg: 0%; --light-btn-secondary-bg: 100%; --btn-secondary-bg-hsl: var(--hue-btn-secondary-bg), var(--saturation-btn-secondary-bg), var(--light-btn-secondary-bg); --btn-secondary-bg: hsl(var(--btn-secondary-bg-hsl)); --hue-btn-secondary-color: 0; --saturation-btn-secondary-color: 0%; --light-btn-secondary-color: 0%; --btn-secondary-color-hsl: var(--hue-btn-secondary-color), var(--saturation-btn-secondary-color), var(--light-btn-secondary-color); --btn-secondary-color: hsl(var(--btn-secondary-color-hsl)); --hue-btn-secondary-border: 0; --saturation-btn-secondary-border: 0%; --light-btn-secondary-border: 0%; --btn-secondary-border-hsl: var(--hue-btn-secondary-border), var(--saturation-btn-secondary-border), var(--light-btn-secondary-border); --btn-secondary-border: hsl(var(--btn-secondary-border-hsl)); --hue-btn-secondary-bg-hover: 0; --saturation-btn-secondary-bg-hover: 0%; --light-btn-secondary-bg-hover: 100%; --btn-secondary-bg-hover-hsl: var(--hue-btn-secondary-bg-hover), var(--saturation-btn-secondary-bg-hover), var(--light-btn-secondary-bg-hover); --btn-secondary-bg-hover: hsl(var(--btn-secondary-bg-hover-hsl)); --hue-btn-secondary-color-hover: 0; --saturation-btn-secondary-color-hover: 0%; --light-btn-secondary-color-hover: 0%; --btn-secondary-color-hover-hsl: var(--hue-btn-secondary-color-hover), var(--saturation-btn-secondary-color-hover), var(--light-btn-secondary-color-hover); --btn-secondary-color-hover: hsl(var(--btn-secondary-color-hover-hsl)); --hue-btn-secondary-border-hover: 0; --saturation-btn-secondary-border-hover: 0%; --light-btn-secondary-border-hover: 100%; --btn-secondary-border-hover-hsl: var(--hue-btn-secondary-border-hover), var(--saturation-btn-secondary-border-hover), var(--light-btn-secondary-border-hover); --btn-secondary-border-hover: hsl(var(--btn-secondary-border-hover-hsl)); --btn-secondary-bg-active: var(--theme-primary-lighten); --btn-secondary-color-active: var(--theme-primary-text); --btn-secondary-border-active: var(--theme-primary-lighten); --btn-download-bg: var(--btn-primary-bg); --btn-download-color: var(--btn-primary-color); --btn-download-border: var(--btn-primary-border); --btn-download-bg-hover: var(--btn-primary-bg-hover); --btn-download-color-hover: var(--btn-primary-border-hover); --btn-download-border-hover: var(--btn-primary-border-hover); --btn-download-bg-active: var(--btn-primary-bg-hover); --btn-download-color-active: var(--btn-primary-border-hover); --btn-download-border-active: var(--btn-primary-border-hover); /* Submenu block colors */ --hue-submenu-bg: 201; --saturation-submenu-bg: 98.7%; --light-submenu-bg: 29.8%; --submenu-bg-hsl: var(--hue-submenu-bg), var(--saturation-submenu-bg), var(--light-submenu-bg); --submenu-bg: hsl(var(--submenu-bg-hsl)); --hue-submenu-link: 0; --saturation-submenu-link: 0%; --light-submenu-link: 100%; --submenu-link-hsl: var(--hue-submenu-link), var(--saturation-submenu-link), var(--light-submenu-link); --submenu-link: hsl(var(--submenu-link-hsl)); --theme-submenu-font-family: Lato, Arial, 'Helvetica Neue', Helvetica, sans-serif; --theme-submenu-font-size: 18; --theme-submenu-font-style: normal; --theme-submenu-font-weight: 700; --submenu-font-family: var(--theme-submenu-font-family); --submenu-font-size: var(--theme-submenu-font-size); --submenu-font-style: var(--theme-submenu-font-style); --submenu-font-weight: var(--theme-submenu-font-weight); --submenu-link-hover: var(--theme-secondary-text); --hue-submenu-link-active: 0; --saturation-submenu-link-active: 0%; --light-submenu-link-active: 100%; --submenu-link-active-hsl: var(--hue-submenu-link-active), var(--saturation-submenu-link-active), var(--light-submenu-link-active); --submenu-link-active: hsl(var(--submenu-link-active-hsl)); /* Troubleshooting colors */ --theme-troubleshooting-font-size: 16; --troubleshooting-font-size: var(--theme-troubleshooting-font-size); --hue-troubleshooting-bg: 0; --saturation-troubleshooting-bg: 0%; --light-troubleshooting-bg: 12.2%; --troubleshooting-bg-hsl: var(--hue-troubleshooting-bg), var(--saturation-troubleshooting-bg), var(--light-troubleshooting-bg); --troubleshooting-bg: hsl(var(--troubleshooting-bg-hsl)); --hue-troubleshooting-text-color: 0; --saturation-troubleshooting-text-color: 0%; --light-troubleshooting-text-color: 100%; --troubleshooting-text-color-hsl: var(--hue-troubleshooting-text-color), var(--saturation-troubleshooting-text-color), var(--light-troubleshooting-text-color); --troubleshooting-text-color: hsl(var(--troubleshooting-text-color-hsl)); --hue-troubleshooting-link: 187; --saturation-troubleshooting-link: 100%; --light-troubleshooting-link: 32.9%; --troubleshooting-link-hsl: var(--hue-troubleshooting-link), var(--saturation-troubleshooting-link), var(--light-troubleshooting-link); --troubleshooting-link: hsl(var(--troubleshooting-link-hsl)); --hue-troubleshooting-link-hover: 200; --saturation-troubleshooting-link-hover: 100%; --light-troubleshooting-link-hover: 36.5%; --troubleshooting-link-hover-hsl: var(--hue-troubleshooting-link-hover), var(--saturation-troubleshooting-link-hover), var(--light-troubleshooting-link-hover); --troubleshooting-link-hover: hsl(var(--troubleshooting-link-hover-hsl)); /* Forms */ --hue-form-field-text: 0; --saturation-form-field-text: 0%; --light-form-field-text: 0%; --form-field-text-hsl: var(--hue-form-field-text), var(--saturation-form-field-text), var(--light-form-field-text); --form-field-text: hsl(var(--form-field-text-hsl)); --hue-form-field-bg: 0; --saturation-form-field-bg: 0%; --light-form-field-bg: 100%; --form-field-bg-hsl: var(--hue-form-field-bg), var(--saturation-form-field-bg), var(--light-form-field-bg); --form-field-bg: hsl(var(--form-field-bg-hsl)); --hue-form-field-border: 0; --saturation-form-field-border: 0%; --light-form-field-border: 0%; --form-field-border-hsl: var(--hue-form-field-border), var(--saturation-form-field-border), var(--light-form-field-border); --form-field-border: hsl(var(--form-field-border-hsl)); /* Programming widget colors or filter widget */ --prgm-panel-hsl: var(--hue-text), var(--saturation-text), var(--light-text); --prgm-panel: hsla(var(--prgm-panel-hsl), 0.1); --theme-prgm-filter-bg: #0095A8; --prgm-filter-bg: var(--theme-prgm-filter-bg); --theme-prgm-filter-text: #FFFFFF; --prgm-filter-text: var(--theme-prgm-filter-text); --theme-prgm-group-font-family: Lato, Arial, 'Helvetica Neue', Helvetica, sans-serif; --theme-prgm-group-font-style: normal; --prgm-group-font-family: var(--theme-prgm-group-font-family); --prgm-group-font-style: var(--theme-prgm-group-font-style); /* Pagination block colors */ --pagination-item-bg: var(--theme-background); --pagination-item-bg-disable: var(--theme-background); --pagination-item-bg-active: var(--btn-primary-bg); --pagination-item-color: var(--theme-text); --pagination-item-color-disable: hsla(var(--hue-text), var(--saturation-text), var(--light-text), 0.4); --pagination-item-color-active: var(--btn-primary-color); --pagination-item-border: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); --pagination-item-border-disable: hsla(var(--hue-text), var(--saturation-text), var(--light-text), 0); --pagination-item-border-active: var(--btn-primary-bg); --pagination-nav-bg: var(--theme-background); /* Slider widget colors */ --theme-slider-title: #000000; --theme-slider-font-transformation: none; --theme-slider-arrow: #006BA1; --theme-slider-arrow-hover: #005A87; --slider-title: var(--theme-slider-title); --slider-arrow: var(--theme-slider-arrow); --slider-arrow-hover: var(--theme-slider-arrow-hover); --slider-arrow-bg: white; /* Banner widget colors */ --bnrw-title-color: var(--slider-title); /* Video tile colors */ --videotile-color: var(--slider-title); /* Top Carousel colors */ --topcarousel-text-color: var(--theme-text); /* Sports Schedule Banner colors */ --sports-schedule-banner-text-color: var(--theme-text); /* Mini Schedule widget */ --mini-schedule-text-color: var(--theme-text); /*VODS */ --vod-right-related-bg: hsla(var(--hue-text), var(--saturation-text), var(--light-text), 0.2); --vod-content-bg: hsla(var(--hue-text), var(--saturation-text), var(--light-text), 0.1); --vod-right-related-text-color: var(--theme-text); --vod-downloads-bg: hsla(var(--hue-text), var(--saturation-text), var(--light-text), 0.3); --vod-content-text-color: var(--theme-text); --hue-vod-content-text-color: 0; --saturation-vod-content-text-color: 0%; --light-vod-content-text-color: 100%; --vod-content-text-color-hsl: var(--hue-vod-content-text-color), var(--saturation-vod-content-text-color), var(--light-vod-content-text-color); --vod-content-text-color: hsl(var(--vod-content-text-color-hsl)); --hue-vod-fade-color: 0; --saturation-vod-fade-color: 0%; --light-vod-fade-color: 0%; --vod-fade-color-hsl: var(--hue-vod-fade-color), var(--saturation-vod-fade-color), calc(var(--light-vod-fade-color) - 1%); --vod-fade-color: hsl(var(--vod-fade-color-hsl)); --hue-player-link: 187; --saturation-player-link: 100%; --light-player-link: 32.9%; --player-link-hsl: var(--hue-player-link), var(--saturation-player-link), var(--light-player-link); --player-link: hsl(var(--player-link-hsl)); --hue-player-hover-link: 200; --saturation-player-hover-link: 100%; --light-player-hover-link: 36.5%; --player-hover-link-hsl: var(--hue-player-hover-link), var(--saturation-player-hover-link), var(--light-player-hover-link); --player-hover-link: hsl(var(--player-hover-link-hsl)); } body { color: var(--theme-text); background-color: var(--theme-background); } a { color: var(--body-link); } a:hover { color: var(--body-link-hover); text-decoration: none; } .page__content .description a { color: var(--player-link); } .page__content .description a:hover { color: var(--player-hover-link); } .page__content .description a.btn-primary { color: var(--btn-primary-color); } .page__content { background-color: var(--theme-background); } ._page-static { background-color: var(--theme-background); } .mobile-headline { background-color: var(--theme-primary); } ._latest-news { background-color: var(--theme-primary); } .bg-MainRed { background-color: var(--theme-background-lighten); } h2 { font-size: calc((var(--theme-body-font-size) + 16) * 1px); } .player-block__supplemental-desc { font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); color: #fff; } /*------------------------------------*\ Header \*------------------------------------*/ /* Header color variables */ .header { background-color: var(--header-bg); border-bottom: calc(var(--header-border-size) * 1px) solid var(--header-border); } #header__nav a { color: var(--header-link); font-family: var(--header-menu-font-family) !important; font-size: calc(var(--header-menu-font-size) * 1px); font-style: var(--header-menu-font-style); font-weight: var(--header-menu-font-weight); text-transform: var(--header-menu-font-transformation); } #header__nav a .caret, #header__nav .flexMenu-popup .dropdown .caret, #header__nav .flexMenu-popup .dropdown.open .caret { border-top: 1px solid var(--header-link); border-right: 1px solid var(--header-link); } #header__nav a:hover { color: var(--header-link-hover); } #header__nav a:hover .caret { border-top: 1px solid var(--dropdown-link-hover); border-right: 1px solid var(--dropdown-link-hover); } #header__nav li.open>a { color: var(--header-link-hover); } #header__nav li.open .caret { border-color: var(--header-link-hover); } #header__nav li.active>a { color: var(--header-link); } #header__nav .dropdown-menu { background-color: var(--header-dropdown-bg); } #header__nav .dropdown-menu a { color: var(--header-link); } #header__nav .flexMenu-popup .dropdown-menu a:focus, #header__nav .flexMenu-popup .dropdown-menu a:hover, #header__nav .flexMenu-popup li.open > a:hover, #header__nav .flexMenu-popup li a:active, #header__nav .flexMenu-popup li a:hover, #header__nav .dropdown-menu a:hover { background-color: var(--dropdown-bg-hover); color: var(--dropdown-link-hover); } .header__logged .dropdown-menu>li>a:hover, .header__logged .dropdown-menu>li>a:focus { background-color: var(--dropdown-bg-hover) !important; color: var(--dropdown-link-hover) !important; background-image: none; } #header__nav .flexMenu-viewMore.active>a { color: var(--header-link-hover); } #header__nav .flexMenu-popup>li:first-child { border-top: none; } @media (min-width: 992px) { #header__nav .flexMenu-popup>li:first-child { padding-top: 0; margin-top: 0; } } #header__nav .flexMenu-popup { padding-top: 18px; } @media (min-width: 1200px) { #header__nav .flexMenu-popup { padding-top: 15px; } } #header__nav .flexMenu-popup li, #header__nav .flexMenu-popup li a, #header__nav .flexMenu-popup li.open > a { background-color: var(--header-dropdown-bg); color: var(--header-link); } #header__nav .flexMenu-popup .dropdown-menu a { background-color: var(--header-dropdown-bg); color: var(--header-link); } .header__login>a, .header__logged>a, .header__search a, .header__date a, .header__help a { color: var(--header-link); } .header__login>a:hover, .header__logged>a:hover, .header__search a:hover, .header__date a:hover, .header__help a:hover { color: var(--header-link-hover); } .header__logged .dropdown-menu { border-radius: 0; background-color: var(--header-dropdown-bg); border: none; padding: 0; margin-top: 3px; } @media (min-width: 1200px) { .header__logged .dropdown-menu { margin-top: 0; } } .header__logged .dropdown-menu>li>a { padding: 10px; color: var(--header-link); font-size: 16px; } #cd-lateral-nav { background-color: var(--theme-secondary); } #cd-lateral-nav ul a { color: var(--header-link); } ._has-top-separator { border-top: 1px solid var(--header-border); } .nav-sidebar__brand { color: transparent; background-color: var(--header-link); padding-top: 31px; } .nav-sidebar__brand:before { content: 'WORLDPLAY TV'; color: var(--header-bg); } .search__input-field { border: 1px solid var(--header-search-border); } #header__nav .dropdown-menu { padding-top: 5px; } #header__nav .dropdown-menu a { padding: 10px; } @media only screen and (min-width: 992px) { #header__nav { left: var(--size-left); right: 185px; } .header--has-subscribe #header__nav { left: var(--size-left); right: 300px; } } .translate-switcher-wrap { color: var(--header-link); border-color: var(--header-link); background-color: var(--header-bg); } .translate-switcher-wrap .dropdown { background-color: var(--header-bg); color: var(--header-link); } .translate-switcher-wrap .dropdown li a { color: var(--header-link); } .translate-switcher-wrap .dropdown li:hover a { background-color: var(--header-link); color: var(--header-bg); } /*------------------------------------*\ Hambuger Menu \*------------------------------------*/ #js-menu-trigger .cd-menu-icon::before, #js-menu-trigger .cd-menu-icon::after { background-color: var(--header-link); } #js-menu-trigger .cd-menu-icon, #js-menu-trigger.is-clicked .cd-menu-icon::before, #js-menu-trigger.is-clicked .cd-menu-icon::after { background-color: var(--header-link); } #cd-lateral-nav { background-color: var(--header-bg); } #cd-lateral-nav a { color: var(--header-link); font-family: 'Oswald', sans-serif; } #cd-lateral-nav a.btn { background-color: var(--btn-primary-bg); border-color: var(--btn-primary-border); color: var(--btn-primary-color); } .no-touch #cd-lateral-nav a:hover { color: var(--header-link-hover) } #cd-lateral-nav .item-has-children>a { color: var(--header-link); background-color: var(--header-bg); } .cd-main-content { min-height: 100%; position: relative; background-color: var(--theme-secondary); } /*------------------------------------*\ Troubleshooting overlay \*------------------------------------*/ .troubleshooting { color: var(--troubleshooting-text-color); } .troubleshooting a { color: var(--troubleshooting-link); font-size: calc(var(--troubleshooting-font-size) * 1px); } .troubleshooting a:hover { color: var(--troubleshooting-link-hover); } .troubleshooting a:active { color: var(--troubleshooting-link-hover); } .modal-backdrop.modal-backdrop-fullscreen { background: var(--troubleshooting-bg); } .troubleshooting-title { color: var(--troubleshooting-text-color); } /*------------------------------------*\ Buttons \*------------------------------------*/ .btn-primary, a.btn-primary { background-color: var(--btn-primary-bg); border-color: var(--btn-primary-border); color: var(--btn-primary-color); } .btn-primary:hover, .btn-primary:focus, a.btn-primary:hover, a.btn-primary:focus { background-color: var(--btn-primary-bg-hover); border-color: var(--btn-primary-border-hover); color: var(--btn-primary-color-hover); outline: none; } .btn-primary:active, .btn-primary.active, a.btn-primary:active, a.btn-primary.active { background-color: var(--btn-primary-bg-active); border-color: var(--btn-primary-bg-active); color: var(--btn-primary-color-active); outline: none; } .btn-primary:active:hover, .btn-primary.active:hover, .open>.dropdown-toggle.btn-primary:hover, .btn-primary:active:focus, .btn-primary.active:focus, .open>.dropdown-toggle.btn-primary:focus, .btn-primary:active.focus, .btn-primary.active.focus, .open>.dropdown-toggle.btn-primary.focus { background-color: var(--btn-primary-bg-hover); border-color: var(--btn-primary-border-hover); color: var(--btn-primary-color-hover); outline: none; } .open>.dropdown-toggle.btn-default:hover, .open>.dropdown-toggle.btn-default:focus, .open>.dropdown-toggle.btn-default.focus { background-color: var(--btn-primary-bg-hover); border-color: var(--btn-primary-border-hover); color: var(--btn-primary-color-hover); outline: none; } .dropdown-menu>.active>a, .dropdown-menu>.active>a:hover, .dropdown-menu>.active>a:focus { background-color: #0060A8; } /*------------------------------------*\ Submenu \*------------------------------------*/ .sub-menu { color: var(--submenu-link); background-color: var(--submenu-bg); font-family: var(--submenu-font-family); font-style: var(--submenu-font-style); font-weight: var(--submenu-font-weight); font-size: calc(var(--submenu-font-size) * 1px); } .sub-menu__item a { color: var(--submenu-link); font-family: var(--submenu-font-family); font-style: var(--submenu-font-style); font-weight: var(--submenu-font-weight); font-size: calc(var(--submenu-font-size) * 1px); } .sub-menu__item.active a { color: var(--submenu-link-active); } .sub-menu .nav>li>a:hover, .sub-menu .nav>li>a:focus { background-color: transparent; color: var(--submenu-link-hover); } /*------------------------------------*\ Top Carousel widget \*------------------------------------*/ .manual-selected-slider__itemTitle { color: var(--topcarousel-text-color); } .manual-selected-slider__itemSubtitle { color: var(--topcarousel-text-color); } .link-watch { color: var(--topcarousel-text-color); } /*------------------------------------*\ Sports Schedule Banner widget \*------------------------------------*/ .SportsScheduleBannerWidget__bannerTitle { color: var(--sports-schedule-banner-text-color); } .SportsScheduleBannerWidget__bannerSubtitle { color: var(--sports-schedule-banner-text-color); } /*------------------------------------*\ Mini Schedule Banner widget \*------------------------------------*/ .schedule__title { color: var(--bnrw-title-color); font-family: var(--theme-title-font-family); font-size: calc(var(--theme-title-font-size) * 1px); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight) !important; text-transform: var(--theme-title-font-transformation) !important; } /*------------------------------------*\ Slider widget \*------------------------------------*/ .s4rw .s4rw__header__title { color: var(--slider-title); font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight) !important; text-transform: var(--theme-title-font-transformation) !important; } .s4rw .videotile__title { color: var(--videotile-color) !important; font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight) !important; text-transform: var(--theme-title-font-transformation) !important; } .s4rw .videotile__text { color: var(--theme-text); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); background-image: linear-gradient(180deg, var(--videotile-color), var(--theme-background) 60px); font-size: var(--body-font-size); } .s4rw .videotile__date { color: var(--theme-text); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); font-size: calc((var(--theme-body-font-size) - 2) * 1px); } .s4rw .s4rw__header__link a { background-color: var(--btn-primary-bg); border-color: var(--btn-primary-border); color: var(--btn-primary-color); } .s4rw .s4rw__header__link a:hover { background-color: var(--btn-primary-bg-hover); border-color: var(--btn-primary-border-hover); color: var(--btn-primary-color-hover); outline: none; } /*------------------------------------*\ Search widget \*------------------------------------*/ .sw { background-color: var(--theme-background) !important; color: var(--theme-text) !important; } .sw .sw__title-heading { color: var(--slider-title); } .sw .videotile__title { color: var(--videotile-color) !important; font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: bold; font-size: var(--body-font-size); } .sw .sw__results-list--grid .videotile__text, .sw .sw__results-list--list .videotile__text { color: var(--theme-text); background-image: linear-gradient(180deg, var(--videotile-color), var(--theme-background) 60px); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); font-size: var(--body-font-size); } .sw .videotile__date { color: var(--videotile-color) !important; font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); font-size: calc((var(--theme-body-font-size) - 2) * 1px); } .sw .sw__form-control { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); color: var(--theme-text); } .sw .sw__form-control:focus { border-color: var(--btn-primary-bg); } .sw .sw__input-clear svg { fill: var(--theme-text); } .sw .sw__input-search-icon svg { fill: var(--theme-text); } .sw .sw__results-list--list .videotile { border-bottom: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); } .sw .sw__form-wrapper { border-bottom: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); } .sw .sw__pagination-item { background-color: var(--pagination-item-bg); border-color: var(--pagination-item-border); color: var(--pagination-item-color); } .sw .sw__pagination-item:hover { color: var(--pagination-item-color-active); background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); } .sw .sw__pagination-item--active, .sw .sw__pagination-item--active:hover { color: var(--pagination-item-color-active); background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); } .sw .sw__pagination-item--disabled, .sw .sw__pagination-item--disabled:hover { background-color: var(--pagination-item-bg-disable) !important; color: var(--pagination-item-color-disable) !important; border-color: var(--pagination-item-border-disable) !important; } .sw .sw__pagination-nav { background-color: var(--pagination-item-bg); border-color: var(--pagination-item-border); color: var(--pagination-item-color); } .sw .sw__pagination-nav:hover { color: var(--pagination-item-color-active); background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); } .sw .sw__layout-toggle-btnn { background-color: var(--pagination-item-bg); border-color: var(--pagination-item-border); color: var(--pagination-item-color); } .sw .sw__layout-toggle-btn--active { background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); color: var(--pagination-item-color-active); } .sw .sw__layout-toggle-btn svg { fill: var(--pagination-item-color); } .sw .sw__layout-toggle-btn:hover svg { fill: var(--pagination-item-color-active); } .sw .sw__layout-toggle-btn--active svg { fill: var(--pagination-item-color-active); } .sw .sw__layout-toggle-btn:hover { background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); color: var(--pagination-item-color-active); } /*------------------------------------*\ Programming widget \*------------------------------------*/ .fw { background-color: var(--theme-background) !important; color: var(--theme-text) !important; font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-size: var(--body-font-size); } .fw .fw__filter_panel { background-color: var(--prgm-panel); } .fw .fw__results-wrapper { font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); } .fw .fw__form-control { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); color: var(--theme-text); } .fw .fw__filter_panel_heading { font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight) !important; } .fw .fw__form-control:focus { border-color: var(--btn-primary-bg); } .fw .fw__input-clear svg { fill: var(--theme-text); } .fw .fw__input-search-icon svg { fill: var(--theme-text); } .fw .fw__pagination-item { background-color: var(--pagination-item-bg); border-color: var(--pagination-item-border); color: var(--pagination-item-color); } .fw .fw__pagination-item:hover { color: var(--pagination-item-color-active); background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); } .fw .fw__pagination-item--active, .fw .fw__pagination-item--active:hover { color: var(--pagination-item-color-active); background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); } .fw .fw__pagination-item--disabled, .fw .fw__pagination-item--disabled:hover { background-color: var(--pagination-item-bg-disable) !important; color: var(--pagination-item-color-disable) !important; border-color: var(--pagination-item-border-disable) !important; } .fw .fw__layout-toggle-btn { background-color: var(--pagination-item-bg); border-color: var(--pagination-item-border); color: var(--pagination-item-color); } .fw .fw__layout-toggle-btn:hover { background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); color: var(--pagination-item-color-active); } .fw .fw__layout-toggle-btn--active { background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); color: var(--pagination-item-color-active); } .fw .fw__layout-toggle-btn svg { fill: var(--pagination-item-color); } .fw .fw__layout-toggle-btn:hover svg { fill: var(--pagination-item-color-active); } .fw .fw__layout-toggle-btn--active svg { fill: var(--pagination-item-color-active); } .fw .fw__pagination-nav { background-color: var(--pagination-item-bg); border-color: var(--pagination-item-border); color: var(--pagination-item-color); } .fw .fw__pagination-nav:hover { color: var(--pagination-item-color-active); background-color: var(--pagination-item-bg-active); border-color: var(--pagination-item-border-active); } .fw .fw__select { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); color: var(--theme-text); background-color: var(--theme-background); } .fw .fw__select:focus, .fw .fw__select:hover { border-color: var(--theme-primary); color: var(--theme-text); } .fw .fw__filter_group__name { background-color: var(--prgm-filter-bg); color: var(--prgm-filter-text); font-family: var(--prgm-group-font-family); font-style: var(--prgm-group-font-style); } .fw .fw__filter_group--open .fw__filter_group__name { border-bottom: 4px solid var(--prgm-filter-bg); background-color: var(--prgm-filter-bg); color: var(--prgm-filter-text); } .fw .fw__filter_group--open .fw__filter_group__name:before { border-top-color: var(--prgm-filter-bg); } .fw .fw__filter_group__checkbox:checked+label:before { background: var(--prgm-filter-bg); border-color: var(--prgm-filter-bg); } .fw .fw__filter_group__checkbox:hover+label:before { background: var(--prgm-filter-bg); border-color: var(--prgm-filter-bg); } .fw .fw__filter_group__content { background: none; } .fw .fw__filter { color: var(--theme-text); } .fw .fw__filter_group__expand svg, .fw .fw__filter_group__toggle svg { fill: var(--btn-primary-color); } .fw .fw__filter_panel__footer { background: none; } .fw .fw__filter_panel_heading { color: var(--theme-text); font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight); } .fw .fw__filter_panel__apply_filter { background-color: var(--btn-primary-bg); border-color: var(--btn-primary-border); color: var(--btn-primary-color); outline: none; } .fw .fw__filter_panel__apply_filter:hover { background-color: var(--btn-primary-bg-hover); border-color: var(--btn-primary-border-hover); color: var(--btn-primary-color-hover); } .fw .fw__results-list--list .videotile__title { color: var(--videotile-color); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-size: var(--body-font-size); } .fw .fw__results-list--list .videotile__text { color: var(--theme-text); background-image: linear-gradient(180deg, var(--videotile-color), var(--theme-background) 60px); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); font-size: var(--body-font-size); } .fw .fw__results-list--list .videotile__date { color: var(--theme-text); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); font-size: calc((var(--theme-body-font-size) - 2) * 1px); } .sw__results-list-item > .videotile__anchor > .videotile__details > .videotile__title { color: var(--bnrw-title-color) !important; font-family: var(--theme-title-font-family) !important; font-style: var(--theme-title-font-style) !important; font-weight: var(--theme-title-font-weight) !important; text-transform: var(--theme-title-font-transformation) !important; } .sw__results-list-item > .videotile__anchor > .videotile__details > .videotile__text, .sw__results-list-item > .videotile__anchor > .videotile__details > .videotile__date { color: var(--theme-text) !important; font-family: var(--theme-body-font-family) !important; font-style: var(--theme-body-font-style) !important; font-weight: var(--theme-body-font-weight) !important; } .fw .fw__filter_panel__clear_filter { color: var(--theme-text); } .fw .fw__results-list--grid .videotile__details { background-color: var(--prgm-panel); } .fw .fw__results-list--grid .videotile__title, .fw .fw__results-list--grid .videotile__details > .videotile__title { color: var(--videotile-color); font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-size: var(--body-font-size); } .fw .fw__results-list--grid .videotile__text, .fw .fw__results-list--grid .videotile__details > .videotile__text { color: var(--theme-text); background-image: linear-gradient(180deg, var(--videotile-color), var(--prgm-panel) 60px); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); font-size: var(--body-font-size); } .fw .fw__results-list--grid .videotile__date, .fw .fw__results-list--grid .videotile__details> .videotile__date { color: var(--theme-text); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); font-size: calc((var(--theme-body-font-size) - 2) * 1px); } /*------------------------------------*\ Full Schedule widget \*------------------------------------*/ .schedule { background-color: #232323; } .f10ew__content { background: #232323; color: #ffffff; } .f10ew__filter__selectbox .selectbox-menu { background-color: #ffffff; } .f10ew__filter__selectbox .selectbox-menu li.active { background: #00a0e4; } .f10ew__filter__selectbox .selectbox-toggle { color: #fff; background: #888888; } .f10ew__filter__action button { background: #00a0e4; color: #ffffff; } .f10ew__filter__selectbox.season .selectbox-toggle { background: #232323; } .f10ew__board__month { background: #00a0e4; color: #ffffff; border-bottom: 1px solid #95989a; } .f10ew__board__date { background: #888888; color: #ffffff; } .f10ew__board__item { border-bottom: 1px solid #95989a; background-color: #ffffff; color: #000000; } .f10ew__board .action-btn { color: #ffffff; background: #575757; } /*------------------------------------*\ Mini Schedule widget \*------------------------------------*/ .schedule { background-color: var(--theme-background); } .m10ew .m10ew__content { color: var(--theme-text); } .m10ew .m10ew__board__no_games { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); color: var(--theme-text); } .m10ew .m10ew__filter hr { border-color: var(--theme-text-lighten); } .m10ew .m10ew__filter__action button { background-color: var(--btn-primary-bg); color: var(--btn-primary-color); } .m10ew .m10ew__filter__action button:hover { background-color: var(--btn-primary-bg-hover); color: var(--btn-primary-color-hover); } .m10ew .m10ew__filter__selectbox .selectbox-toggle { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); color: var(--theme-text); background-color: var(--theme-background); } .m10ew .m10ew__week__page_btn { background-color: var(--btn-primary-bg); color: var(--btn-primary-color); } .m10ew .m10ew__week__page_btn:hover { background-color: var(--btn-primary-bg-hover); color: var(--btn-primary-color-hover); } .m10ew .m10ew__week__item { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); color: var(--theme-text); } .m10ew .m10ew__week__item:hover { background-color: var(--btn-primary-bg-hover); color: var(--btn-primary-color-hover); } .m10ew .m10ew__week__item__active { background-color: var(--theme-primary); color: var(--btn-primary-color); } .m10ew .m10ew__week__item__active:hover { background-color: var(--theme-primary-darken); color: var(--btn-primary-color); } .m10ew .m10ew__week__item__inactive, .m10ew .m10ew__week__item__inactive:hover { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .25); } .m10ew .m10ew__board__title { background: var(--theme-primary); color: var(--theme-primary-text); } .m10ew .m10ew__board__game_name { color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); background: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); } .m10ew .m10ew__board__game_name:after { border-top-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); } .m10ew .m10ew__board__item { border-bottom: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); color: var(--theme-text); } .m10ew .m10ew__board__item:hover { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .25); } .m10ew .m10ew__filter__selectbox .selectbox-menu li span { color: var(--theme-text); } .m10ew .m10ew__filter__selectbox .selectbox-menu li.active { background: var(--btn-primary-bg); color: var(--btn-primary-color); } .m10ew .m10ew__filter__selectbox .selectbox-menu li.active:hover { background: var(--btn-primary-bg-hover); color: var(--btn-primary-color-hover); } .m10ew .m10ew__filter__selectbox .selectbox-menu li:hover { background: var(--btn-primary-bg); color: var(--btn-primary-color); } .m10ew .m10ew__filter__selectbox .selectbox-menu li:hover span { color: var(--btn-primary-color); } .m10ew .m10ew__filter__selectbox .selectbox-menu { background-color: var(--theme-background); } .m10ew .m10ew__board__action_btn { color: #fff; background: var(--theme-text); } .m10ew .m10ew__board__action_btn.watch { background: var(--theme-primary); } /*------------------------------------*\ Footer \*------------------------------------*/ .footer { border-top: calc(var(--footer-border-size) * 1px) solid var(--footer-border); background-color: var(--footer-bg); font-family: var(--footer-font-family); font-size: calc(var(--footer-font-size) * 1px); font-style: var(--footer-font-style); font-weight: var(--footer-font-weight); } .footer__copy { color: var(--footer-text); } .footer__links a { color: var(--footer-link); } .footer__links a:hover { color: var(--footer-link-hover); } .footer-group__title { color: var(--footer-text); opacity: 1.0; font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-weight: bold !important; font-size: calc((var(--footer-font-size) + 2) * 1px); } .footer-group__column a { display: block; margin-bottom: 5px; color: var(--footer-link); font-size: calc(var(--footer-font-size) * 1px); } .footer-group__column a:hover { display: block; margin-bottom: 5px; color: var(--footer-link-hover); } .footer-logo-vidflex { display: var(--footer-logo-vidflex); } .footer-logo-telus { display: var(--footer-logo-telus); } .footer-logo-combo { display: var(--footer-logo-combo); } .footer-logo-realm { display: var(--footer-logo-realm); } .footer-logo-onviva { display: var(--footer-logo-onviva); } .footer-logo-rdigital { display: var(--footer-logo-rdigital); } .footer-logo-onviva-combo { display: var(--footer-logo-onviva-combo); } .footer-logo-rdigital-combo { display: var(--footer-logo-rdigital-combo); } .rdigital-svg-path-cross { fill: #1984cd; } .vidflex-svg-path, .telus-svg-path, .combo-svg-path, .realm-svg-path, .rdigital-svg-path, .combo-rdigital-svg-path, .combo-vidflex-svg-path { fill: var(--footer-logo-color) !important; } .onviva-svg-path, .combo-onviva-svg-path { fill: var(--footer-logo-onviva-color) !important; } /*------------------------------------*\ Contact page \*------------------------------------*/ .ContactWidget { background-color: var(--theme-background); } .contact-form__header { color: var(--theme-text); } .contact-form__description { color: var(--theme-text); } /*------------------------------------*\ Account page and login \*------------------------------------*/ /* Change Autocomplete styles in Chrome*/ input:-webkit-autofill, input:-webkit-autofill:hover, input:-webkit-autofill:focus, textarea:-webkit-autofill, textarea:-webkit-autofill:hover, textarea:-webkit-autofill:focus, select:-webkit-autofill, select:-webkit-autofill:hover, select:-webkit-autofill:focus { border: 1px solid var(--form-field-border); -webkit-text-fill-color: var(--theme-text) !important; -webkit-box-shadow: 0 0 0px 1000px var(--theme-background) inset !important; transition: background-color 5000s ease-in-out 0s; background-image: none !important; color: var(--form-field-text) !important; } .form-control { box-shadow: none; border: 1px solid var(--form-field-border); color: var(--form-field-text); background-color: var(--form-field-bg); } .form-control:focus { border-color: var(--btn-primary-bg); } .form-control[disabled], .form-control[readonly], fieldset[disabled] .form-control { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .3); } span.required { color: #b94a48; } /* To be deleted */ select.form-control { background-color: var(--form-field-bg); } .form-field { border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); } .login-form__content .checkbox label::before { background-color: var(--theme-background); border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); border-radius: 4px; } .login-form__content .checkbox label::after { color: var(--theme-text); } @media (min-width: 768px) { .login-form__content { font-size: var(--body-font-size); } } @media (min-width: 768px) { .login-form__description { font-size: var(--body-font-size); } } @media (min-width: 970px) { .login-form__side .login-form__content { font-size: var(--body-font-size); } } .login-form__content input { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); } .login-form__content .form-control:focus { border-color: var(--btn-primary-bg); } /* Titles */ .title, .s4rw .s4rw__header__title, .sw .sw__title-heading, .banner-widget__title .title, .m10ew .m10ew__board__title, .subscription__title, .login-form__header, .login-form__header h2, .account-info__title h2, .login-form__title p, .series-data__title, .player-block__title h3, .TextWidget .title, .static-page__header > h1.title, .title-block__name, .SportsScheduleBannerWidget__bannerTitle, .schedule__mini-title { color: var(--bnrw-title-color); font-family: var(--theme-title-font-family); font-size: calc(var(--theme-title-font-size) * 1px); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight) !important; text-transform: var(--theme-title-font-transformation) !important; } @media (max-width: 767px) { .login-form__header { background-color: var(--theme-primary); color: var(--theme-primary-text); } } @media (max-width: 767px) { .account-info__title { background-color: var(--theme-primary); color: var(--slider-title); } } .login-form__side { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); } .account-sidebar__list { border-color: var(--theme-primary); } .account-sidebar__item a { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); color: var(--theme-text); font-size: var(--body-font-size); } .account-sidebar__item a:hover { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .3); color: var(--theme-text); } .account-sidebar__item--selected a { background-color: var(--theme-primary); color: var(--theme-primary-text); } .account-sidebar__item--selected a:hover { background-color: var(--theme-primary-darken); color: var(--theme-primary-text); } .movie-card__title, .videotile__title { color: var(--bnrw-title-color); font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight) !important; text-transform: var(--theme-title-font-transformation) !important; } .static-page__content > p { color: var(--theme-text); font-size: calc((var(--theme-body-font-size) - 2) * 1px); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); } .movie-card__text, .movie-card__date, .videotile__text, .videotile__date { color: var(--theme-text); font-size: calc((var(--theme-body-font-size) - 2) * 1px); font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); } .l-list-view__item { border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); } .communications { font-size: var(--body-font-size); } /*------------------------------------*\ VOD standard & Player Block \*------------------------------------*/ .player-block__title h3 { font-family: var(--theme-title-font-family); } @media (max-width: 991px) { .player-block__data { background-color: var(--vod-fade-color, #4f4f4f) !important; } } @media (min-width: 992px) { .player-block__data { background-color: transparent !important; } } .player-block__title { background-color: transparent; color: var(--vod-content-text-color); } @media (min-width: 992px) { .player-block__date { color: var(--vod-content-text-color); } } .player-block__dataWrapper { color: var(--vod-content-text-color); } @media (min-width: 992px) { .player-block__dataWrapper { background-color: transparent; color: var(--vod-content-text-color); } } .player-block__downloads { background-color: var(--vod-downloads-bg); } .player-block__game-sport { font-size: var(--body-font-size); } @media (min-width: 992px) { .player-block__date { font-size: var(--body-font-size); } } @media (min-width: 992px) { .player-block__subtitles { font-size: var(--body-font-size); } .player-block__desc { font-size: var(--body-font-size); } .player-block__supplemental-desc { font-size: var(--body-font-size); } } a.btn-download { background-color: var(--btn-download-bg); border-color: var(--btn-download-border); color: var(--btn-download-color); } a.btn-download:hover, a.btn-download:focus, a.btn-download:active, a.btn-download.active { background-color: var(--btn-download-bg-hover); border-color: var(--btn-download-border-hover); color: var(--btn-download-color-hover); outline: none; } .btn.btn-download.link-downloader { background-color: var(--btn-download-bg); border-color: var(--btn-download-border); color: var(--btn-download-color); } .btn.btn-download.link-downloader:hover, .btn.btn-download.link-downloader:focus, .btn.btn-download.link-downloader:active { background-color: var(--btn-download-bg-hover); border-color: var(--btn-download-border-hover); color: var(--btn-download-color-hover); outline: none; } .cover-widget { background-color: var(--theme-background); } .player-widget:before { background: linear-gradient(to right, hsla(var(--vod-fade-color-hsl), 1) 10%, hsla(var(--vod-fade-color-hsl), 0.65) 50%, hsla(var(--vod-fade-color-hsl), 0) 100%); } .player-block__supplemental-desc { font-family: var(--theme-body-font-family); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); color: var(--vod-content-text-color); background: none; border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), 0.2); } /*------------------------------------*\ VOD Series \*------------------------------------*/ .vodSeries { color: var(--theme-text); } .vodSeries__data { color: var(--theme-text); } .series-data__attribute { border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .3); } .series-data__action { border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .3); } .series-list__item a { color: var(--theme-text); } @media (min-width: 992px) { .series-data__desc p { font-size: var(--body-font-size); } } .episode__bgimg:before { background: linear-gradient(to right, hsla(var(--vod-fade-color-hsl), 1) 10%, hsla(var(--vod-fade-color-hsl), 0.65) 50%, hsla(var(--vod-fade-color-hsl), 0) 100%) } .episode-info__season a { color: var(--theme-text); } .episode-info__title { color: var(--slider-title); } .episode-info__data { color: var(--theme-text); } .episode-info__desc { color: var(--theme-text); } .series-list__item a:hover { color: var(--theme-primary); } .episode-list__item a { color: var(--theme-text); } .episode-list__item a:hover { color: var(--theme-primary); } .btn-season { color: var(--theme-text); border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); } .btn-season:hover, .btn-season:focus { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); color: var(--theme-text); border-color: var(--theme-primary); } .btn-group .caret { border-top: 8px solid var(--theme-text); } .bootstrap-select.btn-group .dropdown-menu li.selected a { background-color: var(--theme-primary); color: var(--theme-primary-text); } /*------------------------------------*\ VOD Theater \*------------------------------------*/ .player-block__buy-mobile { padding-top: 14px; padding-left: 10px; } .player-block__buy-mobile .btn { display: inline-block; } .player-block__buy .btn { background-color: var(--btn-primary-bg); color: var(--btn-primary-color); border-color: var(--btn-primary-border); } .player-block__buy .btn:hover { background-color: var(--btn-primary-bg-hover); color: var(--btn-primary-color-hover); border-color: var(--btn-primary-hover); } .player-block__buy .buy-video { background-color: var(--btn-secondary-bg); color: var(--btn-secondary-color); border-color: var(--btn-secondary-border); } .player-block__buy .buy-video:hover { background-color: var(--btn-secondary-bg-hover); color: var(--btn-secondary-color-hover); border-color: var(--btn-secondary-border-hover); } .player-block__subscription .btn-subscription { background-color: var(--btn-primary-bg); color: var(--btn-primary-color); border-color: var(--btn-primary-border); } .player-block__subscription .btn-subscription:hover { background-color: var(--btn-primary-bg-hover); color: var(--btn-primary-color-hover); border-color: var(--btn-primary-hover); } @media (min-width: 768px) { .player-block__buy-mobile .btn { width: auto; } } /*------------------------------------*\ VOD with right related \*------------------------------------*/ .player-data { background-color: var(--vod-right-related-bg); } .player-sidebar { background-color: var(--vod-right-related-bg); } @media (max-width: 767px) { .player-sidebar, .l-player__sidebar .player-sidebar { background-color: #00A4E4; } } a.morelink:focus, a.morelink:active { color: #00A4E4; } .movie-card._type-sidebar .movie-card__title { color: var(--vod-right-related-text-color); } .movie-card._type-sidebar a:hover { text-decoration: none; } .movie-card._type-sidebar .movie-card__date { color: var(--vod-right-related-text-color); } .player-sidebar__item { border-bottom: 1px solid #ccc; } /*------------------------------------*\ VOD assets \*------------------------------------*/ .downloads__link { color: var(--theme-text); } /*------------------------------------*\ #Purchase \*------------------------------------*/ .steps>li.active>span { background-color: var(--theme-primary); color: var(--theme-primary-text); } .steps>li>span { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .3); color: #fff; display: block; } .steps>li:not(:last-child)>span:after { border-left-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .3); } .steps>li.active>span:after { border-left-color: var(--theme-primary); } .steps>li:last-child>span:after { border-left-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .3); } .purchase__wrapper .btn-back { top: 0; } .purchase__item { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); } .purchase__wrapper { padding-top: 15px; } .btn-back { background-color: var(--btn-secondary-bg); border-color: var(--btn-secondary-border); color: var(--btn-secondary-color) !important; } .btn-back:before { border-top: 2px solid var(--btn-secondary-border); border-right: 2px solid var(--btn-secondary-border); color: var(--btn-secondary-color); } .btn-back:hover:before { border-top: 2px solid var(--btn-secondary-border-hover); border-right: 2px solid var(--btn-secondary-border-hover); color: var(--btn-secondary-color-hover); } .btn-back:hover, .btn-back:focus { outline: none; background-color: var(--btn-secondary-bg-hover); border-color: var(--btn-secondary-border-hover); color: var(--btn-secondary-color-hover) !important; } .btn-back:active, .btn-back.active { outline: none; background-color: var(--btn-secondary-bg-active); border-color: var(--btn-secondary-border-active); color: var(--btn-secondary-color-active); } .summary__table td { border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); } .payment-process hr { border-top-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); } /*------------------------------------*\ #Subscription \*------------------------------------*/ .subscription__title { color: var(--slider-title); } .subscription__text { color: var(--theme-text); } /*------------------------------------*\ #Buy Video \*------------------------------------*/ .buy-video { background-color: #00CBD3; white-space: normal; padding: 10px 20px; border-color: #FFF; color: #FFF; font-size: 14px; font-weight: 600; text-transform: uppercase; } .buy-video:hover, .buy-video:focus { background-color: #009499; outline: none; border-color: #FFF; color: #FFF; } /*------------------------------------*\ Terms of Use Page \*------------------------------------*/ .TextWidget { background-color: var(--theme-background); color: var(--theme-text); } .modal-header { border-bottom: 1px solid #e5e5e5; } .modal-header .close.icon { color: #fff; } .modal-body .hr { border-top: 1px solid #eee; } /*------------------------------------*\ Full schedule widget \*------------------------------------*/ .games-selector__btn .btn { background-color: var(--theme-primary); color: var(--theme-primary-text); border-color: var(--theme-primary); } .games-selector__btn .btn:hover { background-color: var(--btn-primary-bg-hover); color: var(--btn-primary-color-hover); } td.match-table__month { background-color: var(--theme-primary); color: var(--theme-primary-text); } .match-table { background-color: var(--theme-background); color: var(--theme-text); } .btn-drops-schedule { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); color: var(--theme-text); background-color: var(--theme-background); } .btn-drops-schedule:hover { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); color: var(--theme-text); } .match-table__note { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); color: var(--theme-text); } .match-table__note:after { border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2) transparent transparent transparent; } td.match-table__day { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); color: var(--theme-text); } .match-table__no-broadcast { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), 1); color: var(--theme-background); } .match-table tr.match-table__hover.calendar-has-event:hover td { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .1); } .games-selector__select .dropdown-menu { background-color: var(--theme-background); border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); } .games-selector__select .dropdown-menu>li>a { color: var(--theme-text); } .games-selector .dropdown-menu>.active>a, .games-selector .dropdown-menu>.active>a:hover, .games-selector .dropdown-menu>.active>a:focus { background: var(--btn-primary-bg); color: var(--btn-primary-color); } .games-selector .dropdown-menu>li>a:hover, .games-selector .dropdown-menu>li>a:focus { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); } .btn-filter-title { color: var(--slider-title); } .btn-filter-title:hover, .btn-filter-title:focus { color: var(--slider-title); } .full-schedule__season .dropdown-menu { background-color: var(--theme-background); border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); } .full-schedule__season .dropdown-menu>.active>a, .full-schedule__season .dropdown-menu>.active>a:hover, .full-schedule__season .dropdown-menu>.active>a:focus { background: var(--btn-primary-bg); color: var(--btn-primary-color); } .f10ew .f10ew__filter__action button { background-color: var(--theme-primary); color: var(--theme-primary-text); border-color: var(--theme-primary); } .f10ew .f10ew__filter__action button:hover { background-color: var(--btn-primary-bg-hover); color: var(--btn-primary-color-hover); } .f10ew .f10ew__board__month { background-color: var(--theme-primary); color: var(--theme-primary-text); } .f10ew .f10ew__board__item { background-color: var(--theme-background); color: var(--theme-text); } .f10ew .f10ew__filter__selectbox .selectbox-toggle { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); color: var(--theme-text); background-color: var(--theme-background); } .f10ew .f10ew__filter__selectbox .selectbox-toggle:hover { border: 1px solid hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); color: var(--theme-text); } .f10ew .f10ew__board__date { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .4); color: var(--theme-text); } .f10ew .f10ew__filter__selectbox .selectbox-menu { background-color: var(--theme-background); border-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); } .f10ew .f10ew__filter__selectbox .selectbox-menu>li>span { color: var(--theme-text); } .f10ew .f10ew__filter__selectbox .selectbox-menu>.active, .f10ew .f10ew__filter__selectbox .selectbox-menu>.active:hover, .f10ew .f10ew__filter__selectbox .selectbox-menu>.active:focus { background: var(--btn-primary-bg); } .f10ew .f10ew__filter__selectbox .selectbox-menu>.active span, .f10ew .f10ew__filter__selectbox .selectbox-menu>.active:hover span, .f10ew .f10ew__filter__selectbox .selectbox-menu>.active:focus span { color: var(--btn-primary-color); } .f10ew .f10ew__filter__selectbox .selectbox-menu>li:hover, .f10ew .f10ew__filter__selectbox .selectbox-menu>li:focus { background-color: hsla(var(--hue-text), var(--saturation-text), var(--light-text), .2); } .f10ew .f10ew__filter__selectbox .selectbox-toggle { color: var(--theme-text); background-color: var(--theme-background); } .f10ew__filter__selectbox .selectbox-toggle:after {} .f10ew .f10ew__filter__selectbox .selectbox-toggle:hover, .f10ew .f10ew__filter__selectbox .selectbox-toggle:focus { color: var(--theme-text); } /* Slider arrows moved here for a reason*/ .swipr__nav .cls-4 { fill: var(--slider-arrow) !important; } .swipr__nav:hover .cls-4 { fill: var(--slider-arrow-hover) !important; } /* Community Uploader */ .community-upload__title { color: var(--bnrw-title-color); font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight); text-transform: var(--theme-title-font-transformation); } .uploader-modal-title, .uploader-modal-subtitle, .uploader-modal > .uploader-modal-content > div > .cancel-popup-title, .uploader-modal-content > div > div > .filename, .uploader-modal-content > div > div > .progress-value, .uploader-modal-content > div > .upload-details, .uploader-modal-content > div .upload-desktop-view > .upload-details-row > .upload-details-row-header-column, .uploader-modal-content > div .upload-desktop-view > .upload-details-row > .upload-details-row-column, .uploader-modal > .uploader-modal-content > .uploader-modal-close > svg { color: var(--troubleshooting-text-color) !important; } .page__account-content > .community-upload__desc > p { font-family: var(--theme-body-font-family); font-size: var(--body-font-size); font-style: var(--theme-body-font-style); font-weight: var(--theme-body-font-weight); line-height: var(--theme-body-font-lineheight); } .uploader-modal-content { background-color: var(--troubleshooting-bg) !important; color: var(--troubleshooting-text-color) !important; } .uploader-modal > .uploader-modal-content > div > .label { color: var(--form-field-text); } .credits-modal-header-unavailable { color: var(--troubleshooting-text-color) !important; } .credits-modal-content { background-color: var(--troubleshooting-bg) !important; color: var(--troubleshooting-text-color) !important; } .uploader-modal-content > div > .uploader-wrapper > .drop-zone { border: 3px dashed var(--theme-primary) !important; color: var(--troubleshooting-text-color) !important; } .uploader-modal-content > div > .action > .library-btn, .uploader-wrapper > .drop-zone > div > .uploader-btn, .uploader-wrapper > .drop-zone > div > .close-button, .uploader-wrapper > .drop-zone > div > .btn-primary, .uploader-modal-content > div > .cancel-popup-actions > .continue-button { background-color: var(--btn-primary-bg) !important; border: 1px solid var(--btn-primary-color) !important; border-color: var(--btn-primary-border) !important; } .uploader-modal-content > div > .action > .library-btn:hover, .uploader-wrapper > .drop-zone > div > .uploader-btn:hover, .uploader-wrapper > .drop-zone > div > .close-button:hover, .uploader-wrapper > .drop-zone > div > .btn-primary:hover, .uploader-modal-content > div > .cancel-popup-actions > .continue-button:hover { background-color: var(--btn-primary-bg-hover) !important; color: var(--btn-primary-color-hover) !important; border: 1px solid var(--btn-primary-border-hover) !important; } .uploader-modal-content > div > div > .cancel-button, .warning-modal-content > .warning-modal-footer > .warning-modal-cancel-btn, .uploader-modal-content > div > .cancel-popup-actions > .stop-button { background-color: var(--btn-secondary-bg) !important; color: var(--btn-secondary-color) !important; border: 1px solid var(--btn-secondary-border) !important; } .uploader-modal-content > div > div > .cancel-button:hover, .warning-modal-content > .warning-modal-footer > .warning-modal-cancel-btn:hover, .uploader-modal-content > div > .cancel-popup-actions > .stop-button:hover { background-color: var(--btn-secondary-bg-hover) !important; color: var(--btn-secondary-color-hover) !important; border: 1px solid var(--btn-secondary-border-hover) !important; } /* Ensure the countdown timer overlay in player is not affected with body style */ .l7ow__count_wrapper .l7ow__count_section span { font-style: normal; } .tweets > .tweets__title > .title > a { color: var(--videotile-color); font-family: var(--theme-title-font-family); font-style: var(--theme-title-font-style); font-weight: var(--theme-title-font-weight); text-transform: var(--theme-title-font-transformation); } /* Slider widget title colors */ .s4rw__header__title { color: #000000 !important; } /* Video slider thumbnail short description text color */ .s4rw .videotile__title { color: #000000 !important; } .s4rw .videotile__text { color: #000000; !important; } /* Set Text Color in Login & Registration Page */ .subscription__title, .login-form__header, .login-form__header h2, .account-info__title h2, .login-form__title p { color: #000000 !important; } /* Set Player TItle Color */ .player-block__title h3 { color: #ffffff !important; } /* ------- menu center ------- */ .header__menu { justify-content: center; }