/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain)*/
html, body, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr,
acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong,
sub, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption,
tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer,
header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; }
h1, h2, h3, h4, h5, h6 { color: #3a3a3a; }
h4 { text-transform: none; }
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ul { list-style: disc; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
.clear { display: none; }
.container { width: 100%; }
body div#BodyFooter { margin-top: 0px; }
body { color: #3a3a3a; }
section.body, #bodycolumn { color: #3a3a3a; }
.text-cta { font-family: Segoe UI Semibold, segoe, arial, helvetica, sans-serif; font-size: 15px; color: #5dc21e !important; }
.text-cta-white { font-family: Segoe UI, segoe, arial, helvetica, sans-serif; font-size: 18px; color: #fff !important; }
.contentBlock { overflow: visible; }
/* Mobile fixes */

.splashBlockHeader { display: none; }
section.body { margin: 0 auto; max-width: 1280px; min-width: 320px; overflow: hidden; }
div#BodyContent { width: 100%; }
.center-wrapper { width: 100%; margin: 0 auto; }
.contentBlock { border-bottom: none; padding: 0; min-height: 0px; }
.header img { width: 100%; height: auto; margin: 0; }

/* lightbox shell menu fix */
.shell-category-header { z-index: 10 !important; }
/****************************************************************/
/* normalized element styles */




/* End normalized element styles */
/* Full width image blades */


.blackBG { color: #fff; background-color: #000; }
.blackBG h2 { color: #fff !important; }
.lightGreyBG { color: #000; background-color: #e3e3e3; }
.lightGrey h2 { color: #000; }
.greenBG { color: #fff; background-color: #107c10; }
.greenBG h2 { color: #fff; }
.darkGreyBG { color: #fff; background-color: #3a3a3a; }
.darkGreyBG h2 { color: #fff; }
.mediumGreyBG { color: #fff; background-color: #282828; }
.mediumGreyBG h2 { color: #fff; }


.bbg { border-bottom: 1px solid #c1c1c1;
           width: 90%; margin: 0 auto; }
.thirtyTwoPad {padding: 32px 0;}
/************************************** HERO **********************************/
@media (min-width: 769px) {
.deskHero {display: block;}
.mobileHero {display: none;}
}

@media (max-width: 768px) {
.mobileHero {display: block;}
.deskHero {display: none;}

}
/************************************** END HERO **********************************/



.FullWidthImage-section { position: relative; }
@media (min-width: 1680px) {
    .LcolPad { padding-right: 250px !important; }
    .RcolPad { padding-left: 80px !important; }
}
.FullWidthImage-section .button-container { margin-top: 40px; }
@media screen and (max-width: 767px) {
    .FullWidthImage-section { 
        /* padding-top: -webkit-calc(44.5px + 1.8vw);
           padding-top: calc(44.5px + 1.8vw); */ 
           padding-bottom: -webkit-calc(44.5px + 1.8vw); 
           padding-bottom: calc(44.5px + 1.8vw); }
}

.FullWidthImage-section .FullWidthImage-image { display: none; }

@media screen and (min-width: 768px) {
    .FullWidthImage-section .FullWidthImage-image { display: block; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-position: center; background-repeat: none; background-size: 100%; background-size: cover; }
    .rtextCol { padding-left: 150px !important; }
}
@media (min-width: 768px) and (max-width: 850px) {
    .FullWidthImage-section { padding-top: -webkit-calc(44.5px + 1.8vw); padding-top: calc(44.5px + 1.8vw); padding-bottom: -webkit-calc(44.5px + 1.8vw); padding-bottom: calc(44.5px + 1.8vw); }
}
.FullWidthImage-section img { width: 100%; height: auto; margin-bottom: 12px; }
@media all and (min-width: 540px) {
    .FullWidthImage-section img { margin-bottom: 12px; }
}
@media all and (min-width: 1400px) {
    .FullWidthImage-section img { margin-bottom: 12px; }
}
@media screen and (min-width: 768px) {
    .FullWidthImage-section img { display: none; }
}
.FullWidthImage-section .isolated-link { margin-bottom: 0; }
@media screen and (max-width: 768px) {
.beatlesLogo {display: none !important;}
}
@media screen and (min-width: 768px) {
    .FullWidthImage-section > .ms-grid > .ms-row { height: 460px; height: 60vw; }
     .FullWidthImage-image {background-image: url('http://compass.xbox.com/assets/62/ae/62ae666e-6ccd-404f-93af-8376d59b0221.jpg?n=Groove-Music_blade_background_desktop_1084x589_02.jpg');
                          background-position: center;}
.beatlesLogo {display: block !important;}
}
@media screen and (min-width: 1084px) {
    .FullWidthImage-section > .ms-grid > .ms-row { height: 589px; }
    .FullWidthImage-section > .ms-grid > .ms-row.advTechFW { height: 589px; /*height: 31vw; */ }
     .FullWidthImage-image {background-image: url('http://compass.xbox.com/assets/5b/8a/5b8af802-89d5-43da-879e-4631380a7322.jpg?n=Groove-Music_blade_background_fullwidth_1920x589_02.jpg');
                          background-position: center;}
     .beatlesLogo {display: block !important;}
}


@media (max-width: 767px) {
    .gallery.text-cta.desktop { display: none; }
    .gallery.text-cta-white.desktop { display: none; }
}
/* End Full width image blades */


.RetailerLogos { float: left; padding-right: 25px; padding-bottom: 25px; }
.RetailerLogos img { width: 100%; }
.logoParade { padding-top: 40px; }
.blade_bg { background-color: #282828; color: #fff; }
.blade_bg:nth-child(odd) { background-color: #000; }

.containerIMG h3 { text-align: left; }
.containerIMG .boxShot { margin-bottom: 11px; width: 100%; }
.priceDiv .price { text-align: left; padding-left: 0px; display: inline-block; width: 50%; }
.priceDiv .price span { text-decoration: line-through; }
.priceDiv .price.goldPrice { color: #F9E477; }

/********************************************************************************************/
.bfWeekendDealsH { padding-top: -webkit-calc(44.5px + 1.8vw); padding-top: calc(44.5px + 1.8vw); }
.bfJumpAhead { max-width: 1084px; margin: 0 auto; padding-top: -webkit-calc(10px + 1vw); padding-top: calc(10px + 1vw); padding-bottom: -webkit-calc(44.5px + 1.8vw); padding-bottom: calc(44.5px + 1.8vw); }
.bfJumpAhead .priceDiv { position: relative; bottom: 0px; max-width: 242px; margin: 0 auto; }
.bfJumpAhead .containerIMG { max-width: 242px; margin: 0 auto; height: 450px; }
@media (min-width: 541px) and (max-width: 768px) {
    .bfJumpAhead .containerIMG { height: 400px; }
}
@media (max-width: 540px) {
    .bfJumpAhead .containerIMG { height: 440px; margin-top: 40px; }
}

/********************************************************************************************/
@media (min-width: 1540px) {
    .gameBlades { width: 1540px; margin: 0 auto; }
}
@media (min-width: 1310px) and (max-width: 1539px) {
    .gameBlades { width: 1310px; margin: 0 auto; }
}
@media (min-width: 1048px) and (max-width: 1309px) {
    .gameBlades { width: 1048px; margin: 0 auto; }
}
@media (min-width: 768px) and (max-width: 1047px) {
    .gameBlades { width: 768px; margin: 0 auto; }
}
@media (min-width: 540px) and (max-width: 767px) {
    .gameBlades { width: 560px; margin: 0 auto; }
}
@media (max-width: 539px) {
    .gameBlades { width: 295px; margin: 0 auto; }
}
.gameBlades .containerIMG { max-width: 211px; height: 400px; }
.gameBlades .containerIMG.square { height: 310px; }
.gameBlades .containerIMG.vid { height: 385px; }
.gameBlades { padding-top: -webkit-calc(10.5px + 1.8vw); padding-top: calc(10.5px + 1.8vw); padding-bottom: -webkit-calc(10.5px + 1.8vw); padding-bottom: calc(10.5px + 1.8vw); }
.gameBlades .gameDiv { margin: 0 25px; max-width: 211px; padding-top: -webkit-calc(10.5px + 1.6vw); padding-top: calc(10.5px + 1.6vw); padding-bottom: -webkit-calc(8px + 1vw); padding-bottom: calc(8px + 1vw); position: relative; }
.gameBlades .ms-grid { width: 100%; }
.gameBlades .priceDiv { position: relative; bottom: 0px; }

/******************************/

.fittyBlade { max-width: 1600px; margin: 0 auto; }
@media (min-width: 769px) {
    .fittyBox { text-align: right; }
}
@media (max-width: 768px) {
    .fittyBox { text-align: center; }
    .fittyBox.Right { padding-top: 60px; }
}
.fittyRetail { padding-top: 44px; }
.copyPad {
    margin-top: 20px;
}

/********************************/
.gameDivsWrapper { overflow: hidden; -webkit-transition: max-height 0.5s ease; transition: max-height 0.5s ease; }
.hide { display: none; }
.svg-container { align-items: center; justify-content: center; transition: background-color 0.5s; }
.svg-container svg { width: 25px; height: 25px; fill: #fff; vertical-align: sub; }
.buttonP.green-bgc { max-width: 282px; }
.overlay360 { position: absolute; width: 211px; }
.overlay360 img { width: 100%; }
/************************ End Black Friday ************************************/


/**********************************************************************************************************************************************************************************************************************************************
********************************************************************************************************************************************************************************************************************************/
/* game list */
/********************************************************************************************/

.gameBlades .containerIMG  {max-width: 183px; height: 400px; display: inline-block; padding: 0 2px; }
.gameBlades .containerIMG.square {height: 310px;}
.gameBlades .containerIMG.vid {height: 385px;}
.gameBlades { padding-top: -webkit-calc(10.5px + 1.8vw);
                       padding-top: calc(10.5px + 1.8vw);
                       padding-bottom: -webkit-calc(10.5px + 1.8vw);
                       padding-bottom: calc(10.5px + 1.8vw);}
.gameBlades .gameDiv {margin: 0 25px; max-width: 211px;
                                      padding-top: -webkit-calc(10.5px + 1.6vw);
                                      padding-top: calc(10.5px + 1.6vw);
                                      padding-bottom: -webkit-calc(8px + 1vw);
                                      padding-bottom: calc(8px + 1vw); 
                                      position: relative;}
.gameBlades .ms-grid {width: 100%;} 
 .gameBlades .priceDiv {position: relative; bottom: 0px;} 
.gamesModuleWrap {padding: 0 40px;}
.gameDivsWrapper {
  overflow: hidden; 
  -webkit-transition: max-height 0.5s ease;
  transition: max-height 0.5s ease;
}
.hide {
  display: none;
}
.svg-container {
  align-items: center;
  justify-content: center;
  transition: background-color 0.5s;
}
.svg-container svg {width: 25px; height: 25px; fill: #fff; vertical-align: sub;}
.buttonP.green-bgc { max-width: 300px;}



/************** Legal Footer *************************************/
.tgd_xbox-BlackStripe.greenbordersmall { border-top: 1px solid #107c10; }
.tgd_xbox-BlackStripe { width: 100%; background: #000000; }
.tgd_xbox-LegalStripe { padding-bottom: 50px; }
.tgd_xbox-ContentStripe { margin: 0 auto; padding: 40px 50px 60px; width: 100%; max-width: 1280px; box-sizing: border-box; }
.tgd_xbox-LegalStripe > p, .tgd_xbox-LegalStripe > ol li, .tgd_xbox-LegalStripe > ol p { margin-bottom: 10px; font-style: italic; font-size: calc(9px + 0.22vw); }
.tgd_xbox-BlackStripe h1, .tgd_xbox-BlackStripe h4, .tgd_xbox-BlackStripe p, .tgd_xbox-BlackStripe ol li { color: #ffffff; }
/* End legal footer */
/* retailer popups */
@media (min-width: 1280px) {
    .retailerpopup { background-color: white; margin: 0 auto; width: 1280px; right: 0; display: none; z-index: 20; padding-left: 60px; }
    .popimage { display: inline-block; width: 470px; padding: 20px; vertical-align: middle; }
    .popimage img { width: 470px; position: relative; bottom: 30px; }
    .popinfo { display: inline-block; width: 50%; padding: 20px; vertical-align: middle; }
    .popretaillogo { width: 24%; display: inline-block; }
    .popretaillogo img { width: 96%; max-width: 130px; }
    .popclosebutton { left: 96%; }
    .popclosebutton { top: 10%; }
}
@media (min-width: 981px) and (max-width: 1279px) {
    .retailerpopup { background-color: white; margin: 0 auto; width: 960px; right: 0; display: none; z-index: 20; }
    .popimage { display: inline-block; width: 470px; padding: 20px; vertical-align: middle; }
    .popimage img { width: 470px; position: relative; bottom: 40px; }
    .popinfo { display: inline-block; width: 50%; padding: 20px; vertical-align: middle; }
    .popretaillogo { width: 32%; display: inline-block; }
    .popretaillogo img { width: 100%; max-width: 130px; }
    .popclosebutton { left: 96%; }
    .popclosebutton { top: 10%; }
}
.otherretailerspop, #otherretailers { color: #107c10; font-size: 18px; cursor: pointer; }
@media (min-width: 740px) and (max-width: 980px) {
    .retailerpopup { background-color: white; margin: 0 auto; width: 740px; right: 0; display: none; z-index: 20; text-align: center; }
    .popimage { display: inline-block; width: 360px; padding: 20px 8px; vertical-align: middle; }
    .popinfo { display: inline-block; width: 360px; padding: 20px; vertical-align: middle; }
    .popimage img { width: 380px; margin: 8px 0; position: relative; bottom: 30px; }
    .popretaillogo { width: 150px; display: inline-block; }
    .popretaillogo img { width: 150px; }
    .popclosebutton { left: 96%; }
    .popclosebutton { top: 10%; }
}
@media (max-width: 739px) {
    .retailerpopup { background-color: white; margin: 0 auto; width: 320px; right: 0; display: none; z-index: 1001; text-align: center; top: 4% !important; }
    .popimage { display: none; }
    .popinfo { display: inline-block; width: 300px; padding: 20px 8px; vertical-align: middle; }
    .popretaillogo { width: 136px; margin: 8px 0; display: inline-block; }
    .popretaillogo img { width: 136px; }
    .popclosebutton { left: 85%; }
    .popinfo h4 { margin-top: 20px; }
    .popclosebutton { top: 3%; }
}


.popclosebutton { text-align: right; position: absolute; background-color: rgb(50, 50, 50); border-radius: 20px; padding: 1px; width: 25px; font-size: 1px; }
.popclosebutton img { width: 25px; vertical-align: middle; }
.popclosebutton :hover { cursor: pointer; }
.popretailerlist { margin-top: 12px; }
.retailerpopup { position: relative; border-top: 1px solid #c1c1c1; }
.matchinnerbg { background-color: white; }

/************** retailer pops *************************************/

#consolesList {align-items: inherit;}
/* Alternating borders */
   @media (min-width: 769px) {
   .vertRule {border-right: 1px solid #c1c1c1; ;} 
   }

.product-price {margin-bottom: 18px;}
.productBorder {padding: 42px 0 42px 0;}
.singleProduct img {margin-top: 0px;}
@media (min-width: 1400px) {
.singleProduct {padding: 0 4vw 0 4vw; height: 758px; margin: 33px 0 33px 0;}

.singleProduct .button-container {position: absolute;  bottom: 0px;}
}
@media (min-width: 1084px) and (max-width: 1399px) {
.singleProduct {padding: 0 4vw 0 4vw; height: 630px; margin: 33px 0 33px 0;}
.singleProduct .button-container {position: absolute;  bottom: 0px;}
}
@media (min-width: 769px) and (max-width: 1083px) {
.singleProduct {padding: 0 4vw 0 4vw; height: 490px; margin: 33px 0 33px 0;}
.singleProduct .button-container {position: absolute;  bottom: -30px;}
}
@media (max-width: 768px) {
.singleProduct {padding: 0 4vw 0 4vw; height: 620px; margin: 28px 0 28px 0;}
.singleProduct .button-container {position: absolute;  bottom: -30px;}
}
@media (min-width: 676px) and (max-width: 767px) {
  .singleProduct {height: 600px}
}
@media (min-width: 577px) and (max-width: 675px) {
  .singleProduct {height: 570px}
}
@media (min-width: 511px) and (max-width: 576px) {
  .singleProduct {height: 510px}
}
@media (max-width: 510px) {
  .singleProduct {height: 460px}
}