@charset "utf-8";
@font-face 
{
    font-family: MissionGothic;
    font-style:  normal;
    font-weight: 400;
    src:url('Resources/Mission Gothic Regular.otf');
}
@font-face 
{
    font-family: MissionGothic;
    font-style:  normal;
    font-weight: 200;
    src:url('Resources/Mission Gothic Light.otf');
}
body
{
	margin:0;
}
img
{
	max-width:100%;
	max-height:100%;
	image-rendering: -moz-crisp-edges;         /* Firefox */
	image-rendering: -o-crisp-edges;         /* Opera */
	image-rendering: -webkit-optimize-contrast;/* Webkit (non-standard naming) */
	image-rendering: crisp-edges;
	-ms-interpolation-mode: nearest-neighbor;  /* IE (non-standard property) */
}
a
{
	text-decoration: none;
	color:inherit;
}
h1,h2,h3,h4,h5
{
	font-family: MissionGothic;
	font-weight: 400;
	margin-top:0;
	margin-bottom: 0.5em;
}
p
{
	font-family: MissionGothic;
	font-weight: 200;
	margin: 0 0 0.5em 0;
}
.wrapper
{
	display:block;
	width:100%;
	max-width:1200px;
	margin:0 auto;
	padding:3rem 0;
}
.header
{
	width:100%;
	background-color:rgba(0,0,0,0.7);
	height:3rem;
	position:fixed;
	top:0;
	left:0;
	z-index:10;
	display:none;
}
.header .logo
{
	height: 100%;
    width: auto;
    margin: auto 0;
    padding: 0.5rem 1rem;
    box-sizing: border-box;
}
#availableNow img
{
	vertical-align:middle;
	max-height: 2rem;
}
.verticalAlign
{
	display: inline-block;
	height:100%;
	vertical-align: middle
}
.heroContent
{
	width:100%;
	height:85vh;
	overflow: hidden;
}
.heroVideoSource
{
	position: relative;
    left: 50%;
    min-width: 100%;
    min-height: 100vh;
    max-width: inherit;
    transform: translate(-50%, 0);
}
.cover
{
	position:absolute;
	top:0;
	width:100%;
	height:inherit;
	background-color:rgba(0,0,0,0.5);
}
.heroInfo
{
	position:absolute;	
	top:65%;
	left:50%;
	width:fit-content;
	transform:translate(-50%,-50%);
	color:white;
}
.heroContent .logo
{
	height:7rem;
	margin:0 auto;
}
.largeButton
{
	height:2.5rem;
	width:fit-content;
	width: -moz-max-content;
	margin:1.5rem auto;
	padding:0.5rem 3rem;
}
.heroContent .largeButton
{
	background-color:rgba(230, 33, 23, 0.8);
}
.center
{
	height: 100%;
	width: fit-content;
	margin: 0 auto;
}
#availText
{
	float:left;
	margin:0 1rem 0 0;
	line-height: 2.5rem;
}
.fullWidth
{
	display:block;
	width:100%;
}
#gameDetails
{
	background-color: white;
	border-top:2px solid #89b4ff;
}
#gameDetails .columnElement
{
 	flex: 1 1 100%;  
	margin:0 2rem;
}
#description .flexBox
{
	width:auto;
}
#description .flexContainer
{
	justify-content: flex-start;
}
.flexContainer
{
	display:flex;
	flex-wrap:nowrap;
	justify-content: space-around;
}
.flexBox
{
}
.flexWrap
{
	flex-wrap:wrap;
}
.trailerLink
{
	width:75%;
	max-height:50vh;
	margin:0 auto;
}
.iframeHolder
{
	margin-bottom:2rem;
	height: 0;
    position: relative;
    padding-bottom: 56%;
}
.perserveAspect
{
	width: 100%;
	height: 100%;
	position: absolute;
}
#availOn
{
	justify-content: flex-start;
	margin-bottom: 1rem;
}
#availOn .flexBox:nth-child(even)
{
	margin-right: 1vh;
}
#availOn .largeButton
{
	padding: 0.5rem 0;
    margin: 0 0 1vh 0;
    background: rgba(0,0,0,0.8);
    height: 1.5rem;
    flex: 1 1 40%;
    text-align: center;
}
#description #switchLink
{
	flex: 1 1 100%;
	background-color:rgb(230, 33, 23);
}
#extraInfo .flexBox
{
	width:47.5%;
	margin: 0 2% 2% 0;
}
.esrb
{
	height:7vh;
}
#footer
{
	background: rgba(0,0,0,0.8);	
	height:1.5rem;
	padding: 0.75rem 0;
}
#compamyLogos
{
	margin:0 1rem;
	display:flex;
	flex-wrap: nowrap;
	justify-content: center;
	text-align: center;
	box-sizing: border-box;
	height:100%;
	width:fit-content;
	width:-moz-fit-content;
	max-width: 60%;
	align-items: center;
}
#compamyLogos a
{
	display: flex;
	margin:0 2rem 0 0;
	height:1.5rem;
	width:fit-content;
	width:-moz-fit-content;
}
#compamyLogos #coatsinkLogo
{
	padding:0.35rem 0;
	height:1.25rem;
}
#copyright 
{
	color:rgb(120,120,120);
	margin:0;
	line-height:1.5rem;
	white-space: nowrap;
}

@media screen and (orientation:portrait) 
{
	.heroContent
	{
		height:70vh;
	}
	.heroInfo
	{
		top:55%;
		width:80%;
		width:fit-content;
		width:-moz-fit-content;
	}
	.heroContent .logo 
	{
		height: auto;
		width: 90%;
	}
	#availText
	{
		width: fit-content;
		margin-right: 0.5rem;
	}
	.largeButton 
	{
		margin: 2.5rem auto;
		padding: 1rem;
	}
	.flexContainer
	{
		flex-wrap: wrap;
	}
	#gameDetails .columnElement 
	{
    	width: 100%;
		margin-bottom: 1.5rem;
		margin: 0 3rem;
	}
	#description .largeButton
	{
		height: 3rem;
		box-sizing: border-box;
		padding: 1rem;
	}
	#description #switchLink
	{
		padding: 0.65rem;
	}
	#airconsoleLogo
	{
		height:100%;
		width:auto;
	}
	#extraInfo .flexContainer
	{
		justify-content: start;
	}
	#extraInfo .flexBox:last-child
	{
		width: 100%;
		height: 5rem;
		margin: 0 auto;
		text-align: center;
		margin-top: 1rem;
	}
	#footer
	{
		height:auto;
	}
	#compamyLogos
	{
		flex-wrap: wrap;
		text-align: center;
		justify-content: space-evenly;
		max-width: 100%;
	}
	#compamyLogos a
	{
		margin: 0;
		height: 2rem;
		padding: 0;
	}
	#compamyLogos #coatsinkLogo
	{
		height:1rem;
	}
	#footer p
	{
		font-size: 0.75rem;
		flex: 1 1 100%;
	}
}
@media only screen and (min-width:480px)
{
	#gameDetails .columnElement 
	{
		margin: 0 2rem;
	}
}
@supports (-ms-accelerator:true) {
	#compamyLogos
	{
		justify-content: space-around;
	}
}