header[role='banner'] {
background: #000;
background-size: 100% auto;
overflow: hidden;
position: relative;
width: 100%;
max-height: 450px;
min-height: 120px;
z-index: 2;
margin-bottom: 0
}

#main {
padding-bottom: 40px
}
#main button[data-toggle="collapse"] {
position: relative;
width: 100%;
color: #fff;
background: #2f2f2f;
border-top: 2px solid #fff;
padding: 5px 12% 3px 5%;
text-align: left;
font-size: 26px;
font-size: 2.6rem;
text-transform: uppercase;
font-weight: bold;
height: auto;
}
#main button[data-toggle="collapse"] i {
position: absolute;
right: 10px;
top: 50%;
display: block;
margin: -7px auto 0;
width: 30px;
height: 18px;
background: url(../img/arrs.png) no-repeat -39px 0
}
#main button[data-toggle="collapse"].active i {
background-position: 0 0
}
#main button[data-toggle="collapse"]:first-child {
border-top: 0
}

#main section .content {
padding: 20px 10px 10px;
color: #1f1f1f
}
#main section .content p {
text-align: justify
}
#main section .content ul {

}

#main section .content ul li {
    line-height: 1.3em;
    margin: 0 0 5px;
}


section[role='main'] {
text-align: center
}

.cta {
text-align: center
}
.btn {
background: #cdcdcd;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
padding: 8px 10% 6px 10%;
text-align: center;
letter-spacing: 0;
text-shadow: 1px 1px 0 #424242;
color: #101010;
font-weight: bold;
text-transform: uppercase;
font-size: 20px;
font-size: 2rem;
line-height: 25px!important
}
.btn .ico,.btn .caret {
vertical-align: text-top
}
.btn i {
-webkit-opacity: .6;
-moz-opacity: .6;
-khtml-opacity: .6;
opacity: .6
}
.btn strong {
display: block;
font-size: 1.55em;
line-height: 1em
}
.btn:hover,.btn:focus {
text-decoration: none;
}
.btn:hover i,.btn:focus i {
-webkit-opacity: .4;
-moz-opacity: .4;
-khtml-opacity: .4;
opacity: .4
}
.btn.open,.btn.active {
background: #ababab
}
.btn.dark,.btn.dark:hover {
text-shadow: 0 1.5px 0 rgba(0,0,0,0.2)!important;
background: #383838!important;
border-color: #232323;
color: #fff!important
}
.btn.pink,.btn.pink:hover {
text-shadow: 0 1.5px 0 rgba(0,0,0,0.2)!important;
background: #f1403b!important;
border-color: #ba221e;
color: #fff!important
}
.btn.red,.btn.red:hover {
text-shadow: 0 1.5px 0 rgba(0,0,0,0.2)!important;
background-color: #8b0000;
background-image: -moz-linear-gradient(top,#9e0000,#6e0000);
background-image: -ms-linear-gradient(top,#9e0000,#6e0000);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#9e0000),to(#6e0000));
background-image: -webkit-linear-gradient(top,#9e0000,#6e0000);
background-image: -o-linear-gradient(top,#9e0000,#6e0000);
background-image: linear-gradient(top,#9e0000,#6e0000);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#9e0000',endColorstr='#6e0000',GradientType=0);
border-color: #6e0000 #6e0000 #200;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
border-color: #782800;
color: #fff!important
}
.btn.red.active,.btn.red:hover.active,.btn.red:active,.btn.red:hover:active {
background-color: #810000;
background-image: -moz-linear-gradient(top,#6e0000,#9e0000);
background-image: -ms-linear-gradient(top,#6e0000,#9e0000);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#6e0000),to(#9e0000));
background-image: -webkit-linear-gradient(top,#6e0000,#9e0000);
background-image: -o-linear-gradient(top,#6e0000,#9e0000);
background-image: linear-gradient(top,#6e0000,#9e0000);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#6e0000',endColorstr='#9e0000',GradientType=0);
border-color: #9e0000 #9e0000 #520000;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25)
}
.btn.yellow,.btn.yellow:hover {
text-shadow: none!important;
background-color: #ffba00;
background-image: -moz-linear-gradient(top,#ffc600,#ffa800);
background-image: -ms-linear-gradient(top,#ffc600,#ffa800);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffc600),to(#ffa800));
background-image: -webkit-linear-gradient(top,#ffc600,#ffa800);
background-image: -o-linear-gradient(top,#ffc600,#ffa800);
background-image: linear-gradient(top,#ffc600,#ffa800);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc600',endColorstr='#ffa800',GradientType=0);
border-color: #ffa800 #ffa800 #b37600;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
border-color: #ffc271;
border-bottom-color: #ef6b00;
color: #b71900!important
}
.btn.yellow.active,.btn.yellow:hover.active,.btn.yellow:active,.btn.yellow:hover:active {
background-color: #ffb400;
background-image: -moz-linear-gradient(top,#ffa800,#ffc600);
background-image: -ms-linear-gradient(top,#ffa800,#ffc600);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffa800),to(#ffc600));
background-image: -webkit-linear-gradient(top,#ffa800,#ffc600);
background-image: -o-linear-gradient(top,#ffa800,#ffc600);
background-image: linear-gradient(top,#ffa800,#ffc600);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa800',endColorstr='#ffc600',GradientType=0);
border-color: #ffc600 #ffc600 #b38b00;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25)
}
.btn.blue,.btn.blue:hover {
text-shadow: 0 1.5px 0 rgba(0,0,0,0.2)!important;
border-color: #213c76;
color: #fff!important;
background: #39579a
}
.btn.purple,.btn.purple:hover {
text-shadow: 0 1.5px 0 rgba(0,0,0,0.2)!important;
border-color: #21244d;
color: #9fa6d8!important;
background-color: #212232;
background-image: -moz-linear-gradient(top,#1d1e2c,#26273b);
background-image: -ms-linear-gradient(top,#1d1e2c,#26273b);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#1d1e2c),to(#26273b));
background-image: -webkit-linear-gradient(top,#1d1e2c,#26273b);
background-image: -o-linear-gradient(top,#1d1e2c,#26273b);
background-image: linear-gradient(top,#1d1e2c,#26273b);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1d1e2c',endColorstr='#26273b',GradientType=0);
border-color: #26273b #26273b #08080c;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25)
}
.btn.purple.active,.btn.purple:hover.active,.btn.purple:active,.btn.purple:hover:active {
background-color: #222335;
background-image: -moz-linear-gradient(top,#26273b,#1d1e2c);
background-image: -ms-linear-gradient(top,#26273b,#1d1e2c);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#26273b),to(#1d1e2c));
background-image: -webkit-linear-gradient(top,#26273b,#1d1e2c);
background-image: -o-linear-gradient(top,#26273b,#1d1e2c);
background-image: linear-gradient(top,#26273b,#1d1e2c);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#26273b',endColorstr='#1d1e2c',GradientType=0);
border-color: #1d1e2c #1d1e2c #000;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25)
}


.patBg {
text-shadow: 1px 1px 0 #1f2140!important
}
.tintBg {
background: #06071a;
background-color: rgba(6,7,26,0.8)
}


.menu.popover {
left: 0!important;
width: 90%;
padding: 0 5%;
z-index: 99
}
.menu.popover.bottom .arrow {
border-bottom-color: #181a31;
left: 15%;
border-width: 10px
}
.menu.popover .popover-inner {
background: #181a31;
padding: 0;
margin: 10px 0 0;
width: 100%
}
.menu.popover .popover-inner .popover-content {
background: #181a31;
color: #fff;
padding: 5px
}
.menu.popover .popover-inner .popover-content ul {
margin: 0;
padding: 0;
list-style: none
}
.menu.popover .popover-inner .popover-content ul li {
border-bottom: 1px solid #202343
}
.menu.popover .popover-inner .popover-content ul li:first-child,.menu.popover .popover-inner .popover-content ul li.preOrder {
display: none
}
.menu.popover .popover-inner .popover-content ul li:hover a,.menu.popover .popover-inner .popover-content ul li:focus a {
color: #181a31
}
.menu.popover .popover-inner .popover-content ul li a {
padding: 15px;
color: #9fa6d8
}
.menu.popover .popover-title {
display: none
}
.mobile .mobileHide {
display: none;
position: absolute;
margin: -1px;
padding: 0;
height: 1px;
width: 1px;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0)
}
.mobile .mobileOnly,.mobile .mobileShow {
display: inherit
}
.mobile #main {
text-align: center
}
.mobile #main p {
text-align: justify;
padding-left: 20px;
padding-right: 20px
}
.mobile #main ul {
text-align: left
}
.mobile .langs .btn-group {
margin: 15px
}
.mobile .langs .btn {
position: absolute
}
.mobile .langs .dropdown-menu,.mobile .langs .btn {
right: 0;
left: 0
}
.mobile .langs .dropdown-menu {
position: relative;
width: 100%;
top: 30px
}



.full {
min-width: 950px
}
.fullhtml {
overflow: auto
}

.full body,.full #wrapper {
	background: #000;
}

.full .wrap {
position: relative;
width: 950px;
margin: 0 auto
}
.full header[role='banner'] {
max-height: none;
min-height: 380px;
background: 0
}
.full header[role='banner'] .langs {
display: block
}

.full #main section {
margin: 0;
height: auto!important
}
.full #main section .content {
padding: 0
}
.full #main section button[data-toggle="collapse"] {
padding: 0
}
.full #main section .content ul {

}

#main section .content ul li {
.full     line-height: 1.3em;
    margin: 0 0 5px;
}



.full input:focus,.full textarea:focus,.full select:focus {
outline-color: #4e5068!important;
border-color: #4e5068;
box-shadow: 0 0 5px #2f3040!important
}
.full.tablet {
min-width: 100%
}
.full.tablet body,.full.tablet #wrapper {
background-size: 170% auto
}
.full.tablet .tabletHide {
display: none;
width: 0
}
.full.tablet .wrap {
width: 100%!important
}
.full.tablet header[role="banner"] {
margin-bottom: 80px
}
.full.tablet header[role="banner"] .wrap {
width: 100%
}

.full .mobileOnly {
display: none;
position: absolute;
margin: -1px;
padding: 0;
height: 1px;
width: 1px;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0)
}
.tabletview {
min-width: 100%
}
.tabletview body,.tabletview #wrapper {
background-size: 170% auto
}
.tabletview .tabletHide {
display: none;
width: 0
}
.tabletview .wrap {
width: 100%!important
}
.tabletview header[role="banner"] {
margin-bottom: 80px
}
.tabletview header[role="banner"] .wrap {
width: 100%
}
.tablet {
min-width: 100%
}
.tablet body,.tablet #wrapper {
background-size: 170% auto
}
.tablet .tabletHide {
display: none;
width: 0
}
.tablet .wrap {
width: 100%!important
}
.tablet header[role="banner"] {
margin-bottom: 80px
}
.tablet header[role="banner"] .wrap {
width: 100%
}
.mobileOnly {
display: none;
position: absolute;
margin: -1px;
padding: 0;
height: 1px;
width: 1px;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0)
}



/* Modal Support */
.modal {
    margin: -350px 0 0 -280px;
}


@media only screen and (min-width:961px) {
min-width: 950px;
html {
overflow: auto
}

body,#wrapper {
background: #000;
}

.wrap {
position: relative;
width: 950px;
margin: 0 auto
}

}





@media only screen and (min-device-width:320px) and (max-device-width:480) {
.mobileHide {
display: none;
position: absolute;
margin: -1px;
padding: 0;
height: 1px;
width: 1px;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0)
}
.mobileOnly,.mobileShow {
display: inherit
}
#main {
text-align: center
}
#main p {
text-align: justify;
padding-left: 20px;
padding-right: 20px
}
#main ul {
text-align: left
}
.langs .btn-group {
margin: 15px
}
.langs .btn {
position: absolute
}
.langs .dropdown-menu,.langs .btn {
right: 0;
left: 0
}
.langs .dropdown-menu {
position: relative;
width: 100%;
top: 30px
}



}









@media only screen and (max-width:640px) {
.mobileHide {
display: none;
position: absolute;
margin: -1px;
padding: 0;
height: 1px;
width: 1px;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0)
}
.mobileOnly,.mobileShow {
display: inherit
}
#main {
text-align: center
}
#main p {
text-align: justify;
padding-left: 20px;
padding-right: 20px
}
#main ul {
text-align: left
}
.langs .btn-group {
margin: 15px
}
.langs .btn {
position: absolute
}
.langs .dropdown-menu,.langs .btn {
right: 0;
left: 0
}
.langs .dropdown-menu {
position: relative;
width: 100%;
top: 30px
}

footer .rating { width: 100% !important; text-align: center !important; }
footer .capcomLogo { width: 100% !important; text-align: center !important; }
footer .capLogo { padding:25px !important; }
footer .privacy {width: 100% !important; text-align: center !important; }

}






@media only screen and (min-width:641px) and (max-width:960px) {
min-width: 950px;
min-width: 100%;
html {
overflow: auto
}
body,#wrapper {
background: #000;
}
.wrap {
position: relative;
width: 950px;
margin: 0 auto
}
header[role='banner'] {
max-height: none;
min-height: 380px;
background: 0
}
header[role='banner'] .langs {
display: block
}

#main section {
margin: 0;
height: auto!important
}
#main section .content {
    padding: 0
    height: auto;
    margin: 0 10% 40px;
    padding: 0;
}

#main section .content ul {

}

#main section .content ul li {
    line-height: 1.3em;
    margin: 0 0 5px;
}

#main section button[data-toggle="collapse"] {
padding: 0
}
input:focus,textarea:focus,select:focus {
outline-color: #4e5068!important;
border-color: #4e5068;
box-shadow: 0 0 5px #2f3040!important
}
.tablet {
min-width: 100%
}
.tablet body,.tablet #wrapper {
background-size: 170% auto
}
.tablet .tabletHide {
display: none;
width: 0
}
.tablet .wrap {
width: 100%!important
}
.tablet header[role="banner"] {
margin-bottom: 80px
}
.tablet header[role="banner"] .wrap {
width: 100%
}
.mobileOnly {
display: none;
position: absolute;
margin: -1px;
padding: 0;
height: 1px;
width: 1px;
overflow: hidden;
border: 0;
clip: rect(0 0 0 0)
}
body,#wrapper {
background-size: 170% auto
}
.tabletHide {
display: none;
width: 0
}
.wrap {
width: 100%!important
}
header[role="banner"] {
margin-bottom: 80px
}
header[role="banner"] .wrap {
width: 100%
}
}





.site_button {
    background: url(../img/button1.jpg) no-repeat scroll center center #000;
    background-size: 100%;
    border: 1px solid #444;
    border-radius: 15px;
    color: #fff;
    height: 300px;
    margin-bottom: 50px;
    margin-left: 5%;
    margin-top: 50px;
    overflow: hidden;
    padding: 0;
    position: relative;
    width: 95%;
}
.site_button2 {
    background: url(../img/button2.jpg) no-repeat scroll top center #FFF;
    background-size: 100%;
}

.site_button span {
    font-size: 2rem;
    position: relative;
    top: 80%;
}

/*             SHOWCASE  CSS            */
/****************************************/




.clearfix:before, .clearfix:after {
    content: "";
    display: table;
}
.clearfix:after {
    clear: both;
}
.clearfix {
}



.grid-wrapper {
    margin: 0 auto;
    padding: 0 20px;
    width: 100%;
}
.grid-wrapper-no-pad {
    padding: 0;
}
.grid-wrapper-half-pad {
    padding: 0 10px;
}
.grid {
    margin: 0 0 20px;
}
.grid:after {
    clear: both;
    content: "";
    display: table;
}
.grid-no-margin {
    margin-bottom: 0;
}
.grid-half-margin {
    margin-bottom: 10px;
}
[class*="col-"] {
    float: left;
    padding-right: 20px;
}
.grid [class*="col-"]:last-of-type {
    padding-right: 0;
}
.col-3-4 {
    width: 75%;
}
.col-2-3 {
    width: 66.66%;
}
.col-1-3 {
    width: 33.33%;
}
.col-1-2 {
    width: 49%;
    padding-right: 0;
}
.col-1-4 {
    width: 25%;
}
.col-1-5 {
    width: 20%;
}
.col-1-8 {
    width: 12.5%;
}
.grid-pad {
    padding: 20px 0 20px 20px;
}
.grid-pad [class*="col-"]:last-of-type {
    padding-right: 20px;
}
.hidden {
    display: none;
}


.grid-wrapper {
    left: 0;
    max-width: 1000px;
    position: relative;
    top: 0;
}


#block--approuting--featuredpromo {
    width: 100%;
}
#block--approuting--featuredpromo .col-1-3 {
    padding-right: 0;
}
#block--approuting--featuredpromo ul {
    list-style: none;
    padding: 30px 0 20px;
}
#block--approuting--featuredpromo ul li {
    text-align: center;
}
#block--approuting--featuredpromo ul li img {
    max-width: 100%;
}
#block--approuting--featuredpromo ul li:first-child {
    margin-left: 0;
}
#block--approuting--featuredpromo ul li h2, #block--approuting--featuredpromo ul li h3 {
    font-family: purista-web,sans-serif;
    text-transform: uppercase;
}
#block--approuting--featuredpromo ul li h2 {
    font-size: 16px;
    line-height: 16px;
    margin-top: 20px;
}
#block--approuting--featuredpromo ul li h3 {
    font-size: 24px;
    line-height: 24px;
}
#block--approuting--featuredpromo ul li p {
    font-size: 13px;
    line-height: 20px;
    margin: 10px;
    font-weight: 400;
}



section[id="showcase"] {
}

section[id="showcase"] a:hover { color: #cdcdcd; text-decoration: none; }


#main #showcase {
color: #fff;
font-size: 1.3em
}


@media only screen and (max-width:640px) {

.col-1-3 {
    width: 100%;
    margin-bottom: 20px;
}


}

@media only screen and (min-width:641px) and (max-width:960px) {


}


/* 	           LOGO CSS               */
/**************************************/

h1.logo {
}

header[role='banner'] .logo a {
	display: block;
	padding: 6% 26% 10px
}
header[role='banner'] .logo a img {
	padding-left: 10px
}
.logo a {
	display: block;
	/* padding: 1% 20% 10px */
	/*padding: 6% 26% 10px*/
}
.logo a img {
	padding-left: 10px
}

.full header[role='banner'] .logo {
	margin: 218px 0 100px
}
.full header[role='banner'] .logo a {
	display: block;
	padding: 0
}
.full header[role='banner'] .logo a img {
	padding-left: 14.5%;
	display: block;
	margin: 0 auto
}

.full.tablet header[role="banner"] .logo {
	margin: 21% 0 10%
}
.full.tablet header[role="banner"] .logo a {
	padding: 0 27%
}

.tabletview header[role="banner"] .logo {
	margin: 21% 0 10%
}
.tabletview header[role="banner"] .logo a {
	padding: 0 27%
}

.tabletview #preorder .content h2 {
	font-size: 38px;
	font-size: 3.8rem
}
.tabletview #cookieNotice .inner {
	max-width: 80%
}
.tabletview #social .item {
	width: 48%
}
.tabletview #social .item.gg {
	width: 98%;
	letter-spacing: 20px;
	padding-bottom: 30px
}
.tabletview #social .item.gg .wrapper {
	height: auto
}
.tabletview #social .item.gg a {
	display: inline-block!important;*display:inline;
	zoom: 1;
	vertical-align: top;
	margin: 10px 0;
	letter-spacing: normal;
	padding-left: 45px
}
.tabletview footer .rightLogos {
	padding-left: 20px
}


@media only screen and (min-width:961px) {

	header[role='banner'] .logo {
		margin: 218px 0 100px
	}
	header[role='banner'] .logo a {
		display: block;
		padding: 0
	}
	header[role='banner'] .logo a img {
		padding-left: 14.5%;
		display: block;
		margin: 0 auto
	}

	.tablet header[role="banner"] .logo {
		margin: 21% 0 10%
	}
	.tablet header[role="banner"] .logo a {
		padding: 0 27%
	}

}


@media only screen and (min-width:641px) and (max-width:960px) {

	header[role='banner'] .logo {
		margin: 218px 0 100px
	}
	header[role='banner'] .logo a {
		display: block;
		padding: 0
	}
	header[role='banner'] .logo a img {
		padding-left: 14.5%;
		display: block;
		margin: 0 auto
	}

	.tablet header[role="banner"] .logo {
		margin: 21% 0 10%
	}
	.tablet header[role="banner"] .logo a {
		padding: 0 27%
	}

	header[role="banner"] .logo {
		margin: 21% 0 10%
	}
	header[role="banner"] .logo a {
		padding: 0 27%
	}
}	
	
/*              VIDEO WIDGET CSS                */
/************************************************/

#videos {
height: 260px;
margin: 0 auto;
padding-bottom: 30px;
position: relative
}
#videos .item {
position: relative;
display: none;
height: 210px;
width: 100%;
-webkit-box-shadow: 0 0 50px #000;
-moz-box-shadow: 0 0 50px #000;
box-shadow: 0 0 50px #000
}
#videos .item:first-child, #videos .item a {
display: block
}
#videos .play {
position: absolute;
height: 47px;
width: 47px;
top: 50%;
left: 50%;
margin: -23.5px 0 0 -23.5px
}
#videos .play img {
width: 100%;
height: auto
}
#videos .play:hover, #videos .play:focus {
-webkit-opacity: .4;
-moz-opacity: .4;
-khtml-opacity: .4;
opacity: .4
}
#videos .img {
display: block;
text-align: center;
height: 210px
}
#videos .img img {
height: 100%;
width: auto;
max-width: none;
background: #101010
}
#videos .title {
position: absolute;
bottom: -75px;
width: 70%;
padding: 5px 15%;
height: 62px;
z-index: 98;
font-size: 1.1em;
text-align: center;
display: block
}
#videos .title .text {
background: #e8e8e8;
background: -moz-linear-gradient(top,  #e8e8e8 0%, #a5a5a5 40%, #a5a5a5 60%, #e8e8e8 100%);
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#e8e8e8), color-stop(40%,#a5a5a5), color-stop(60%,#a5a5a5), color-stop(100%,#e8e8e8));
background: -webkit-linear-gradient(top,  #e8e8e8 0%,#a5a5a5 40%,#a5a5a5 60%,#e8e8e8 100%);
background: -o-linear-gradient(top,  #e8e8e8 0%,#a5a5a5 40%,#a5a5a5 60%,#e8e8e8 100%);
background: -ms-linear-gradient(top,  #e8e8e8 0%,#a5a5a5 40%,#a5a5a5 60%,#e8e8e8 100%);
background: linear-gradient(to bottom,  #e8e8e8 0%,#a5a5a5 40%,#a5a5a5 60%,#e8e8e8 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e8e8e8', endColorstr='#e8e8e8',GradientType=0 );

position: relative;
display: block;
vertical-align: sub;
color: #101010;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius:  5px;
padding: 12px;
border: 1px solid #333;
}
#videos .title .watch {
display: none;
text-shadow: none!important;
background-color: #ffba00;
background-image: -moz-linear-gradient(top,#ffc600,#ffa800);
background-image: -ms-linear-gradient(top,#ffc600,#ffa800);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffc600),to(#ffa800));
background-image: -webkit-linear-gradient(top,#ffc600,#ffa800);
background-image: -o-linear-gradient(top,#ffc600,#ffa800);
background-image: linear-gradient(top,#ffc600,#ffa800);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffc600',endColorstr='#ffa800',GradientType=0);
border-color: #ffa800 #ffa800 #b37600;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25);
border-color: #ffc271;
border-bottom-color: #ef6b00;
color: #b71900!important;
position: absolute;
top: 0;
bottom: 0;
right: -120px;
width: 120px;
padding: 0;
font-size: .85em;
line-height: 1.1em;
-webkit-box-shadow: 0 1px 5px rgba(0,0,0,0.6);
-moz-box-shadow: 0 1px 5px rgba(0,0,0,0.6);
box-shadow: 0 1px 5px rgba(0,0,0,0.6);
text-align: center!important
}
#videos .title .watch.active, #videos .title .watch:active {
background-color: #ffb400;
background-image: -moz-linear-gradient(top,#ffa800,#ffc600);
background-image: -ms-linear-gradient(top,#ffa800,#ffc600);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffa800),to(#ffc600));
background-image: -webkit-linear-gradient(top,#ffa800,#ffc600);
background-image: -o-linear-gradient(top,#ffa800,#ffc600);
background-image: linear-gradient(top,#ffa800,#ffc600);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa800',endColorstr='#ffc600',GradientType=0);
border-color: #ffc600 #ffc600 #b38b00;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25)
}
#videos .title .watch.active, #videos .title .watch:active {
background-color: #ffb400;
background-image: -moz-linear-gradient(top,#ffa800,#ffc600);
background-image: -ms-linear-gradient(top,#ffa800,#ffc600);
background-image: -webkit-gradient(linear,0 0,0 100%,from(#ffa800),to(#ffc600));
background-image: -webkit-linear-gradient(top,#ffa800,#ffc600);
background-image: -o-linear-gradient(top,#ffa800,#ffc600);
background-image: linear-gradient(top,#ffa800,#ffc600);
background-repeat: repeat-x;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffa800',endColorstr='#ffc600',GradientType=0);
border-color: #ffc600 #ffc600 #b38b00;
border-color: rgba(0,0,0,0.1) rgba(0,0,0,0.1) rgba(0,0,0,0.25)
}
#videos .title .watch .t {
position: absolute;
display: block;
top: 50%;
width: 100%;
text-align: center;
margin-top: -7px
}
#videos .title .watch img {
padding: 0 8px;
position: relative;
top: 1px;
vertical-align: baseline
}
#videos .flex-viewport {
z-index: 9;
height: 295px;
-webkit-box-shadow: 0 0 50px #000;
-moz-box-shadow: 0 0 50px #000;
box-shadow: 0 0 50px #000
}
#videos .controlsContainer {
position: absolute;
bottom: 0;
height: 81px;
width: 100%;
text-align: center;
z-index: 10;
overflow: hidden
}
#videos .controlsContainer .flex-control-paging {
display: none;
margin: 0 56px;
padding: 15px 0;
background: #000;
background: rgba(0,0,0,0.4)
}
#videos .controlsContainer .flex-control-paging li a {
background: url(../img/vid_sprite.png) no-repeat -30px 100%;
height: 21px;
width: 21px
}
#videos .controlsContainer .flex-control-paging li a:hover, #videos .controlsContainer .flex-control-paging li a:focus, #videos .controlsContainer .flex-control-paging li a.flex-active {
background-position: 0 100%
}
#videos .controlsContainer .flex-prev, #videos .controlsContainer .flex-next {
position: absolute;
bottom: 0;
left: 0;
width: 46px;
height: 81px;
text-indent: -999em
}
#videos .controlsContainer .flex-prev .arr, #videos .controlsContainer .flex-next .arr {
display: block;
margin: 25% auto 0;
height: 40px;
width: 24px;
background: url(../img/vid_sprite.png) no-repeat 0 0;
background-size: 50px auto
}
#videos .controlsContainer .flex-prev .arr:hover, #videos .controlsContainer .flex-next .arr:hover, #videos .controlsContainer .flex-prev .arr:focus, #videos .controlsContainer .flex-next .arr:focus {
background-position: -26px 0
}
#videos .controlsContainer .flex-next {
right: 0;
left: auto
}
#videos .controlsContainer .flex-next .arr {
background-position: 0 -40px
}
#videos .controlsContainer .flex-next .arr:hover, #videos .controlsContainer .flex-next .arr:focus {
background-position: -26px -40px
}
#videos #videoContainer {
position: absolute;
top: 0;
left: 0;
right: 0;
bottom: 80px;
z-index: 99
}
#videos #videoContainer #video {
height: 100%;
width: 100%;
max-width: 430px;
margin: 0 auto;
z-index: 101
}
#videos #videoContainer #socialContainer {
display: none
}
#videos #videoContainer #socialContainer .wrapper {
overflow: hidden
}
#videos #videoContainer #socialContainer .videoTitle {
float: left;
padding: 7px;
width: 55%;
margin: 0;
white-space: normal
}
#videos #videoContainer #socialContainer .share label {
display: none;
position: relative;
top: 50%;
margin-top: -6px;
line-height: 12px;
float: left
}
#videos #videoContainer #socialContainer .share ul {
white-space: nowrap;
margin: 0;
padding: 0;
letter-spacing: -3px;
text-align: center
}
#videos #videoContainer #socialContainer .share ul li {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: top;
position: relative;
min-width: 70px;
width: auto!important;
overflow: hidden!important;
margin: 0;
list-style: none;
max-width: 80px;
text-align: center
}
#videos #videoContainer #socialContainer .share ul li.tw, #videos #videoContainer #socialContainer .share ul li.fb {
max-width: 100px
}
#videos #videoContainer #socialContainer .share ul li .tx {
line-height: 1em;
height: 20px;
padding: 5px 10px
}
#videos #videoContainer #socialContainer .share ul li .tx>:first-child {
display: inline-block!important;*display:inline;
zoom: 1;
height: 35px;
margin: 0 auto!important
}
#videos #videoContainer #socialContainer .share ul li img {
display: none
}
#videos #videoContainer #socialContainer .share ul .fb-send {
height: 20px
}
.controlsContainer ul,.slides ul,.controlsContainer ol,.slides ol {
padding: 0;
margin: 0
}
.controlsContainer li,.slides li {
list-style: none
}
.slides {
padding: 0
}
.flex-control-paging {
text-align: center
}
.flex-control-paging li {
display: inline-block!important;*display:inline;
zoom: 1;
padding: 5px
}
.flex-control-paging li a {
display: block;
text-indent: -999em
}
.flex-disabled {
-webkit-opacity: .2;
-moz-opacity: .2;
-khtml-opacity: .2;
opacity: .2
}
.flex-viewport ul {
list-style: none;
padding: 0;
margin: 0
}




.full  #videos {
position: relative;
height: auto;
width: 65%;
max-width: 685px;
padding: 1.5% 10% 60px;
margin: 0 auto 92px
}
.full  #videos .item {
height: auto;
max-height: 380px;
z-index: 9;
overflow: hidden
}
.full  #videos .play {
height: 87px;
width: 87px;
margin: -43.5px 0 0 -43.5px
}
.full  #videos .img {
height: auto
}
.full  #videos .img img {
width: 100%;
height: auto
}
.full  #videos .title {
width: 100%;
height: auto;
bottom: 7%;
right: 0;
padding: 0;
background: 0;
text-align: center;
text-transform: uppercase
}
.full  #videos .title .text {
padding: 15px 5%;
margin: 0 10%;
text-shadow: none;
font-size: 28px;
font-size: 2.8rem;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
}
.full  #videos .controlsContainer {
top: 0;
bottom: 0;
left: 0;
height: auto;
border: 0;
background: 0;
overflow: visible;
z-index: 1
}
.full  #videos .controlsContainer .flex-control-paging {
position: absolute;
left: 0;
right: 0;
bottom: 0;
display: inline-block!important;*display:inline;
zoom: 1
}
.full  #videos .controlsContainer .flex-next,.full  #videos .controlsContainer .flex-prev {
top: 40%;
bottom: auto
}
.full  #videos .controlsContainer .flex-next .arr,.full  #videos .controlsContainer .flex-prev .arr {
margin: 0;
height: 80px;
width: 46px;
background-size: auto auto
}
.full  #videos .controlsContainer .flex-next .arr {
background-position: 0 -80px
}
.full  #videos .controlsContainer .flex-next:hover .arr,.full  #videos .controlsContainer .flex-next:focus .arr {
background-position: -51px -80px
}
.full  #videos .controlsContainer .flex-prev .arr {
background-position: 0 0
}
.full  #videos .controlsContainer .flex-prev:hover .arr,.full  #videos .controlsContainer .flex-prev:focus .arr {
background-position: -51px 0
}
.full  #videos .flex-viewport {
height: auto
}
.full  #videos #videoContainer {
top: 10px;
bottom: 60px;
left: 56px;
right: 55px
}
.full  #videos #videoContainer #video {
max-width: none;
position: relative;
left: 0;
height: 100%;
padding: 7px 7px 40px;
background: #202026;
-webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
-moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
box-shadow: inset 0 0 10px rgba(0,0,0,0.8)
}



.full.tablet  #videos {
width: 83%;
margin-bottom: 5%
}


.tabletview  #videos {
width: 83%;
margin-bottom: 5%
}


.tablet  #videos {
width: 83%;
margin-bottom: 5%
}






@media only screen and (min-width:961px) {

	 #videos {
	position: relative;
	height: auto;
	width: 75%;
	max-width: 750px;
	padding: 1.5% 10% 60px;
	margin: 0 auto 0px !important;
        /*margin: 0 auto 92px !important;*/
	}
	 #videos .item {
	height: auto;
	max-height: 380px;
	z-index: 9;
	overflow: hidden
	}
	 #videos .play {
	height: 87px;
	width: 87px;
	margin: -43.5px 0 0 -43.5px
	}
	 #videos .img {
	height: auto
	}
	 #videos .img img {
	width: 100%;
	height: auto
	}
	 #videos .title {
	width: 100%;
	height: auto;
	bottom: 7%;
	right: 0;
	padding: 0;
	background: 0;
	text-align: center;
	text-transform: uppercase
	}
	 #videos .title .text {
	padding: 15px 5%;
	margin: 0 10%;
	text-shadow: none;
	font-size: 28px;
	font-size: 2.0rem;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	}
	 #videos .controlsContainer {
	top: 0;
	bottom: 0;
	left: 0;
	height: auto;
	border: 0;
	background: 0;
	overflow: visible;
	z-index: 1
	}
	 #videos .controlsContainer .flex-control-paging {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: inline-block!important;*display:inline;
	zoom: 1
	}
	 #videos .controlsContainer .flex-next, #videos .controlsContainer .flex-prev {
	top: 40%;
	bottom: auto
	}
	 #videos .controlsContainer .flex-next .arr, #videos .controlsContainer .flex-prev .arr {
	margin: 0;
	height: 80px;
	width: 46px;
	background-size: auto auto
	}
	 #videos .controlsContainer .flex-next .arr {
	background-position: 0 -80px
	}
	 #videos .controlsContainer .flex-next:hover .arr, #videos .controlsContainer .flex-next:focus .arr {
	background-position: -51px -80px
	}
	 #videos .controlsContainer .flex-prev .arr {
	background-position: 0 0
	}
	 #videos .controlsContainer .flex-prev:hover .arr, #videos .controlsContainer .flex-prev:focus .arr {
	background-position: -51px 0
	}
	 #videos .flex-viewport {
	height: auto
	}
	 #videos #videoContainer {
	top: 10px;
	bottom: 60px;
	left: 56px;
	right: 55px
	}
	 #videos #videoContainer #video {
	max-width: none;
	position: relative;
	left: 0;
	height: 100%;
	padding: 7px 7px 40px;
	background: #202026;
	-webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
	-moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
	box-shadow: inset 0 0 10px rgba(0,0,0,0.8)
	}


}


@media only screen and (min-device-width:320px) and (max-device-width:480) {.
	
}


@media only screen and (max-width:640px) {

}


@media only screen and (min-width:641px) and (max-width:960px) {

	 #videos {
	position: relative;
	height: auto;
	width: 65%;
	max-width: 685px;
	padding: 1.5% 10% 60px;
	margin: 0 auto 92px
	}
	 #videos .item {
	height: auto;
	max-height: 380px;
	z-index: 9;
	overflow: hidden
	}
	 #videos .play {
	height: 87px;
	width: 87px;
	margin: -43.5px 0 0 -43.5px
	}
	 #videos .img {
	height: auto
	}
	 #videos .img img {
	width: 100%;
	height: auto
	}
	 #videos .title {
	width: 100%;
	height: auto;
	bottom: 7%;
	right: 0;
	padding: 0;
	background: 0;
	text-align: center;
	text-transform: uppercase
	}
	 #videos .title .text {
	padding: 15px 5%;
	margin: 0 10%;
	text-shadow: none;
	font-size: 20px;
	font-size: 2.0rem;
	}
	 #videos .controlsContainer {
	top: 0;
	bottom: 0;
	left: 0;
	height: auto;
	border: 0;
	background: 0;
	overflow: visible;
	z-index: 1
	}
	 #videos .controlsContainer .flex-control-paging {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 0;
	display: inline-block!important;*display:inline;
	zoom: 1
	}
	 #videos .controlsContainer .flex-next, #videos .controlsContainer .flex-prev {
	top: 40%;
	bottom: auto
	}
	 #videos .controlsContainer .flex-next .arr, #videos .controlsContainer .flex-prev .arr {
	margin: 0;
	height: 80px;
	width: 46px;
	background-size: auto auto
	}
	 #videos .controlsContainer .flex-next .arr {
	background-position: 0 -80px
	}
	 #videos .controlsContainer .flex-next:hover .arr, #videos .controlsContainer .flex-next:focus .arr {
	background-position: -51px -80px
	}
	 #videos .controlsContainer .flex-prev .arr {
	background-position: 0 0
	}
	 #videos .controlsContainer .flex-prev:hover .arr, #videos .controlsContainer .flex-prev:focus .arr {
	background-position: -51px 0
	}
	 #videos .flex-viewport {
	height: auto
	}
	 #videos #videoContainer {
	top: 10px;
	bottom: 60px;
	left: 56px;
	right: 55px
	}
	 #videos #videoContainer #video {
	max-width: none;
	position: relative;
	left: 0;
	height: 100%;
	padding: 7px 7px 40px;
	background: #202026;
	-webkit-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
	-moz-box-shadow: inset 0 0 10px rgba(0,0,0,0.8);
	box-shadow: inset 0 0 10px rgba(0,0,0,0.8)
	}


	.tablet  #videos {
		width: 83%;
		margin-bottom: 5%
	}

	 #videos {
	width: 83%;
	margin-bottom: 5%
	}


}


@media only screen and (min-width:801px) and (max-width:959px) { 
	 #videos {
		margin-bottom: 10%
	}
}

/*********************************************/
/*           END VID WIDGET                  */


/*             GAME INFO 2 CSS            */
/****************************************/

section[id="game-info"] {
   background: #ffffff;
   -webkit-box-shadow: 0 0 20px #000;
   -moz-box-shadow: 0 0 20px #000;
   box-shadow: 0 0 20px #000;
   padding: 5px;
   border-radius: 5px 5px 0 0;
   -moz-border-radius: 5px 5px 0 0;
   -webkit-border-radius: 5px 5px 0 0;
}

section[id="dlc-info"] {
}

#dlc-info {
   padding: 20px 10px;
   background: none repeat scroll 0 0 #cdcdcd;
   color: #101010;
   font-weight: 500;
   text-align: center;
   cursor: pointer;
}

#myModal {
  z-index: 1000;
}

#game-info .slides {
margin: 0!important
}
#game-info .controlsContainer ul,.slides ul,.controlsContainer ol,.slides ol {
padding: 0;
margin: 0
}
#game-info .controlsContainer li,.slides li {
list-style: none
}
#game-info .flex-control-paging {
display: none;
text-align: center
}
#game-info .flex-control-paging li {
display: inline-block!important;*display:inline;
zoom: 1;
padding: 5px
}
#game-info .flex-control-paging li a {
cursor: pointer;
display: block;
text-indent: -999em;
background: url(../img/dots.png) no-repeat -26px 0;
background-size: auto 100%!important;
height: 16px;
width: 16px
}
#game-info .flex-control-paging li a:hover,#game-info .flex-control-paging li a:focus,#game-info .flex-control-paging li a.flex-active {
background-position: 0 0
}
#game-info .flex-prev,#game-info .flex-next {
position: absolute;
bottom: 0;
width: 60px;
height: 68px;
padding: 0;
font-size: 3em;
line-height: 60px;
text-decoration: none!important
}
#game-info .flex-prev .arr,#game-info .flex-next .arr {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: middle;
height: 32px;
width: 23px;
margin: 0 auto;
background: url(../img/arr_lr_s.png) no-repeat 0 0;
color: #f4ac00;
font-weight: 100;
text-indent: -999em
}
#game-info .flex-prev {
left: 0
}
#game-info .flex-next {
right: 0
}
#game-info .flex-next .arr {
background-position: 100% 0
}
#game-info .flex-active {
cursor: default
}
#game-info .flex-disabled {
-webkit-opacity: .2;
-moz-opacity: .2;
-khtml-opacity: .2;
opacity: .2
}
#game-info .flex-viewport ul {
list-style: none;
padding: 0;
margin: 0;
overflow: hidden
}

#game-info .slides {
margin: 0!important
}
#game-info .controlsContainer ul,.slides ul,.controlsContainer ol,.slides ol {
padding: 0;
margin: 0
}
#game-info .controlsContainer li,.slides li {
list-style: none
}
#game-info .flex-control-paging {
display: none;
text-align: center
}
#game-info .flex-control-paging li {
display: inline-block!important;*display:inline;
zoom: 1;
padding: 5px
}




#main #game-info {
color: #fff;
font-size: 1.3em
}
#main #game-info h2 {
text-transform: uppercase;
margin-bottom: 25px;
text-shadow: 1px 1px 0px #c6c6c6 !important;
}
#main #game-info h2 img {
width: 90%
}
#main #game-info p {
font-size: 13px;
font-size: 1.3rem
}
#main #screensSlider, #main #wallpapersSlider {
position: relative;
bottom: 30px;
background-size: 100% 100%;
width: 78%;
padding: 25px 22px 20px 23px;
margin: 0 auto 10px
}
#main #screensSlider .controlsContainer .flex-next,#main #wallpapersSlider .controlsContainer .flex-next,#main #screensSlider .controlsContainer .flex-prev,#main #wallpapersSlider .controlsContainer .flex-prev {
width: 30px;
bottom: 50%;
margin-bottom: -30px;
z-index: 99
}
#main #screensSlider .controlsContainer .flex-next .arr,#main #wallpapersSlider .controlsContainer .flex-next .arr,#main #screensSlider .controlsContainer .flex-prev .arr,#main #wallpapersSlider .controlsContainer .flex-prev .arr {
background-image: url(../img/arr_lr_m.png);
height: 55px;
width: 25px
}
#main #screensSlider .controlsContainer .flex-next,#main #wallpapersSlider .controlsContainer .flex-next {
right: -10px
}
#main #screensSlider .controlsContainer .flex-prev,#main #wallpapersSlider .controlsContainer .flex-prev {
left: -10px
}
#main #screensSlider .slides,#main #wallpapersSlider .slides {
white-space: nowrap;
overflow: hidden
}
#main #screensSlider .item,#main #wallpapersSlider .item {
cursor: alias;
overflow: hidden;
text-align: center;
padding: 0!important;
margin: 0!important;
display: inline-block!important;*display:inline;
zoom: 1;
width: 100%
}

#main #screensSlider .item a,#main #wallpapersSlider .item a {
display: block;
margin: 0 auto
}
#main #screensSlider .item img,#main #wallpapersSlider .item img {
margin: 0 auto;
width: 100%;
height: auto
}

.full #main #game-info {
background: none!important
}


.full #main #game-info h1 {
margin-bottom: 35px
}


.full #main #game-info h1 img {
width: 100%
}
.full #main #game-info .wrap {
white-space: nowrap
}
.full #main #game-info .content,.full #main #game-info .boxart,.full #main #game-info #screensSlider {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: top
}
.full #main #game-info .content {
width: 50%;
padding: 0;
padding-right: 30px
}
.full #main #game-info.no-gallery .content {
width: auto
}
.full #main #game-info #screensSlider {
top: 30px;
right: 0;
margin-bottom: 45px;
width: 40%;
padding: 25px 27px 20px 15px
}
.full #main #game-info #screensSlider .flex-viewport,.full #main #game-info #screensSlider .slides {
position: relative;
top: -5px;
left: 5px;
min-height: 150px
}
.full #main #game-info #screensSlider .flex-viewport .slides {
position: static
}
.full #main #game-info #screensSlider .flex-next {
right: -25px
}
.full #main #game-info #screensSlider .flex-prev {
left: -25px
}
.full #main #game-info #screensSlider .slides .item {
width: 255px
}
.full #main #game-info #screensSlider .slides .item img {
background: #fff;
width: 100%;
height: auto
}

.full.tablet #main #game-info {
margin-top: 20px;
text-align: center
}
.full.tablet #main #game-info .content,.full.tablet #main #game-info .boxart {
width: 39%;
text-align: left
}
.full.tablet #main #game-info .boxart {
padding-left: 3%
}
.full.tablet #main #game-info #screensSlider {
right: 12px
}


.tabletview #main #game-info {
margin-top: 20px;
text-align: center
}
.tabletview #main #game-info .content,.tabletview #main #game-info .boxart {
width: 39%;
text-align: left
}
.tabletview #main #game-info .boxart {
padding-left: 3%
}
.tabletview #main #game-info #screensSlider {
right: 12px
}


@media only screen and (min-width:959px) {

section[id="game-info"] {
   padding: 25px;
}

#main #game-info {
background: none!important
padding: 20px;
}
#main #game-info h1 {
margin-bottom: 35px
}
#main #game-info h1 img {
width: 100%
}
#main #game-info .wrap {
white-space: nowrap
}
#main #game-info .content,#main #game-info .boxart,#main #game-info #screensSlider {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: top
}
#main #game-info .content {
width: 47%;
padding: 0;
padding-right: 30px
}
#main #game-info.no-gallery .content {
width: auto
}
#main #game-info #screensSlider {
top: 30px;
right: 0;
margin-bottom: 45px;
width: 40%;
padding: 25px 27px 20px 15px
}
#main #game-info #screensSlider .flex-viewport,#main #game-info #screensSlider .slides {
position: relative;
top: -5px;
left: 5px;
min-height: 150px
}
#main #game-info #screensSlider .flex-viewport .slides {
position: static
}
#main #game-info #screensSlider .flex-next {
right: -25px
}
#main #game-info #screensSlider .flex-prev {
left: -25px
}
#main #game-info #screensSlider .slides .item {
width: 255px
}
#main #game-info #screensSlider .slides .item img {
background: #fff;
width: 100%;
height: auto
}

.tablet #main #game-info {
margin-top: 20px;
text-align: center
}
.tablet #main #game-info .content,.tablet #main #game-info .boxart {
width: 39%;
text-align: left
}
.tablet #main #game-info .boxart {
padding-left: 3%
}
.tablet #main #game-info #screensSlider {
right: 12px
}

}


/*        SOCIAL CSS         */
/*****************************/

header[role='banner'] .social {
text-align: center
}
header[role='banner'] .social .title {
display: inline-block!important;*display:inline;
zoom: 1;
padding-right: 20px;
line-height: 22px;
font-weight: bold;
text-transform: uppercase;
color: #fff;
font-size: 14px;
font-size: 1.4rem
}
header[role='banner'] .social .links {
letter-spacing: 0;
padding: 0;
margin: 0;
display: inline-block!important;*display:inline;
zoom: 1
}
header[role='banner'] .social .links li {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: top;
height: 18px;
width: 25px;
letter-spacing: normal;
text-align: left
}
header[role='banner'] .social .links li a {
height: 100%;
background: url(../img/social.jpg) no-repeat;
display: block;
text-indent: -999em
}
header[role='banner'] .social .links li:hover a {
-webkit-opacity: .5;
-moz-opacity: .5;
-khtml-opacity: .5;
opacity: .5
}
header[role='banner'] .social .links li.fb a {
background-position: -25px 0
}
header[role='banner'] .social .links li.gp a {
background-position: -50px 0
}
header[role='banner'] .social .links li.yt a {
background-position: -75px 0
}


#social {
/* display: none; */
text-align: center;
padding-top: 25px;
background: #666
}
#social h2 {
text-transform: uppercase;
font-size: 2.2em;
color: #fff
}
#social ul {
letter-spacing: 20px;
margin: 0 auto;
padding: 0
}
#social ul.wrap {
width: 950px
}
#social .item {
display: inline-block!important;*display:inline;
zoom: 1;
padding: 55px 0 20px;
width: 31.2%;
vertical-align: top;
letter-spacing: normal
}
#social .item .wrapper {
height: 244px;
overflow: hidden
}
#social .item.tw {
background: url(../img/icon_tw.png) no-repeat 50% 0
}
#social .item.tw .wrapper {
background: none!important;
border: none!important;
height: 244px
}
#social .item.tw .twFollow {
padding: 0
}
#social .item.tw .twFollow iframe {
position: relative;
margin: 0 auto
}
#social .item.tw .loading {
text-align: center;
color: #fff;
text-transform: uppercase;
padding: 10px 0
}
#social .item.tw .twlist {
margin: 10px 10px;
height: 210px;
position: relative;
overflow: hidden
}
#social .item.tw .tweet_list {
position: relative;
margin: 0;
letter-spacing: normal!important;
white-space: normal
}
#social .item.tw .tweet_list li {
font-size: .9em;
position: relative;
height: 80px;
padding: 10px 0;
text-align: left;
list-style: none;
border-top: 1px solid #fff;
color: #fff
}
#social .item.tw .tweet_list li.tweet-first {
border: 0
}
#social .item.tw .tweet_list li a {
color: #101010
}
#social .item.tw .tweet_list li .tweet_join {
display: none
}
#social .item.tw .tweet_list li .tweet_avatar,#social .item.tw .tweet_list li .tweet_text {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: top
}
#social .item.tw .tweet_list li .tweet_avatar {
background: #fff;
padding: 2.5px;
width: 40px
}
#social .item.tw .tweet_list li .tweet_avatar img {
width: 100%;
height: auto
}
#social .item.tw .tweet_list li .tweet_text {
padding-left: 10px;
width: 75%;
overflow: hidden;
line-height: 1.3em
}
#social .item.tw .tweet_list li .tweet_time {
position: absolute;
bottom: 5px;
right: 10px
}
#social .item.tw .tweet_list li .tweet_time a {
text-transform: none;
font-style: italic
}
#social .item.fb {
background: url(../img/icon_fb.png) no-repeat 50% 0
}

#social .item.fb em {
   font-weight: 600;
   font-size: 24px;
   color: #AAA;
   line-height: 175px;
}

#social .item.fb .wrapper {
background: none!important;
border: none!important;
height: 244px
}
#social .item.fb iframe {
position: relative;
top: -1px;
left: -1px;
width: 298px;
height: 220px
}
#social .item.gg {
/* background: url(../img/icon_gg.png) no-repeat 50% 0 */
}
#social .item.gg a {
position: relative;
font-size: 16px;
padding: 0 0 0 60px;
margin: 25px 10%;
text-align: left;
font-weight: normal;
display: block;
line-height: 1.2em
}
#social .item.gg a img {
position: absolute;
top: 0;
left: 0
}
#social .item.gg a strong {
text-transform: uppercase;
display: block;
font-size: 1.8em
}
#social .item.gg a:hover,#social .item.gg a:focus {
text-decoration: none
}

.full header[role='banner'] .social {
display: block
}

.full #social {
display: block
}

.full.tablet #social .item {
width: 48%
}

.full.tablet #social .item.gg {
width: 98%;
letter-spacing: 20px;
padding-bottom: 30px
}
.full.tablet #social .item.gg .wrapper {
height: auto
}
.full.tablet #social .item.gg a {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: top;
margin: 10px 0;
letter-spacing: normal;
padding-left: 45px
}

.tabletview #social .item {
width: 48%
}
.tabletview #social .item.gg {
width: 98%;
letter-spacing: 20px;
padding-bottom: 30px
}
.tabletview #social .item.gg .wrapper {
height: auto
}
.tabletview #social .item.gg a {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: top;
margin: 10px 0;
letter-spacing: normal;
padding-left: 45px
}



@media only screen and (min-width:961px) {

	header[role='banner'] .social {
	display: block
	}

	#social {
	display: block
	}

	.tablet #social .item {
	width: 48%
	}
	.tablet #social .item.gg {
	width: 98%;
	letter-spacing: 20px;
	padding-bottom: 30px
	}
	.tablet #social .item.gg .wrapper {
	height: auto
	}
	.tablet #social .item.gg a {
	display: inline-block!important;*display:inline;
	zoom: 1;
	vertical-align: top;
	margin: 10px 0;
	letter-spacing: normal;
	padding-left: 45px
	}

}



@media only screen and (max-width:640px) {

	header[role='banner'] .social {
	display: block
	}

	.logo a {
    		padding: 0;
    		width: 100%;
	}

#block--approuting--featuredpromo ul {
    padding: 0px;
}
.col-1-2 {
width: 98%;
}

.site_button {
    margin-top: 10px;
    padding-bottom: 10px;
    margin-left: 0;
    background-size: 100%;
}

	#social {
	display: block
	}

	.tablet #social .item {
	width: 48%
	}
	.tablet #social .item.gg {
	width: 98%;
	letter-spacing: 20px;
	padding-bottom: 30px
	}
	.tablet #social .item.gg .wrapper {
	height: auto
	}
	.tablet #social .item.gg a {
	display: inline-block!important;*display:inline;
	zoom: 1;
	vertical-align: top;
	margin: 10px 0;
	letter-spacing: normal;
	padding-left: 45px
	}

	#social .item {
	width: 48%
	}
	#social .item.gg {
	width: 98%;
	letter-spacing: 20px;
	padding-bottom: 30px
	}
	#social .item.gg .wrapper {
	height: auto
	}
	#social .item.gg a {
	display: inline-block!important;*display:inline;
	zoom: 1;
	vertical-align: top;
	margin: 10px 0;
	letter-spacing: normal;
	padding-left: 45px
	}


}

/*           FOOTER CSS             */
/************************************/

footer {
position: relative;
padding: 117px 0 20px;
margin: -85px 0 0;
width: 100%;
z-index: 1;
}
footer * {
color: #FFF;
text-shadow: 1px 1px 2px #000;
font-weight: normal
}
footer a {
color: #FFF!important
}
footer p {
font-size: 13px!important;
font-size: 1.3rem!important;
margin-bottom: 1em;
text-align: center;
text-transform: uppercase
}
footer p a {
padding: 0 5px
}
footer #links {
margin-bottom: 10px;
display: none
}
footer #links a {
display: block
}
footer #legalContainer {
margin-top: 20px
}


footer .rating {
width: 316px;
float: left;
}
footer .rating img {
max-width: 100%!important;
width: 225px;
height: auto!important;
}

footer .privacy {
   width: 316px;
   float: right;
   text-align: right;
   margin-top: 40px;
}
footer .privacy img {

}


footer .capcomLogo {
width: 168px;
float: left;
text-align: center;
}
footer .capLogo {
padding-top: 110px
}

.mobile footer {
text-align: center
}
.mobile footer .rating {
margin: 0 auto
}

.full footer {
min-height: 150px
}
.full footer .wrap {
padding-top: 10px
}
.full footer #links {
display: block
}
.full footer .rating {
float: left
}
.full footer .rightLogos {
overflow: hidden
}
.full footer .rightLogos img {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: middle;
margin: 0;
padding: 50px 0 0
}
.full footer #legalContainer {
clear: both;
padding-top: 20px
}
.full.tablet footer .rightLogos {
padding-left: 20px
}
.tabletview footer .rightLogos {
padding-left: 20px
}

footer #legalContainer {
clear: both;
padding-top: 20px
}
.tablet footer .rightLogos {
padding-left: 20px
}


@media only screen and (min-device-width:320px) and (max-device-width:480) {
footer {
text-align: center
}
footer .rating {
margin: 0 auto
}

}

}

@media (max-width: 480px) {
  #sb-wrapper-inner { height: 325px !important; }
}


@media only screen and (max-width:640px) {
footer {
text-align: center
}
footer .rating {
margin: 0 auto
}
.wright-sykes {
    display: none;
}
}



@media only screen and (min-width:641px) and (max-width:960px) {
footer {
min-height: 150px
}
footer .wrap {
padding-top: 10px
}
footer #links {
display: block
}
footer .rating {
float: left
}
footer .rightLogos {
overflow: hidden
}
footer .rightLogos img {
display: inline-block!important;*display:inline;
zoom: 1;
vertical-align: middle;
margin: 0;
padding: 50px 0 0
}
footer #legalContainer {
clear: both;
padding-top: 20px
}
.tablet footer .rightLogos {
padding-left: 20px
}
footer .rightLogos {
padding-left: 20px
}
        .steam_logo {
                position: relative !important;
                left: 100px !important;
                top: 0px !important;
        }

footer .rating { width: 100% !important; text-align: center !important; }
footer .capcomLogo { width: 100% !important; text-align: center !important; }
footer .capLogo { padding:25px !important; }
footer .privacy {width: 100% !important; text-align: center !important; }



}

/*dlc page additions */
.h_rule {
  width: 90%;
  height: 2px;
  background: -moz-linear-gradient(left,  rgba(0,0,0,0.65) 0%, rgba(0,0,0,0) 100%);
  background: -webkit-gradient(linear, left top, right top, color-stop(0%,rgba(0,0,0,0.65)), color-stop(100%,rgba(0,0,0,0)));
  background: -webkit-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
  background: -o-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
  background: -ms-linear-gradient(left,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
  background: linear-gradient(to right,  rgba(0,0,0,0.65) 0%,rgba(0,0,0,0) 100%);
  filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a6000000', endColorstr='#00000000',GradientType=1 );
}

ul.dl_showcase {
  list-style: none;
  margin: 0 0 0 3%;
  padding: 0;
  display: table;
}

ul.dl_showcase li {
  float: left;
  margin-right: 3% !important;
  width: 30%;
  text-align: center;
}
ul.dl_showcase li:last-child {
  margin-right: 0px !important;
}
ul.dl_showcase li img {
  border: 1px solid #555;
}

ul.dlc_inst {
  list-style: none;
  margin: 20px 0;
  padding: 0px;
  display: table;
}

ul.dlc_inst li {
  float: left; 
}

ul.dlc_inst li img {
    border: 1px solid #555555;
    height: auto;
    margin: 6px 15px;
    width: 75%;
}

ul.dlc_notes {
    background: none repeat scroll 0 0 #EEEEEE;
    border-radius: 10px 10px 10px 10px;
    display: table;
    padding: 10px 10px 10px 20px;
}

ul.dlc_add_funds {
  list-style: none;
  margin: 20px 0;
  padding: 0px;
  display: table;
  width: 90%;
}

ul.dlc_add_funds li {
  float: left;
  vertical-align: middle;
}

ul.dlc_add_funds li img {
    border: 1px solid #555555;
    height: auto;
    width: 80%;
}




.steam_logo {
    background: url("../img/steam_logo.png") no-repeat scroll 50% 10px #4C6B22;
    border: 1px solid #CDCDCD;
    height: 85px;
    position: absolute;
    right: 150px;
    top: 320px;
    width: 200px;
}

.steam_logo span {
    color: #FFFFFF;
    left: 52px;
    position: relative;
    top: 60px;
}