/* High contrast fix -andrewS */
@media screen and (-ms-high-contrast:white-on-black), screen and (forced-colors: active) and (prefers-color-scheme: dark) {
  .HCfix {
      filter: contrast(50%) brightness(95%) hue-rotate(160deg) saturate(4);
  }
}
@media screen and (-ms-high-contrast:black-on-white), screen and (forced-colors: active) and (prefers-color-scheme: light) {
  .HCfix {
      filter: contrast(40%) brightness(45%) hue-rotate(120deg) saturate(2);
  }
}
/*Hero section*/
.sub-hero .gears-community a.c-call-to-action.c-glyph.f-lightweight{ color: #054b16; }
@media screen and (min-width: 768px) and (max-width: 1083px) {
    .page-hero section {
        height: 54.5vw;
    }
    .page-hero {
        margin-bottom: 48px;
    }
}

@media only screen and (min-width: 1084px) {
    .page-hero section {
        height: 45.3vw;
    }
}

/*Sub-hero and Game pass sections*/
@media only screen and (min-width: 1084px) {
    .gamePass section,
    .gears-social section {
        height: 53.9vw;
    }
    .sub-hero {
        background-image: url('https://assets.xboxservices.com/assets/e0/83/e08398e5-cfaf-4e99-86b4-f09a55e8b73d.jpg?n=Gears-Franchise_Background-1084_1920x2567_02.jpg');
        background-position: top;
        background-repeat: no-repeat;
    }
    .gears-social section div div {
        padding-right: 8vw;
    }
}

@media only screen and (min-width:767px){

.theme-black picture.c-image>img {margin: 0px !important;}
}



@media only screen and (min-width: 1400px) {
    .gamePass section,
    .gears-social section {
        height: 55.5vw;
    }
    .gears-social section div div {
        padding-right: 11vw;
    }
}

.sub-hero .m-banner .c-heading-2 {
    font-weight: 700 !important;
}

/*
.theme-black section.m-hero-item>div>div>p,
.theme-black section.m-hero-item>div>div>a {
    padding-top: 20px;
    margin-top: 0px;
}
*/

/* CTA tweaks*/

.gears-community a,
.theme-black .m-highlight-feature a,
.m-content-placement-item a.c-call-to-action,
.gamePass>div>section.m-hero-item>div>div>a {
    color: #5dc21e !important;
}
.gears-community a:focus,
.m-highlight-feature a:focus,
.m-content-placement-item a.c-call-to-action:focus,
.gamePass>div>section.m-hero-item>div>div>a:focus,
.m-social>ul>li>a:focus{
    outline: #FFF dashed 2px !important;
}
.theme-black section.m-hero-item>div>div>a:focus{
    outline: #FFF dashed 2px !important;
    margin-left: 2px !important;
}


.theme-black section.m-hero-item .c-glyph.glyph-play:before {
    margin-left: 0px;
}

.intro-text .c-heading-2 {
    font-weight: 700 !important;
    padding-top: 15px;
}

.theme-black .m-highlight-feature div {
    background-color: #000 !important;
    color: #fff !important;
}
.gear-theme-black{
    background-color: #000;
    margin-bottom: 0px !important;
}
@media only screen and (max-width: 767px) {
.gear-theme-black .m-highlight-feature div {
    color: #fff !important;
}
/*.m-hero-item > div picture, .c-hero > div .ctaSection picture {display:inline !Important;}*/
.gear-theme-black .m-highlight-feature a{color: #5dc21e !important;}
}
section.m-highlight-feature>div>a.x-type-left{
    margin-left: 0px;
}

/*Social section */
.gears-social section.m-hero-item div div h2.c-heading-1 {
    font-weight: 700 !important;
}

@media screen and (max-width: 1083px) {
.social-section .m-hero-item>div>div {
    max-width: 520px !important;}
}

.social-section ul {display: flex;}
.social-section section.m-hero-item div div h2.c-heading-1{font-weight:700 !important;}
.social-section .icons a {height:46px !important; width:46px !important;}
.social-section .icons, .social-section .icons li > a {
    display: inline-block !important;
}
.social-section li {
    padding: 0 .5em;
}


@media screen and (max-width:540px) {
.social-section .c-heading-1 {
    font-size: 38px;}
}

@media screen and (max-width:390px) {
.social-section .c-heading-1 {
    font-size: 34px;}
}

.ctaSection{margin-top:5px !important;}


@media only screen and (min-width:768px){
.iosLogo{float:left !important; margin-right:23px !Important;}
}


@media screen and (max-width:858px){
.context-uhf .theme-dark{background-color:black !important;}
.page-hero .m-hero-item{margin-top:88px !Important;}
}


.blackBG{background-color:#000 !important;}
/*.xgpLogo{width:250px !important; height:60px !important;}*/



@media only screen and (max-width: 767px){
.gamePass .m-hero-item>div picture { display:inline-block !Important;}
.social-section .m-hero-item>div picture {display:inline !important;}
}

@media only screen and (max-width: 375px){
.gamePass .m-hero-item>div picture { margin-left:10% !important; margin-right:10% !important;}
.padTop{padding-top:20px !Important;}
}

.sub-hero { background-color:black !Important;}
.gears5Blade a:focus {
 outline: 2px dashed black !Important;
}
/*
.custSvgImage {max-width:46px !important;}
*/


.social-section a:focus {
 outline: 5px dashed red !important;
 }


@media (forced-colors: active) {
 .social-section .f-horizontal {
    background-color:white !important;
    padding-top:50px !important;
 }
}

@media screen and (max-width: 859px) {
.heroMobileFix .m-hero-item >picture img{padding-top:88px !Important;}
.heroMobileFix .m-hero-item>div>div  {top:calc(55%) !important; }
}

.xgpLogo img {
      height:24px !important;
      display:inline-block !important;
  }

@media only screen and (max-width: 767px) {
   .xgpBlade  .m-hero-item>div picture {
        display: inline-block !important;
    }
  .xgpLogo img {
      height:24px !important;
  }
  .xgpBlade .c-heading {
   padding-top:0px !important;
 }
}

@media screen and (max-width:1083px)  and (min-width:768px) {
  .custHeroModule h1 {
    font-size: 46px;
    line-height: 56px;
  }
  .custHeroModule p{ 
    font-size: 20px;
    line-height: 24px;
 }
}

  @media screen and (min-width:1084px) {
  .superHeroMarginLeft {
    margin-left:15px !important;
   }
  }

@media screen and (max-width:767px) {
  .custHeroModule h1 {
  font-size: 34px;
  line-height: 40px;
}
  .custHeroModule p{ 
  font-size: 15px;
    line-height: 20px;
 }

 .franchiseSuperHero .custCTAGroup {
  margin-left:10%;
 }
}

@media screen and (max-width:499px) {
  .franchiseSuperHero .custCTAGroup {
    margin-left:0%;
 }
}


/* Super Hero */
  @media screen and (min-width:768px) {
  .franchiseSuperHero h2,
  .hero h1 { 
    margin-top:16px; 
   }
  }
  
  
  @media screen and (max-width:767px) {
   .franchiseSuperHero .m-hero-item>div picture { display:inline-block !important; padding-bottom:10px !important; }
   .franchiseSuperHero .m-hero-item>div>div { top: calc(200px) !important; }
  }
  
  
  @media screen and (max-width:539px) {
   .appStoreIcons { 
     padding-bottom:20px; 
   }
    #whatsnew h2.c-heading-3,
    .featured-games h2.c-heading-2, 
    .threeUpCont h2.c-heading-3{
      padding-left: 10%;
      padding-right: 10%;
   }
    .franchiseSuperHero .m-hero-item>div picture  {
         padding-bottom: 0px !important;
         margin-top: 10%;
    }
    .franchiseSuperHero h2 { 
      margin-top:16px; 
    }
  }
  
  .franchiseSuperHero .m-hero-item > div picture.custSvgAppImage{
    display:inline !important;
  }
  

  .franchiseSuperHero .gamePassLogo,
  .hero .gamePassLogo { 
    height:16px; 
  }
  
  
  /* mobile appstore icons */
  @media screen and (max-width: 450px) {
   .franchiseSuperHero .appStoreIcons {
        padding:0px !important; 
        margin-left:0 !important;
        margin-right:0 !important;
     }
   }
   
  
  @media screen and (min-width:350px) {
  .franchiseSuperHero .logoMargLeft {
    padding-left:15px;
   }
  }
  
  
  @media screen and (max-width:328px) {
   .franchiseSuperHero .appStoreIcons { width:103%; }
  }
  
  .franchiseSuperHero  .appStoreIcons a:focus {
  outline:2px dashed white !important;
  }
  
  @media screen and (-ms-high-contrast: active) {
   .franchiseSuperHero .appStoreIcons a{
    padding-top:10px;
    padding-bottom:12px;
   }
  }
  
  .franchiseSuperHero .appStoreIcons a{
    padding-top:10px;
    padding-bottom:12px;
  }
  
  /* scale down feature logo's */
  @media screen and (min-width:0px) {
   .custSvgAppImage img {
   height:26px;
   }
  }
  @media screen and (min-width:365px) {
   .custSvgAppImage img {
   height:28px;
   }
  }
  
  @media screen and (min-width:405px) {
   .custSvgAppImage img {
   height:32px;
   }
  }
  
  @media screen and (min-width:540px) {
   .custSvgAppImage img {
   height:40px;
   }
  }
  

.legacyBackground .appBackground, .legacyBackground .appBackground.theme-dark {
    background-color: transparent;
    background-color: black;
}

.xboxSocial {
 background-color:white !Important;
}