/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain)*/
html, body, div, 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; }
/* HTML5 display-role reset for older browsers */

article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
ol, 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 { }

section.body, #bodycolumn { background-color: #f1f1f1; }

.text-cta { font-family: Segoe UI Semibold, segoe, arial, helvetica, sans-serif; font-size: 15px; color: #5dc21e !important; }
.contentBlock { overflow: visible; }
/* Mobile fixes */
.splashBlockHeader h2 { display: none; }
.contentBlock h2 { margin-top: 0px; margin-bottom: 0px; }
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; }
/* Colors */
.XboxGreen { color: #107c10; }
.BrightGreen { color: #5dc21e; }
.SlateGrey { color: #3a3a3a; }
.MediumGrey { color: #6b6b6b; }
.LightGrey { color: #c2c2c2; }
.OffWhite { color: #f1f1f1; }
.transBG-white {background: rgba(239,237,235, .6);}
/* Colors */

/* normalized element styles */
@media (min-width: 1281px) {
    /* Desktop */
    .sectionGradient { background-image: url('http://compass.xbox.com/assets/59/c8/59c8a9d0-7a6f-4b87-850a-7613eeb49caf.jpg?n=xbox-glp_misc-module_background_desktop_1260x5.jpg'); background-repeat: repeat-y; }
    .xboxH1 { font-size: 40px; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; padding-bottom: 20px; }
    .xboxH2 { font-size: 28px !important; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; margin-bottom: 28px !important; color: #3a3a3a !important; }
    .xboxH2 span {font-size: 18px; }
    .xboxH3 { font-family: Segoe UI, Arial, Sans-Serif; font-size: 16px; line-height: 1.3; color: #3a3a3a; }
    .xboxH3 span { font-size: 24px; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; }
    .xboxH4 { font-family: Segoe UI Semibold, Arial, Sans-Serif; font-size: 18px; margin-bottom: 20px; text-transform: none; }
    .xboxP { font-size: 15px; font-family: Segoe UI, Arial, Sans-Serif; line-height: 1.3; margin-bottom: 12px; }
    .xboxUL { padding-left: 15px; font-family: Segoe UI, Arial, Sans-Serif; font-size: 16px; line-height: 1.3; color: #3a3a3a; }
}
@media (min-width: 769px) and (max-width: 1280px) {
    /* tablet */
    .sectionGradient { background-image: url('http://compass.xbox.com/assets/a5/6a/a56aad66-f28d-402c-a004-5f4b14158132.jpg?n=xbox-glb_misc-module_background_tablet_754x5.jpg'); background-repeat: repeat-y; }
    .xboxH1 { font-size: 36px; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; padding-bottom: 20px; }
    .xboxH2 { font-size: 24px !important; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; margin-bottom: 28px !important; color: #3a3a3a !important; }
    .xboxH3 { font-family: Segoe UI, Arial, Sans-Serif; font-size: 16px; line-height: 1.3; color: #3a3a3a; }
    .xboxH3 span { font-size: 24px; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; }
    .xboxH4 { font-family: Segoe UI Semibold, Arial, Sans-Serif; font-size: 18px; margin-bottom: 20px; text-transform: none; }
    .xboxP { font-size: 13px; font-family: Segoe UI, Arial, Sans-Serif; line-height: 1.3; margin-bottom: 10px; }
    .xboxUL { padding-left: 13px; font-family: Segoe UI, Arial, Sans-Serif; font-size: 16px; line-height: 1.3; color: #3a3a3a; }
}
@media (max-width: 768px) and (min-width: 321px) {
    .sectionGradient { background-image: url('http://compass.xbox.com/assets/5b/e1/5be1ace7-23f5-456b-82c5-6771da6b9a15.jpg?n=xbox-glp_misc-module_background_mobile_470x5.jpg'); background-repeat: repeat-y; }
    .mainCTA {left: 0px !important;}
}
@media (max-width: 320px) {
    .sectionGradient { background-image: url('http://compass.xbox.com/assets/24/7a/247ade77-a3c2-4066-bf1a-486c0bc90343.jpg?n=xbox-glp_misc-module_mobile_background_310x5.jpg'); background-repeat: repeat-y; }
}
@media (max-width: 768px) {
    /* tablet */
    .xboxH1 { font-size: 32px; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; padding-bottom: 20px; }
    .xboxH2 { font-size: 18px !important; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; margin-bottom: 28px !important; color: #3a3a3a !important; }   
    .xboxH3 { font-family: Segoe UI, Arial, Sans-Serif; font-size: 16px; line-height: 1.3; color: #3a3a3a; }
    .xboxH3 span { font-size: 24px; font-family: Segoe UI Light, Arial, Sans-Serif; line-height: 1.2; }
    .xboxH4 { font-family: Segoe UI Semibold, Arial, Sans-Serif; font-size: 18px; margin-bottom: 20px; text-transform: none; }
    .xboxP { font-size: 14px; font-family: Segoe UI, Arial, Sans-Serif; line-height: 1.5; margin-bottom: 10px; }
    .xboxUL { padding-left: 14px; font-family: Segoe UI, Arial, Sans-Serif; font-size: 16px; line-height: 1.5; color: #3a3a3a; }
}
.btmbrdr {border-bottom: 1px solid;  border-color: #3a3a3a;}
/* end normalized element styles */

/* hero */
.heroT1 { width: 100%; }
.heroT1 .gallery {   
   width: 169px !important;
   position: relative;
    left: 45%;
    top: 70%;
}
@media (min-width: 769px) and (max-width: 1280px) {
.heroT1 .gallery {   
    left: 42%;
}
}
@media (max-width: 768px) and (min-width: 421px) {
.heroT1 .gallery {   
    left: 35%;
    top: -200px;
}
}
@media (max-width: 420px) {
.heroT1 .gallery {   
   width: 149px !important;
   left: 30%;
   top: -100px;
}
}
/* Summary Blade */
@media (min-width: 1281px) {
    /* Desktop */
    .summaryCopy { width: 1153px; margin: 0 auto; padding: 30px 53px; }  
    .summaryCopy p { font-size: 20px; line-height: 1.3; width: 1150px; margin: 0 auto; padding-bottom: 60px; }
    .summaryCopy h2 { width: 100%; margin: 13px auto 0 auto;  }
    .summaryBlock UL {margin-bottom: 30px;}
     .summaryBlock UL li {line-height: 2.2;}

}
@media (min-width: 769px) and (max-width: 1280px) {
    /* Tablet */
    .summaryCopy { width: 704px; margin: 0 auto 10px auto; padding: 18px 25px;  }
    .summaryCopy p { font-size: 16px; line-height: 1.3; width: 649px; margin: 0 auto; padding-bottom: 50px; }
    .summaryCopy h2 { width: 100%; margin: 25px auto 0 auto;  }
    .summaryBlock UL {margin-bottom: 30px;}
     .summaryBlock UL li {line-height: 2.2;}
    .keyFeaturesScreen {width: 708px;}
    .keyFeaturesScreen img {width: 100%;}
}
@media (max-width: 768px) and (min-width: 421px) {
    /* large phone*/
    .summaryBlock {padding-left: 22px;}
    .summaryCopy { width: 470px; margin: 0 auto 10px auto;  }
    .summaryCopy p { font-size: 14px; line-height: 1.3; width: 410px; margin: 0 auto; padding-bottom: 50px; }
    .summaryCopy h2 { width: 100%; margin: 25px auto 0 auto;  }
    .summaryBlock UL {margin-bottom: 30px;}
     .summaryBlock UL li {line-height: 1.8;}
    .keyFeaturesScreen {width: 470px;}
    .keyFeaturesScreen img {width: 100%;}
}
@media (max-width: 420px) {
    /* small phone*/
    .summaryCopy { max-width: 320px; margin: 40px auto 5px auto; padding-left: 10px; }
    .summaryCopy p { font-size: 14px; line-height: 1.3; width: 280px; margin: 0 auto; padding-bottom: 50px; }
    .summaryCopy h2 { width: 100%; margin: 25px auto 0 auto;  }
    .summaryBlock UL {margin-bottom: 30px;}
     .summaryBlock UL li {line-height: 1.8;}
    .keyFeaturesScreen {max-width: 320px; padding-right: 5px;}
    .keyFeaturesScreen img {width: 100%;}
}
/* End Summary Blade */


/* game play Features */
@media (min-width: 1281px) {
    /* Desktop */
    .gamePlayFeatures { width: 1153px; height: 402px; margin: -10px auto 0 auto; padding: 60px 53px; }
    .gpCopy { width: 412px;  vertical-align: top; }
    .gpImage { width: 680px; float: right;}
    .gpImage img { width: 100%; }
}

@media (min-width: 769px) and (max-width: 1280px) {
    /* tablet */
    .gamePlayFeatures { width: 704px; margin: 0 auto 10px auto; padding: 30px 25px 60px 25px; }
    .gpCopy { width: 250px; vertical-align: top; }
    .gpImage { width: 414px; float: right; }
    .gpImage img { width: 100%; }
}

@media (max-width: 768px) and (min-width: 421px) {
    /* mobile big */
    .gamePlayFeatures { width: 470px; margin: 0 auto 10px auto;  }
    .gpCopy { width: 410px; padding: 25px 30px 30px 23px; }
    .gpImage { max-width: 470px; padding-top: 60px; }
    .gpImage img { width: 100%; }
}
@media (max-width: 420px) {
    /* mobile small */
    .gamePlayFeatures { width: 360px; height: 644px; margin: 0 auto 5px auto;  }
    .gpCopy { width: 270px; padding: 25px 20px 40px 20px; }
    .gpImage { max-width: 360px; padding-top: 40px; }
    .gpImage img { width: 100%; }
}

/* End game play Features */
/***********************************************************************************/
/* Game Features */
.detailsIcon { vertical-align: top; }
.detailsIcon h3 { font-family: Segoe UI Light, Arial, Sans-Serif; }
.detailsIcon img { width: 100%; }

@media (min-width: 1281px) {
    /* Desktop */
    .GameDetails { width: 1153px; margin: 0px auto 10px auto; padding: 50px 53px; }
    .detailContainer { width: 1050px; margin: 0 auto; }
    .detailsIcon { width: 154px; display: inline-block; text-align: center; }
}
@media (min-width: 769px) and (max-width: 1280px) {
    /* Desktop */
    .GameDetails { width: 704px; margin: 10px auto 10px auto; padding: 45px 25px; }
    .detailContainer { width: 704px; margin: 0 auto; }
    .detailsIcon { width: 154px; display: inline-block; text-align: center; margin-bottom: 30px; }
}
@media (max-width: 768px) and (min-width: 421px) {
    /* Desktop */
    .GameDetails { width: 420px; margin: 10px auto 10px auto; padding: 30px 25px; }
    .detailContainer { width: 420px; margin: 0 auto; }
    .detailsIcon { width: 135px; display: inline-block; text-align: center; margin-bottom: 30px; }
}
@media (max-width: 420px) {
    /* Desktop */
    .GameDetails { width: 310px; margin: 10px auto 10px auto; padding: 30px 25px; }
    .detailContainer { width: 310px; margin: 0 auto; }
    .detailsIcon { width: 125px; display: inline-block; text-align: center; margin-bottom: 30px; }
}
/* End Game Features */
/***********************************************************************************/

/* Overview */
@media (min-width: 1281px) {
    /* Desktop */
    .overview { width: 1153px; margin: 0 auto; padding: 50px 53px;  }
    .overview ul { list-style-type: none; font-size: 16px; color: #3a3a3a; display: inline-block; }
    .overview li { font-family: Segoe UI semibold, Arial, Sans-Serif; line-height: 1.5; }
    .overview li span { font-family: Segoe UI, Arial, Sans-Serif; margin-left: 33px; }
    .detailsLeft { width: 421px; display: inline-block; vertical-align: top; }
    .detailsRight { width: 421px; display: inline-block; vertical-align: top; }
    .esrb { display: inline-block; margin-left: 53px; }
    .esrb ul { font-size: 12px; position: relative; top: -15px; }
}

@media (min-width: 769px) and (max-width: 1280px) {
    /* tablet */
    .overview { width: 704px; margin: 10px auto 10px auto; padding: 45px 25px; }
    .overview ul { list-style-type: none; font-size: 13px; color: #3a3a3a; display: inline-block; }
    .overview li { font-family: Segoe UI semibold, Arial, Sans-Serif; width: 140px; line-height: 1.7; }
    .overview li span { font-family: Segoe UI, Arial, Sans-Serif; margin-left: -30px; }
    .detailsLeft { width: 421px; display: inline-block; vertical-align: top; }
    .detailsRight { width: 421px; display: inline-block; vertical-align: top; }
    .esrb { display: inline-block; margin-left: 53px; margin-top: -40px; }
    .esrb img { position: relative; top: -15px; }
    .esrb ul { font-size: 12px; position: relative; top: -20px; }

}
@media (max-width: 768px) and (min-width: 421px) {
    /* mobile */
    .overview { width: 420px; margin: 10px auto 10px auto; padding: 30px 25px;  }
    .overview ul { list-style-type: none; font-size: 13px; color: #3a3a3a; display: inline-block; }
    .overview li { font-family: Segoe UI semibold, Arial, Sans-Serif; width: 150px; line-height: 1.7; }
    .overview li span { font-family: Segoe UI, Arial, Sans-Serif; margin-left: -60px; }
    .detailsLeft { width: 421px; display: inline-block; vertical-align: top; }
    .detailsRight { width: 421px; display: inline-block; vertical-align: top; }
    .esrb { display: inline-block; margin: -130px 0 0 300px; }
    .esrb ul { font-size: 12px; }

}

@media (max-width: 420px) {
    /* mobile */
    .overview { width: 310px; margin: 5px auto 5px auto; padding: 30px 25px;  }
    .overview ul { list-style-type: none; font-size: 13px; color: #3a3a3a; display: inline-block; }
    .overview li { font-family: Segoe UI semibold, Arial, Sans-Serif; width: 150px; line-height: 2; }
    .overview li span { font-family: Segoe UI, Arial, Sans-Serif; margin-left: -60px; }
    .detailsLeft { width: 310px; display: inline-block; vertical-align: top; }
    .detailsRight { width: 310px; display: inline-block; vertical-align: top; }
    .esrb { display: inline-block; position: relative; margin: 30px 0 0 0px; }
    .esrb img { }
    .esrb ul { font-size: 12px; }
}
/* End Overview */


/* recommendations */
@media (min-width: 1281px) {
    .recommendations { width: 1153px; margin: 0 auto; padding: 54px 53px 60px 53px; }    
    .recContent { width: 160px; display: inline-block; padding-right: 18px; vertical-align: top;}
    .recLast { padding-right: 0px; }
    .recContent img { margin-bottom: 25px; width: 100%;}
}
@media (min-width: 769px) and (max-width: 1280px) {
    .recommendations { margin: 10px auto 0 auto; padding: 45px 55px;  }
    .recContent { width: 157px; display: inline-block; padding-right: 18px; padding-bottom: 20px; vertical-align: top;}
    .recLast { padding-right: 0px; }
    .recContent img { margin-bottom: 10px; width: 100%; }
}
@media (max-width: 768px) and (min-width: 421px) {
    .recommendations { width: 420px; margin: 10px auto 10px auto; padding: 30px 25px; }
    .recContent { width: 184px; display: inline-block; padding-right: 22px; margin-bottom: 30px; vertical-align: top; }
    .recLast { }
    .recContent img { margin-bottom: 10px; width: 100%; }
}
@media (max-width: 420px) {
    .recommendations { width: 320px; margin: 0 auto; padding: 40px 20px 40px 20px;  }
    .recContent { width: 130px; display: inline-block; padding-right: 3px; margin-bottom: 30px; vertical-align: top; }
    .recLast { }
    .recContent img { margin-bottom: 10px; width: 100%; }
}
/* end recommendations */
/*******************************************************************************/

/*******************************************************************************/
/* intro */
#preOrderCTA {  
    top: auto !important;
    right: auto !important;
}
@media (min-width: 1281px) {
    /* Desktop */
  .intro {width: 1159px; margin: 0 auto; padding: 49px 0 60px 0;}
  .intro .boxshot {float: left; margin-right: 35px;}
  .intro .title {display: inline-block; }
  .intro h1 {max-width: 620px;}
  .intro .copy {width: 620px;display: inline-block; margin-right: 60px; }
  .intro .gameButtons {border-left: 1px solid #fff;  vertical-align: top;display: inline-block; padding-left: 40px; margin-top: -60px; }
  .intro .gameButtons img {margin-bottom: 0px;}
  .intro .gameButtons h3 {text-align: center; font-size: 24px; padding-bottom: 13px;}

}
@media (min-width: 769px) and (max-width: 1280px) {
    /* tablet */
  .intro {width: 769px; margin: 0 auto; padding: 50px 0 100px 0;}
  .intro .boxshot {float: left; margin-right: 35px;}
  .intro .title {display: inline-block; }
  .intro h1 {max-width: 540px;}
  .intro .copy {width: 550px;display: inline-block; }
  .intro .gameButtons {display: inline-block; padding-left: 160px; margin-top: 40px; }
  .intro .gameButtons img {margin-bottom: 0px;}
  .intro .gameButtons h3 {font-size: 24px; padding-bottom: 13px;}
}
@media (max-width: 768px)  {
    /* mobile large */
  .intro {max-width: 768px; margin: 0 auto 0 10%; padding: 60px 0 100px 0;}
  .intro .boxshot {padding-bottom: 40px;}
  .intro .title {display: inline-block; }
  .intro .copy {max-width: 768px;display: inline-block; }
  .intro .gameButtons {display: inline-block; margin-top: 40px; }
  .intro .gameButtons img {margin-bottom: 0px;}
  .intro .gameButtons h3 {font-size: 24px; padding-bottom: 13px;}
}

/* End Intro */
/************************************************/

/* promo blades */
.promoBlades { width: 100%; }
.promoCopy h2 { margin-bottom: 0px !important; color: #fff !important; }
.promoCopy h3 { margin-bottom: 10px; color: #fff; }
.promoCopy p { font-size: 16px; color: #fff; }
.prmoContent { margin: 10px 0 10px 0; }

/* END promo blades */
/* Legal */
.legal { background-color: #6b6b6b; width: 100%; }
.legalContent p { font-family: Segoe UI, Arial, Sans-Serif; font-size: 12px; font-style: italic; padding: 30px 0 40px 0; color: #fff; }
@media (min-width: 1281px) {
    .legalContent { width: 960px; margin: 0 auto; }
}
@media (min-width: 769px) and (max-width: 1280px) {
    .legalContent { width: 720px; margin: 0 auto; }
}
@media (max-width: 768px) and (min-width: 421px) {
    .legalContent { width: 420px; margin: 0 auto; }
}
@media (max-width: 420px) {
    .legalContent { width: 320px; margin: 0 auto; }
}
/* End Legal */



div#BodyFooter div#ShellFooterContent div.PrimaryContent { width: 10px; }

