/**
 * Tag and page-wide styles
 */
body{
 background:url("http://www.xbox.com/shell/images/hero_bg_E3.jpg") repeat-x;
background-position: center top;
}

.hide {
 display: none;
}

#BodyContent.container {
     width:100% !important;
 overflow-x:hidden;
}

/* Override the xbox.com shellstyles footer that leaves a whtie strip above the header!!! */
#BodyFooter{
 margin-top:0 !important;
}

br.clear{
 display:none;
}

.innerContent{
 width:955px;
 margin:0px auto;
 display:block;
}

h1,
h2,
h3{
 font-weight:normal;
 margin-bottom:20px;
     font-family: 'Segoe UI Light', Arial, Sans-Serif;
}

h4{
 text-transform:none !important;
 font-family: 'Segoe UI Light', Arial, Sans-Serif;
}

h2{
 font-size:40px;
}

.noTopPadding{
   padding-top:0px !important;
}

.noBottomPadding{
   padding-bottom:0px !important;
}

.noTopMargin{
   margin-top:0px !important;
}

.noBottomMargin{
   margin-bottom:0px !important;
}

.ctaArrowGreen{
 background: url("http://compass.xbox.com/assets/fe/d5/fed5dd63-150d-4811-a1a5-5da69022182f.png?n=ui-global-resources-xbox-cta-green-arrow-25x25.png") no-repeat;
 display: inline-block;
 padding-right: 35px;
 background-position: right bottom;
}


/**
 * Hero Section
 */

.hero{
 position:relative;
}

.hero img { 
     width: 955px;
}

.hero h1{
      color: #000;
 font-size:55px;
 line-height:58px;
 position:absolute;
}
 
.hero h2 { 
 color:#222;
     font-size: 40px;
     line-height: 42px;
}



/**
 * Intro Section
 */
.intro{
  font-family: 'Segoe UI Light', Arial, Sans-Serif;
    background-color: #107C10;
    width: 100%;
      color: #FFFFFF;
  font-size: 20px;
}

.intro.content{
 font-size:20px;
}

.intro h2 {
    color: #ffffff;
     font-size: 40px;
     line-height: 56px;
     margin-bottom: 20px;
 width:955px;
 margin:00px auto;
  text-align:left;
  }

.intro p {
 text-align:left;
 margin-bottom: 0;
  padding-bottom: 0;
}

.intro .copy {
   margin:0 auto;
   display:block;
   width: 960px;
}

.intro .imgBlocks {
     display: block;
     margin-left: 18px;
}

.intro .imgBlocks .block {
   display:block;
   background-color:#000;
   float:left;
   height: 250px;
   width: 261px;
   margin: 1px;
}

.intro #xbgallery {
 font-size: 18px;
}



/**
 * Twist Nav Section
 */
nav {
  font-size: 22px;
  line-height: 27px;
  width: 100%;
  z-index: 25;
}

.subNav{
 background-color:#222;
}

nav ul {
 display:inline-block;
   list-style: none;
   margin: 0 auto;
   padding: 16px 0 18px 0;
   text-align: left;
   width: 1200px;
}

nav ul li {
   display: inline-block;
   padding: 0px 30px 0px 0;
}
nav ul li:last-of-type {
 padding: 0;
}

nav ul li a{
 font-size:20px;
}

nav ul li a, 
nav ul li a:visited {
  color: #ffffff;
  display: block;
  font-weight: normal;
  text-decoration: none;
}

nav ul li a.selected, 
nav ul li a:hover, 
nav ul li a:focus { 
 color: #5CC21F; 
}



/**
 * Content Section
 */
.content {
      margin: 0;
      padding:80px 0;
      width: 100%;
  font-size: 20px;
  line-height: 28px;
      text-align:center;
  clear:both;
}

.content.intro{
 padding-top:40px;
}

.content h3{
  color:#000;
 font-size:34px;
 line-height:37px;
}

.content.noVPadding{
 padding: 0;
}

.content.noVPadding .copyWrapper,
.content.footerCTA {
 padding: 80px 0;
}

.content h2 {
 font-size: 40px;
 line-height: 44px;
}

.hero{
  padding:30px 0 20px;
}

.content .copyWrapper{
   width: 50%;
}

.content .copyWrapper .copy {
     display: block;
     width:477px;
}

.content .imageWrapper{
   width:50%;
}

.content .imageWrapper img{
   display:block;
}

.content.left .copyWrapper {
   text-align:right;
   float: left;
   display: block;
}

.content.left .copyWrapper .copy {
     text-align: left;
     float: right;
}

.content.left .imageWrapper{
   float: right;
   text-align: left;
}

.content.left .imageWrapper img {
    margin-left:20px;
}

.content.right .copyWrapper {
   text-align: right;
   float: right;
   display:block;
  
}

.content.right .copyWrapper .copy {    
     text-align: left;    
}

.content.right .imageWrapper{
   float: left;
   text-align: right;
   direction: rtl;
}

.content.right .imageWrapper img {
   margin-right:20px;
}

.content.two {
   background-color: #f2f2f2;
}

.content.three{
   background-color: #3B3B3B;
}

.content.three,
.content.three h2{
 color:#FFF !important;
}

.content.legal,
.content.footerCTA{
 background-color:#000;
}

.content .subData h3{
 font-size:30px;
 margin-bottom:0px;
}

.content .subData p{
 font-size:16px;
 line-height:20px;
 margin-top:10px;
}



/**
 * Gallery styles
 */

#xbgallery{
    position:relative;
    left:50%;
   padding-bottom:40px;
}

#xbgallery-thumbs img,
#XBOneGalleryControls img{
  cursor:pointer;
 z-index:20;
}

#xbgallery img{
   display:block;
}

#xbgallery ul{
   margin:0 0 0 -726px;
   padding:0;
   width:1452px;
}

#xbgallery ul li{
   float:left;
   display:inline-block;
   list-style:none;
   margin-left:0;
   position:relative;
   margin-right:4px;
   margin-top:4px;
}

#xbgallery p{
   position:absolute;
   bottom:15px;
   left:15px;
   margin:0;
   padding:0;
}

#XBOneGalleryDisplay{
   position:absolute;
   z-index:21;
   width:100%;
   height:510px;
   background:#000;
   display:none;
}

/*Note: important styles are for IE. Leave them here.*/
#XBOneGalleryDisplay img{
 width:1450px !important;
    height:644px !important;
 max-width: none !important;
}

#XBOneGalleryControls{
   position:absolute;
   display:none;
   z-index:22;
} 

#XBOneGalleryControls img{
 position:absolute;
 z-index:20;
}



/**
 * Footer CTA
 */
.footerCTA{
 color:#FFF;
 font-size:20px;
}

.footerCTA a,
.footerCTA a:hover{
 color:#FFF;
}

.footerCTA h1{
 font-size:60px;
 color:#FFF;
 line-height:62px;
}

.reserve-cta{
  color:#FFF;
  font-size:30px;
  font-weight:normal;
  padding:13px 35px;
  background-color:#107b11;
 margin:40px 0 15px 0;
 display: inline-block;
}

.reserve-cta-store{
 padding:0;
}

.findRetailers{
 margin-top:10px;
}

.findRetailers a{
 color:#FFF;
 font-weight:normal;
}

.social{
 margin-top:20px;
}

.social span{
 display: inline-block;
 margin-right: 12px; 
 font-size:30px;
}

.social img{
 margin-left:7px;
}



/**
 * Legal
 */
.legal{
 padding:0 0 20px 0;
 text-align:left;
 font-size:12px;
 font-style:italic;
 color:#FFF;
 line-height:18px;
}



/**
 * Social
 */
.facebook-share,
.twitter-tweet{
   display:inline-block;
  width:61px;
  height:20px;
}

.facebook-share{
 background:url("http://compass.xbox.com/assets/e8/a6/e8a65e14-b9ff-42dd-bcc0-dabac4afbffb.png?n=icon-facebook-share-61x20.png") no-repeat;
}

.twitter-tweet{
 background:url("http://compass.xbox.com/assets/2d/45/2d45d92a-b187-4a2e-a4f4-7454d1d8bed7.png?n=icon-twitter-tweet-61x20.png") no-repeat;
} 

/* Add one block*/
.content.one.left.apps {
    background-color: #3B3B3B;
}
.content.one.left.apps h2 {
    color: #FFFFFF !important;
}
.content.one.left.apps p {
    color: #FFFFFF !important;
}