/************* TG ovewrrides *****************/
@media screen and (max-width:1083px) {
[data-grid~=container] {
    padding-left: 5%;
    padding-right: 5%;
}
}

/* September redesign hero */
.static-hero {position: relative; z-index: 990;}
.static-hero h1 {letter-spacing: .075em;}
.static-hero .c-action-trigger {margin-top: 0px;}
.quotes {width: 121px; height: 103px; margin-right: -50px;}
.slash {width: 84px; height: 145px;}
.quoteLogo {width: 70px; height: 42px; margin: 0 24px;}

 .static-hero button.c-action-trigger.c-glyph::before {
    color: #5dc21e;
}

.accoladeRotator .theme-dark {background-color: #171717;}
.accoladeRotator .content {display: inline-flex;}
.accoladeRotator .m-hero-item > div > div {
    max-width: 100%;
    min-width: 100%;
}
.accoladeRotator p {line-height: 40px; padding-top: 38px;}
@media (min-width: 1084px) and (max-width: 1399px) {
    .static-hero h1 {padding-top: 0px;}
}
@media screen and (min-width: 1084px) {
    .static-hero p {padding-top: 0px;}   
    .static-hero .c-group {width: 360px; margin: 12px auto;}
    .static-hero a.c-call-to-action.green-brdr {margin-right: 23px;}
    .accoladeRotator .m-hero-item::before { padding-bottom: 370px;}
    .accoladeRotator .m-hero-item > div {max-width: 1084px;}

}
@media screen and (min-width: 1400px) {
    .static-hero h1 {font-size: 84px;}
    .static-hero p {padding-top: 27px;}
    .static-hero .c-group {margin: 40px auto;}
}
@media screen and (min-width: 1600px) {
    .static-hero .m-image-intro > div {margin-top: 3vw;}
}
@media screen and (max-width: 1083px) {
  .slash {display: none;}
    .static-hero .m-image-intro > div {padding: 0px; width: 400px; margin: 0 auto;}
    .static-hero p {padding-top: 15px;}
    .static-hero .c-group {margin: 30px auto; width: 330px;}
.accoladeRotator .m-hero-item .content.lower p {margin: 0 auto;}
}
@media screen and (max-width: 767px) {
.accoladeRotator .m-hero-item > div {position: absolute; height: 280px;}
}

@media screen and (max-width: 540px) {
 .static-hero .m-image-intro > div {top: -150vw; margin-bottom: -10px; height: 0px;}
.static-hero p {padding-top: 5px;}
    .static-hero .c-group {margin: 10px auto;}
.accoladeRotator .m-hero-item::before {
    padding-bottom: 56.25%;
}
.accoladeRotator .m-hero-item > div {position: relative; height: 180px;}
.accoladeRotator .m-hero-item > div > div {top: calc(1%) !important;}
}

.newWow .m-immersive-hero-item {z-index: 999;}

.c-feature>div .c-paragraph, .m-feature>div .c-paragraph {width: 56vw; margin: 0 auto;}
#headerArea {position: relative; z-index: 999;}
.c-universal-header > div:first-child .c-logo .c-image {
    width: 108px !important;
}
.xp-loader {display: none !important;}
.wowHero .m-immersive-hero-item {position: relative; z-index: 999; min-height: 100%; max-height: 100%;}
.dskHero .c-subheading, .tabHero .c-subheading {font-size: 34px; line-height: normal; margin-bottom: 24px; display: block;}

@media screen and (max-width: 1399px) {
.xp-wow-copy .c-heading-2 { font-size: 150px !important;}
.wowHero .m-hero-item > div > div {
    max-width: 500px;
}
}
@media (min-width: 768px) and (max-width: 1083px) {
.wowHero .m-hero-item.f-x-left > div > div {left: calc(30%); text-align: center;}
}
@media screen and (max-width: 1083px) {
.wowHero .m-hero-item.f-x-left > div > div {top: 27vw;}
.wowHero .m-immersive-hero-item.f-align-bottom > div {top: 70%;}
.c-feature>div .c-paragraph, .m-feature>div .c-paragraph {width: 66vw;}
}
@media screen and (max-width: 768px) {
.wowHero .m-hero-item.f-x-left > div > div {top: -15%;}
.dskHero .c-subheading, .tabHero .c-subheading {font-size: 24px;}
.c-feature>div .c-paragraph, .m-feature>div .c-paragraph {width: 83vw;}
}
@media screen and (max-width: 540px) {
.wowHero .m-hero-item.f-x-center > div > div {top: -12%;}
.wowHero .m-hero-item .c-heading {padding-bottom: 5px !important;}
}
}

@media screen and (min-width: 1084px) {
.wowHero .m-immersive-hero-item.f-align-bottom > div {top: 60%;}
}
@media screen and (min-width: 1400px) {
.wowHero .m-immersive-hero-item.f-align-bottom > div { top: 70%;}
}
.xp-wow-copy .c-heading-2 {
    font-size: calc(200px + 1.18vw) !important;
    text-shadow: 0px 0px 15px #000;
    text-align: center;
    line-height: 0.9;
    margin-bottom: 0px !important;
    padding: 0;
    color: #fff;
}

.xp-wow-copy p.c-paragraph-2 {
    font-size: calc(17.6px + 1.18vw) !important;
    text-shadow: 0px 0px 13px #000;
    text-align: center;
    padding: 0;
    line-height: initial;
}
.wowHero .m-hero-item.f-x-center > div > div {min-width: 60%;}
@media screen and (max-width: 1083px) {
.wowHero .m-hero-item, .wowHero .m-hero-item .tabHero {height: 132vw;}
}
@media screen and (max-width: 768px) {
.wowHero .m-hero-item, .wowHero .m-hero-item .tabHero {height: 163vw;}
.xp-wow-copy .c-heading-2 { font-size: 150px !important;}
}
@media screen and (min-width: 0) {
.wowHero .m-hero-item .c-heading {font-size: 46px; letter-spacing:  .075em;  line-height: 100%; line-height: 100%; font-weight: 100;}
}
@media screen and (min-width: 768px) {
.wowHero .m-hero-item .c-heading { font-size: 62px; letter-spacing:  .075em;  line-height: 100%; line-height: 100%; font-weight: 100;}
}
@media screen and (min-width: 1084px) {
.wowHero .m-hero-item {height: 56vw;}
.wowHero .m-hero-item .m-ambient-video video {height: 56vw;}
.wowHero .m-hero-item .c-heading {font-size: 62px; letter-spacing:  .075em;  line-height: 100%; line-height: 100%; font-weight: 100; }
}

.wowHero .m-hero-item .c-heading {padding-bottom: 26px;}
.wowHero .m-hero-item a {font-weight: 700;}
.wowHero .c-glyph.glyph-play::before {
    color: #5DC21E;
    padding-right:10px;
}

.wowHero .m-hero-item {padding: 0px !important; }
/* .wowHero .m-hero-item h1 {text-shadow:0px 0px 75px rgba(18, 18, 19, 1);} */
.wowHero .m-hero-item .c-action-trigger {color: #fff;}
.m-image-intro {overflow: hidden;}
.accCont .lightboxcontent {
    position: static !important;
}
.accCont .lightboxclosebutton {
    cursor: pointer;
    width: 35px;
    margin-top: -15px;
    margin-left: auto;
    margin-left: 115%;
    margin-top: 15px;
    position: relative;
    z-index: 500001;
    top: -50px;
}
.accCont .m-banner .c-call-to-action {color: #5dc21e;}
.accCont .c-paragraph-1 {width: 56vw; margin: 0 auto;}
.x-ray .c-paragraph-4 {padding-top: 22px}
@media screen and (max-width: 1084px) {
.x-ray .c-paragraph-2 {font-size: 20px;}
}
@media screen and (max-width: 1084px) {
.accCont .c-paragraph-1 {width: 83vw;}
}
@media screen and (max-width: 768px) {
.x-ray .c-paragraph-2 {font-size: 18px; width: 83vw; margin: 0 auto;}
.accCont .c-paragraph-1 {width: 66vw;}
}
.x-ray .stripeWrapper {max-width: 230px;}
.slide-detail .c-caption {font-size: 13px; margin-top: 12px; text-transform: uppercase; font-weight: 700;}

#xp-accolade-panel .accoladeFooter .holder {margin-bottom: 0px;}
#xp-accolade-panel .accoladeFooter .rotate-descriptor {width: 270px; margin: 0 auto; }
#xp-accolade-panel .accoladeFooter .rotate-descriptor p {letter-spacing: 3px; color: #c8c8c8; font-weight: 600; padding: 0px;}

/*************** Drawer ********************/
.xp-drawer .c-feature.f-align-center>div, .m-feature.f-align-center>div {max-width: none;}
.xp-drawer .m-multi-feature.f-align-center>section>.c-pivot>section, .m-multi-feature.f-align-center>section>ul {width: auto;}
.c-action-toggle.fourkbutton, .c-action-toggle.xraydrawerbutton {font-family: segoe ui semibold, helvetica, arial; letter-spacing: 0.075em; }
.xp-drawer {background-color: #2f2f2f; color: #fff;}
.xp-drawer .h-divider {
    border-right: 2px solid #000;
}
.xp-drawer-container {
    -ms-transform: skew(0deg, -3deg);
    -webkit-transform: skew(0deg, -3deg);
    transform: skew(0deg, -3deg);
    border-bottom: 1px solid #171717;
}
.xp-drawer .xp-drawer-content {
    -ms-transform: skew(0deg, 3deg);
    -webkit-transform: skew(0deg, 3deg);
    transform: skew(0deg, 3deg);
    padding-top: 20px;
}

.xp-drawer-container .xp-drawer-toggle button {
    -ms-transform: skew(0deg, 3.5deg);
    -webkit-transform: skew(0deg, 3.5deg);
    transform: skew(0deg, 3.5deg);
}
.xp-drawer-container.drawer3 .xp-drawer img {box-shadow: none;}
.xp-drawer-container .xp-drawer img {box-shadow: 0 0 80px rgba(0,0,0,.4) ;}
.xp-drawer-container .xp-drawer .connectivity img {box-shadow: none;}
.xp-drawer-container .xp-drawer .four-K-drawer > div:nth-child(2) > section img {box-shadow: none;}
.xp-drawer-container .xp-drawer .compat-drawer img {box-shadow: none;}
.xp-drawer-container .xp-drawer .c-carousel .c-flipper+div {overflow: inherit;}
.xp-drawer-container .specs picture img {
    width: auto;
}
@media screen and (max-width: 1084px) {
.xp-drawer-content .m-banner .c-paragraph-1 {width: 66vw; margin: 0 auto; color: #c8c8c8;}}
.xp-drawer-content .m-feature .c-paragraph {width: 66vw; margin: 0 auto; color: #c8c8c8;}

}
@media screen and (max-width: 768px) {
.xp-drawer-content .m-banner .c-paragraph-1 {width: 83vw; margin: 0 auto;}
.xp-drawer-content .m-feature .c-paragraph {width: 83vw; margin: 0 auto;}
}
@media only screen and (min-width:541px) {
.xp-drawer-content .m-feature {margin-top: 80px !important;}
.h-divider {
    border-right: 2px solid #000 !important;
}

}
@media  (min-width:541px) and (max-width: 1084px) {
.connectivity .rtBorder.tab {border-right: none;} 
}
@media only screen and (min-width:540px) {
.connectivity .rtBorder {border-right: 2px solid #000;}
.connectivity .rtBorder {height: 183px;} 
}
@media only screen and (min-width:769px) {
.xp-drawer-content .m-feature {margin-top: 100px !important;}
}
@media only screen and (min-width:1084px) {
.xp-drawer-content .m-feature, .four-K-drawer .m-feature {margin-top: 120px !important;}
}


.btmSlant {
    -ms-transform: skew(0deg, -3deg);
    -webkit-transform: skew(0deg, -3deg);
    transform: skew(0deg, -3deg);
    height: 100px;
    background-color: #171717;
    position: relative;
    z-index: 10;
    margin-top: -1px;
    margin-bottom: -40px;
    border-top: 1px solid #171717;
}
.btmSlant.tech {height: 10px;}
.xp-drawer-container :not(.f-disabled).c-pivot > div > a.f-active:hover, .xp-drawer-container :not(.f-disabled).c-pivot > header > a.f-active:hover {
    color: #ccc;
}
.xp-drawer-container :not(.f-disabled).c-pivot > div > a.f-active, .xp-drawer-container :not(.f-disabled).c-pivot > header > a.f-active {
    color: #fff;
    border-bottom: 2px solid #5DC21e;
}
.xp-drawer-container .c-pivot > div > a, .xp-drawer-container .c-pivot > header > a {
    color: #ccc;
}
.xp-drawer-container .m-multi-feature [role=tabpanel] .c-paragraph {
    width: 56vw;
    margin: 0 auto;
}
@media screen and (max-width: 1084px) {
.xp-drawer-container .m-multi-feature [role=tabpanel] .c-paragraph {
    width: 66vw;
}
}
@media screen and (max-width: 768px)  {
.xp-drawer-container .m-multi-feature [role=tabpanel] .c-paragraph {
    width: 83vw;
}
}
#xp-accolade-panel {
    background-color: #171717;
}
.c-image.blutooth {height: 59px; margin: 38px 0 18px;}
.connectivity {margin-bottom: -38px;}
@media screen and (max-width: 1084px) {
.connectivity {margin-bottom: -55px;}
}
.connectivity picture img {width: 100px !important;}
.four-K-drawer .m-multi-feature, .four-K-drawer .m-feature {margin-top: 80px; padding-top: 0px;}
/*************** End Drawer ********************/
@media screen and (max-width: 767px) {
.hero-4kMob {display: block;}
.hero-4kDsk {display: none;}
.fourK-ent .m-hero-item > picture::before {
    content: "";
    display: block;
    position: relative;
    z-index: 1;
    width: 100%;
    height: 100%;
}
}
@media screen and (min-width: 768px) {
.hero-4kMob {display: none !important;}
.hero-4kDsk {display: block;}
}
.fourK-ent .m-hero-item > div.m-ambient-video::before {
top: 0;
background: linear-gradient(180deg, rgba(255,255,255,0),rgba(255,255,255,0), #171717);
padding-bottom: 60%;
}
@media only screen and (max-width:767px) {
.fourK-ent [class*=f-x][class*=f-y].m-hero-item > div > div {
    top: calc(-20%);
}
.fourK-ent .m-hero-item > div {
    margin-bottom: -400px;
}

}
.fourK-pwr .m-image-intro {z-index: 999}

.fourK-ent .m-hero-item {padding-left: 0px; padding-right: 0px;}
.fourK-ent .m-hero-item > div {width: 100%;}
.fourK-ent .c-heading-2 {
    font-size: calc(200px + 1.18vw) !important;
    text-align: center;
    text-shadow: 0px 0px 15px #000;
    line-height: 0.9;
    margin-bottom: 0px !important;
    padding: 0;
    color: #fff;
}
.fourK-ent p.c-paragraph-2 {
    font-size: calc(17.6px + 1.18vw) !important;
    text-shadow: 0px 0px 13px #000;
    text-align: center;
    padding: 0;
    line-height: initial;
}
.fourK-icons picture img {width: 78px !important;}
.fourK-ent {padding-bottom: 48px;}
.fourK-ent .m-content-placement section {text-align: center;}
.fourK-ent .m-content-placement picture img {width: auto;}
.fourK-ent [data-grid~=container] { max-width: calc(1100px + 10%);}
.specs-container, .four-K-drawer {
    -ms-transform: skew(0deg, 3.1deg);
    -webkit-transform: skew(0deg, 3.1deg);
    transform: skew(0deg, 3.1deg);
    padding-top: 60px;
    padding-bottom: 80px;
}
.x-ray .slide-detail h2 {
    display: inline-flex;
    line-height: 95px;
}
.x-ray .slide-detail span {font-weight: normal !important;}
.x-ray .slide-detail picture img {margin-top: 36px;}
.scroll-magic #xp-x-ray-panel .slide-detail {z-index: 1000;}

.purchase-mod .m-hero-item {background-color: #171717 !important;}
.purchase-mod .c-call-to-action {background: none !important; border: 2px solid #5dc21e; }
 .purchase-mod hr.c-divider {
    border-top: 2px solid #464646;
    margin-top: 29px;
    margin-bottom: 7px;
}
.purchase-mod .c-badge, .newPurchase .c-badge {background-color: #5dc21e; color: #2f2f2f;}
.purchase-mod .c-caption-1 {padding-top: 32px; color: #919191;}
@media screen and (min-width: 0px) {
.x-sell .copyContent picture {margin-bottom: 36px !important;}
}
@media screen and (min-width: 768px) {
.x-sell .copyContent picture {margin-bottom: 40px;}
.purchase-mod .m-hero-item {height: 55vw;}
.x-sell .m-hero-item {height: 31.25vw;}
.x-sell .c-product-subtitle {font-size: 26px; }
}
@media screen and (min-width: 1084px) {
.x-sell .copyContent picture {margin-bottom: 48px;}
.purchase-mod .m-hero-item {height: 55vw;}
.x-sell .copyContent {margin-right: 7.5vw;}
}
@media only screen and (max-width:767px) {
.x-sell .c-product-subtitle {font-size: 34px; }
 .purchase-mod [class*=f-x][class*=f-y].m-hero-item > div > div {
    top: calc(55%);
}
 .purchase-mod .m-hero-item > div {
    height: 600px;
}
.x-sell .m-hero-item {background-color: #fff !important;}
.x-sell .m-hero-item > div {height: 305px;}
.x-sell .m-hero-item > div picture, [class*=f-x][class*=f-y].m-hero-item > picture::after {
    display: block !important;
    max-width: 400px;
    margin: 0 auto;
}

 .x-sell [class*=f-x][class*=f-y].m-hero-item > div > div {
    top: calc(45%);
}

}

/* specs */
.xp-drawer .oneFiftyCol {
    height: 200px;
    margin-bottom:2vw;
}
.specs-container .c-heading-1, .c-subheading-1  {font-weight: 400;}
.specs .m-banner {padding-bottom: 48px; padding-top: 115px;}
@media screen and (max-width: 1084px) {
.connectivity .x-type-center {padding-bottom: 12px;}
.specs .m-banner {padding-top: 65px; padding-bottom: 24px;}
}
@media screen and (max-width: 768px) {
.specs .m-banner {padding-top: 35px;}
}

@media screen and (min-width: 541px) {
.specs-container .c-heading-1 {font-size: calc(26px + 1vw); }
.specs-container .c-subheading-1 {font-size: calc(17px + 1vw); }
.specs-container .c-paragraph-1 {font-size: calc(10px + .5vw); }
}
@media screen and (min-width: 768px) {
.specs-container .c-heading-1 {font-size: calc(31px + 2vw); }
}
.specs {margin: 0 auto; float: none;}

  .specsRight {
      background-image: url('https://compass-ssl.xbox.com/assets/82/16/82167492-ca90-4295-86bf-8e4ffdc5c09e.jpg?n=Charlie_Background-Desktop_Tech-right_1920x486-02.jpg');
      background-size: contain;
      background-repeat: no-repeat;
  }

  .specsLeft {
      background-image: url('https://compass-ssl.xbox.com/assets/96/7d/967d2c12-ec4c-4fef-82ac-f0407bf3f0ac.jpg?n=Charlie_Background-Desktop_Tech-left_1920x486-02.jpg');
      background-size: contain;
      background-repeat: no-repeat;
  }
  #xp-drawer-panel .xp-drawer {
      display: none;
  }
  #xp-drawer-panel2 .xp-drawer {
    display: none;
  }
/* end specs */

.purchase-mod .social-icons {margin-top: 32px;}
.purchase-mod .social-icons img {width: 40px; height: 40px; margin-right: 8px;}
@media only screen and (min-width:541px) {
.drawer .h-divider {
    border-right: 1px solid #000!important;
}
}
@media only screen and (min-width: 0px) {
.fourK-ent .m-hero-item, #SoT {height: 95vw;}
}
@media only screen and (min-width:768px) {
.fourK-ent .c-heading-1 {font-size: 150px;}
.fourK-ent .m-hero-item, #SoT {height: 56.45vw;}
}
@media only screen and (min-width:1084px) {
.purchase-mod .buttons {position: relative; top: 8vw;}
}

@media only screen and (min-width:1400px) {
.purchase-mod .buttons {position: relative; top: 16vw;}
}
@media only screen and (min-width:1600px) {
.purchase-mod .buttons {position: relative; top: 20vw;}
}
@media (max-width:768px) {
}
@media only screen and (max-width:539px) {
.drawer2 [data-grid*=col-] {
    float: left;
}
}

.m-banner .c-image, .c-logo .c-image {
    width: auto !important; 
}
.faqMod {padding: 120px 0;}
.faqMod .c-heading-4 {color: #acacac !important;}
.faqMod p {color: #e3e3e3;}
.faqMod .c-drawer > button {color: #107c10;}
.faqMod .c-drawer.f-divider .f-toggle, .faqMod .c-drawer.f-divider > button, .faqMod .c-drawer.f-divider > header .f-toggle, .faqMod .c-drawer.f-divider > header > button {border-top: 1px solid #c8c8c8;}

#newRTBItemContent1 .c-heading {padding-top: 22px;}
@media screen and (min-width: 0px) {
.dskVid {display:none !important;}
.tabVid {display:none !important;}
.mobVid {display:block;}

.dskHero {display:none;}
.tabHero {display:block;}
}
@media screen and (min-width: 768px) {
.dskVid {display:none !important;}
.tabVid {display:block;}
.mobVid {display:none !important;}
}
@media screen and (min-width: 1084px) {
.dskVid {display:block;}
.tabVid {display:none !important;}
.mobVid {display:none !important;}

.dskHero {display:block;}
.tabHero {display:none;}
}

.c-badge.f-large { padding: 3px 14px 5px 10px;}

.blockBusters .m-ambient-video::before {
top: 0;
background:linear-gradient(180deg, #171717 0%, rgba(19, 19, 19, 0) 100%);
}
@media screen and (min-width: 0px) {
.blockBusters .m-image {width: 360px !important; margin: 0 auto;}
}
@media screen and (min-width: 768px) {
.blockBusters .m-image {width: 508px !important;}
.blockBusters a.bbMob {display:none;}
.blockBusters a.bbDsk {display:block;}
}
@media screen and (min-width: 1400px) {
.blockBusters .m-image {width: 900px !important;}
}

@media screen and (max-width: 1084px) {
.back-compat .floatCopy img {margin-top: 34px;}
.back-compat .floatCopy h5 {padding-top: 12px;}
}

.back-compat .floatCopy img {width: 56px; height: 56px;}
.blockBusters .c-heading-5, .back-compat .c-heading-5, .multiplayer-network .c-heading-5 {font-weight: 700;}
.blockBusters .m-banner .c-image {width: 150px !important; max-height: 100%;}
.blockBusters .m-banner .c-call-to-action {color: #5DC21E;}
.blockBusters .m-banner .c-call-to-action:hover {color: #5DC21E;}
.back-compat > div:nth-child(3)  {position: relative; margin-top: -13%; padding-bottom: 55px;}
.multiplayer-network > div:nth-child(2)  {position: relative; margin-top: -13%; padding-bottom: 72px;}
.blockBusters .c-paragraph-3 {padding-top: 14px; width: 56vw; margin: 0 auto;}
@media screen and (max-width: 1084px) {
.back-compat > div:nth-child(3)  {padding-bottom: 52px;}
.multiplayer-network > div:nth-child(2) {padding-bottom: 52px;}
.blockBusters .c-paragraph-3 {width: 66vw; margin: 0 auto;}
}
@media screen and (max-width: 767px) {
.back-compat > div:nth-child(3)  {padding-bottom: 32px;}
.multiplayer-network > div:nth-child(2) {padding-bottom: 32px;}
.blockBusters .vidCOntainer, .blockBusters .m-heading-2 {padding-left: 0px !important; padding-right: 0px !important;}
.blockBusters .c-paragraph-3 {width: 83vw; margin: 0 auto;}
.blockBusters a.bbMob {display:block;}
.blockBusters a.bbDsk {display:none;}
}
.multiplayer-network {background-color: #171717;}

.back-compat .m-banner, .multiplayer-network .m-banner {max-width: 88vw}
.c-drawer.f-divider.first > button {border-bottom: 1px solid #c8c8c8;}
.back-compat, .multiplayer-network {max-width: 1920px; margin: 0 auto;}

/* 4-up content fixes */
[data-grid~=pad-12x][data-grid~=stack-3].m-rich-content-block > div [class*=c-heading]:first-child {
    padding-top: 38px;
}
@media only screen and (min-width: 1084px) {
.m-rich-content-block[data-grid~=pad-12x][data-grid~=stack-3]>div+div [class*=c-heading]:first-child {
    padding-top: 38px;
}
}

    .xbx-pageBar.m-page-bar {
        max-width: 100%;
        background: rgba(0, 0, 0, .7);
        color: #fff;
        border-bottom: none;
        left: 0px;
        -ms-transform: none;
        transform: none;
    }
    .xbx-pageBar.m-page-bar > div .context-menu .c-list li {
    margin: 0 20px;
     }


        .xbx-pageBar.m-page-bar.f-sticky {
            z-index: 999;
        }

        .xbx-pageBar.m-page-bar > div .context-menu .c-list li .c-hyperlink {
            color: #fff;
        }

            .xbx-pageBar.m-page-bar > div .context-menu .c-list li .c-hyperlink:focus, .xbx-pageBar.m-page-bar > div .context-menu .c-list li .c-hyperlink:focus {
                color: #fff;
                font-weight: 700;
            }

        .xbx-pageBar.m-page-bar a.c-call-to-action {
            border: 2px solid #5dc21e;
            color: #fff;
            background: none;
        }

            .xbx-pageBar.m-page-bar a.c-call-to-action:hover {
                border: 2px solid #107c10;
                color: #c8c8c8;
                background: none;
            }

        .xbx-pageBar.m-page-bar .c-menu-item a {
            background: #000;
        }

        .xbx-pageBar.m-page-bar .c-select-menu > a::after, .xbx-pageBar.m-page-bar .c-select-menu > button::after {
            color: #fff;
        }

        .xbx-pageBar.m-page-bar .c-select-menu > a,
        .xbx-pageBar.m-page-bar .c-select-menu > a:hover,
        .xbx-pageBar.m-page-bar .c-select-menu > a:hover::after,
        .xbx-pageBar.m-page-bar .c-select-menu > button,
        .xbx-pageBar.m-page-bar .c-select-menu > button:hover,
        .xbx-pageBar.m-page-bar .c-select-menu > button:hover::after {
            color: #fff;
        }

        .xbx-pageBar.m-page-bar .c-menu-item a:focus,
        .xbx-pageBar.m-page-bar .c-menu-item a:hover,
        .xbx-pageBar.m-page-bar .c-menu-item button:focus,
        .xbx-pageBar.m-page-bar .c-menu-item button:hover,
        .xbx-pageBar.m-page-bar .c-menu-item span:focus,
        .xbx-pageBar.m-page-bar .c-menu-item span:hover {
            background: #464646;
        }
@media only screen and (max-width:767px) {
.xbx-pageBar.m-page-bar > div {
    width: 70%;
}
}
/* parallax new */
   .parallaxarea [data-grid~=container] {
    max-width: calc(1237px + 10%);
    }

  .parallaxarea {    
    background-position: center;
    background-repeat: no-repeat;
    position: relative;
    background-color: #171717;
    color: #fff;
  }
  .parallaxarea .plxbgImg {
    background-image: url("https://compass-ssl.xbox.com/assets/03/01/030161a8-95b0-4569-a419-6fba95889be9.jpg?n=PS_1920_MostPowerful2_img.jpg");
    background-position: center;
    background-repeat: no-repeat;
     background-size: 2910px;
    position: fixed;
  }
  @media (max-width:768px) {
    .parallaxarea .plxbgImg {
    background-position: center;
    background-repeat: no-repeat;
    background-size: cover;
    height: 100vw;
    top: 25vw;
    }
  }
  .plx-layer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }
  .plx-content .c-heading-3 {
    padding: 0;
  }
  .plx-content .c-paragraph-4 {
    margin-top: 7px;
    margin-bottom: 2.51vw;
  }
  .fgContent {
    position: relative;
    z-index: 30;
    margin-bottom: 71px;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
  .parallaxarea .m-heading-2 {
    margin-bottom: 28vh;
  }
  .plx-content {
      background-color: rgba(47, 47, 47, .85);
      /*padding: 40px 2vw 10px !important;*/
      padding: 0 !important;
      border-bottom: 2px solid #5cc11d;
      max-width: 443px;
  }
  .plxText {
    padding: 16px 3.9vw 10px !important;
  }
  .sDetails canvas {
    margin-bottom: 5px;
    max-width: 230px;
    width: 100%;
  }
  .sDetails .stripeWrapper {
    background-color: #787878;
    height: 20px;
    position: relative;
    margin-bottom: 8px;
    max-width: 230px;
  }

  .sDetails .stripeWrapper .stripe {
    width: 0%;
    height: 100%;
    background-color: white;
  }

  .sDetails .stripeWrapper .gray-stripe {
    width: 0%;
    height: 100%;
    background-color: #787878;
    position: absolute;
    top: 0;
  }
   .sDetails .c-caption {
    margin-top: 12px;
    text-transform: uppercase;
    font-weight: 700;
    }

.sDetailsvid {
    width: 100%;
    max-width: 443px;
}

  .spacerBlock {height: 40vw;}
/* mosaic new */
.MosaicDiv a:focus {outline: 2px #fff dashed;}
    .tg-mosaic.c-dialog.f-lightbox [role=dialog] {
        max-width: 100%;
    }

    .tg-mosaic.c-dialog.f-lightbox > [role=presentation] + .c-glyph {
        z-index: 1001;
    }

    .tg-mosaic.c-dialog [role=dialog] {
        max-height: 100%;
        overflow: hidden;
    }

    .tg-mosaic .m-hero-item::before {
        padding-bottom: 62%;
    }
    #DocumentBody {transition: all 2s ease;}
/* accolade rotator */
    .notransform {
      transform: translateY(0) !important;
    }
.compatdrawer .c-feature>div .c-paragraph, .compatdrawer .m-feature>div .c-paragraph {
    width: 100%;
}
#xp-drawer-panel3 .xp-drawer {
    display: none;
}

/********* New Purchase Panel ************/
@media (min-width: 768px) and (max-width:1083px) {
.newPurchase [data-grid~=stack-3] > [data-grid] {width: 500px;}
}

.newPurchase {background-color: #171717; color: #fff;}
.retail-purchase {border-bottom: 1px solid #c8c8c8; border-top: 1px solid #c8c8c8;}
.retail-purchase img {margin-left: auto; margin-right: auto;}

.newPurchase a.f-lightweight, .ps-widget.ps-theme-1 {color: #5dc21e !important;}

.p-content .m-area-heading {padding-top: 8.1vw !important;}
.p-content h2 {padding-top: 12px;}
.p-content h3 {padding-top: 23px;}
.p-content p {padding-top: 15px;}
.p-content .c-list {margin-top: 20px;}
.p-content .c-list li {padding: 4px 0;}
.p-content .c-divider {border-top: 1px solid #c8c8c8;}

.retailContain {width: 975px; margin: 0 auto;}
.retailContain .m-content-placement {padding-left: 0px; padding-right: 0px;}
.retailContain .m-content-placement-item {float: left; padding: 0 12px;}

.btnBox {
    padding-left: 12px;
    padding-right: 12px;
    padding-top: 25px;
}
.btnBox p {padding-top: 0px;}
.btnBox h4 {padding-top: 22px;}
.btnBox .c-group {padding-top: 25px;}

@media screen and (max-width: 1725px) {
 .retailer-boxShot h2 {font-size: 50px !important;}
}
@media screen and (max-width: 1178px) {
 .retailer-boxShot h2 {font-size: 40px !important;}
}
@media screen and (max-width: 1083px) {
     .p-content .m-area-heading {padding-top: 20px !important;}
     .retailContain {width: 700px; margin: 0 auto;}
}
@media screen and (max-width: 767px) {
    .retailContain {width: 470px; margin: 0 auto;}
    .retailer-boxShot h2 {text-align: center;}
    .newPurchase .c-group {display: inline-table;}
    .newPurchase .ps-widget {padding-left: 0px; margin-top: 12px; cursor: pointer;}
    .newPurchase .customRetCTA {margin-left: 0px !important; margin-top: 12px; cursor: pointer;}
}
@media screen and (max-width: 470px) {
    .retailContain {width: 250px; margin: 0 auto;}
}


@media (min-width:768px) and (max-width: 1084px) {
   .retailer-boxShot h2 {margin-left: 4vw;}
}
@media only screen and (min-width:0) {
  .retailer-boxShot { height: 550px; padding-top: 60px; margin: 0 auto; width: 83vw;}
  .retailer-boxShot img {margin: 0 auto;}
 .retail-purchase {width: 83vw; margin: 0 auto 80px auto; height: 250px; float: none;}
 .retail-purchase img, .retail-purchase a, .retail-purchase h3 {margin-top: 24px;}
 .retail-purchase p {margin-top: 15px;}
}
@media only screen and (min-width:540px) {   
     .retail-purchase {width: 83vw; height: 303px;}
     .retail-purchase h3 {margin-top: 23px;}
    .retail-purchase p {margin-top: 15px;}
    .retail-purchase img, .retail-purchase a {margin-top: 40px;}
.btnBox {
    padding-left: 24px;
    padding-right: 24px;
}
}
@media only screen and (min-width:768px) {
     .retailer-boxShot { height: 396px; padding-top: 80px; margin: 0 auto; width: 83vw;}
     .retailer-boxShot h2 {margin-top: 92px;}     
     .retail-purchase {width: 83vw; height: 123px;}
     .retail-purchase h3 {margin-top: 23px;}
    .retail-purchase p {margin-top: 15px;}
    .retail-purchase img, .retail-purchase a {margin-top: 40px;}
.btnBox {
    padding-left: 36px;
    padding-right: 36px;
}
#gallery2 {padding-bottom: 25px;}
}
@media screen and (min-width: 1084px) {
     .retailer-boxShot { height: 396px; padding-top: 80px; margin: 0 auto;}
     .retailer-boxShot h2 {margin-top: 164px;}    
     .retail-purchase {height: 110px;}
     .retail-purchase h3,  .retail-purchase p {line-height: 110px; margin-top: 0px;}
     .retail-purchase img, .retail-purchase a {margin-top: 32px;}
     .newPurchase > picture {display: none;}
     /*.btnBox {width: 525px;}*/
      .btnBox .c-divider.f-pad-top-6x {margin-top: 36px !important;}
}
@media only screen and (min-width:1400px) {
 .retailer-boxShot {width: 70vw;}
 .retail-purchase {width: 70vw; height: 110px;}
.p-content {padding-left: 85px;}
.btnBox {
    padding-left: 48px;
    padding-right: 48px;
}
}

a.c-call-to-action.green-brdr, .wowHero a.c-call-to-action {
    border: 2px solid #5dc21e;
    color: #fff;
    background: none !important;
    text-transform: uppercase;
}
a.c-call-to-action.green-brdr:hover, .wowHero a.c-call-to-action:hover {
    border: 2px solid #107c10;
    color: #c8c8c8;
    background: none;
}

.xb1x.c-dialog.f-lightbox [role=dialog], .itb.xb1x.c-dialog.f-lightbox [role=dialog] {
    background: #000;
    color: #fff;
    border-color: transparent;
    max-width: 100%;
    overflow: visible;
    padding: 0;
}
.itb.xb1x.c-dialog.f-lightbox [role=dialog] {
    background: rgba(0,0,0,0.1);
}
.xb1x.c-dialog [role=dialog] {
    -ms-transform: translate(-50%,-50%);
    transform: translate(-50%, -50%);
    background: #FFF;
    border: 1px solid #0F760F;
    max-height: 100%;
    width: 100%;
    z-index: 1000;
}
.xb1x.c-dialog.f-lightbox > [role=presentation] + .c-glyph {
    top: 40px;
    right: 40px;
    color: #5dc21e; 
    z-index: 1001;
}
@media screen and (max-width: 767px) {
.witb .c-list li {text-align: left;}
.witb h3 {padding-top: 58px;}
.witb picture {text-align: center;}
}
.witb {overflow: hidden; padding-bottom: 48px;}
.witb .c-list {padding-top: 16px; padding-right: 48px;}
.witb .c-list li {padding: 4px 0;}

/* WITB logos US*/
.ms-logo {width: 197px; height: 43px;}
@media screen and (min-width: 0px) {
.usa.retailer-logos picture img {width: 208px; height: 117px; padding: 2vw;}
}
@media screen and (min-width: 1084px) {
.usa.retailer-logos picture img {width: 300px; height: 169px; padding: 2vw;}
}
/* WITB logos ROW*/
.ms-logo {width: 197px; height: 43px;}
@media screen and (min-width: 0px) {
.retailer-logos picture img {width: auto; height: 117px; padding: 2vw;}
.retailer-logos picture .svg {width: 208px; height: 117px; padding: 2vw;}
}
@media screen and (min-width: 1084px) {
.retailer-logos picture img {width: auto; height: 169px; padding: 2vw;}
.retailer-logos picture .svg {width: 280px; height: 169px; padding: 2vw;}
}

/*** Mosiac overrides ****/
 .box .c-glyph {position: relative; bottom: 9.4vw; left: 45%;}
 .box .c-caption {position: relative; bottom: 35%; left: 16px;}
.MosaicDiv button.c-action-trigger {
    background: rgba(0,0,0,.6) !important;
    border-radius: 50% !important;
    font-size: 24px !important;
    line-height: 14px !important;
    padding-right: 5px !important;
    height: 48px !important;
    width: 48px !important;
    color: #FFF !important;
} 
@media screen and (max-width: 1800px) {
 .box .c-caption {position: relative; bottom: 40%; left: 16px;}
}
@media screen and (max-width: 1600px) {
 .box .c-caption {position: relative; bottom: 45%; left: 16px;}
}
@media screen and (max-width: 1400px) {
 .box .c-glyph {position: relative; bottom: 11vw; left: 45%;}
 .box .c-caption {position: relative; bottom: 50%; left: 16px;}
}
@media screen and (max-width: 1200px) {
 .box .c-caption {position: relative; bottom: 60%; left: 16px;}
}
@media screen and (max-width: 1083px) {
 .box .c-caption {position: relative; bottom: 70%; left: 16px;}
}
@media screen and (max-width: 890px) {
 .box .c-caption {position: relative; bottom: 70%; left: 16px;}
}
@media screen and (max-width: 768px) {
a.c-call-to-action.green-brdr {
    height: 40px;
}

#gallery2 {padding-top: 64px;}
 .box .c-glyph {position: relative; bottom: 17vw; left: 41%;}
 .box .c-caption {position: relative; bottom: 57%; left: 16px;}
}
@media screen and (max-width: 540px) {
 .box .c-glyph {position: relative; bottom: 25vw; left: 38%;}
 .box .c-caption {position: relative; bottom: 98%; left: 16px;}
}

.hiddenCTA {
  display: none !important;
}
a.c-call-to-action span.shopOtherText,
a.c-call-to-action span.shopNowText {
  display: none;
}
.price-spider .green-brdr {
    border: 2px solid #5dc21e;
    color: #fff !important;
    background: none !important;
}
.legal {
    background-color: #171717;
}

/* End TG ovewrrides */