/* Copyright (C) Microsoft Corporation. All rights reserved. */
.inlineGlyph, .inlineGlyphSmall, .contentNotificationListIcon
{
    opacity: .5;
    width: auto
}
.inlineGlyphSolid
{
    opacity: 1
}
.errorContainer
{
    display: none
}
.editBox.validationFailed .errorContainer
{
    display: -ms-grid;
    -ms-grid-columns: auto 5px 1fr
}
.editError
{
    display: none
}
html[dir=rtl] .editError
{
    text-align: right
}
.editInput, .editMultiline
{
    padding: 5px
}
.editBox .icon
{
    display: block;
    -ms-grid-row-align: start
}
.fillParent
{
    height: 100%;
    width: 100%
}
.editBox .editError
{
    display: block;
    -ms-grid-row-align: start;
    -ms-grid-column: 3;
    margin-top: -1px
}
.modifierControl
{
    display: -ms-grid;
    -ms-grid-columns: auto auto auto;
    margin: 11px -8px 0 -8px;
    padding: 4px 8px 4px 8px;
    outline: none
}
.modifierControl:before
{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: rgba(70,71,76,.01)
}
.leaderboards .immersiveMoreGallery .modifierControl
{
    -ms-grid-columns: auto 1fr auto
}
.modifierControl .modifierDescription
{
    padding-right: 6px;
    -ms-grid-row-align: end;
    padding-bottom: 2px
}
html[dir=rtl] .modifierControl .modifierDescription
{
    padding-right: 0;
    padding-left: 6px
}
.modifierPopupScroller
{
    height: auto;
    min-width: 283px;
    max-height: calc(100vh - 200px);
    overflow-y: auto;
    margin-top: 4px;
    box-shadow: 0 5px 25px rgba(0,0,0,.4)
}
@media screen and (min-height: 1080px)
{
    .modifierPopupScroller
    {
        max-height: calc(100vh - 230px)
    }
}
@media screen and (min-height: 1200px)
{
    .modifierPopupScroller
    {
        max-height: calc(100vh - 350px)
    }
}
@media screen and (min-height: 1440px)
{
    .modifierPopupScroller
    {
        max-height: calc(100vh - 440px)
    }
}
.modifierEntryTextContainer
{
    display: -ms-grid;
    -ms-grid-columns: auto auto;
    -ms-grid-row-align: center
}
.modifierPopupEntryLabel
{
    -ms-grid-column: 2
}
.initialSelectedModifierPopupEntry .modifierPopupEntryLabel
{
    padding: 0 6px 0 2px
}
.modifierPopupScroller .win-template
{
    height: 50px
}
.modifierPopupEntry
{
    height: 100%;
    position: relative;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    padding: 0 15px;
    display: -ms-grid;
    -ms-grid-rows: 1fr
}
.modifierSelectedItem
{
    -ms-grid-column: 2
}
.inboxPage .modifierSelectedItem
{
    white-space: normal;
    -ms-grid-column: 1;
    -ms-grid-row: 2
}
.dropDownArrowContainer
{
    -ms-grid-column: 3
}
.inboxPage .dropDownArrowContainer
{
    -ms-grid-column: 2;
    -ms-grid-row: 2
}
.modifierDropDownArrow
{
    margin-top: 3px;
    padding-left: 8px;
    padding-right: 8px
}
.thumbnailButton, .cardThumbnailButton
{
    position: relative;
    width: 295px;
    height: 165px;
    white-space: normal;
    display: inline-block;
    overflow: hidden
}
.gamesFlexHubBigItem .cardThumbnailButton, .searchHCR.gamesThumbnail, .searchHCR .cardThumbnailButton
{
    height: 100%
}
.cardThumbnailButton.acc-keyboardFocusTarget
{
    overflow: visible
}
.thumbnailButton
{
    opacity: 0
}
.dashboardGridItemContent .thumbnailButton
{
    overflow: visible;
    display: -ms-grid;
    -ms-grid-columns: 100%;
    -ms-grid-rows: 100%
}
.dashboardGridItemContent .content, .dashboardGridItemContent .imageContainer
{
    overflow: hidden;
    -ms-grid-column: 1;
    -ms-grid-row: 1
}
.dashboardGridItemContent .content
{
    display: -ms-grid;
    -ms-grid-columns: 100%;
    -ms-grid-rows: 1fr 67px
}
.dashboardGridItemContent .textContainer
{
    width: 100%;
    display: -ms-grid;
    -ms-grid-column: 1;
    -ms-grid-row: 2;
    -ms-grid-columns: 15px 1fr auto 15px;
    -ms-grid-rows: 25px 42px
}
.dashboardGridItemContent .secondaryText, .dashboardGridItemContent .tertiaryText, .dashboardGridItemContent .quaternaryText
{
    padding-left: 15px;
    padding-right: 15px;
    -ms-grid-column: 1;
    -ms-grid-column-span: 4
}
.dashboardGridItemContent .primaryTextBg
{
    width: 100%;
    -ms-grid-row: 2;
    -ms-grid-column: 1;
    -ms-grid-column-span: 5
}
.dashboardGridItemContent .primaryText
{
    height: calc(100% - 8px);
    padding-top: 8px;
    -ms-grid-row: 2;
    -ms-grid-column: 2
}
.dashboardGridItemContent .dashboardTileIcon
{
    -ms-grid-row: 2;
    -ms-grid-row-align: end;
    -ms-grid-column: 3;
    margin-bottom: 14px;
    margin-left: 5px
}
html[dir=rtl] .dashboardGridItemContent .dashboardTileIcon
{
    margin-left: 0;
    margin-right: 5px;
    transform: scaleX(-1)
}
.dashboardGridItemContent .dashboardTileIcon.gameIcon
{
    -ms-grid-row-align: center;
    margin-top: 3px;
    margin-bottom: 0;
    margin-left: 0;
    margin-right: -7px
}
html[dir=rtl] .dashboardGridItemContent .dashboardTileIcon.gameIcon
{
    margin-left: -7px;
    margin-right: 0
}
.dashboardGridItemContent .primaryText.specificLineCount
{
    text-overflow: ellipsis;
    white-space: nowrap;
    word-wrap: normal
}
.dashboardGridItemContent .secondaryText, .dashboardGridItemContent .tertiaryText, .dashboardGridItemContent .quaternaryText
{
    width: auto;
    max-width: calc(100% - 30px);
    height: calc(100% - 4px);
    padding-top: 4px;
    -ms-grid-column-align: start;
    -ms-grid-row: 1
}
.dashboardPanel .cardThumbnailButton:hover, .dashboardGridItemContent .thumbnailButton:hover, .immersiveDetails .relatedHeroItemImage .thumbnailButton:hover, .games .engagePanel .actionTile button:hover, .games .engagePanel .actionTile button:hover:active
{
    outline-width: 2px;
    outline-style: solid;
    outline-color: rgba(0,0,0,.3)
}
.dashboardPanel .cardThumbnailButton:after, .dashboardGridItemContent .thumbnailButton:after, .immersiveDetails .relatedHeroItemImage .thumbnailButton:after, .extras .control-extrasListItem:after, .games .achievementPageContainer .achievementGameDetailsThumbnail .imageContainer:after, .relatedHeroItem:after, .immersiveDetails .relatedListView .horizontalListItem .win-focusable:after
{
    content: "";
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,.01)
}
.extras .control-extrasListItem:after, .relatedHeroItem:after, .immersiveDetails .relatedListView .horizontalListItem .win-focusable:after
{
    background-color: rgba(55,54,58,.01)
}
.dashboardPanel .cardThumbnailButton:active, .dashboardGridItemContent .thumbnailButton:active, .immersiveDetails .relatedHeroItemImage .thumbnailButton:active, .games .achievementPageContainer .achievementGameDetailsThumbnail .imageContainer:active, .extras .control-extrasListItem:active, .relatedHeroItem:active, .games .engagePanel .actionTile button:active, .immersiveDetails .relatedListView .horizontalListItem .win-focusable:active
{
    transform: scale(.975)
}
.games .achievementPageContainer .achievementGameDetailsThumbnail .imageContainer:hover, .extras .control-extrasListItem:hover>div, .relatedHeroItem:hover .imageContainer, .relatedHeroItem:hover .textContainer
{
    opacity: .8
}
.related .relatedListView.acc-keyboardFocusTarget>.win-template:hover, .related .relatedListView.acc-keyboardFocusTarget>.win-template>.control-immersiveListViewItem>.win-template:hover
{
    opacity: 1
}
.gameThumbnail .cardThumbnailButton
{
    display: -ms-grid;
    -ms-grid-columns: 15px 99px 15px 151px 15px
}
.gameThumbnail.gameExtra .cardThumbnailButton
{
    display: -ms-grid;
    -ms-grid-columns: 15px 135px 15px 115px 15px
}
.cardThumbnailButton
{
    -ms-grid-rows: 100%
}
.gamesFlexHubBigItem.gamesThumbnail .cardThumbnailButton, .searchHCR.gamesThumbnail .cardThumbnailButton
{
    display: -ms-grid;
    -ms-grid-rows: 15px auto 15px 1fr 15px;
    -ms-grid-cols: 100%;
    -ms-grid-columns: auto
}
.thumbnailButton.visible
{
    transform: translateX(0);
    opacity: 1
}
.gameThumbnail
{
    width: 295px;
    height: 165px
}
.gameThumbnail .cardThumbnailButton .imageContainer
{
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr
}
.gameThumbnail .cardThumbnailButton .imageHolder
{
    -ms-grid-column-align: center;
    display: -ms-grid;
    -ms-grid-columns: auto;
    -ms-grid-rows: 1fr
}
.gameThumbnail .cardThumbnailButton .imageHolder img
{
    -ms-grid-column-align: center;
    -ms-grid-row-align: center
}
.showMoreContent
{
    overflow: hidden
}
.cardThumbnailButton .imageContainer
{
    position: relative;
    -ms-grid-column: 2;
    margin-top: 15px
}
.gamesFlexHubBigItem .cardThumbnailButton .imageContainer, .searchHCR .cardThumbnailButton .imageContainer
{
    position: relative;
    -ms-grid-row: 2;
    margin-left: 15px;
    margin-right: 15px;
    -ms-grid-column: 1;
    margin-top: 0
}
.cardThumbnailButton .imageHolder, .imageHolder
{
    background-repeat: no-repeat;
    background-position: center
}
.cardThumbnailButton .imageHolder
{
    display: -ms-grid;
    overflow: hidden
}
.collectionGames .cardThumbnailButton .imageHolder, .gamesThumbnail .cardThumbnailButton .imageHolder
{
    -ms-grid-columns: 99px
}
.cardThumbnailButton .imageHolder img
{
    -ms-grid-column: 1;
    -ms-grid-column-align: center
}
.cardThumbnailButton .imageOverlay
{
    position: absolute;
    width: 135px;
    height: 135px;
    top: 0
}
.dashboardGridItemContent.primaryPanelComponent .imageHolder
{
    background-position-y: center
}
.cardThumbnailButton .content
{
    -ms-grid-column: 4;
    height: 100%;
    display: -ms-grid;
    -ms-grid-rows: 100%;
    -ms-grid-columns: 1fr
}
.gamesFlexHubBigItem .cardThumbnailButton .content, .searchHCR .cardThumbnailButton .content
{
    -ms-grid-column: 1;
    -ms-grid-row: 4;
    height: 100%;
    display: -ms-grid;
    -ms-grid-rows: 100%;
    margin-top: 0;
    margin-left: 15px;
    margin-right: 15px
}
.thumbnailButtonTextContainerPadding
{
    padding-bottom: 16px;
    padding-top: 80%
}
.collectionPage .thumbnailButtonTextContainerPadding, .marketplacePage .thumbnailButtonTextContainerPadding, .marketplaceGamesPage .thumbnailButtonTextContainerPadding, .cardThumbnailButton .thumbnailButtonTextContainerPadding, .thumbnailButton .thumbnailButtonTextContainerPadding, .control-immersiveListViewItem .thumbnailButtonTextContainerPadding
{
    padding: 0
}
.gamesThumbnail .thumbnailButtonTextContainerPadding
{
    padding-bottom: 18px
}
.thumbnailButtonText
{
    padding-left: 14px;
    padding-right: 20px;
    position: relative;
    text-align: left
}
.cardThumbnailButton .textContainer
{
    position: relative;
    height: calc(100% - 20px);
    margin-top: 0;
    padding-top: 20px;
    display: -ms-grid;
    -ms-grid-columns: 100%;
    -ms-grid-rows: auto auto auto 1fr
}
.searchHCR .cardThumbnailButton .textContainer
{
    height: 100%
}
.searchHCR .cardThumbnailButton .quaternaryText
{
    margin-bottom: 0
}
.collectionGames .cardThumbnailButton .textContainer, .gamesThumbnail .cardThumbnailButton .textContainer
{
    width: 151px
}
.gamesFlexHubBigItem.gamesThumbnail .cardThumbnailButton .textContainer, .searchHCR.gamesThumbnail .cardThumbnailButton .textContainer
{
    width: 100%
}
.cardThumbnailButton .textContainer, .cardThumbnailButton .primaryText, .cardThumbnailButton .secondaryText, .cardThumbnailButton .tertiaryText
{
    width: 100%
}
.cardThumbnailButton .primaryText, .cardThumbnailButton .secondaryText, .cardThumbnailButton .tertiaryText, .cardThumbnailButton .quaternaryText
{
    overflow: hidden;
    word-wrap: break-word
}
.cardThumbnailButton .quaternaryText
{
    max-height: 33px
}
.cardThumbnailButton .primaryText
{
    -ms-grid-row: 2;
    margin-top: 2px;
    margin-bottom: 0;
    padding-bottom: 2px;
    white-space: normal
}
.cardThumbnailButton .secondaryText
{
    -ms-grid-row: 1;
    margin-top: 2px;
    margin-bottom: 2px;
    white-space: normal
}
.cardThumbnailButton .textContainer.primaryTextOnTop .primaryText
{
    -ms-grid-row: 1
}
.cardThumbnailButton .textContainer.primaryTextOnTop .secondaryText
{
    -ms-grid-row: 2;
    margin-top: 6px;
    margin-bottom: 0;
    white-space: nowrap;
    text-overflow: ellipsis
}
.games .flexHubPage .cardThumbnailButton .textContainer.primaryTextOnTop .secondaryText
{
    white-space: normal
}
.searchHCR .cardThumbnailButton .textContainer
{
    padding-top: 0
}
.cardThumbnailButton .tertiaryText
{
    -ms-grid-row: 3;
    margin-top: 4px
}
.cardThumbnailButton .quaternaryText
{
    -ms-grid-row: 4;
    -ms-grid-row-align: end;
    max-height: 100%;
    margin-bottom: 15px;
    white-space: normal;
    display: -ms-grid;
    -ms-grid-columns: 1fr auto;
    -ms-grid-rows: 1fr
}
.cardThumbnailButton .quaternaryText>div
{
    -ms-grid-column-align: start;
    -ms-grid-row-align: end;
    max-height: 34px;
    width: 100%
}
.cardThumbnailButton .quaternaryText .smartGlassGem
{
    -ms-grid-column-align: end
}
.thumbnailStatusIcon
{
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    -ms-grid-column-align: end;
    -ms-grid-row-align: end
}
.hidden
{
    visibility: hidden;
    z-index: -1
}
.collapse
{
    visibility: collapse
}
.label
{
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden
}
.label.noClip
{
    overflow: visible
}
.miniProfileDetailsAndControls .label.noClip
{
    overflow: hidden
}
.label.wrap
{
    white-space: normal
}
.label.autoResizeFont
{
    white-space: normal;
    overflow: hidden
}
.label.specificLineCount
{
    word-wrap: break-word;
    white-space: normal
}
.link
{
    border: 0 solid
}
.imageActionLink.link
{
    background: none;
    width: 100%;
    height: 100%;
    padding: 0;
    margin: 0
}
.imageActionLink.link img
{
    width: 100%;
    height: 100%
}
.showMoreLink
{
    background: none;
    border: 0 solid;
    padding-left: 0;
    margin-top: 10px;
    overflow: visible
}
button:not([disabled]).link.panelHeaderLink:hover
{
    opacity: .8
}
button:not([disabled]).link.panelHeaderLink:active
{
    opacity: .4
}
.listDivider
{
    height: 1px;
    width: 100%;
    border: none
}
.hideFromDisplay, [data-win-control="MS.Entertainment.UI.Shell.ImageControl"][src=""]
{
    visibility: hidden;
    z-index: -1
}
.hideDuringInitialize
{
    visibility: hidden;
    z-index: -1
}
.wecDialog
{
    width: 100%;
    height: 100%;
    display: -ms-grid;
    -ms-grid-columns: 100%;
    -ms-grid-rows: 100%
}
.overlayContainerGrid
{
    display: -ms-grid;
    -ms-grid-columns: 120px auto 1fr;
    -ms-grid-rows: 150px auto 1fr
}
.overlayBackground
{
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    -ms-grid-column-span: 3;
    -ms-grid-row-span: 3;
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    -ms-touch-action: none
}
.overlayContainer
{
    position: absolute
}
.wecDialog .overlayContainer
{
    position: relative;
    -ms-grid-row-align: center
}
.dialogContainerBackground
{
    width: 100%;
    height: auto
}
.dialogContainer
{
    height: 100%;
    padding-left: 20px;
    padding-right: 20px;
    overflow: auto
}
.dialogContainer form
{
    width: 100%;
    max-width: 680px;
    height: 100%;
    margin-left: auto;
    margin-right: auto
}
.dialogContainer form textarea
{
    width: 558px;
    margin-top: 6px;
    margin-bottom: 6px
}
.dialogCaption
{
    margin-top: 40px;
    margin-bottom: 10px;
    white-space: normal
}
.dialogContent
{
    max-height: 60vh;
    overflow-y: auto;
    padding: 2px
}
.errorDialogContent
{
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: auto auto auto auto
}
.webLinkContainer
{
    margin-top: 20px;
    margin-bottom: 20px
}
.webLinkContainer a
{
    padding: 2px
}
.webHostDialogContent
{
    padding-top: 0;
    padding-left: 0;
    top: 0;
    bottom: 0
}
.dialogButtons
{
    width: 100%;
    margin-top: 20px;
    margin-bottom: 25px;
    white-space: nowrap;
    display: -ms-flexbox;
    -ms-flex-pack: end
}
.dialogButtons>.win-template
{
    display: inline-block;
    margin-right: 0
}
.dialogButton
{
    min-width: 90px;
    min-height: 32px;
    margin: 5px
}
.dialogButton:focus
{
    outline: 0
}
.createPlaylistFlyoutGrid .dialogButton, .resetButtonContainer .dialogButton
{
    margin: 0
}
.errorFeedbackLink
{
    border: 0;
    text-align: left;
    padding: 0;
    margin-bottom: 20px
}
html[dir=rtl] .errorFeedbackLink
{
    text-align: right
}
.webHostIFrame
{
    position: absolute;
    height: 745px;
    border-width: 0
}
.webHostPromptOnPurchaseToggle .win-title, .webHostPromptOnPurchaseToggle .win-label
{
    max-width: 100%
}
.dashboardHost
{
    display: -ms-grid;
    height: 100%;
    width: 100%
}
.dashboardContent
{
    -ms-grid-row: 3;
    -ms-grid-column: 1;
    -ms-grid-column-span: 2;
    height: 100%;
    display: -ms-flexbox;
    -ms-flex-direction: row;
    overflow-x: auto;
    overflow-y: hidden;
    -ms-scroll-snap-type: proximity;
    -ms-scroll-snap-points-x: snapInterval(0%,0%);
    -ms-scroll-limit-x-min: 4000px
}
.pivotDashboard .dashboardContent
{
    -ms-scroll-snap-type: mandatory
}
.dashboardTitle
{
    display: -ms-grid;
    -ms-grid-columns: auto 20px auto 60px;
    -ms-grid-rows: auto;
    -ms-grid-row: 1;
    -ms-grid-column: 2;
    -ms-grid-row-align: end
}
html[dir=rtl] .dashboardTitle
{
    -ms-grid-columns: 410px 1fr auto 20px auto 60px;
    width: 100%
}
.pivotDashboard .dashboardTitle
{
    -ms-grid-columns: 40px 20px auto 60px;
    -ms-grid-rows: auto auto
}
html[dir=rtl] .dashboardTitle
{
    direction: ltr;
    -ms-grid-column-align: start
}
.dashboardTitleIcon
{
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    width: 40px;
    height: 40px;
    margin-top: 11px;
    -ms-grid-row-align: start;
    unicode-bidi: bidi-override
}
html[dir=rtl] .dashboardTitleIcon
{
    -ms-grid-column: 3
}
.dashboardTitleLabel
{
    -ms-grid-column: 3;
    -ms-grid-row: 1
}
html[dir=rtl] .dashboardTitleLabel
{
    -ms-grid-column: 5
}
@media screen and (max-width: 825px)
{
    .win8v1 .dashboardTitleLabel
    {
        visibility: hidden
    }
}
.dashboardContent>.leftSpacer
{
    width: 40px;
    height: 100%
}
.dashboardContent>.leftOfHome
{
    display: -ms-flexbox;
    -ms-flex-direction: row-reverse;
    -ms-flex-pack: start;
    width: 4000px;
    height: 100%
}
.avatarsDisabled .dashboardContent>.leftOfHome
{
    width: 3745px
}
.dashboardContent>.homeAndToTheRight
{
    display: -ms-flexbox;
    -ms-flex-direction: row;
    min-width: calc(100vw - 120px);
    height: 100%
}
.dashboardContent>div
{
    flex-shrink: 0
}
.dashboardContent>.rightSpacer
{
    width: 80px;
    height: 100%
}
.dashboardPanel
{
    display: -ms-grid;
    -ms-grid-rows: 51px 1fr;
    -ms-grid-columns: 80px auto;
    width: auto
}
.pivotDashboard .dashboardPanel
{
    width: 100vw
}
.dashboardPanel>.panelTitle
{
    -ms-grid-row: 1;
    -ms-grid-column: 2
}
.dashboardPanel>.panelContainer, .dashboardPanel>.panelLoading, .dashboardPanel>.panelFailed
{
    -ms-grid-row: 2;
    -ms-grid-column: 2;
    position: relative
}
.dashboardPanel>.panelLoading
{
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr
}
.dashboardPanel>.panelLoading>.win-ring
{
    -ms-grid-column-align: center;
    -ms-grid-row-align: center
}
.dashboardPanel>.panelLoading, .dashboardPanel>.panelFailed
{
    height: 505px
}
@media screen and (min-height: 1080px)
{
    .dashboardPanel>.panelLoading, .dashboardPanel>.panelFailed
    {
        height: 675px
    }
}
.hubStripScroller
{
    overflow-x: auto;
    overflow-y: hidden;
    white-space: nowrap;
    height: 100%;
    opacity: 0
}
.galleryPageHost .hubStripScroller
{
    opacity: 1
}
.galleryHubStrip
{
    height: 100%
}
.hub
{
    position: relative;
    display: inline-block;
    white-space: nowrap;
    height: 100%;
    vertical-align: top
}
.mainHubStrip>.win-template, .hubControl, .hubControl>.win-template, .mainHubStripHub, .mainHubStripHub>.win-template, .panel, .panel>.win-template, .panelFragmentContainer>.win-template
{
    height: 100%
}
.pageHub
{
    margin-top: 10px
}
.pageNavigation
{
    margin-top: 30px
}
.panelFragmentContainer
{
    height: 100%
}
.dashboardPanel.failed
{
    position: relative
}
.dashboardPanel.failed>.panelFailed
{
    position: absolute;
    top: 55px
}
.failedPanelContainer
{
    width: 100%;
    height: 100%
}
.failedPanelTextContainer, .noContentTextContainer
{
    position: absolute;
    bottom: 0;
    margin: 48px 48px
}
.overlayAnchor .failedPanelTextContainer
{
    bottom: auto
}
.offline .failedPanelTextContainer
{
    margin: 20px 25px
}
.failedPanelTitle
{
    margin-bottom: 8px;
    padding-bottom: 2px
}
.offline.dashboardHost .dashboardPanel.failed:not(.homeSpotlight)
{
    display: none
}
.popOverContainer .failedPanelContainer .failedPanelTextContainer
{
    margin-left: 30px;
    margin-right: 30px;
    margin-bottom: 25px
}
.galleryHubStrip .failedPanelTextContainer, .galleryHubStrip .noContentTextContainer
{
    margin: 45px 40px
}
.panel
{
    position: relative;
    vertical-align: top;
    display: inline-block
}
.panelTitle .internalActionLink
{
    margin: 2px -8px 0 -8px
}
.loadingControlHidden
{
    visibility: hidden
}
progress:-ms-square
{
    background-repeat: no-repeat;
    background-color: transparent
}
progress.ringLoadingControl:indeterminate::-ms-fill {
    animation-name: -ms-ring
}
.horizontalFlow
{
    display: inline-block;
    vertical-align: top
}
.verticalFlow
{
    display: block
}
.listFlowLeft
{
    float: left
}
.panelActionLinkContainer
{
    width: 115px;
    height: 115px;
    position: relative;
    bottom: 0;
    margin-right: 5px
}
.panelActionLinkLabel
{
    width: auto;
    position: absolute;
    bottom: 0;
    text-align: left;
    margin-bottom: 10px
}
.panelActionLinkContainer .panelActionLinkLabel
{
    white-space: normal
}
.panelActionLink
{
    text-align: left;
    vertical-align: middle
}
.actionLinkContainer
{
    display: -ms-flexbox;
    -ms-flex-align: start;
    -ms-flex-direction: row
}
.actionLinkContainer .icon
{
    margin-bottom: 4px
}
.achievements .actionLinkContainer .icon
{
    margin-top: -8px
}
.actionLinkContainer .icon:after
{
    content: ''
}
html[dir=rtl] .actionLinkContainer .icon:after
{
    content: ''
}
.panelHeaderLink .actionLinkContainer .icon
{
    transform: translateX(8px)
}
html[dir=rtl] .panelHeaderLink .actionLinkContainer .icon
{
    transform: translateX(-8px)
}
.closeLink .actionLinkContainer .icon:after, html[dir=rtl] .closeLink .actionLinkContainer .icon:after
{
    content: '✕'
}
.panelModifierContainer
{
    display: -ms-grid;
    -ms-grid-columns: auto 40px auto 40px auto 1fr auto 80px;
    -ms-grid-rows: 100%
}
.secondaryPanelModifier
{}
.tertiaryPanelModifier
{}
.galleryHubStrip .secondaryPanelModifier, .galleryHubStrip .tertiaryPanelModifier
{
    text-align: right
}
.galleryHubStrip .tertiaryPanelModifier
{
    width: 120px
}
.primaryPanelModifier
{
    position: relative
}
.primaryPanelModifier.disabled
{
    opacity: .4
}
.pivotModifier
{
    display: inline-block
}
.loadingProgress
{
    width: 100%;
    height: 100%
}
.snappedMode
{
    position: absolute;
    width: 100%;
    height: 100%
}
.panelFragmentLoading, .panelFragmentFailed
{
    position: absolute;
    top: 4px;
    width: 100%
}
.panelFragmentLoading, .panelFragmentFailed, .achievementsGallery .emptyGalleryContainer
{
    height: 505px
}
@media screen and (min-height: 1080px)
{
    .panelFragmentLoading, .panelFragmentFailed, .achievementsGallery .emptyGalleryContainer
    {
        height: 675px
    }
}
.popOverContentContainer .panelFragmentLoading
{
    position: absolute;
    width: 100%;
    height: 530px
}
html[dir=ltr] .panelFragmentLoading, html[dir=ltr] .panelFragmentFailed
{
    left: 0
}
html[dir=rtl] .panelFragmentLoading, html[dir=rtl] .panelFragmentFailed
{
    right: 0
}
.popOverContainer .panelFragmentLoading
{
    top: 0;
    height: 100%
}
.panelFragmentWrapper
{
    position: relative;
    width: 100%;
    height: 100%
}
.panelFragmentWrapper .noShadow
{
    height: 100%
}
.panelFragmentLoadingProgress, .dashboardPanel>.panelLoading>.loadingTextLabel
{
    position: relative;
    width: 200px;
    top: calc(50% - 5pt);
    left: 45%
}
.actionButtonLabel
{
    text-align: center;
    width: 100%
}
html[dir=rtl] .actionButtonLabel
{
    direction: rtl
}
.removeOverlayWaitCursor {
    position: absolute;
    top: calc(50% - 30px);
    left: calc(50% - 30px)
}
.win-flyout
{
    position: fixed;
    padding: 25px 20px 20px 20px;
    min-width: 200px;
    max-width: 320px;
    line-height: 20px;
    text-align: left;
    max-width: 80vw;
    min-height: 68px
}
html[dir=rtl] .win-flyout
{
    text-align: right
}
.win-flyout.actionListFlyout
{
    padding: 5px 0 7px 0;
    line-height: 33px;
    max-height: calc(100vh - 133px);
    max-width: 300px;
    overflow-y: auto;
    overflow-x: hidden;
    margin-bottom: 13px
}
.win-flyout hr
{
    display: block;
    margin: 4px 0 8px 0;
    height: 1px;
    width: 180px;
    border: 0
}
.win-flyout button, .win-flyout input[type="button"]
{
    margin-left: 20px;
    float: right
}
.bottomAppBar, .bottomAppBar div, .bottomAppBar button
{
    z-index: 1002
}
.actionListFlyout button, .actionListFlyout input[type="button"]
{
    display: block;
    border: none;
    padding: 0 16px 0 16px;
    margin-left: 2px;
    margin-right: 2px;
    line-height: 50px;
    float: none;
    text-align: left;
    width: calc(100% - 4px)
}
html[dir=rtl] .actionListFlyout button, html[dir=rtl] .actionListFlyout input[type="button"]
{
    text-align: right
}
.actionListFlyout hr
{
    padding: 0;
    margin: 8px 16px
}
.actionListFlexBox
{
    display: -ms-flexbox;
    -ms-flex-direction: column;
    -ms-flex-align: start;
    -ms-flex-pack: justify;
    -ms-flex-wrap: wrap
}
.appbarActionFlyout .actionListFlexBox
{
    -ms-flex-direction: column-reverse
}
.actionListFlexBox .win-template
{
    width: 100%
}
.win-flyout .actionButtonFlyoutButton, .win-flyout .playbackOptionFlyoutButton
{
    word-wrap: normal
}
.comboSelect
{
    margin: 0 14px 0 14px;
    width: 85%
}
.miniProfilePanelControlsSignedOut, .dashboardHubContent
{
    height: 100%;
    width: auto;
    margin-top: 4px;
    display: -ms-grid;
    -ms-grid-columns: auto auto auto;
    -ms-grid-rows: 220px 215px
}
.dashboardGridItemContent
{
    position: relative;
    width: 100%;
    height: 100%;
    margin-right: 0
}
.dashboardSmallGridItemSquare .thumbnailButton
{
    height: 215px;
    width: 215px
}
.dashboardSmallGridItemSquare .imageHolder img
{
    min-width: 287px
}
.flexibleItemsControlContainer .dashboardSmallGridItemSquare .imageHolder img
{
    min-width: 0
}
.spotlightContent
{
    display: -ms-grid;
    -ms-grid-columns: auto 885px;
    -ms-grid-rows: 1fr
}
.noContentPane
{
    position: relative;
    top: 0;
    left: 0;
    margin-top: 4px;
    border-width: 0;
    border-style: solid;
    text-align: left;
    width: inherit;
    height: inherit
}
html[dir=rtl] .noContentPane
{
    text-align: right
}
.noContentPane.removeFromDisplay
{
    display: none
}
.noGamesContentPane
{
    width: 675px;
    height: 505px
}
@media screen and (min-height: 900px)
{
    .noGamesContentPane
    {
        width: 675px;
        height: 675px
    }
}
.failedPanelContainer .failedPanelTitle, .noContentPane .noContentPaneTitle
{
    margin-bottom: 30px
}
.offline .failedPanelContainer .failedPanelTitle, .popOverContainer .failedPanelContainer .failedPanelTitle
{
    margin-bottom: 8px
}
.settingsFeedbackContentDialog
{
    left: 0
}
.settingsFeedbackOptions
{
    margin-top: 20px;
    margin-bottom: 13px
}
.settingsFeedbackOptionsDialog
{
    left: 0
}
.feedbackRadioButton
{
    width: 17px;
    height: 17px;
    margin-top: 20px;
    margin-bottom: 8px
}
.settingsFeedbackSelect
{
    width: 100%;
    height: auto
}
.settingsFeedbackOptionLabel
{
    display: inline;
    position: relative;
    white-space: normal;
    top: 4px
}
.settingsFeedbackCommentBox .editMultiline
{
    width: 500px
}
.settingsFeedbackCommentBoxDialog
{
    left: 0
}
.settingsFeedbackBottom
{
    top: 20px;
    left: 0
}
.feedbackButtons
{
    margin-top: 20px;
    height: auto;
    display: -ms-flexbox;
    -ms-flex-pack: end
}
.feedbackButtons .dialogButton
{
    margin: 5px
}
.feedbackConnectionError
{
    margin-top: 10px
}
button.iconButton.win-command
{
    padding: 0;
    margin: 0;
    width: 100%;
    display: -ms-grid;
    -ms-grid-columns: 35px 1fr;
    -ms-grid-rows: 5px 1fr 5px
}
button.iconButton.win-command.hideAdorner
{
    overflow: visible
}
.inPlaceDetailsItemActions button.iconButton.win-command
{
    padding-top: 0;
    max-height: none
}
button.iconButton.win-command:focus, button.iconButton.win-command:not(:disabled):active
{
    opacity: 1
}
button.iconButton.win-command:hover
{
    opacity: .9
}
.iconButton .win-commandicon
{
    width: 30px;
    height: 30px;
    margin: 0;
    padding: 0;
    -ms-grid-column: 1;
    -ms-grid-column-align: start;
    -ms-grid-row: 2;
    -ms-grid-row-align: center
}
button.iconButton.hideAdorner .win-commandicon
{
    overflow: visible
}
html[dir=rtl] .popOver .verticalBox button.iconButton .win-commandicon, .nowPlayingTransportControlsPlayPauseButton .iconButton .win-commandicon
{
    -ms-grid-column-align: center
}
.iconButton .win-commandimage
{
    width: 30px;
    height: 30px;
    background-size: 120px 60px
}
button.iconButton:hover .win-commandimage, button.iconButton:active .win-commandimage
{
    background-position: -30px 0
}
button.iconButton:hover:active .win-commandimage
{
    background-position: -60px 0
}
button.iconButton:disabled .win-commandimage, button.iconButton:disabled:active .win-commandimage
{
    background-position: -90px 0
}
button.iconButton[aria-selected=true] .win-commandimage {
    background-position: 0 -30px
}
button.iconButton[aria-selected=true]:hover .win-commandimage, button.iconButton[aria-selected=true]:active .win-commandimage {
    background-position: -30px -30px
}
button.iconButton[aria-selected=true]:hover:active .win-commandimage {
    background-position: -60px -30px
}
button.iconButton[aria-selected=true]:disabled .win-commandimage, button.iconButton[aria-selected=true]:disabled:active .win-commandimage {
    background-position: -90px -30px
}
button.iconButton.win-command .win-label
{
    position: inherit;
    margin-top: 0;
    margin-bottom: 0;
    line-height: normal;
    max-width: none;
    max-height: none;
    padding: 2px 4px;
    width: calc(100% - 8px);
    white-space: normal;
    text-align: left;
    -ms-grid-column: 2;
    -ms-grid-column-align: start;
    -ms-grid-row: 1;
    -ms-grid-row-align: center;
    -ms-grid-row-span: 3
}
html[dir=rtl] button:not(.appBarIconButton).iconButton.win-command .win-label
{
    text-align: right
}
.headingRow button.iconButton.win-command .win-label
{
    max-height: 109px
}
.iconButtonTwoLine .iconButton.win-command
{
    -ms-grid-columns: 53px 1fr;
    -ms-grid-rows: 1fr auto;
    max-height: none;
    min-height: 62px;
    height: auto;
    margin-bottom: 10px
}
.iconButtonTwoLine .iconButton .win-commandicon
{
    margin: 0;
    width: 40px;
    height: 40px;
    -ms-grid-column-align: start;
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    -ms-grid-row-align: center
}
.iconButtonTwoLine .iconButton .win-commandimage
{
    width: 40px;
    height: 40px
}
.iconButtonTwoLine .iconButton.win-command .textContainer
{
    display: block;
    -ms-grid-column: 2
}
.iconButtonTwoLine .iconButton.win-command .win-label
{
    max-height: none;
    -ms-grid-row: 1;
    -ms-grid-row-align: center;
    -ms-grid-row-span: 1;
    line-height: normal;
    margin-bottom: 4px
}
.iconButtonTwoLine .iconButton.win-command .win-label.subtitle
{
    max-height: none;
    -ms-grid-row: 2;
    -ms-grid-row-align: start;
    -ms-grid-row-span: 1;
    line-height: normal;
    margin-top: -4px
}
.iconButtonTwoLine .iconButton.win-command .win-label.subtitle.removeFromDisplay
{
    display: none
}
.iconButtonWithSubtext .textContainer
{
    display: -ms-grid;
    -ms-grid-rows: auto auto;
    -ms-grid-row: 2;
    -ms-grid-column: 2;
    -ms-grid-row-align: center
}
.iconButtonWithSubtext .iconButton.win-command .win-label
{
    max-height: none;
    -ms-grid-row: 1;
    -ms-grid-row-span: 1;
    line-height: normal
}
.iconButtonWithSubtext .iconButton.win-command .win-label.subtitle
{
    max-height: none;
    -ms-grid-row: 2;
    -ms-grid-row-span: 1;
    margin-top: -4px
}
.iconButtonWithSubtext .iconButton.win-command .win-label.subtitle.removeFromDisplay, .immersiveTwoColumn .viewMoreRow.removeFromDisplay
{
    display: none
}
.inPlaceDetailsItemActions button.iconButton.win-command
{
    -ms-grid-columns: 1fr 30px 1fr;
    -ms-grid-rows: 30px 1fr;
    margin-left: 0;
    margin-right: 20px;
    width: 100%
}
html[dir=rtl] .inPlaceDetailsItemActions button.iconButton.win-command
{
    margin-left: 20px;
    margin-right: 0
}
.inPlaceDetailsItemActions button:disabled, .inPlaceDetailsItemActions .iconButton .win-commandicon
{
    -ms-grid-column: 2;
    -ms-grid-column-align: center;
    -ms-grid-row: 1
}
.popover .inPlaceDetailsItemActions button:disabled, .popOver .inPlaceDetailsItemActions .iconButton .win-commandicon, .games .inPlaceDetailsItemActions button:disabled, .games .inPlaceDetailsItemActions .iconButton .win-commandicon
{
    -ms-grid-row-align: start;
    margin: 3px 0 0 0
}
html[dir=rtl] .inPlaceDetailsItemActions button.iconButton.win-command .win-label, .inPlaceDetailsItemActions button.iconButton.win-command .win-label
{
    -ms-grid-column: 1;
    text-align: center;
    -ms-grid-row: 2;
    -ms-grid-column-span: 3;
    -ms-grid-column-align: center;
    -ms-grid-row-align: center;
    padding: 5px;
    line-height: normal;
    max-height: 32px;
    max-width: 110px;
    min-width: 80px;
    white-space: normal;
    word-wrap: normal;
    word-break: normal
}
.win-appbar button.appBarIconButton
{
    width: 100px;
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: auto 1fr;
    margin-top: -2px
}
@media(min-width: 320px) and (max-width: 499px)
{
    .win-appbar button.appBarIconButton
    {
        width: 80px
    }
}
.win-appbar button.appBarIconButton, .win-appbar button.appBarIconButton:hover, .win-appbar button.appBarIconButton:hover:active, .win-appbar button.appBarIconButton:active, .win-appbar button.appBarIconButton.acc-keyboardFocusTarget, .win-appbar button.appBarIconButton.acc-keyboardFocusTarget:hover, .win-appbar button.appBarIconButton.acc-keyboardFocusTarget:hover:active, .win-appbar button.appBarIconButton.acc-keyboardFocusTarget:active, .win-appbar button.appBarIconButton:disabled, .win-appbar button.appBarIconButton:disabled:hover, .win-appbar button.appBarIconButton:disabled:hover:active, .win-appbar button.appBarIconButton:disabled:active, .win-appbar button.appBarIconButton.acc-keyboardFocusTarget:disabled, .win-appbar button.appBarIconButton.acc-keyboardFocusTarget:disabled:hover, .win-appbar button.appBarIconButton.acc-keyboardFocusTarget:disabled:hover:active, .win-appbar button.appBarIconButton.acc-keyboardFocusTarget:disabled:active
{
    border-style: solid;
    border-width: 2px;
    border-color: transparent
}
.win-appbar .appBarIconButton .win-commandicon
{
    margin: 0 8px;
    width: 40px;
    height: 40px;
    -ms-grid-column-align: center
}
.win-appbar .appBarIconButton .win-commandimage
{
    width: 40px;
    height: 40px
}
.win-appbar button.appBarIconButton.win-command .appBarIconLabel
{
    display: block;
    padding-left: 0;
    -ms-grid-row: 2;
    padding-right: 0;
    -ms-grid-column-align: center;
    margin-top: 1px;
    white-space: normal;
    word-wrap: break-word;
    word-break: normal;
    max-height: 50px
}
html[dir=rtl] .win-appbar button.appBarIconButton.win-command .appBarIconLabel
{
    direction: rtl
}
.actionTile button.iconButton.win-command
{
    padding: 0;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 36px 66px 8px 1fr;
    width: 295px;
    height: 165px;
    max-height: 165px
}
.actionTile button:disabled, .actionTile .iconButton .win-commandicon
{
    width: 66px;
    height: 66px;
    -ms-grid-row: 2;
    -ms-grid-column-align: center;
    border-width: 4px
}
.actionTile .iconButton .win-commandimage
{
    position: relative;
    vertical-align: middle;
    text-align: center;
    margin: -2px;
    width: 66px;
    height: 66px;
    margin: -4px;
    background-size: 264px 132px;
    letter-spacing: 0
}
.actionTile button.iconButton:hover .win-commandimage, button:active .win-commandimage {
    background-position: -66px 0
}
.actionTile button.iconButton:hover:active .win-commandimage {
    background-position: -132px 0
}
.actionTile button.iconButton:disabled .win-commandimage, .actionTile button.iconButton:disabled:active .win-commandimage {
    background-position: -198px 0
}
.actionTile button.iconButton[aria-selected=true] .win-commandimage {
    background-position: 0 -66px
}
.actionTile button.iconButton[aria-selected=true]:hover .win-commandimage, .actionTile button.iconButton[aria-selected=true]:active .win-commandimage {
    background-position: -66px -66px
}
.actionTile button.iconButton[aria-selected=true]:hover:active .win-commandimage {
    background-position: -132px -66px
}
.actionTile button.iconButton[aria-selected=true]:disabled .win-commandimage, .actionTile button.iconButton[aria-selected=true]:disabled:active .win-commandimage {
    background-position: -198px -66px
}
html[dir=rtl] .actionTile button.iconButton.win-command .win-label, .actionTile button.iconButton.win-command .win-label
{
    -ms-grid-column: 1;
    text-align: center;
    -ms-grid-row: 4;
    -ms-grid-column-align: center;
    -ms-grid-row-align: center;
    max-height: 48px;
    margin-bottom: 20px
}
button.playPauseIconButton.win-command
{
    width: 131px;
    height: 131px;
    -ms-grid-columns: 1fr;
    padding: 0
}
button:active.playPauseIconButton .win-commandicon, button:hover.playPauseIconButton .win-commandicon, button:disabled.playPauseIconButton .win-commandicon, .playPauseIconButton .win-commandicon, .playPauseIconButton:hover .win-commandicon
{
    width: 131px;
    height: 131px;
    border-width: 10px;
    margin: 0
}
@media screen and (max-width: 900px)
{
    button.playPauseIconButton.win-command
    {
        width: 55px;
        height: 55px
    }
    button:active.playPauseIconButton .win-commandicon, button:hover.playPauseIconButton .win-commandicon, button:disabled.playPauseIconButton .win-commandicon, .playPauseIconButton .win-commandicon, .playPauseIconButton:hover .win-commandicon
    {
        width: 55px;
        height: 55px;
        border-width: 5px;
        margin: 0
    }
}
html[dir=ltr] .games .nowPlayingTransportControlsContainer .win-commandimage
{
    margin-left: -53px
}
html[dir=rtl] .games .nowPlayingTransportControlsContainer .win-commandimage
{
    margin-right: -53px
}
@media screen and (max-width: 900px)
{
    html[dir=ltr] .games .nowPlayingTransportControlsContainer .win-commandimage
    {
        margin-left: -17px
    }
    html[dir=rtl] .games .nowPlayingTransportControlsContainer .win-commandimage
    {
        margin-right: -17px
    }
}
button.prevNextIconButton.win-command
{
    width: 65px;
    height: 65px;
    -ms-grid-columns: 1fr;
    padding: 0
}
button:active.prevNextIconButton .win-commandicon, button:hover.prevNextIconButton .win-commandicon, button:active:hover.prevNextIconButton .win-commandicon, button:disabled.prevNextIconButton .win-commandicon, .prevNextIconButton .win-commandicon
{
    width: 65px;
    height: 65px;
    border: none;
    margin: 0
}
.nowPlayingContainer .nowPlayingTransportControlsSkipButton button:active .win-commandicon, .nowPlayingContainer .nowPlayingTransportControlsSkipButton button:hover .win-commandicon, .nowPlayingContainer .nowPlayingTransportControlsSkipButton button:active:hover .win-commandicon
{
    border: none
}
.prevNextIconButton .win-commandimage
{
    position: relative;
    vertical-align: middle;
    text-align: center;
    width: 65px;
    height: 65px;
    background-size: 260px 130px;
    letter-spacing: 0
}
.musicOverlay .playPauseIconButton button.win-command, .musicOverlay .prevNextIconButton button.win-command, .musicOverlay .volumeIconButton button.win-command
{
    width: 40px;
    height: 40px;
    min-width: 40px
}
.musicOverlay .playPauseIconButton .win-commandicon, .musicOverlay .playPauseIconButton:hover .win-commandicon, .musicOverlay .prevNextIconButton .win-commandicon, .musicOverlay .prevNextIconButton:active:hover .win-commandicon, .musicOverlay .volumeIconButton .win-commandicon, .musicOverlay .volumeIconButton:active:hover .win-commandicon
{
    width: 40px;
    height: 40px;
    border-style: solid;
    border-width: 2px
}
.musicOverlay .playPauseIconButton .win-commandimage, .musicOverlay .prevNextIconButton .win-commandimage, .musicOverlay .volumeIconButton .win-commandimage
{
    width: 40px;
    height: 40px
}
.musicOverlay .nowPlayingTransportControlsNext .win-commandimage, .musicOverlay .nowPlayingTransportControlsPrevious .win-commandimage, .musicOverlay .nowPlayingTransportControlsVolume .win-commandimage
{
    margin-right: 0;
    margin-left: 0
}
.win-commandicon.win-commandring
{
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr
}
.win-commandimage
{
    -ms-grid-column-align: center;
    -ms-grid-row-align: center
}
button.iconButton .win-commandimage.iconSpan, button.iconButton:not(:disabled):active:hover .win-commandimage.iconSpanPressed, button.iconButton .win-commandimage.modifier
{
    opacity: 1
}
button.appBarIconButton .win-commandimage.iconSpanPressed, button.iconButton:not(:disabled):active:hover .win-commandimage.iconSpan, button.iconButton .win-commandimage.iconSpanPressed, button.iconButton:not(:disabled):active:hover .win-commandimage.modifier
{
    opacity: 0
}
button.iconButton.toggleButton:not(:disabled):active:hover .win-commandimage.toggleIndicator, button.appBarIconButton.toggleButton:not(:disabled):active:hover .win-commandimage.toggleIndicator
{
    opacity: 0
}
.inlineCaretButton
{
    display: -ms-grid;
    -ms-grid-columns: auto auto;
    border: none;
    margin: 0;
    padding: 0
}
.inlineCaretButton:focus
{
    outline: 0
}
.notificationContent .inlineCaretButtonText
{
    -ms-grid-column: 1
}
.notificationContent .inlineCaretButtonIcon
{
    -ms-grid-column: 2
}
.immersiveTwoColumn .inlineCaretButton.related, .immersiveTwoColumn .inlineCaretButton.seasons
{
    -ms-grid-columns: auto auto;
    -ms-grid-rows: 1fr
}
.inlineCaretButton:hover
{
    opacity: .8
}
.inlineCaretButton:active, .inlineCaretButton:active:hover
{
    opacity: .4
}
.inlineCaretButtonText
{
    margin-right: 2px
}
html[dir=rtl] .inlineCaretButtonText
{
    margin-right: 0;
    margin-left: 2px
}
.inlineCaretButtonIcon
{
    margin-top: 2px
}
html[dir=rtl] .inlineCaretButtonIcon
{
    transform: scaleX(-1)
}
.emptyGalleryContainer
{
    position: absolute;
    top: 20px;
    right: 50px;
    bottom: 50px;
    left: 0
}
html[dir=rtl] .emptyGalleryContainer
{
    right: 0;
    left: 50px
}
.emptyGalleryPanel
{
    position: relative;
    width: calc(100vw - 200px);
    height: calc(100% - 153px);
    margin-left: 120px;
    margin-right: 80px
}
html[dir=rtl] .emptyGalleryPanel
{
    margin-left: 80px;
    margin-right: 120px
}
.emptyGalleryContainerNoMargins
{
    top: 0;
    left: 0;
    bottom: 0
}
.signIn
{
    display: -ms-grid;
    -ms-grid-columns: auto auto;
    -ms-grid-rows: auto auto;
    margin: 0;
    padding: 0;
    border: 0 solid;
    background-color: transparent
}
.signInError, .signInRetry, .signInProgress, .signInComplete
{
    margin: 0 10px 0 0;
    text-align: right;
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    -ms-grid-row-align: center
}
.settingsSignIn .signInError, .settingsSignIn .signInRetry, .settingsSignIn .signInProgress, .settingsSignIn .signInComplete
{
    text-align: left
}
.signInRetry
{
    -ms-grid-row: 2
}
.signInProgress, .signInComplete
{
    -ms-grid-row-span: 2
}
.signInRetryRing, .signInRetrySpinner
{
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    -ms-grid-row-span: 2;
    -ms-grid-row-align: center
}
.searchBox
{
    -ms-grid-row: 4;
    -ms-grid-column: 3;
    margin: 21px 35px 0 10px
}
.win-searchbox
{
    height: 36px;
    width: 336px
}
.win-searchbox input
{
    height: 36px
}
.win-searchbox-button
{
    width: 36px;
    height: 36px
}
.appNotifications
{
    display: -ms-grid;
    -ms-grid-column: 2;
    -ms-grid-row: 2;
    -ms-grid-column-span: 2;
    -ms-grid-columns: 10px 1fr auto 10px;
    -ms-grid-rows: auto auto;
    width: 100%;
    -ms-grid-column-align: end
}
.appCriticalNotification
{
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    -ms-grid-column-align: end
}
.appInfoNotification
{
    -ms-grid-column: 3;
    -ms-grid-row: 1;
    -ms-grid-column-align: start
}
.criticalNotificationSecActions
{
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    margin-top: 10px;
    margin-left: 10px;
    margin-right: 10px
}
.criticalNotificationSecAction, .criticalNotificationSecAction:hover
{
    height: 30px;
    text-align: center;
    border: 2px solid;
    padding-bottom: 2px
}
.criticalNotificationContainer .win-item .win-template
{
    -ms-flex-pack: end
}
.criticalNotificationContainer, .infoNotificationContainer
{
    width: 370px;
    height: 130px;
    margin-right: 10px
}
.criticalNotificationContainer .win-item .win-template .criticalNotificationItem, .infoNotificationContainer .win-item .win-template
{
    height: 100%;
    display: -ms-grid;
    -ms-grid-columns: 100%;
    -ms-grid-rows: auto;
    margin-top: 40px
}
.notificationContent
{
    height: 100%;
    -ms-grid-column-align: end;
    display: -ms-grid;
    -ms-grid-columns: auto 6px auto;
    -ms-grid-rows: 100%;
    padding: 0 16px;
    border: none
}
.infoNotificationTitle, .infoNotificationSubTitle
{
    max-width: 260px;
    white-space: normal
}
.infoNotificationTitle
{
    max-height: 40px
}
.infoNotificationSubTitle
{
    margin-top: 2px;
    max-height: 34px
}
.notificationContent .textContainer
{
    display: -ms-flexbox;
    -ms-grid-column: 3;
    -ms-flex-direction: column;
    -ms-flex-align: start;
    -ms-grid-row-align: center;
    margin-top: -5px
}
.infoNotificationIcon
{
    width: 35px;
    -ms-grid-column: 1;
    -ms-grid-column-align: end;
    -ms-grid-row: 1;
    -ms-grid-row-align: start
}
.appCriticalNotification .win-flipview .win-navbutton, .appInfoNotification .win-flipview .win-navbutton
{
    width: 40px;
    height: 54px;
    top: 29px;
    left: auto;
    right: 0
}
.infoNotificationContainer .win-navleft, .criticalNotificationContainer .win-navleft
{
    display: none;
    width: 0;
    height: 0
}
.contentNotificationListItemWrapper
{
    display: -ms-grid;
    -ms-grid-columns: auto 1fr;
    -ms-grid-rows: 100%;
    width: 100%
}
.contentNotificationListImagesWrapper
{
    display: -ms-grid;
    -ms-grid-rows: auto 55px;
    width: 100%
}
.contentNotificationListImagesWrapper:last-of-type
{
    margin-bottom: 24px
}
.contentNotificationListIcon
{
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    margin-top: 1px;
    margin-right: 5px;
    margin-bottom: 5px
}
.contentNotificationListItemDescription
{
    -ms-grid-column: 2;
    -ms-grid-row: 1
}
.contentNotificationListItemDescriptionNoIcon
{
    -ms-grid-column: 1;
    -ms-grid-row: 1
}
.contentNotificationImage
{
    height: 45px;
    float: left
}
html[dir=rtl] .contentNotificationImage
{
    margin: 5px -2px 3px 0;
    float: right
}
.inlineDetailsOverviewActionBlock .externalLinkBackground, .inPlaceDetailsItemActions .externalLinkBackground
{
    padding-left: 35px
}
.horizontalPivotItem, .verticalPivotItem
{
    width: 100%;
    display: -ms-grid;
    -ms-grid-columns: 1fr 5px 30px;
    -ms-grid-rows: auto
}
.verticalSubPivotItem
{
    margin: 0
}
.horizontalPivotButton, .verticalPivotButton
{
    text-overflow: ellipsis;
    border: 0 solid;
    padding: 0;
    outline-style: none;
    outline-width: 0;
    min-height: 50px;
    text-align: left
}
html[dir=rtl] .horizontalPivotButton, html[dir=rtl] .verticalPivotButton
{
    text-align: right
}
[data-win-control="MS.Entertainment.UI.Controls.FlexibleItemsControl"]
{
    display: -ms-flexbox;
    overflow: visible;
    -ms-flex-align: start;
    -ms-flex-pack: start;
    -ms-flex-direction: column;
    -ms-flex-wrap: wrap
}
.flexRowLayout[data-win-control="MS.Entertainment.UI.Controls.FlexibleItemsControl"], .games .homeSpotlight [data-win-control="MS.Entertainment.UI.Controls.FlexibleItemsControl"]
{
    -ms-flex-direction: row
}
.dashboard .flexibleItemsControlItemContainer, .dashboardPanel .flexibleItemsControlItemContainer
{
    margin-top: 0;
    margin-bottom: 5px;
    margin-right: 5px;
    margin-left: 0;
    position: relative
}
.games .homeSpotlight .flexibleItemsControlItemContainer
{
    -ms-flex-preferred-size: 293px
}
.control-actionButtons, .control-actionButtons.state-orientationHorizontal, .horizontalBox
{
    display: -ms-flexbox;
    -ms-flex-direction: row
}
.control-actionButtons.state-orientationHorizontal
{
    -ms-flex-wrap: wrap
}
.control-actionButtons.state-orientationVertical, .verticalBox, .actionButtonsListControl
{
    display: -ms-flexbox;
    -ms-flex-direction: column
}
.popOverContainer
{
    height: auto;
    display: -ms-grid;
    -ms-grid-columns: 255px 1fr
}
.overlayAnchor
{
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0
}
@media(min-width: 320px) and (max-width: 499px)
{
    .overlayAnchor
    {
        display: none
    }
}
[data-win-control="MS.Entertainment.UI.Controls.ImmersiveLayout"]
{
    height: 100%;
    display: -ms-flexbox;
    -ms-flex-direction: row;
    -ms-flex-align: stretch;
    -ms-flex-direction: row;
    -ms-flex-pack: start;
    -ms-flex-wrap: nowrap;
    -ms-scroll-snap-type: proximity
}
.immersiveViewMoreOneColumn .immersiveViewMorePopOverContentLayout, .immersiveOneColumn
{
    width: 350px
}
.immersiveViewMoreTwoColumn .immersiveViewMorePopOverContentLayout, .immersiveTwoColumn
{
    width: 800px
}
.immersiveThreeColumn .immersiveFrame
{
    width: 1200px
}
.immersiveFrame
{
    display: -ms-grid;
    -ms-grid-columns: 25px 1fr 25px;
    -ms-grid-rows: auto 1fr 78px;
    height: 100%
}
@media screen and (min-height: 1080px)
{
    .immersiveFrame
    {
        -ms-grid-rows: auto 1fr 98px
    }
}
.immersiveFrame>.headingRow, .immersiveViewMorePopOverContentLayout>.headingRow
{
    width: 100%;
    height: 104px;
    -ms-grid-column: 2;
    -ms-grid-row: 1;
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr 12px;
    margin-bottom: 15px
}
.immersiveFrame>.headingRow
{
    position: relative;
    border-bottom-width: 1px;
    border-bottom-style: solid
}
.immersiveViewMorePopOverContentLayout>.headingRow
{
    -ms-grid-columns: 1fr 10px auto
}
@media screen and (min-height: 1080px)
{
    .immersiveFrame>.headingRow, .immersiveViewMorePopOverContentLayout>.headingRow
    {
        height: 114px
    }
}
@media screen and (min-height: 1200px)
{
    .immersiveFrame>.headingRow, .immersiveViewMorePopOverContentLayout>.headingRow
    {
        height: 134px
    }
}
@media screen and (min-height: 1440px)
{
    .immersiveFrame>.headingRow, .immersiveViewMorePopOverContentLayout>.headingRow
    {
        height: 194px
    }
}
.immersiveFrame>.headingRow>div .iconButton
{
    -ms-grid-columns: 0 1fr;
    -ms-grid-rows: 0 1fr 0
}
.immersiveFrame>.headingRow>p, .immersiveFrame>.headingRow>div
{
    margin: 0;
    padding: 0;
    -ms-grid-row: 1;
    -ms-grid-row-align: end;
    margin-bottom: -13px;
    white-space: normal
}
.immersiveFrame>.headingRow>.headingLink
{
    margin-left: -8px;
    margin-right: -8px
}
.immersiveFrame .headingRow .internalActionLink
{
    width: 100%
}
html[dir=ltr] .immersiveFrame .headingRow .internalActionLink .actionLinkLabel
{
    text-align: left
}
html[dir=rtl] .immersiveFrame .headingRow .internalActionLink .actionLinkLabel
{
    text-align: right
}
.immersiveViewMorePopOverContentLayout>.headingRow>.immersiveViewMorePopOverHeading
{
    margin: 0;
    padding: 0;
    -ms-grid-row: 1;
    -ms-grid-column: 1;
    -ms-grid-row-align: end;
    -ms-grid-column-span: 3;
    margin-bottom: -5px
}
.immersiveViewMorePopOverContentLayout .closeButton
{
    -ms-grid-column: 3;
    -ms-grid-column-align: end;
    -ms-grid-row: 1;
    -ms-grid-row-align: start;
    margin-top: 32px;
    margin-right: -7px;
    margin-left: -7px;
    padding: 0
}
.immersiveFrame>.contentRow, .immersiveViewMorePopOverContentLayout>.contentRow
{
    -ms-grid-column: 1;
    -ms-grid-row: 2;
    -ms-grid-column-span: 3;
    overflow: hidden
}
.immersiveViewMorePopOverContentLayout>.contentRow
{
    overflow-x: hidden;
    overflow-y: auto;
    height: calc(100% - 20px)
}
.immersiveColumnPadding
{
    margin-left: 25px;
    margin-right: 25px
}
.immersiveFrame>.viewMoreRow
{
    -ms-grid-column: 1;
    -ms-grid-row: 3;
    -ms-grid-column-span: 2;
    -ms-grid-column-align: start;
    -ms-grid-row-align: end;
    background-color: transparent;
    margin: 0 15px 24px 15px;
    padding: 10px
}
@media screen and (min-height: 1080px)
{
    .immersiveFrame>.viewMoreRow
    {
        margin-bottom: 54px
    }
}
.immersiveTwoColumn:first-of-type
{
    display: -ms-grid;
    -ms-grid-rows: 1fr auto;
    -ms-grid-columns: 50px 1fr 50px
}
html[dir=ltr] .immersiveDetailsContainer>div:nth-child(2)
{
    padding-left: 25px
}
html[dir=rtl] .immersiveDetailsContainer>div:nth-child(2)
{
    padding-right: 25px
}
.immersiveTableOfContentsItemContainer:first-of-type
{
    visibility: collapse
}
.immersiveTableOfContentsItemContainer
{
    min-width: 260px;
    margin-bottom: 12px;
    height: 38px
}
.immersiveTableOfContentsItemContainer button.label
{
    box-sizing: border-box;
    border-style: solid;
    border-width: 2px;
    border-color: transparent
}
.showKeyboardFocus .immersiveTableOfContentsItemContainer button:focus.label
{
    border-style: solid;
    border-width: 2px;
    border-color: #fff
}
.immersiveViewMorePopOverContentLayout
{
    -ms-grid-column: 2
}
.snapped .immersiveViewMorePopOverContentLayout
{
    -ms-grid-column: 1
}
.immersiveViewMorePopOverLayout
{
    display: -ms-grid;
    height: 100%;
    width: 100%;
    -ms-grid-columns: 20px auto 1fr;
    -ms-grid-rows: 38px auto 1fr
}
.snapped .immersiveViewMorePopOverLayout
{
    -ms-grid-columns: 0 auto 1fr
}
@media screen and (min-height: 1080px)
{
    .immersiveViewMorePopOverLayout
    {
        -ms-grid-rows: 40px auto 1fr
    }
}
@media screen and (min-height: 1200px)
{
    .immersiveViewMorePopOverLayout
    {
        -ms-grid-rows: 60px auto 1fr
    }
}
@media screen and (min-height: 1440px)
{
    .immersiveViewMorePopOverLayout
    {
        -ms-grid-rows: 120px auto 1fr
    }
}
.immersiveViewMoreBackground
{
    position: static;
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    -ms-grid-column-span: 3;
    -ms-grid-row-span: 3;
    height: 100%;
    width: 100%
}
.immersiveBackButtonContainer
{
    -ms-grid-column: 2;
    -ms-grid-row: 2
}
.immersiveViewMorePopoverContainer
{
    height: 100%;
    -ms-grid-column: 3;
    -ms-grid-row-span: 3;
    display: -ms-grid;
    -ms-grid-rows: 1fr;
    position: relative
}
.immersiveViewMorePopOverContentLayout
{
    -ms-grid-column: 2;
    display: -ms-grid;
    height: 100%;
    -ms-grid-columns: 25px 1fr 25px;
    -ms-grid-rows: auto 1fr
}
.immersiveTableOfContentsItemContainer .label
{
    font-weight: normal
}
[data-win-control="MS.Entertainment.UI.Controls.ArcProgress"]>svg
{
    width: 100%;
    height: 100%
}
.extendedSplashScreen
{
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    z-index: 1
}
.extendedSplashScreenProgressContainer
{
    text-align: center
}
.extendedSplashScreenImage
{
    position: absolute
}
.extendedSplashScreenTitle
{
    margin-top: 20px
}
.adPlaceholder, .adError
{
    width: 100%;
    height: 100%;
    position: absolute;
    z-index: -1
}
.adPlaceholder
{
    display: -ms-grid;
    -ms-grid-columns: 100%;
    -ms-grid-rows: 100%;
    height: 265px
}
.adPlaceholderText
{
    -ms-grid-column-align: start;
    -ms-grid-row-align: end
}
.dashboardGridItemContent .adError
{
    background-image: url("../images/x8_300x250_ad_error.png")
}
.sidebarAd .adError
{
    background-image: url("../images/x8_300x600_ad_error.png");
    height: 600px
}
.appBarTransportControlsContainer
{
    display: -ms-grid;
    -ms-grid-columns: 1fr auto;
    -ms-grid-column: 2;
    -ms-grid-column-span: 2;
    -ms-grid-row: 4
}
[data-win-control="MS.Entertainment.UI.Controls.ItemControl"]
{
    -ms-touch-action: pan-x
}
[data-win-control="MS.Entertainment.UI.Controls.ItemControl"]>.selectionContainer
{
    position: absolute;
    left: 0;
    top: 0;
    right: 0;
    bottom: 0
}
[data-win-control="MS.Entertainment.UI.Controls.ItemControl"]>.selectionContainer .selectionLayout
{
    -ms-touch-action: pan-x;
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr;
    width: 100%;
    height: 100%;
    border-width: 3px;
    border-style: solid;
    box-sizing: border-box
}
[data-win-control="MS.Entertainment.UI.Controls.ItemControl"]>.selectionContainer .selectionLayout .checkBackground
{
    -ms-touch-action: pan-x;
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    -ms-grid-column-align: end;
    -ms-grid-row-align: start;
    width: 0;
    height: 0;
    border-top-width: 35px;
    border-top-style: solid;
    border-left: 35px solid transparent
}
[data-win-control="MS.Entertainment.UI.Controls.ItemControl"]>.selectionContainer .selectionLayout .checkMark
{
    -ms-touch-action: pan-x;
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    -ms-grid-column-align: end;
    -ms-grid-row-align: start
}
.control-upgradeTileContainer
{
    -ms-grid-columns: 25px 1fr 25px;
    -ms-grid-rows: 25px 1fr 130px 25px 25px;
    display: -ms-grid
}
.control-upgradeTileContainer .part-Image
{
    -ms-grid-column: 2;
    -ms-grid-column-align: center;
    -ms-grid-row: 2;
    -ms-grid-row-align: center
}
.control-upgradeTileContainer .part-bigMessage
{
    -ms-grid-column: 1;
    -ms-grid-column-align: center;
    -ms-grid-column-span: 3;
    -ms-grid-row: 3;
    -ms-grid-row-align: center;
    text-align: center
}
.control-upgradeTileContainer .part-littleMessage
{
    -ms-grid-column: 2;
    -ms-grid-column-align: center;
    -ms-grid-row: 4;
    -ms-grid-row-align: end
}
.part-outOfBandMessagingContainer
{
    position: relative
}
.removeFromDisplay, .dropDownDisabled .dropDownArrowContainer
{
    display: none
}
@media screen and (-ms-high-contrast)
{
    .dashboardGridItemContent .thumbnailButton:after, .immersiveDetails .relatedHeroItemImage .thumbnailButton:after, .flexibleItemsControlItemContainer .cardThumbnailButton:after, .games .achievementPageContainer .achievementGameDetailsThumbnail .imageContainer:after, .immersiveDetails .relatedListView .horizontalListItem .win-focusable:after
    {
        background-color: transparent
    }
    .games .achievementPageContainer .achievementGameDetailsThumbnail .imageContainer:hover, .inlineGlyph, .inlineGlyphSmall, button:not([disabled]).link.panelHeaderLink:hover, button:not([disabled]).link.panelHeaderLink:active, .nowPlayingMetadataShowPlaylistButton:hover, .viewMoreRow:hover
    {
        opacity: 1
    }
}
html:-ms-lang(ta,kn) .hubNavigationContainer
{
    margin: -12px -12px -1px -12px
}
html:-ms-lang(ta) .actionLinkContainer .actionLinkLabel
{
    margin-top: 4px
}
html:-ms-lang(ml,ta) .actionTile button.iconButton.win-command .win-label
{
    max-height: 52px;
    padding-top: 0;
    padding-bottom: 0
}
html:-ms-lang(ml,ta,km) .profileButtons>.itemList>.win-template
{
    -ms-flex-preferred-size: 100%
}
html:-ms-lang(ml,ta) .hubNavigationClippingContainer
{
    overflow-x: auto
}
html:-ms-lang(ta) .hubNavigationTitle
{
    margin-bottom: 6px
}
html:-ms-lang(ta) .editInput
{
    padding-top: 4px
}
html:-ms-lang(ta) .modifierControl .modifierDescription
{
    -ms-grid-row-align: center
}
html:-ms-lang(ml,ta) .infoNotificationContainer, html:-ms-lang(ml,ta) .criticalNotificationContainer
{
    width: 520px
}
html:-ms-lang(ml,ta) .infoNotificationTitle, html:-ms-lang(ml,ta) .criticalNotificationTitle
{
    max-width: 420px
}
html:-ms-lang(ja) .win-appbar button.appBarIconButton.win-command .appBarIconLabel
{
    word-break: keep-all;
    word-wrap: break-word;
    padding-left: 0;
    padding-right: 0
}
html:-ms-lang(ml,ta,ja) .achievementsGallery .achievementByDate
{
    width: 170px
}
html:-ms-lang(en) .inPlaceDetailsItemActions button.iconButton.win-command .win-label
{
    max-width: 80px
}
html:-ms-lang(as,el) .inPlaceDetailsItemActions button.iconButton.win-command .win-label
{
    max-width: 140px
}
html:-ms-lang(ta) .inPlaceDetailsItemActions button.iconButton.win-command .win-label
{
    max-width: 160px
}
html:-ms-lang(ml) .inPlaceDetailsItemActions button.iconButton.win-command .win-label
{
    max-width: 220px
}
html:-ms-lang(ta) .cardThumbnailButton .primaryText, html:-ms-lang(ta) .cardThumbnailButton .secondaryText, html:-ms-lang(ta) .cardThumbnailButton .tertiaryText, html:-ms-lang(ta) .cardThumbnailButton .quaternaryText
{
    word-wrap: break-word
}
.overlayAnchor.volumeContainer, .snapped .overlayAnchor.volumeContainer
{
    display: block;
    width: 100%;
    top: -8px;
    z-index: 1010
}
.volumeContainer
{
    width: 66px
}
.volumeIcon
{
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr;
    height: 50px;
    width: 46px;
    margin-left: 10px;
    margin-right: 10px
}
.volumeIcon button.win-command
{
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr;
    -ms-grid-column-align: center;
    -ms-grid-row-align: center;
    height: 40px;
    width: 40px;
    margin-left: -3px;
    padding: 0
}
.volumeIcon .win-commandring, .snapped .volumeIcon .win-commandring, .volumeIcon button:active .win-commandring, .snapped .volumeIcon button:active .win-commandring
{
    -ms-grid-column: 1;
    -ms-grid-row: 1;
    height: inherit;
    width: inherit;
    margin: 0
}
.volumeIcon .win-commandimage
{
    height: inherit;
    width: inherit;
    margin: 0
}
.volumeRange
{
    display: -ms-grid;
    -ms-grid-columns: 1fr;
    -ms-grid-rows: 1fr;
    height: 195px;
    width: 66px
}
.volumeRange input[type=range].win-vertical
{
    -ms-grid-column-align: center;
    -ms-grid-row-align: center;
    height: 163px;
    width: 11px;
    padding: 0
}
.volumeRange input[type=range].win-vertical::-ms-tooltip
{
    display: none
}
.control-upgradeTileContainer .part-littleMessage:after
{
    content: " ";
    position: relative;
    top: -1px;
    font-weight: 800
}
.avatarControlContainer
{
    width: 250px;
    height: 500px
}
.avatarControlLoading
{
    position: relative;
    top: calc(50% - 30px);
    left: calc(50% - 30px)
}
.avatarControlVideo
{
    position: relative;
    left: -195px;
    top: -20px
}
.miniProfilePanelContainer.socialMiniProfile.socialHub .avatarControlVideo
{
    left: -245px;
    top: 40px
}
html[dir=rtl] .avatarControlVideo
{
    right: -195px;
    left: 0
}
html[dir=rtl] .miniProfilePanelContainer.socialMiniProfile.socialHub .avatarControlVideo
{
    right: -245px;
    left: 0
}