@charset "UTF-8";
/* reset */
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,sup,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:inherit;font-size:100%;vertical-align:baseline}
html{line-height:1}
ol,ul{list-style:none}
table{border-collapse:collapse;border-spacing:0}
caption,th,td{text-align:left;font-weight:400;vertical-align:middle}
q,blockquote{quotes:none}
q:before,q:after,blockquote:before,blockquote:after{content:"";content:none}
a img{border:none}
article,aside,details,figcaption,figure,footer,header,hgroup,main,menu,nav,section,summary{display:block}
*,:before,:after{box-sizing:border-box}
html,body{width:100%;min-height:100%;position:relative}
body{-webkit-backface-visibility:hidden;backface-visibility:hidden;font-family:"Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;line-height:1.7}
a{outline:none;text-decoration:none}
img{vertical-align:middle}
.clearfloat:after{display:table;height:0;width:100%;line-height:1;content:" ";}

body{font-family:source-sans-pro;background-color:#000;font-style:normal;font-weight:200;margin:0}
.container{width:100%;margin-left:auto;margin-right:auto;height:1000px;background-color:#FFF}
header{width:100%;background:#FFF;position:relative}
.logo{color:#fff;font-weight:700;text-align:undefined;width:10%;float:left;margin-top:15px;margin-left:25px;letter-spacing:4px}
nav{width:100%;height:100%;text-align:center;position:relative;z-index:9999;padding:5px 0}
header nav ul{list-style:none;position:relative;width:60%;margin:0 auto}
nav ul li{display:inline-block;position:relative;color:#FFF;width:17%;margin:0 1%;letter-spacing:2px;font-weight:700;transition:all .3s linear;background:url(../img/common/nav_home_on.png) left top no-repeat;background-size:100% auto}
nav ul li img{width:100%;height:auto}
nav ul li#world{background-image:url(../img/common/nav_world_on.png);}
nav ul li#characters{background-image:url(../img/common/nav_characters_on.png);}
nav ul li#system{background-image:url(../img/common/nav_system_on.png);}
nav ul li#media{background-image:url(../img/common/nav_media_on.png);}
nav ul li#purchase{background-image:url(../img/common/nav_purchase_on.png);}
ul li a{color:#FFF;text-decoration:none;}
ul li p{display:none}
ul li:hover a{color:#2C9AB7}
header #console{display:block;position:absolute;left:0;top:50%;transform:translate(0,-50%);}
header #console img{display:inline-block;}
header #social{display:block;position:absolute;right:0;top:50%;transform:translate(0,-50%);z-index:99999}
header #social ul{display:table;}
header #social ul li{display:table-cell;padding:10px;}
header #social ul li a{text-indent:-99999px}
.hero_header{color:#FFF;text-align:center;letter-spacing:4px;margin:0}
.hero{position:relative;overflow:hidden}
.hero img{width:100%;height:auto}
.heroShadow {position: absolute;width: 120%;height: 100%;top: 0;left: -10%;box-shadow: 0px -10px 30px 2px #000 inset;}
.hero .game-logo{position:absolute;top:0;left:0;width:45%;height:auto}
.hero .video{position:absolute;top:40%;left:67%;width:25%;height:auto}
.hero .catch{position:absolute;top:60%;left:6.5%;width:30%;height:auto}
.light{font-weight:700;color:#717070}
.tagline{text-align:center;color:#FFF;margin-top:4px;font-weight:lighter;text-transform:uppercase;letter-spacing:1px}
.text_column{width:29%;text-align:justify;font-weight:lighter;line-height:25px;float:left;padding-left:20px;padding-right:20px;color:#A3A3A3}
.about{padding-top:0;display:block;background-color:#000;margin-top:0}
.stats{color:#717070;margin-bottom:5px}
.gallery{clear:both;display:block;width:100%;background-color:#FFF;padding-bottom:35px;padding-top:0;margin-top:-5px;margin-bottom:0}
.thumbnail{width:25%;text-align:center;float:left;margin-top:35px}
.gallery .thumbnail h4{color:#52BAD5;margin:5px}
.gallery .thumbnail p{color:#A3A3A3;margin:0}
.banner{background-color:#2D9AB7;background-image:url(../images/parallax.png);height:400px;background-attachment:fixed;background-size:cover;background-repeat:no-repeat}
.parallax{color:#FFF;text-align:right;padding-right:100px;padding-top:110px;letter-spacing:2px;margin-top:0}
.parallax_description{color:#FFF;text-align:right;padding-right:100px;width:30%;float:right;font-weight:lighter;line-height:23px;margin:0}
.purchase{width:100%;text-align:center;font-family: "mrs-eaves-xl-serif",serif;background-image: url(../img/common/bg_pattern.jpg);background-repeat: repeat;background-position: center top;padding:0 0 40px}
.purchase h2{padding:40px 0 0;width:100%}
.purchase h2 img{width:40%;height:auto}
.purchase .purchase-link{width:250px;height:50px;background: rgba(241,231,103,1);background: -moz-linear-gradient(left, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);background: -webkit-linear-gradient(left, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);background: -o-linear-gradient(left, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);background: -ms-linear-gradient(left, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);background: linear-gradient(to right, rgba(241,231,103,1) 0%, rgba(254,182,69,1) 100%);background-size:auto 100%;display:inline-block;font-size:24px;line-height:48px;font-weight:800;box-shadow:5px 5px 5px #000;border:ridge 3px #C80;margin:20px}
.purchase .purchase-link:hover{background: -moz-linear-gradient(left,rgba(254,182,69,1),rgba(241,231,103,1));background: -webkit-linear-gradient(left, rgba(254,182,69,1), rgba(241,231,103,1));background: -o-linear-gradient(left, rgba(254,182,69,1), rgba(241,231,103,1));background: -ms-linear-gradient(left, rgba(254,182,69,1), rgba(241,231,103,1));background: linear-gradient(to right, rgba(254,182,69,1), rgba(241,231,103,1));}
.purchase .purchase-link:active {box-shadow: 3px 3px 5px #000 inset, -3px -3px 5px #000 inset; }
.purchase .purchase-link a{color:#000;display:block}
.purchase .purchase-link a:hover{color:#FFF}
footer{background-color:#FFF}
.footer_column{width:50%;text-align:center;padding-top:30px;float:left}
footer .footer_column h3{color:#B3B3B3;text-align:center}
footer .footer_column p{color:#717070;background-color:#FFF}
.cards{width:100%;height:auto;max-width:400px;max-height:200px}
footer .footer_column p{padding-left:30px;padding-right:30px;text-align:justify;line-height:25px;font-weight:lighter;margin-left:20px;margin-right:20px}
.button{width:200px;text-align:center;vertical-align:middle;border-radius:0;text-transform:uppercase;font-weight:700;letter-spacing:2px;border:3px solid #FFF;color:#FFF;transition:all .3s linear;margin:40px auto auto;padding:20px 10px}
.button:hover{background-color:#FEFEFE;color:#C4C4C4;cursor:pointer}
.copyright{text-align:center;padding-top:20px;padding-bottom:20px;background-color:#FFF;color:#000;font-weight:400;letter-spacing:normal;border-top-width:2px; font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;}
.footer_banner{width:50%;display:table;background-color:#FFF;padding:30px 0;margin:0 auto;text-align:center}
.footer_banner div{display:table-cell;vertical-align:middle}
.footer_banner div#esrb img{height:72px;width:auto}
.footer_banner div#esrbPrivacy img{height:72px;width:auto}
.footer_banner div#atlus img{height:50px;width:auto}
footer{display:block}
.hidden{display:none}
.hamburger{display:none}
#scrollup {width:76px;height:76px;position: fixed;bottom:150px;right:20px;display:none;text-indent:-9999px;cursor:pointer;z-index:999;}
#scrollup img {display: block;width: 100%;}
.disclaimer{font-size:12px}
/*
.comingsoon:before{content:" ";position:absolute;display:block;background:url(../img/common/coming_soon.png) left top no-repeat;background-size:100% auto;top:0;right:0;bottom:0;left:0;width:100%;height:100%;opacity:0.85}
.comingsoon img{width:100%;height:auto}
*/
@media (max-width:1280px){
	#social{width:20%}
	#social img{width:90%}
	#console{width:20%}
	#console img{width:100%;height:auto}
}
@media (max-width: 1096px) {
.text_column{width:100%}
.thumbnail{width:50%}
.text_column{width:100%;margin:0;padding:0}
.banner{margin-top:0;padding-top:0}
	.hamburger{display:block}
	header #console{display:none}
	header #social{width:25%;top:10px;transform:none}
	header nav ul{width:100%}
	header nav{z-index:9999}
}
@media screen and (max-width: 1000px) {
	.purchase h2 img {
		width: 60%;
	}
}
@media screen and (max-width: 600px) {
	.purchase h2 img {
		width: 85%;
	}
}

@media (max-width: 767px) {
.logo{width:100%;text-align:center;color:#043745;margin:13px 0 0}
.container header nav{width:100%;float:none;overflow:auto;display:inline-block;background:#FFF;margin:0}
	header #console{width:100%;float:none;text-align:center}
	header #social{width:50%;float:none;z-index:9999}
	header #social ul{margin:0 0 0 auto}
header nav ul{padding:0;float:none}
/* nav ul li{width:100%;text-align:center;padding-top:8px;padding-bottom:8px;margin:0} */
.text_column{width:100%;text-align:left;padding:0}
.thumbnail{width:100%}
.footer_column{width:100%;margin-top:0}
.parallax{text-align:center;width:100%;font-size:18px;margin:0;padding:40% 0 0}
.parallax_description{float:none;width:100%;text-align:center;margin:30% 0 0;padding:0}
.thumbnail{width:50%}
.parallax{margin:0;padding:20% 0 0}
.parallax_description{width:100%;padding-top:30px;margin:0}
.banner{padding-left:20px;padding-right:20px}
.footer_column{width:100%}
	.footer_banner{display:block}
	.footer_banner div{display:block;width:100%;text-align:center;padding:10px 0}
}
@media (max-width: 450px) {
	header #social {width: 60%;}
	header #social ul li {padding: 5px;}
}
@media (max-width: 350px) {
	header #social {width: 65%;}
	header #social ul li {padding: 2px;}
}
@media (max-width: 320px) {
.logo{width:100%;text-align:center;margin:13px 0 0}
.container header nav{width:100%;float:none;margin:0}
nav ul li{width:19%;text-align:center;margin:0}
.text_column{width:100%;text-align:justify;padding:0}
.thumbnail{width:100%}
.footer_column{width:100%;margin-top:0}
.parallax{text-align:center;width:100%;font-size:18px;margin:0;padding:40% 0 0}
.parallax_description{width:90%;float:none;text-align:center;margin:25px 0 0 12px;padding:0}
.banner{background-color:#2D9AB7;background-image:none}
.tagline{margin-top:20px;line-height:22px}
.hero_header{padding-left:10px;padding-right:10px;line-height:22px;text-align:center}	
}

/*footer addition*/
.fade-border{display: block;border: 0;height: 1px;width: 100%;margin: 0;background-image: linear-gradient(to right, rgba(0,0,0,0), rgba(0,0,0,1), rgba(0,0,0,0));}
#footer-2{color:#000;text-align:center;width:90%;margin: 1% auto 0;}
#footer-2 a{color:#000;text-decoration:none;font-size:15px;display:inline-block;padding:20px; font-family: "Helvetica Neue",Helvetica,Arial,sans-serif}