@media screen and (max-width: 767px) {
.padBottom {
    padding-bottom: 12px;}
}

/* ===== FILE CUSTOMIZED FOR DAYBREAK ===== */


/* ===== do not overwrite file with primary version ===== */

    .join-now .banner-background .sku-chooser__panel {
      margin-top: -40px !important;
    }
    
    
    @media only screen and (min-width: 768px) {
    .m-multi-feature.f-align-left>section, .m-multi-feature.f-align-right>section {
      padding-top:20px !important;
     }
    }
    
    
    
    @media screen and (min-width: 1500px) and (max-width: 1794px) {
      .join-now .banner-background {
          height: 43vw;
      }
    
      .join-now .banner-background section {
          height: 38vw;
      }
    }
    
    @media screen and (min-width: 1251px) and (max-width: 1500px) {
      .join-now .banner-background {
          height: 58vw;
      }
    
      .join-now .banner-background section {
          height: 50vw;
      }
    }
    
    @media screen and (min-width: 1084px) and (max-width: 1250px) {
      .join-now .banner-background {
          height: 70vw;
      }
    
      .join-now .banner-background section {
          height: 65vw;
      }
    }
    
    @media screen and (min-width: 940px) and (max-width: 1084px) {
      .join-now .banner-background {
          height: 78vw;
      }
    
      .join-now .banner-background section {
          height: 73vw;
      }
    }
    
    @media screen and (min-width:1084px) and (max-width:1260px) {
     .xgp-pc .m-area-heading .c-heading {
        padding-top:5% !important;
     }
    }
    
    @media screen and (min-width: 881px) and (max-width: 940px) {
      .join-now .banner-background {
          height: 85vw;
      }
    
      .join-now .banner-background section {
          height: 80vw;
      }
    }
    
    @media screen and (min-width: 768px) and (max-width: 880px) {
      .join-now .banner-background {
          height: 110vw;
      }
    
      .join-now .banner-background section {
          height: 105vw;
      }
    }
  
    @media screen and (min-width: 768px) {
  .join-now .banner-background .sku-chooser__panel .intro {
      padding-top: 0px;
  }
  }
    
    
    @media screen and (max-width:600px) {
    .join-now .banner-background {
        padding-bottom: 22% !important;
        z-index: 0;
    }
    }
    
    @media screen and (max-width:450px) {
    .join-now .banner-background {
        padding-bottom: 53% !important;
        z-index: 0;
    }
    }


@media screen and (min-width: 1251px) and (max-width: 1500px) {
.join-now .banner-background section {
    height: 50vw;
}
}

.filmstrip {
    padding-top: 24px
}

.page-hero .c-group {
    margin-top: 0;
}

.page-hero .m-hero-item [class^="c-subheading"] {
    padding-bottom: .5em;
}

.page-hero .m-hero-item>div>div img {
    max-height: 84px;
    margin-bottom: 35px;
    margin-top: 24px;
}

@media screen and (max-width: 767px) {
    .page-hero .m-hero-item {
        background-color: #e6e6e6;
        color: #000;
    }
}

@media screen and (min-width: 1084px) and (max-width: 1199px) {
    .page-hero .m-hero-item h1 {
        font-size: 36px;
        line-height: 1.2em;
    }
}

@media screen and (min-width: 1200px) and (max-width: 1399px) {
    .page-hero .m-hero-item h1 {
        font-size: 42px;
        line-height: 1.2em;
    }
}

@media screen and (min-width: 768px) and (max-width: 1399px) {
    .page-hero .m-hero-item.f-transparent:before,
    .body-hero .m-hero-item.f-transparent:before {
        padding-bottom: 82% !important;
    }
}

@media screen and (min-width: 768px) and (max-width: 1083px) {
    .page-hero .m-hero-item>div>div {
        width: 55%;
        max-width: 440px;
    }
}

.high-contrast-mode.black-on-white .page-hero .m-hero-item>div>div img {
    filter: grayscale(1) brightness(0);
}

.body-hero {
    padding-top: 96px;
}

.body-hero:last-of-type {
    padding-bottom: 96px;
}

.body-hero h3 strong {
    font-style: italic;
}

@media screen and (min-width: 1400px) {
    .body-hero .m-hero-item>div>div .c-subheading {
        font-size: 20px;
        line-height: 1.2em;
    }
}

.c-badge {
    background-color: #c8c8c8;
    margin-bottom: 8px;
}

.body-hero .c-badge.f-small {
    padding-left: 7px;
    font-weight: 600;
}

.body-hero .c-badge.f-small:not(:first-of-type) {
    margin-left: 8px;
}

@media screen and (min-width: 768px) and (max-width: 1083px) {
    .body-hero .c-heading-2 {
        font-size: 32px;
        line-height: 1.2;
    }
}

@media screen and (min-width: 1084px) and (max-width: 1200px) {
    .body-hero .c-heading-2 {
        font-size: 42px;
        line-height: 1.2;
    }
}

.body-hero .m-hero-item>div>div {
    top: calc(50%) !important;
}

@media only screen and (max-width: 767px) {
    .custom-hero .m-hero-item:before {
        /* This is what defines the aspect ratio of the hero */
        display: none;
    }
    .custom-hero .m-hero-item>div,
    .custom-hero .m-hero-item>div>div,
    .custom-hero .m-hero-item>picture img,
    .custom-hero .m-hero-item>img,
    .custom-hero .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 */
        position: relative;
        top: 0 !important;
        left: 0 !important;
        transform: none !important;
        overflow: visible;
        height: auto;
    }
    .custom-hero .m-hero-item>div>div {
        padding-top: 24px;
        /*padding-bottom: 48px;*/
    }
}

.app-links {
    margin-top: 6px !important;
    padding-top: 12px;
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    max-width: 280px;
    justify-content: space-between !important;
}

@media only screen and (max-width: 767px) {
    .app-links {
        margin-left: auto;
        margin-right: auto;
    }
}

@media only screen and (max-width: 479px) {
    .app-links {
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
}

.app-links img {
    height: 40px;
}

.app-links a {
    margin-top: 12px;
}

.body-hero ul li {
    margin-top: 12px;
}

.body-hero ul li p {
    position: relative;
    padding-left: 24px !important;
}

.body-hero ul li p:before {
    content: "";
    font-family: "MWFMDL2-Xbox";
    font-size: 1.25em;
    line-height: 1.25;
    position: absolute;
    left: 0;
    top: 2px;
}

@media only screen and (max-width: 767px) {
    .body-hero ul li p {
        display: inline-block;
        padding-left: 0 !important;
    }
    .body-hero ul li p:before {
        position: relative;
        top: 3px;
        margin-right: 4px;
    }
}

.split-banner {
    position: relative;
}

.split-banner .m-banner {
    padding-top: 0;
}

.split-banner .m-banner h2 {
    margin-top: 1.32em;
    padding: 0;
    line-height: 1.2em;
}

.split-banner .m-banner h2::before {
    background-color: #e6e6e6;
    display: block;
    content: "";
    width: 100%;
    height: 2em;
    position: absolute;
    top: 0;
    left: 0;
    z-index: -1;
}

.sku-chooser {
    padding-top: 96px;
}

.sb-pivot.SB-hero-banner.head1a .banner-background div.m-banner {
    margin-top: -2% !important;
}

@media screen and (min-width:0px) {
    .SB-hero-banner .m-banner {
        margin-bottom: 32px;
    }
}

@media screen and (min-width:1084px) {
    .SB-hero-banner .m-banner {
        margin-bottom: 35px;
    }
}

@media screen and (min-width:1400px) {
    .SB-hero-banner .m-banner {
        margin-bottom: 55px;
    }
}

.pcGamePassHeroLogo {
    width: 264px !important;
}

.join-now .c-paragraph.legalSub {
    font-weight: 500;
}

.join-now {
    padding-left: 5%;
    padding-right: 5%;
}

.join-now .banner-background {
    width: 100%;
    left: auto;
    right: auto;
}

@media screen and (min-width: 1480px) {
    .join-now .banner-background .m-hero-item:before {
        padding-bottom: 41.55%;
    }
}

.sku-chooser__panel .intro a.c-call-to-action {
    margin-bottom: 24px;
}
.sku-chooser__panel li {
    line-height: 1.12;
}
.join-now .banner-background .sku-chooser__panel .intro .price {
    max-width: 325px;
    min-height: 0;
    padding-bottom: 20px;
}

/* ===== FILE CUSTOMIZED FOR DAYBREAK ===== */


/* ===== do not overwrite file with primary version ===== */