/* Heading */
@media screen and (min-width:1084px){
.accordion ul li.expanded .content p{width:400px !important;}
}
@media screen and (max-width:540px){
.accordion ul li span p{font-size:13px !Important; letter-spacing:1.5px !important; width:100% !important;}
}

.windowsReq [data-grid~='pad-12x'] > [data-grid]{padding-left:0 !important; padding-right:0 !important;}
.insiderProgrammeHero  .c-heading-3{padding:32px 0 2px !important;}
.parent { background: linear-gradient(90deg,#010d0b 0,#0b1e24 25%,#0b1e24 75%,#010d0b) repeat-y !important;}
.theme-black.f-transparent-hero {background: linear-gradient(90deg,#010d0b 0,#0b1e24 25%,#0b1e24 75%,#010d0b) repeat-y !important;}
.m-hero-item.theme-black {background: linear-gradient(90deg,#010d0b 0,#0b1e24 25%,#0b1e24 75%,#010d0b) repeat-y !important;}
.gradDiv1 { background: linear-gradient(#000, transparent); }
@media only screen and (min-width: 1275px) {
.BGimgintro .m-banner .c-subheading-3 {
    margin-top: 48px;}
}

@media only screen and (max-width: 1275px) {
.BGimgintro .m-banner .c-subheading-3 {
    margin-top: 18px;}
}


@media only screen and (max-width: 1276px) {
.BGimgintro .c-heading-1 {
font-size: calc(60px + .1vw);
color: #45997e;
font-family: Windlass Extended;
}
}

@media only screen and (min-width: 1276px) {
.BGimgintro .c-heading-1  {
font-size: calc(100px + .1vw);
word-spacing: 5px;
color: #45997e;
font-family: Windlass Extended;
} 
}

@media only screen and (min-width: 2129px) {
.BGimgintro .m-banner {
max-width: 1920px;}
}

/* ROW Banner Fix */
.bannerRow.m-banner {
max-width: 1920px;
}

/* Feature Section */
.m-highlight-feature>div .c-heading-3 {
color: #45997e !important;
}

 .m-highlight-feature > div {
background: none !important;
color: white !important;
box-shadow:none !Important;
}

@media only screen and (min-width:1084px) {
.m-highlight-feature>.right-align {
margin-right: 10%;
}
.m-highlight-feature>.left-align {
margin-left: 10%;}
}

.fullWidth [data-grid~="container"] {
padding-left: 0 !important;
padding-right: 0 !important;
max-width: 100% !important;
}


/* Tablet for Hero */
@media only screen and (max-width: 780px) {
.cstm-logo-hero .m-hero-item[class*=f-x][class*=f-y]>div>div {
max-width: 97% !important;}
}


.BGimgintro .m-hero-item .c-paragraph {
  max-height: 120px !important;
}

/* Misc */
@media screen and (min-width: 1921px) {
.vertX1S {
    max-width: 1920px !important;
    margin: 0 auto !important;}
}

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

.windowsReq .m-system-requirements {
    padding: 0 24px;}
}


@media screen and (min-width: 768px) {
#community p {
  margin: 0 10%;}
}

.m-image-intro .c-call-to-action {
margin-top: 10px;
}

@media only screen and (max-width: 767px) {
.hero .m-hero-item > div, .c-hero > div{height:0 !Important;}
#community .m-hero-item>div picture, .m-hero-item[class*=f-x][class*=f-y]>picture:after {
display: block !important;}
/*.heroLogo{display: none !important;}*/
}

/* Purchase Section */
.threeP-hero .m-cta-module .button-section.newLayout .c-call-to-action {
  margin-bottom: 0px !important;
}

.threeP-hero .button-section .c-paragraph-1.gamepassText {
margin-bottom: 23px;
}

.purchaseSection .xpa.f-border {
  padding-top: 13px !important;
}

.BGimgintro .media-gallery-black {
background-color: inherit !important;
}

@media (min-width: 768px) and (max-width: 990px) {
.purchaseSection .m-feature {
margin-top: 100px !important;}
}

/* Top Hero */
 .vidHero .c-image {position: absolute; bottom: -7.1%;}

@media screen and (max-width: 1083px) {
 .vidHero .c-image {position: absolute; bottom: -16%;}
}

.float-grade {
    background:  -webkit-linear-gradient(to bottom, rgba(000, 000, 000, .7) 10%, rgba(000, 000, 000, 0) 100%) repeat scroll 0 0 !important;
    background: -moz-linear-gradient(to bottom, rgba(000, 000, 000, .7) 10%, rgba(000, 000, 000, 0) 100%) repeat scroll 0 0 !important;
    background:  -o-linear-gradient(to bottom, rgba(000, 000, 000, .7) 10%, rgba(000, 000, 000, 0) 100%) repeat scroll 0 0 !important;
    background:  linear-gradient(to bottom, rgba(000, 000, 000, .7) 10%, rgba(000, 000, 000, 0) 100%) repeat scroll 0 0 !important;
    content: "";
    width: 100%;
    height: 150px;
    position: absolute;
    top: 0px;
    z-index: 10;
    pointer-events: none;
}

.float-grade {
    background:  -webkit-linear-gradient(to bottom, rgba(000, 000, 000, .7) 10%, rgba(000, 000, 000, 0) 100%) repeat scroll 0 0 !important;
    background: -moz-linear-gradient(to bottom, rgba(000, 000, 000, .7) 10%, rgba(000, 000, 000, 0) 100%) repeat scroll 0 0 !important;
    background:  -o-linear-gradient(to bottom, rgba(000, 000, 000, .7) 10%, rgba(000, 000, 000, 0) 100%) repeat scroll 0 0 !important;
    background:  linear-gradient(to bottom, rgba(000, 000, 000, .7) 10%, rgba(000, 000, 000, 0) 100%) repeat scroll 0 0 !important;
    content: "";
    width: 100%;
    height: 150px;
    position: absolute;
    top: 0px;
    z-index: 10;
    pointer-events: none;
}


.heroVid.c-action-trigger::before {
    position: absolute;
    top: calc(-12px + 50%);
    left: calc(-12px + 50%);
    color: #fff;
    font-size: 24px;
    content: "";
    margin: 0;
}

.heroVid.c-action-trigger.c-glyph::before {
    line-height: 25px;
    margin-left: 2px;
}

.c-action-trigger.heroVid {
    position: relative;
    color: #fff;
    background: rgba(0, 0, 0, .6);
    border: transparent;
    border-radius: 50%;
    margin: 0;
    height: 48px;
    width: 48px;
    padding: 6px 0 8px;
}

a:not(:hover).c-action-trigger.heroVid.x-hidden-focus {
    background: rgba(0, 0, 0, .6) !important;
}

.c-action-trigger.heroVid:visited {
    background: rgba(0, 0, 0, .6);
}

.c-action-trigger.heroVid:hover,
.c-action-trigger.heroVid:hover:focus,
.c-action-trigger.heroVid:hover:active {
    background: rgba(0, 0, 0, 1) !important;
}
.c-action-trigger.c-glyph.glyph-play.heroVid:focus{
  border: dashed;
  border-width: 2px;
  border-color: white;
  background: rgba(0, 0, 0, 1);
}

/*
 a[aria-label].c-action-trigger.c-glyph{min-width:100% !important;}
*/

.m-multi-feature a{margin-bottom:-1.5px !important;}
.mixerLogo{ max-width:169px !important; max-height:50px !important;}


/* adjusts image offset in parent <a> tag */
#add-ons picture, #subscriptions picture {
    height: 396px;
    width: 100%;
    overflow: hidden;
    border: none;
}

.theme-black .m-product-placement-item>a:focus, 
.theme-black .c-product-placement>a:focus {
    border-color: #fff;