html, body{
    height:100%;
}

body{
    margin:0px;
    background:#111;
    font-family:Arial;
    color:#fff;
    line-height:1.45;
}

html, body, main{
    min-height:100%;
}

/* Assistive utility */
.visually-hidden{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0 0 0 0) !important;
    white-space:nowrap !important;
    border:0 !important;
}

[role="link"],
[role="button"] {
    cursor: pointer;
}

/* Global focus visibility */
:focus { outline: none; } /* only safe because we replace it below */
:focus-visible{
    outline:3px solid #fff;
    outline-offset:2px;
}

/* Accessibility utilities (centralized) */
/* Skip link (visually hidden until focused) */
.skip-link{
    position:absolute;
    left:-9999px;
    top:auto;
    width:1px;
    height:1px;
    overflow:hidden;
    z-index:100000;
}
.skip-link:focus,
.skip-link:active,
.skip-link:focus-visible{
    left:10px;
    top:10px;
    width:auto;
    height:auto;
    padding:8px 12px;
    background:#fff;
    color:#111;
    border-radius:4px;
    text-decoration:none;
}

/* Alias used across codebase */
.sr-only{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0 0 0 0) !important;
    white-space:nowrap !important;
    border:0 !important;
}

/* A visually-hidden utility that becomes visible when focused (useful for skip links)
   Apply to anchors that should be keyboard-accessible but not visible by default */
.visually-hidden--focusable{
    position:absolute !important;
    width:1px !important;
    height:1px !important;
    padding:0 !important;
    margin:-1px !important;
    overflow:hidden !important;
    clip:rect(0 0 0 0) !important;
    white-space:nowrap !important;
    border:0 !important;
}
.visually-hidden--focusable:focus,
.visually-hidden--focusable:active{
    position:static !important;
    width:auto !important;
    height:auto !important;
    margin:0 !important;
    overflow:visible !important;
    clip:auto !important;
    white-space:normal !important;
}

@media screen and (max-width: 900px) {
    .hiddenOnMobile{
        display:none !important;
    }
}

@media screen and (min-width: 901px) {
    .hiddenOnDesktop{
        display:none !important;
    }
}

/* Utility to force a visible focus ring on custom interactive elements */
.focus-ring:focus{outline:3px solid #fff; outline-offset:2px}

/* Respect reduced motion */
@media (prefers-reduced-motion: reduce){
    *{
        animation-iteration-count: 1 !important;
        animation-duration:0.001ms !important;
        animation-iteration-count:1 !important;
        transition-duration:0.001ms !important;
        scroll-behavior: auto !important;
    }
}

/* High Contrast mode */
@media (forced-colors: active){
    :focus-visible{
        outline:2px solid Highlight !important;
        outline-offset:2px;
    }
}

.table{
    display:table;
}

.table .row{
    display:table-row;
}

.cell{
    display:table-cell;
}

.cell.top{
    vertical-align:top;
}

.cell.middle{
    vertical-align:middle;
}

.cell.bottom{
    vertical-align:bottom;
}

.underlined{
    text-decoration:underline;
}

.textAlignCenter{
    text-align:center;
}

.textAlignLeft{
    text-align:left;
}

.textAlignRight{
    text-align:right;
}

.beaconIcon{
    height:11px;
}

.pseudoLink{
    border:0px;
    display:inline;
    color:#ff615c;
    padding:0px;
    background:transparent;
    font-size:16px;
    font-weight:bold;
    cursor:pointer;
}

.pseudoLink:not(.underlined){
    text-decoration:none;
}

.pseudoLink:hover{
    background:transparent;
}

.pseudoLink:hover span{
    text-decoration:underline;
}

.authPanel{
    width:96%;
    max-width:550px;
    border-radius:5px;
    margin:25px auto 0px auto;
    padding:40px;
    background:transparent;
    box-sizing:border-box;
}

.electricalPanelErrorNoticeTable{
    display:table;
    width:100%;
}

.electricalPanelErrorNoticeCell{
    display:table-cell;
    vertical-align:middle;
    padding:20px;
}

.electricalPanelErrorNoticeCell img{
    width:120px;
    display:block;
    margin:auto;
}

.electricalPanelErrorNoticeCell div{
    text-align:center;
    font-weight:bold;
    font-size:14px;
    color:#fff;
    margin-top:10px;
}

.successNotice, .errorNotice{
    margin:10px 0px;
    padding:8px;
    color:#111;
    font-weight:normal;
    font-size:14px;
    border-radius:5px;
}

.successNotice{
    background:#00eb5e;
}

.errorNotice{
    background:#ff615c;
}

.toggleSwitch{
    width:50px;
    height:31px;
    background:#bbb;
    position:relative;
    border-radius:999px;
    overflow:hidden;
    cursor:pointer;
}

.activeToggleSwitchBackground{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background:#ff615c;
    opacity:0;
    z-index:1;
    transition:opacity 250ms ease;
}

.toggleSwitch.toggledOn .activeToggleSwitchBackground{
    transition:opacity 250ms ease;
    opacity:1;
}

.toggleSwitch .toggleKnob{
    position:absolute;
    top:2px;
    left:2px;
    width:25px;
    height:25px;
    border:1px solid #aaa;
    background:#fff;
    -webkit-box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1); 
    box-shadow: 1px 1px 5px 0px rgba(0,0,0,0.1);
    border-radius:999px;
    z-index:2;
    transition:left 0.5s ease;
}

.toggleSwitch.toggledOn .toggleKnob{
    transition:left 0.5s ease;
    left:21px;
}

.vodBadge{
    background:#eb0000;
    padding:2px 4px;
    border-radius:4px;
    color:#fff;
    font-weight:700;
    margin-right:2px;
    font-size:14px;
    text-transform:uppercase;
}

header{
    background:#222;
    position:fixed;
    width:100%;
    z-index:10001;
}

#headerTable{
    display:table;
    height:50px;
    width:100%;
}

#headerTable>.emptyCell{
    display:table-cell;
}

#headerTable>.cell{
    display:table-cell;
    vertical-align:middle;
    height:100%;
    color:#ff615c;
    font-weight:bold;
    font-size:16px;
    padding-left:30px;
    white-space:nowrap;
}

#headerTable>.cell:first-of-type{
    padding-left:10px;
}

#headerTable>.cell:nth-of-type(4){
    width:100%;
    padding-right:10px;
}

#headerTable>.cell:nth-of-type(4){
    width:100%;
}

#headerTable #notificationsCell{
    position:relative;
    font-size: 26px;
    padding-left: 0px;
    color: #fff;
    width:38px;
    text-align:center;
    cursor:pointer;
    display:none;
}

#notificationDot{
    position:absolute;
    width:10px;
    height:10px;
    border:2px solid #fff;
    border-radius:999px;
    background:red;
    top:27%;
    right:0%;
    overflow:hidden;
}

#notificationDot .cell{
    font-size:8px;
    color:#fff;
    text-align:center;
}

#desktopNotifications{
    position:fixed;
    top:50px;
    right:39px;
    background: #333;
    width: 300px;
    box-shadow: 0px 0px 15px -3px rgba(0, 0, 0, 1);
    border-radius: 0px 0px 5px 5px;
    z-index:2146999998;
    display:none;
}

#mobileNotificationsPanel .notification{
    border-bottom:2px solid #444;
    font-size:17px;
    line-height:150%;
}

.notification{
    font-size: 14px;
    padding: 20px;
    box-sizing: border-box;
    white-space: normal;
    text-align: left;
    line-height: 130%;
    cursor:default;
    color:#fff;
    font-weight:bold;
}

.notification a{
    color:#ff615c;
    text-decoration:underline;
}

#headerTable>.cell:nth-of-type(7){
    padding:0px 10px;
}

#headerTable>.cell:nth-of-type(7) #desktopAccountNavIcon{
  border-radius:999px;
  width:33px;
  height:33px;
  text-align:center;
  background-image:url("../images/avatar-small.png");
  background-size:cover;
  background-position:center;
  background-repeat:no-repeat;
  overflow:hidden;
  background-color:#fff;
  border:3px solid #ff615c;
  box-shadow: inset 0px 0px 2px 1px rgba(0,0,0,0.2);
  cursor:pointer;
  position:relative;
  z-index:2147000000;
}

#headerTable>.cell:nth-of-type(7) #desktopAccountNavXTable{
    position:absolute;
    top:-100%;
    left:0px;
    width:100%;
    height:100%;
}

#headerTable>.cell:nth-of-type(8), #headerTable>.cell:nth-of-type(9){
    display:none;
}

#headerTable #searchInputTable{
    display:table;
    border:2px solid #ccc;
    border-radius:5px;
    float:right;
}

#headerTable #searchInputTable>div{
    display:table-cell;
    vertical-align:middle;
    position:relative;
}

#headerTable #searchInputTable .clearSearchButton{
    position:absolute;
    right:0px;
    top:0px;
    height:100%;
    font-size:20px;
    font-weight:bold;
    padding:0px 8px;
    border-radius:0px;
    color:#ff615c;
    cursor:pointer;
    background:transparent;
    display:none;
}

#global-search{
    background:#222;
    padding:7px 30px 7px 10px;
    font-size:14px;
    border:0px none transparent;
    color:#fff;
    width:160px;
    border-radius:5px 0px 0px 5px;
}

::placeholder{
    color:#ccc;
}

#global-search:focus{
    position:relative;
    z-index:1;
    outline-offset:0px;
    outline:5px solid #fff;
}

#headerTable #searchInputTable>div:last-of-type{
    width:40px;
    background-image:url('../images/search-icon-white.png');
    background-size:20px;
    background-position:10px center;
    background-repeat:no-repeat;
    border-left:1px solid #ccc;
    cursor:pointer;
    background-color:#222;
    border-radius:0px 3px 3px 0px;
}

#headerTable #searchInputTable>div:last-of-type:focus{
    outline-offset:0px;
    outline:5px solid #fff;
}

#headerTable #searchInputTable>div:last-of-type:hover{
    background-color:#2F2F2F;
}

#searchSuggestions{
    position:fixed;
    top:50px;
    right:59px;
    display:block;
    background:#333;
    width:255px;
    box-shadow: 2px 2px 15px -3px rgba(0, 0, 0, 1);/*box-shadow: inset 0px 10px 13px -13px rgba(0, 0, 0, 1);*/
    border-radius:0px 0px 10px 10px;
    z-index:10000;
    max-height:237px;
    overflow-x:hidden;
    overflow-y:scroll;
}

#searchSuggestions>div{
    padding:10px 20px;
    color:#ff615c;
    font-weight:bold;
    font-size:16px;
    border-bottom:1px solid #444;
    cursor:pointer;
}

#searchSuggestions>div:last-of-type{
    border-bottom:0px none transparent;
}

#searchSuggestions>div:hover, #searchSuggestions>div[aria-selected="true"]{
    background:#444;
    text-decoration:underline;
}

#desktopAccountNav{
    --size: 400;                   /* pie diameter */
    width:0px;
    height:0px;
    margin:2rem auto;
    font-family:system-ui,sans-serif;
    background:rgba(34, 34, 34,0.9);
    position:fixed;
    top:25px;
    right:29.5px;
    margin-top:-10px;
    margin-right:-10px;
    border-radius:9999px;
    border:10px solid transparent;
    z-index:2146999999;
    box-shadow: 0px 0px 15px 9px rgba(0,0,0,0.5);
    overflow: hidden;
}

@supports ( backdrop-filter: blur(10px) ) {
    #desktopAccountNav{
        background:rgba(34, 34, 34,0.6);
        backdrop-filter: blur(10px);
    }
}

#desktopAccountNav svg{
    width:100%;
    height:100%;
    transform-box: fill-box;
}

#desktopAccountNav .slice{
    cursor:pointer;
    outline:none;
}

#desktopAccountNav .slice.cancelSlice{
    cursor:default;
}
/*#desktopAccountNav .slice:hover path{fill:#ff615c !important}*/
/*#desktopAccountNav .cancelSlice:hover path{fill:rgba(255,255,255,0.05) !important}*/

#desktopAccountNav text.label{
    font:600 14px/1 sans-serif;
    pointer-events:none;
    text-anchor:middle;
    dominant-baseline:middle;
}

/* desktopAccountNavIndicator always below, transition for smooth spin */
#desktopAccountNav #desktopAccountNavIndicator{
    pointer-events:none;
    transform-origin: 200px 200px;
    transition: transform 0.2s ease;
}

#headerTable>.cell a{
    text-decoration:none;
}

#headerTable>.cell a.active span{
    text-decoration:underline;
}

#headerTable>.cell a:hover span{
    text-decoration:underline;
}

#logo{
    height:25px;
}

h1{
    padding:0px;
    margin:0px;
}

#mobileSearchSection, #mobileNavSection, #mobileNotificationsSection{
    overflow:hidden;
    display:none;
}

#mobileNavSection ul, #mobileNavSection li{
    padding:0px;
    margin:0px;
}

#mobileNavSection li{
    list-style-type: none;
}

#watchNowProfilesColumn{
    position:fixed;
    top:0px;
    left:0px;
    width:50px;
    height:100%;
    padding-top:50px;
    background:#222;
    -webkit-box-shadow: inset 0px 85px 24px -36px rgba(0,0,0,0.75);
    -moz-box-shadow: inset 0px 85px 24px -36px rgba(0,0,0,0.75);
    box-shadow: inset 0px 85px 24px -36px rgba(0,0,0,0.75);
    z-index:3;
}

#watchNowProfilesColumn hr{
    border-top:1px solid #000;
    border-left:1px solid #000;
    border-bottom:1px solid #444;
    border-right:1px solid #444;
    margin:15px 0px;
    display:none;
}

.placeholderProfileColumnProfile{
    width:40px;
    height:40px;
    border-radius:999px;
    overflow:hidden;
    margin:8px auto;
    background:rgba(255,255,255,0.1);
}

.profileRow{
    position:relative;
    margin:8px auto;
    display:block;
}

.profileRow:focus{
    outline:0px none transparent;
}

.profileTooltipTableContainer{
    position:absolute;
    height:100%;
    left:2px;
    top:-6px;
    z-index:-1;
    cursor:pointer;
    display:none;
}

.profileRow:focus .profileTooltipTableContainer{
    display:block !important;
}

.profileTooltipTable{
    display:table;
    height:100%;
    background:#444;
    color:#fff;
    border-radius:5px;
    padding:6px 10px;
}

.profileTooltipTable>div{
    display:table-cell;
    vertical-align:middle;
}

.profileTooltipTable>div:first-of-type{
    font-size:13px;
    font-weight:bold;
    padding-right:10px;
    padding-left:48px;
}

.watchNowBadge{
    display:inline-block;
    padding:3px 5px;
    border-radius:4px;
    overflow:hidden;
    white-space:nowrap;
    color:#fff;
    font-size:10px;
    font-weight:bold;
    background:#e60000;
    margin:10px;
    text-transform:uppercase;
}

.watchNowThumbnail .watchNowBadge{
    position:absolute;
    top:0px;
    left:0px;
    display:none;
}

.startsInBadge{
    display: inline-block;
    padding: 3px 5px;
    border-radius: 4px;
    overflow: hidden;
    white-space: nowrap;
    color: #fff;
    font-size: 10px;
    font-weight: bold;
    background: #111;
    margin: 10px;
    text-transform: uppercase;
    border:1px solid #444;
}

.profileTooltipTable>div span{
    margin:0px 0px -4px 0px;
}

.profileColumnProfile{
    width:40px;
    height:40px;
    position:relative;
    border-radius:999px;
    overflow:hidden;
    margin:0px auto;
    cursor:pointer;
}

.profileRow:focus .profileColumnProfile{
    outline:3px solid #fff;
    outline-offset:2px;
}

.profileColumnInitialTable{
    display:table;
    width:100%;
    height:100%;
}

.profileColumnInitialTable>div{
    display:table-cell;
    vertical-align:middle;
    width:100%;
    text-align:center;
    background:#444;
    color:#fff;
    font-weight:bold;
}

.profileColumnPicture{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    overflow:hidden;
}

.profileColumnPicture img{
    width: 100%;
    height: 100%;
    object-fit:cover;
    object-position:center;
    display:block;
}

.profileColumnPicture.onAirProfileColumnPicture{
    border:3px solid #ff615c;
    border-radius:999px;
    box-sizing:border-box;
}

.profileColumnPicture.offAirProfileColumnPicture{
    filter: grayscale(100%); /* Current draft standard */
    -webkit-filter: grayscale(100%); /* New WebKit */
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%); 
    -o-filter: grayscale(100%); /* Not yet supported in Gecko, Opera or IE */ 
    filter: url(resources.svg#desaturate); /* Gecko */
    filter: gray; /* IE */
    -webkit-filter: grayscale(1); /* Old WebKit */
}

main{
    box-sizing:border-box;
}

.visibilityHidden{
    visibility:hidden;
}

.hidden{
    display:none !important;
}

#globalAlerts{
    position:fixed;
    top:70px;
    right:20px;
    z-index:2147483647;
    width:400px;
}

.globalAlert{
    position:relative;
    border-radius:5px;
    overflow:hidden;
    -webkit-box-shadow: 6px 6px 15px -4px rgba(0,0,0,0.59); 
    box-shadow: 6px 6px 15px -4px rgba(0,0,0,0.59);
    margin-bottom:15px;
}

.notificationGlobalAlert{
    background:#fff;
    color:#111;
}

.infoGlobalAlert{
    background:#5cd4ff;
    color:#111;
}

.successGlobalAlert{
    background:#00eb5e;
    color:#111;
}

.warningGlobalAlert{
    background:#ffbe5c;
    color:#111;
}

.errorGlobalAlert{
    background:#ff615c;
    color:#111;
}

.globalAlertContent{
    display:table;
    position:relative;
    z-index:1;
    height:1px;
}

.globalAlertContent>div{
    display:table-cell;
    vertical-align:top;
    font-size:14px;
}

.globalAlertContent>div:nth-of-type(1){
    padding:10px;
}

.globalAlertContent>div:nth-of-type(2){
    width:100%;
    padding:10px 0px;
}

.globalAlertContent>div:nth-of-type(3){
    padding-left:25px;
    height:100%;
}

.globalAlertContent button{
    border:0px none transparent;
    background:transparent;
    height:100%;
    padding:0px 10px;
    white-space:nowrap;
    font-weight:bold;
    cursor:pointer;
    text-decoration:underline;
    border-radius:3px;
    color:inherit;
    border-left:1px solid transparent;
}

.globalAlertContent button:hover{
    background:rgba(0,0,0,0.15);
    border-left:1px solid rgba(0,0,0,0.05);
}

.globalAlertContent button:focus{
    outline:0px none transparent;
}

.globalAlertContent button:focus span{
    outline:3px solid #fff;
    outline-offset:2px;
}

.globalAlertDurationBar{
    position:absolute;
    top:0px;
    left:0px;
    width:0px;
    height:100%;
    background:rgba(0,0,0,0.25);
    z-index:0;
}

.dualButtonModal{
    background:#222;
    display:inline-block;
    border-radius:10px;
    -webkit-box-shadow: 3px 3px 23px 0px rgba(0,0,0,0.75);
    -moz-box-shadow: 3px 3px 23px 0px rgba(0,0,0,0.75);
    box-shadow: 3px 3px 23px 0px rgba(0,0,0,0.75);
    color:#fff;
    font-weight:bold;
}

.dualButtonModalHeader{
    display:table;
    width:100%;
}

.dualButtonModalHeader>div{
    display:table-cell;
    vertical-align:top;
    text-align:left;
    font-size:24px;
}

.dualButtonModalHeader>div:first-of-type{
    width:100%;
    padding:20px 20px 0px 20px;
}

.dualButtonModalHeader>div:last-of-type{
    padding:5px 5px 0px 0px;
}

.dualButtonModalTitle{
    padding:0px;
    box-sizing:border-box;
}

.closeDualButtonModalButton{
    cursor:pointer;
    display:inline-block;
    background:transparent;
    border-radius:5px;
    width:30px;
    text-align:center;
    color:#999;
    font-size:18px;
}

.closeDualButtonModalButton:hover{
    color:#ccc;
}

.dualModalMain{
    width:410px;
    margin:15px auto;
}

.dualButtonModalFooter{
    display:table;
    width:100%;
    margin-top:5px;
}

.dualButtonModalFooter>div{
    display:table-cell;
    vertical-align:top;
    width:50%;
    padding:0px 20px 20px 20px;
    font-size:0px; /* removes text-node spacing between buttons */
}

.dualButtonModalFooter>div:first-of-type{
    padding-right:5px;
}

.dualButtonModalFooter>div:last-of-type{
    padding-left:5px;
}

.dualButtonModalFooter button{
    white-space:nowrap;
    width:200px;
    font-size:14px;
    margin-top:10px;
    box-sizing:border-box;
}

.dualButtonModalFooter>div:last-of-type button:last-of-type{
    display:none;
}

#mainLoadingOverlay{
    position:fixed;
    top:50px;
    left:0px;
    width:100%;
    height:100%;
    padding-top:50px;
    box-sizing:border-box;
    background:#111;
    z-index:9999;
}

#mainLoadingOverlay.translucent{
    display:table;
    opacity:0.8;
}

#mainLoadingOverlay.translucent>div{
    display:table-cell;
    vertical-align:middle;
    padding-bottom:50px;
}

.loadingBeaconAnimationSquare{
    width:100px;
    height:100px;
    position:relative;
    transform:rotate(-40deg);
    margin:auto;
}

.loadingBeaconAnimationCircle{
    border-radius:9999px;
    width:30.72%;
    height:30.72%;
    position:absolute;
    top:34.64%;
    left:34.64%;
    background:#fff;
    z-index:1;
}

.loadingBeaconAnimationLayer{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
}

.loadingBeaconAnimationQuadrant{
    width:50%;
    height:50%;
    float:left;
    overflow:hidden
}

.loadingBeaconAnimationRing{
    border:9px solid #fff;
    width:131.32%;
    height:131.32%;
    border-radius:9999px;
    margin-top:34.34%;
    margin-left:34.34%;
    box-sizing:border-box;
}

.loadingBeaconAnimationQuadrant:last-of-type{
    transform: rotate(180deg);
}

.loadingBeaconAnimationLayer:last-of-type .loadingBeaconAnimationRing{
    width:200%;
    height:200%;
    margin-top:0%;
    margin-left:0%;
}

.inputGroup{
    position:relative;
}

.inputGroup label.fatPseudoPlaceholder{
    top:21px;
    left:21px;
    font-size:20px;
    line-height:20px;
}

.inputGroup label.mediumPseudoPlaceholder{
    top:16px;
    left:16px;
    font-size:16px;
    line-height:16px;
}

.inputGroup label.fatPseudoPlaceholder, .inputGroup label.mediumPseudoPlaceholder{
    position:absolute;
    padding:0px;
    margin:0px;
    pointer-events:none;
    color:#ccc;
    z-index:1;
}

.inputGroup label.fatPseudoPlaceholder::after, .inputGroup label.mediumPseudoPlaceholder::after{
    content:"";
}

.inputContainer{
    position:relative;
    margin-bottom:15px;
}

.fatInput, .mediumInput{
    margin:0px;
    width:100%;
    color:#fff;
    background:transparent;
    font-size:20px;
    font-weight:bold;
    padding:20px;
    box-sizing:border-box;
    border:1px solid #ccc;
    border-radius:5px;
    overflow:hidden;
}

.mediumInput{
    font-size:16px;
    padding:15px;
}

.animatedCountDigitTable{
    position:relative;
}

.animatedCountTable{
    display:table;
    font-family:Arial;
    font-size:16px;
    font-weight:bold;
    margin:auto;
}

.animatedCountCell{
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    height:25px;
    width:12px;
    overflow:hidden;
    position:relative;
}

.viewerCountWidthTable .animatedCountCell{
    display:inline-block;
}

.animatedCountCell .animatedCountCellBounds{
    height:25px;
    width:100%;
    overflow:hidden;
}

.animatedCountCell .animatedCountDigitTableContainer{
    position:relative;
    width:100%;
    height:100%;
}

.animatedCountDigitTable{
    display:table;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
}

.animatedCountDigitCell{
    display:table-cell;
    width:100%;
    height:100%;
    vertical-align:middle;
    text-align:center;
    line-height:163%;
}

.animatedCountCell.animatedCountCommaCell{
    width:5px;
    line-height:125%;
}

.progressBarInputBackground{
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
    background:#111;
    z-index:0;
    border-radius:5px;
    overflow:hidden;
}

.progressBarInput{
    position:relative;
    z-index:2;
}

.progressBarInputProgressBarContainer{
    position:absolute;
    top:0px;
    left:0px;
    height:100%;
    width:100%;
    padding:0px;
    z-index:1;
    box-sizing:border-box;
    display:none;
    border-radius:5px;
    opacity:0.1;
}

.progressBarInputProgressBar{
    height:100%;
    width:0px;
}

.fatButton, .mediumButton{
    background: #ff0000;
    background: -webkit-linear-gradient(90deg, rgba(255, 0, 0, 1) 0%, rgba(255, 93, 92, 1) 100%);
    background: -moz-linear-gradient(90deg, rgba(255, 0, 0, 1) 0%, rgba(255, 93, 92, 1) 100%);
    background: linear-gradient(90deg, rgba(255, 0, 0, 1) 0%, rgba(255, 93, 92, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FF0000", endColorstr="#FF5D5C", GradientType=1);
    width:100%;
    height:62.5px;
    padding:0px;
    font-size:20px;
    font-weight:bold;
    vertical-align:middle;
    color:#fff;
    border-radius:5px;
}

a.fatButton{
    display: block;
    text-align: center;
    height: auto;
    padding: 15px;
    box-sizing: border-box;
    text-decoration: none;
}

.fatButton:hover, .mediumButton:hover{
    background: #ff0000;
}

.mediumButton{
    font-size:19px;
    height:52.5px;
}

.fatButtonLink{
    display:block;
    background: #ff0000;
    background: -webkit-linear-gradient(90deg, rgba(255, 0, 0, 1) 0%, rgba(255, 93, 92, 1) 100%);
    background: -moz-linear-gradient(90deg, rgba(255, 0, 0, 1) 0%, rgba(255, 93, 92, 1) 100%);
    background: linear-gradient(90deg, rgba(255, 0, 0, 1) 0%, rgba(255, 93, 92, 1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#FF0000", endColorstr="#FF5D5C", GradientType=1);
    width:100%;
    border-radius: 5px;
    padding:20px;
    font-size:20px;
    font-weight:bold;
    color:#fff;
    text-decoration:none;
}

.fatButtonLink:hover{
    background: #ff0000;
}

.viewerCountDecorationTable{
    display:table;
    height:25px;
}
.viewerCountDecorationTable .cell{
    display:table-cell;
    vertical-align:middle;
}
.viewerCountDecorationTable .cell:first-of-type{
    padding-right:4px;
}

.viewerCountDecorationTable .cell:nth-of-type(3){
    padding-left:4px;
    opacity:0.7;
}

.viewerCountWidthTableContainer{
    /*display:inline-block;*/
    max-height:1px;
    overflow:hidden;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    opacity:0;
    visibility: hidden;
    float:left;
}

.clearBoth{
    clear:both;
}

.viewerCountWidthTable .viewerCountDigitTable{
    position:relative;
}

.viewerCountUnavailable{
    color:inherit;
    white-space:nowrap;
    display:inline-block;
    font-weight:bold;
}

.viewerCountTable{
    display:none;
    font-family:Arial;
    font-size:16px;
    font-weight:bold;
    float:right;
}

.viewerCountCell{
    display:table-cell;
    vertical-align:middle;
    text-align:center;
    height:25px;
    width:12px;
    overflow:hidden;
    position:relative;
}

.viewerCountCell .viewerCountDigitTableContainer{
    position:relative;
    width:100%;
    height:100%;
}

.viewerCountDigitTable{
    display:table;
    position:absolute;
    top:0px;
    left:0px;
    width:100%;
    height:100%;
}

.viewerCountDigitCell{
    display:table-cell;
    width:100%;
    height:100%;
    vertical-align:middle;
    text-align:center;
    line-height:163%;
}

.viewerCountCell.viewerCountCommaCell{
    width:5px;
    line-height:125%;
}

footer{
    margin-left:50px;
}

#subredditLink{
    background: rgb(255,97,92);
    background: -moz-linear-gradient(90deg, rgba(255,97,92,1) 0%, rgba(255,117,48,1) 100%);
    background: -webkit-linear-gradient(90deg, rgba(255,97,92,1) 0%, rgba(255,117,48,1) 100%);
    background: linear-gradient(90deg, rgba(255,97,92,1) 0%, rgba(255,117,48,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ff615c",endColorstr="#FF5D5C",GradientType=1);
    color:#fff;
    padding:20px 0px;
    text-align:center;
    width:100%;
    box-sizing:border-box;
    font-weight:bold;
    display:block;
    text-decoration:none;
}

#subredditLink:focus{
    outline: 3px solid #fff;
    outline-offset: -3px;
}

#subredditLink:hover span{
    text-decoration:underline;
}

#disclaimerSection{
    text-align:center;
    padding:5px 15px;
    box-sizing: border-box;
    color:#777;
    font-size: 12px;
    background-color: #222;
}

@media screen and (max-width: 818px) {
    .dualButtonModal{
        width:94%;
    }
    
    .dualButtonModalTitle{
        font-size:18px;
        margin-bottom:10px;
    }

    .dualModalMain{
        width:100%;
        margin:0px;
        padding:0px 20px 15px 20px;
        box-sizing:border-box;
    }
    
    .dualButtonModalFooter>div{
        display:block;
        width:100%;
        box-sizing:border-box;
    }
    
    .dualButtonModalFooter>div:first-of-type{
        display:none;
    }
    
    .dualButtonModalFooter>div:last-of-type{
        padding-left:20px;
    }

    .dualButtonModalFooter button{
        width:100%;
    }

    .dualButtonModalFooter>div:last-of-type button{
        margin-top:10px;
    }

    .dualButtonModalFooter>div:last-of-type button:first-of-type{
        margin-top:0px;
    }
    
    .dualButtonModalFooter>div:last-of-type button:last-of-type{
        display:block;
    }
    
    #headerTable>.cell:nth-of-type(2), #headerTable>.cell:nth-of-type(3){
        display:none;
    }
    
    #headerTable>.cell:nth-of-type(4){
        width:100%;
        padding-right:0px;
    }
    
    #headerTable #searchInputTable{
        display:none;
    }

    #headerTable>.cell:nth-of-type(7){
        filter: grayscale(1);
        border-left:2px solid rgba(170, 170, 170, 0.3);
        padding:0px 12px;
    }

    #headerTable>.cell:nth-of-type(8), 
    #headerTable>.cell:nth-of-type(9){
        border-left:2px solid #aaa;
        padding:0px 13px;
    }

    #headerTable>.cell:nth-of-type(7), 
    #headerTable>.cell:nth-of-type(8), 
    #headerTable>.cell:nth-of-type(9){
        display:table-cell;
        cursor:pointer;
    }

    #headerTable #notificationsCell{
        padding-left:13px;
        padding-right:13px;
        border-left:2px solid rgba(170, 170, 170, 0.3);
    }

    #notificationDot{
        right:21%;
    }

    #accountNavCell{
        display:none;
    }

    #notificationsCell:hover{
        background:rgba(85, 85, 85, 0.3);
    }

    #desktopNotifications{
        display:none !important;
    }

    #headerTable>.cell:nth-of-type(7){
        display:none;
    }
    
    #headerTable #notificationsCell i,
    #headerTable>.cell:nth-of-type(8), 
    #headerTable>.cell:nth-of-type(9){
        opacity:.5;
    }
    
    #headerTable>.cell:nth-of-type(8):hover, #headerTable>.cell:nth-of-type(9):hover{
        background-color:#555;
    }
    
    #headerTable>.cell:nth-of-type(8){
        background-image:url('../images/search-icon-white.png');
        background-size:23px auto;
        background-position:center;
        background-repeat:no-repeat;
        padding:0px 25px;
    }
    
    #hamburger{
        width:24px;
    }
    
    #hamburger>div{
        background:#fff;
        margin-bottom:5px;
        border-radius:999px;
        height:3px;
    }
    
    #hamburger>div:last-of-type{
        margin-bottom:0px;
    }

    #desktopAccountNav{
        display:none;
    }
    
    #mobileSearchSection, #mobileNavSection, #mobileNotificationsSection{
        position:fixed;
        top:50px;
        left:0px;
        width:100%;
        height:100%;
        background:rgba(0,0,0,0.8);
        max-height:0px;
        display:block;
        cursor:pointer;
    }
    
    #mobileSearchPanel, #mobileNavPanel, #mobileNotificationsPanel{
        box-shadow: inset 0px 10px 13px -13px rgba(0, 0, 0, 1);
        background:#222;
        cursor:default;
    }
    
    #mobileSearchPanel{
        padding:20px;
    }
    
    #mobileSearchInputTable{
        display:table;
        border:2px solid #555;
        border-radius:5px;
        width:100%;
    }
    
    #mobileSearchInputTable>div{
        display:table-cell;
        vertical-align:middle;
        position:relative;
    }
    
    #mobileSearchInputTable>div:first-of-type{
        background:#fff;
        border-radius:5px 0px 0px 5px;
    }
    
    #mobileSearchInputTable input{
        background:#222;
        padding:20px 54px 20px 20px;
        font-size:16px;
        border:0px none transparent;
        color:#222;
        width:100%;
        box-sizing:border-box;
        background:transparent;
        border-radius:5px 0px 0px 5px;
    }
    
    #mobileSearchInputTable .clearSearchButton{
        position:absolute;
        right:0px;
        top:0px;
        height:100%;
        font-size:40px;
        font-weight:bold;
        padding:0px 15px;
        color:#ff615c;
        border-radius:0px;
        cursor:pointer;
        background:transparent;
        display:none;
    }
    
    #mobileSearchInputTable>div:last-of-type{
        width:60px;
        background-image:url('../images/search-icon-white.png');
        background-size:20px;
        background-position:20px center;
        background-repeat:no-repeat;
        border-left:1px solid #555;
        cursor:pointer;
        background-color:#333;
        border-radius:0px 5px 5px 0px;
    }
    
    #mobileSearchInputTable>div:last-of-type:hover{
        background-color:#444;
    }
    
    #searchSuggestions{
        display:none;
    }
    
    #mobileSearchSuggestions{
        max-height:290px;
        overflow-x:hidden;
        overflow-y:scroll;
    }
    
    #mobileSearchSuggestions>div{
        padding:20px;
        color:#ff615c;
        font-size:20px;
        background:#333;
        border-radius:5px;
        overflow:hidden;
        margin-top:10px;
        cursor:pointer;
    }
    
    #mobileSearchSuggestions>div:hover, #mobileSearchSuggestions>div[aria-selected="true"]{
        background:#444;
        text-decoration:underline;
    }
    
    .mobileNavLink{
        display:block;
        width:100%;
        padding:20px;
        border-bottom:2px solid #444;
        color:#ff615c;
        font-weight:bold;
        text-align:center;
        font-size:20px;
        border-radius:0px;
        text-decoration:none;
        box-sizing:border-box;
        background:transparent;
        cursor:pointer;
    }
    
    .mobileNavLink.active span{
        text-decoration:underline;
    }
    
    .mobileNavLink:hover span{
        text-decoration:underline;
    }
    
    li:last-of-type .mobileNavLink{
        border-bottom:0px none transparent;
    }
}
              
@media screen and (max-width: 550px) {
    .watchNowBadge{
        font-size:14px;
    }
}

@media screen and (max-width: 500px) {
    #watchNowProfilesColumn{
        display:none;
    }

    #globalAlerts{
        width:240px;
    }
            
    footer{
        margin-left:0px;
    }
}

@media screen and (max-width: 400px) {
    .authPanel{
        padding:20px;
    }
}

@media screen and (max-width: 350px) {
    #headerTable>.cell{
        padding-left:20px;
    }
}

@media screen and (max-width: 340px) {
    #headerTable>.cell:nth-of-type(7){
        padding:0px 6px;
    }

    #headerTable #notificationsCell{
        padding-left:8px;
        padding-right:8px;
    }

    #headerTable>.cell:nth-of-type(8){
        padding:0px 21px;
    }

    #headerTable>.cell:nth-of-type(9){
        padding:0px 9px;
    }
}

@media screen and (max-width: 320px) {
    #logo{
        height:23px;
    }
}

@media screen and (max-width: 300px) {
    #logo{
        height:20px;
    }
    
    .authPanel{
        padding:10px;
    }
}
