/* Ribbon */
.m-global-promotion {
  border: 2px solid #5dc21e;
}

@media screen and (max-width: 1084px) and (min-width: 768px) {
.m-global-promotion .c-heading {
padding-right: 20px !important;
font-size: 15px !Important;
line-height: 20px !important;}
}

/*.tab-content {
display: none;
}
*/

.tabs .c-pivot>[role="tablist"] {
  display: block;
  overflow: visible;
  white-space: inherit;
  width: 100%;
}
.tabs > span {
display:inline-block;
width: 1px; height:1px;
}
.tab-bar .tabs {
text-align: center;
 }
 
 div.tab-bar div.tabs .c-button {
padding-left: 25px; /* matches span position */
padding-right: 25px; /* matches span position */
margin: 0;
min-width: auto;
width: auto;
font-weight: 600;

 }
 .tab-bar .tab.active span::after,
 .tab-bar .tabs a:hover span::after,
 .tab-bar .tabs a:focus span::after {
display: block;
  content: '';
  position: absolute;
bottom: 2px;
left: 25px; /* matches a.c-button padding */
  right: 25px; /* matches a.c-button padding */
  border-bottom: 2px solid #107c10;
 }
 
 div.tab-bar div.tabs .c-button:hover,
 div.tab-bar div.tabs .c-button:active,
 div.tab-bar div.tabs .c-button:focus {
text-decoration: none;

 }
 
 div.tab-bar div.tabs .c-button:active,
 div.tab-bar div.tabs .c-button:focus {
background-color: transparent !important;
/*border: 2px dashed #fff !important;*/
  outline: 2px dashed #000 !important;
 }
 
 
 @media only screen and (max-width: 859px) {
.gold-hero {
padding-top: 88px;
}
 }
 
 .gold-hero .m-hero .c-group>.c-call-to-action,
 .gold-hero .m-hero-item .c-group>.c-call-to-action {
padding-right: 12.5px !important;
padding-left: 12.5px !important;
margin-right: 12.5px !important;
margin-left: 12.5px !important;
 }
 
 .gold-hero .c-subheading span {
font-weight: 400;
 }
 
 @media only screen and (max-width: 1083px) {
.gold-hero .m-hero-item>div>div {
max-width: 600px !important;
width: 80%;
}
 }
 
 @media only screen and (max-width: 767px) {
.gold-hero [class*=f-x][class*=f-y].c-hero > div > div, [class*=f-x][class*=f-y].m-hero-item > div > div {
top: calc(20%) !important;
}
 }
 @media only screen and (max-width: 640px) {
.gold-hero .m-hero-item>div>div {
width: auto;
}
 }
 @media only screen and (max-width: 463px) {
.gold-hero .m-hero-item h1 {
font-size: 38px;
}
 }
 
 .gold-mosaic .c-mosaic-placement > div {
justify-content: center;
padding-bottom: 0;
 }
 
 .gold-mosaic .c-mosaic-placement>div>div {
position: relative;
 }
 
 .gold-mosaic .c-mosaic-placement .c-heading span {
font-weight: bold;
 }
 
 .gold-icon-bar .c-heading.f-lean {
padding-top:0;
margin-top: 0;
 }

 body,
 .theme-dark.darker {
background-color: #111;
 }
 
 .theme-dark .high-contrast .green-brdr,
 .theme-dark .high-contrast .green-brdr:hover {
color:#fff !important;
 }
 
 .spacer1 [data-grid~="container"] {
padding-top: 0;
 }
 
 .free-games {
overflow-x:hidden;
 }
 
 .free-games.theme-dark a.c-call-to-action, 
 .free-games.theme-dark a.c-call-to-action:hover, 
 .free-games.theme-dark a.c-call-to-action:focus, 
 a:not(.x-hidden-focus).c-call-to-action:focus, a.c-call-to-action:hover {
background: transparent !important;
 }
 
 .free-games .m-image-intro>div {
padding-bottom: 0;
 }
 
 .free-games .m-image-intro picture,
 .free-games .m-image-intro img {
width: 100%;
 }
 
 .m-image-intro .c-group,
 .m-banner .c-group {
display: block;
margin-top:2px;
padding-top: 12px;
 }
 
 .free-games .m-image-intro.f-align-bottom>div {
width: 88% !important;
max-width: 1000px;
 }
 
 @media only screen and (max-width: 540px) {
.free-games .m-image-intro.f-align-bottom>div {
width: 100% !important;
padding-left: 5%;
padding-right: 5%;
}
 }
 
 .free-games [data-grid~="col-4"]:first-of-type .m-content-placement-item {
margin-top: 0;
 }
 
 @media only screen and (min-width: 768px) {
.free-games .m-content-placement-item {
margin-top: 0;
}
 }
 
 .deals .m-content-placement-item, 
 .deals .c-content-placement {
margin-top: 23px;
 }
 
 .deals-banner .c-paragraph-3, 
 .free-games .c-paragraph-3 {
padding-top: 12px;
 }
 /*
 @media only screen and (min-width: 768px) {
 .m-image-intro .c-group,
 .m-banner .c-group {
margin-top: 12px;
 }
 }*/
 
 @media only screen and (min-width: 1084px){
.game-pass .c-feature.f-align-center>div, .m-feature.f-align-center>div {
max-width: 900px !important;
}
 }
 @media only screen and (max-width: 767px) {
.c-hero > div, .m-hero-item > div {
height: 280px !important;
}
 }
 a.c-call-to-action, button.c-action-trigger {
font-weight: bold !important;
 }
 a.c-call-to-action.green-brdr {
border-color: #5dc21e !important;
 }
 .m-back-to-top {
box-sizing: content-box;
border: 2px solid transparent;
width: auto !important;
height: auto !important;
padding-bottom: 8px !important;
 }
 .m-back-to-top:focus {
outline: 2px dashed #000;
border: 2px dashed #fff;
color: #fff;
 }
 
 @-moz-document url-prefix() { /* fix for images disappearin in mosaic. MWF uses CSS gradient in the mosaic that goes to black in FF HC. */
.high-contrast-mode .c-mosaic-placement picture {
/*opacity: .8;*/
}
.high-contrast-mode .gold-mosaic.theme-dark .c-mosaic-placement picture:after {
display: none;
}
.high-contrast-mode .gold-mosaic.theme-dark .c-mosaic-placement div > * {
/*background-color: #000 !important;*/
}
 }
 
 @media screen and (-ms-high-contrast:white-on-black) {
.gold-icon-bar .high-contrast  img {
filter: invert(1);
}
 }
 
 @media screen and (-ms-high-contrast:white-on-black) {
.high-contrast {
background-color: #000;
color: #fff !important;}
 
.high-contrast-svg-white {
background-color: #fff;
}
 }
 
 a.c-hyperlink.footnotes-link {
font-weight: inherit !important;
 }
 a.c-hyperlink.footnotes-link:not(:hover):not(:focus) {
color: white;
 }
 a.c-hyperlink.footnotes-link:hover {
color: #107c10;
 }
 
 sup .footnotes-link {
margin-right: 0 !important;
 }
 
 .nowrap {
white-space: nowrap;
 }
 
 #xboxGamePass sup {
font-size: .65em;
 }
 
 .tab-bar.theme-dark a.white-c {
color: #fff !important;
 }
 
 .m-content-placement-item .x-type-center .c-call-to-action,
 .m-content-placement-item .x-type-center .c-call-to-action span {
text-align: center !important;
 }

.inactive {display:none;}
      .fpd .m-area-heading {
          padding-bottom: 48px;
      }
      .fpd .c-badge {
          display:none;
}
@media screen and (min-width: 768px) {
.fpdGames.gameDivsWrapper {
min-height: 200px;
}
}

@media screen and (min-width: 1400px) {
.fpdGames.gameDivsWrapper {
min-height: 320px;
}
}


@media screen and (min-width: 1601px) {
.fpdGames.gameDivsWrapper {
 min-height: 480px;
}
}



/* Multiplayer hero fix */
/* override to make hero flow at mobile */
@media screen and (max-width: 767px) {
.gold-mosaic .m-hero-item {
padding-bottom: 48px;
}
.gold-mosaic .m-hero-item:before {/* This is what defines the aspect ratio of the hero */
display: none;
}
.gold-mosaic .m-hero-item>div,
.gold-mosaic .m-hero-item>div>div,
.gold-mosaic .m-hero-item>picture img,
.gold-mosaic .m-hero-item>img,
.gold-mosaic .m-hero-item>picture {/* Some of these styles are redundant for some of these elements, but it doesn't hurt to pile them up in one place */
left: 0 !important;
position: relative !important;
top: 0 !important;
transform: none !important;
overflow: visible !important;
height: auto !important;
padding-top: 0;
}
}

/* end hero override */
 
