
body {
  background: black;
  font-family: trajan-pro; 
}

.row-feature .inner {
  padding-left: 0;
}
.row-feature .inner .column.column-copy {
  width: 540px;
  padding-right: 90px;
}
.row-feature .inner .column-image .thin-border {
  padding: 6px;
}

ul.list-1 {
  color: #DBD2BA !important;
}

#jumbotron .inner {
  height: 516px;
  width: 1189px;
}
#jumbotron .frames-border.left,
#jumbotron .frames-border.right {
  height: 469px;
}
#jumbotron .frames .frame-info-left {
  width: 342px;
  height: 469px;
  float: left;
}
#jumbotron .frames .frame-info-right {
  width: 837px;
  height: 469px;
  float: left;
}

#jumbotron.promo .inner .frames-border.left {
  background: url(../images/promo-border-left.jpg) no-repeat 0 0 transparent;
  width: 9px;
  height: 191px;
}
#jumbotron.promo .inner .frames-border.right {
  background: url(../images/promo-border-right.jpg) no-repeat 0 0 transparent;
  width: 9px;
  height: 191px;
}
#jumbotron.promo .inner {
  height: 197px;
  background: url(../images/promo-border-bottom.jpg) no-repeat 0 100% transparent;
}

#jumbotron.promo .frames .frame-info {
  background: url(../images/beta/top-promo-bg.jpg) no-repeat 100% 0 transparent;
  height: 191px;
  width: 1171px;
}


#jumbotron.first .frames .frame-info-left {
}
#jumbotron.first .frames .frame-info-right {
}
#jumbotron.second .frames .frame-info-left {
  background: url(../images/feature-left-bg.jpg) no-repeat 0 0 transparent;
  border-top: 1px solid #422f16;
}
#jumbotron.second div.inner{
    background: url("../images/carousel-background-nobar.png") no-repeat scroll left bottom transparent;
    height: 498px;
}
#jumbotron.second .frames .frame-info-right {
  cursor: pointer; 
  border-top: 1px solid #422F16;
}
#jumbotron .frame-info-left .date {
  color: #9B8F6F;
  text-align: right;
  font-size: 18px;
}
#jumbotron .frame-info-left {
  text-align: center;
}
#jumbotron .frame-info-left h1 {
  font-size: 57px;
  letter-spacing: -4px;
  padding-right: 7px;
  line-height: 53px;
}

#jumbotron.promo .user-welcome {
  color: #dbc297;
  margin-bottom: 8px;
  font-size: 22px;
}
#jumbotron.promo {
  color: #dbd2ba;
  font-size: 18px;
  display: none;
}
#jumbotron.promo a {
  color: #c1864b;
  text-decoration: none;
}

#jumbotron.first .frame-info-right {
  text-align: center;
  color: #201306;
}
#jumbotron.first .frame-info-right h1 {
  font-size: 65px;
}
#jumbotron.first .frame-info-right h2 {
  font-size: 36px;
}
#jumbotron.first .frame-info-right .date {
  font-size: 30px;
  color: #4c453e;
  margin-bottom: 8px;
}
#jumbotron.first .frame-info-right p {
  font-size: 24px;
  width: 440px;
  margin-left: auto;
  margin-right: auto;
}
#jumbotron.first .omega-button {
  letter-spacing: .4em;
}


#jumbotron.first .frame-info-left h1 {
  margin-bottom: 12px;
}
#jumbotron.first .frame-info-left h4 {
  font-size: 18px;
  line-height: 20px;
}
#jumbotron.first .frame-info-left p {
  font-size: 12px;
  color: #cdc4aa;
  margin-bottom: 16px;
  padding: 0 20px;
  line-height: 18px;
}
#jumbotron.first .frame-info-left h2 {
  font-size: 30px;
}
#jumbotron.second .frame-info-left h2 {
  font-size: 48px;
  margin-bottom: 8px;
}
#jumbotron.second .frame-info-left h4 {
  font-size: 16px;
  line-height: 20px;
  color: #cfcbc1;
}

#jumbotron.promo {
}

#beta .big-bar-header {
	background: url("../images/big-bar-header-background2.png") no-repeat;
	height: 81px;
	width: 1075px;
	margin: 20px auto 20px auto;
	padding: 15px 0 0 0;
	text-align: center; }
#beta .big-bar-header .text {
	font-size: 1.5em;
	text-transform: uppercase;
	padding: 0 0 0 50px; }
#beta-sub-jumbotron h2.uppercase {
	font-size: 1.25em;
	color: #cfcbc1; }
#beta-sub-jumbotron p {
	font-size: 1.0em;
	line-height: 1.7em; }
#beta-sub-jumbotron .separator {
	margin: 80px auto 0 auto; }

#beta-faq h2 {
	font-family: trajan-pro; }
#beta-faq p {
	line-height: 1.5em;
	font-size: 1.1em;
	width: 520px; }
#beta-faq .omega-button {
	font-size: .6em;
	margin: 20px auto 0 auto;
	cursor: pointer; }
#beta-faq .separator {
	margin: 60px auto 60px auto; }
#beta-faq .column-image {
	padding: 45px 0 0 0; }

.thin-border, a .thin-border { 
    border: 1px solid #271E17;
    padding: 6px;
    display: inline-block;
    margin-bottom: 4px; 
}
.thick-border, a .thick-border { 
    border: 13px solid #281F16;
    display: inline-block; 
}

.only-mobile {
    display: none;
}

@media all and (max-width: 767px) {

    .only-mobile {
        display: block;
    }

    .only-desktop {
        display: none;
    }

    #jumbotron .inner {
        width: 100%;
        height: auto;
        min-width: 320px;
    }

        #jumbotron .inner .frames {
            float: none;
            width: 100%;
            height: auto;
        }

    #jumbotron .frames .frame-info-left {
        width: 100%;
        height: auto;
        float: none;
    }

        #jumbotron .frames .frame-info-left img {
            width: 100%;
        }

    #jumbotron.first .frame-info-right {
        width: 100%;
        height: auto;
        float: none;
    }

        #jumbotron.first .frame-info-right img {
            width: 100%;
        }

    #beta .big-bar-header {
        width: 100%;
        background-position: center top;
    }

        #beta .big-bar-header .text {
            padding: 0 0 0 9px;
        }

    #jumbotron .frames .frame-info-right {
        float: none;
        width: 100%;
        height: auto;
    }

    #videocontainerMobile {
        position: relative;
        padding-bottom: 56.25%; /* 16:9 */
        padding-top: 25px;
        padding-left: 0;
        padding-right: 0;
        height: 0;
        width: 100%;
    }

        #videocontainerMobile iframe,
        #videocontainerMobile object,
        #videocontainerMobile img,
        #videocontainerMobile embed {
            position: absolute;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
        }

    #jumbotron.second .frames .frame-info-left {
        background-image: none;
    }

    .last-of-us-titles{
        margin-top: 40px!important;
    }

    #jumbotron.second div.inner{
        height: auto;
    }

    .social{
        float: none;
        text-align: center;
    }

    .container .inner p{
        padding: 0 20px;
    }

    #jumbotron.second div.inner{
      background-image: none;
    }

    .last-of-us-footer-image{
      width: 100%!important;
    }

    .last-of-us-footer-image img{
      width: 100%;
    }

    .thick-border, a .thick-border{
      border-width: 5px;
      display: block;
    }

    .thin-border, a .thin-border{
      padding: 4px;
    }

    #beta-sub-jumbotron .separator{
      margin-top: 20px;
    }
}